/* Thema IVOOR – lichte, warme versie van Showroom Noir: ivoor, zand, messing, verfijnde Romeinse titels */
@font-face{font-family:"Marcellus";src:url(../fonts/marcellus.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Jost";src:url(../fonts/jost.woff2) format("woff2");font-weight:300 600;font-display:swap}

:root{
  --gold:#a8844b; --gold-2:#8a6a35; --gold-soft:#d9c29a;
  --petrol:#8a6a35; --petrol-900:#2b241c; --petrol-700:#a8844b; --petrol-100:#f1e8d8;
  --clay:#a8844b; --clay-700:#8a6a35; --clay-100:#f3ead9;
  --ivory:#fbf8f2; --sand:#f5efe4; --stone:#ece2d1; --line:#e3d7c3;
  --ink:#2b241c; --text:#4f463b; --muted:#857a6b; --white:#fbf8f2;
  --serif:"Marcellus",Georgia,serif;
  --sans:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --r:2px; --r-sm:2px;
  --shadow:0 18px 40px rgba(76,56,28,.08); --shadow-lg:0 28px 60px rgba(76,56,28,.14);
}
html,body{background:var(--ivory)}
body{color:var(--text);font-weight:300;font-size:17px;letter-spacing:.01em}
h1,h2{font-family:var(--serif);font-weight:400;letter-spacing:.02em;line-height:1.12;color:var(--ink)}
h1{font-size:clamp(32px,3.6vw,50px)}
h2{font-size:clamp(26px,2.6vw,38px)}
h3{font-family:var(--sans);font-weight:500;letter-spacing:.03em;color:var(--ink)}
strong{color:var(--ink);font-weight:500}
a{color:var(--gold-2)}
a:hover{color:var(--ink)}
:focus-visible{outline-color:var(--gold)}
.kicker{color:var(--gold);font-weight:500;letter-spacing:.3em;font-size:11px;display:inline-flex;align-items:center;gap:14px}
.kicker::before,.kicker::after{content:"";width:34px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.kicker::after{background:linear-gradient(90deg,var(--gold),transparent)}

.btn{border-radius:0;font:500 13px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;padding:17px 28px}
.btn-primary{background:linear-gradient(135deg,#c8a76c,var(--gold) 55%,#8f6d39);color:#fff;box-shadow:0 10px 26px rgba(168,132,75,.25)}
.btn-primary:hover{color:#fff;filter:brightness(1.06)}
.btn-ghost{border:1px solid var(--gold);color:var(--gold-2)}
.btn-ghost:hover{background:var(--gold);color:#fff;border-color:var(--gold)}

/* topbalk + header */
.topbar{background:var(--ink);color:#d8ccb8;font-size:12px;letter-spacing:.06em}
.topbar a{color:#f3ead9}
.topbar a:hover{color:var(--gold-soft)}
.site-header{background:rgba(251,248,242,.94);border-bottom:1px solid var(--line)}
.site-header.scrolled{box-shadow:0 10px 30px rgba(76,56,28,.08)}
.nav-top{color:var(--ink);font:400 13px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;border-radius:0}
.nav-top:hover,.nav-list>li.active>.nav-top{background:none;color:var(--gold)}
.sub{background:var(--ivory);border:1px solid var(--line);border-radius:0}
.sub a{font-weight:400;border-radius:0}
.sub a:hover,.sub a[aria-current]{background:var(--sand);color:var(--gold-2)}
.sub-img{border-radius:0}
.icon-btn{background:transparent;border-color:var(--gold);color:var(--gold-2)}
.icon-btn:hover{background:var(--gold);color:#fff}
@media (max-width:1080px){.site-header{background:var(--ivory)}.nav{background:var(--ivory)}}

/* hero (home) */
.hero{min-height:min(88vh,820px);text-align:center}
.hero::after{background:radial-gradient(ellipse at center,rgba(43,36,28,.12) 0%,rgba(43,36,28,.52) 80%),linear-gradient(0deg,rgba(43,36,28,.4) 0%,transparent 35%)}
.hero-content{display:flex;flex-direction:column;align-items:center}
.hero-content>*{max-width:780px}
.hero h1{font-size:clamp(34px,4.4vw,60px);letter-spacing:.03em;line-height:1.1}
.hero .kicker{color:var(--gold-soft)}
.hero .kicker::before{background:linear-gradient(90deg,transparent,var(--gold-soft))}
.hero .kicker::after{background:linear-gradient(90deg,var(--gold-soft),transparent)}
.hero-intro p{color:#f3ead9;font-weight:300}
.hero .btns{justify-content:center}
.hero .btn-ghost{color:#fff;border-color:rgba(255,255,255,.7)}
.hero .btn-ghost:hover{background:#fff;color:var(--ink)}
.hero figcaption{left:50%;right:auto;transform:translateX(-50%);background:rgba(251,248,242,.95);color:var(--ink);box-shadow:none;border-radius:0;font-weight:400;letter-spacing:.05em;font-size:13px;white-space:nowrap;max-width:90vw;overflow:hidden;text-overflow:ellipsis}
.hero .carousel-ui{left:auto;right:max(20px,calc((100vw - var(--wrap))/2 + 20px))}
.carousel-ui button{background:rgba(251,248,242,.92);color:var(--gold-2);border:1px solid var(--line);box-shadow:none;border-radius:0}
.carousel-ui button:hover{background:var(--gold);color:#fff}
.c-dots button::after{border-radius:0;height:1px;width:16px;background:rgba(255,255,255,.6)}
.c-dots button[aria-current=true]::after{width:32px;background:#fff}
@media (max-width:640px){.hero figcaption{display:none}}

/* paginabanner */
.page-banner::after{background:linear-gradient(0deg,rgba(43,36,28,.78) 0%,rgba(43,36,28,.25) 50%,rgba(43,36,28,.05) 80%)}
.banner-content .kicker{color:var(--gold-soft)}
.banner-content .kicker::before{background:linear-gradient(90deg,transparent,var(--gold-soft))}
.banner-content .kicker::after{background:linear-gradient(90deg,var(--gold-soft),transparent)}
.banner-content h1{letter-spacing:.03em}
.page-intro{background:var(--ivory)}
.page-head{background:var(--sand);border-bottom:1px solid var(--line)}
.page-visual,.page-carousel{border-radius:0;box-shadow:var(--shadow-lg);outline:1px solid var(--gold);outline-offset:14px}

/* secties */
.block{background:var(--ivory)}
.s-highlight{background:var(--sand)}
.section-head h2::after,.aside-grid h2::after{content:"";display:block;width:56px;height:1px;background:var(--gold);margin-top:18px}

.usps{background:#fff;border:1px solid var(--line);border-radius:0;box-shadow:var(--shadow)}
.usp-i{background:transparent;border:1px solid var(--gold);color:var(--gold);border-radius:50%}

.card a{background:#fff;border:1px solid var(--line);border-radius:0}
.card a:hover{box-shadow:var(--shadow-lg);transform:none;border-color:var(--gold)}
.card-img{background:var(--stone)}
.card-body h3{font-family:var(--serif);font-weight:400;font-size:21px;letter-spacing:.02em}
.card .more{color:var(--gold);letter-spacing:.16em;text-transform:uppercase;font-size:12px;font-weight:500}
.l-large .card a{border:0}
.l-large .card-body{background:linear-gradient(0deg,rgba(43,36,28,.82),rgba(43,36,28,0))}
.l-large .card-body h3{font-family:var(--serif);font-weight:400;letter-spacing:.03em;color:#fff}
.l-large .card .more{color:var(--gold-soft)}
.l-large .card-body::after{content:"";position:absolute;left:20px;right:20px;bottom:12px;height:1px;background:var(--gold-soft);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.l-large .card a:hover .card-body::after{transform:scaleX(1)}
.tag{background:transparent;border:1px solid var(--gold);color:var(--gold-2);border-radius:0}

.split-media img{border-radius:0;box-shadow:var(--shadow-lg)}
.split-media::before{inset:-16px auto auto -16px;width:60%;height:60%;border-radius:0;background:none;border-top:1px solid var(--gold);border-left:1px solid var(--gold);z-index:1}
.img-right .split-media::before{inset:-16px -16px auto auto;border-left:0;border-right:1px solid var(--gold)}
.b-split{isolation:auto}

.feature,.s-plain .feature{background:#fff;border:1px solid var(--line);border-radius:0}
.feature .num{font:400 30px/1 var(--serif);color:var(--gold)}
.feature h3{font-family:var(--serif);font-weight:400}

.gallery a,.content-carousel{border-radius:0}
.slide-box{background:rgba(251,248,242,.96);border:1px solid var(--line);border-radius:0}
.slide-box strong{font-family:var(--serif);font-weight:400}

.logos a{background:#fff;border:1px solid var(--line);border-radius:0}
.logos a:hover{border-color:var(--gold);box-shadow:none}

.b-cta .cta-box{border-radius:0;background:radial-gradient(ellipse at 100% 0%,rgba(217,194,154,.35),transparent 60%),var(--ink);color:#d8ccb8}
.b-cta h2{color:#fbf8f2}
.b-cta .btn-ghost{color:#f3ead9;border-color:var(--gold-soft)}

.b-visit{background:var(--sand)}
.visit-hours,.contact-info,.contact-form{background:#fff;border:1px solid var(--line);border-radius:0;box-shadow:none}
.b-visit .status,.contact-info .status{background:#fff;border:1px solid var(--line);border-radius:0}
.hours tr.today th,.hours tr.today td{color:var(--gold)}
form input[type=text],form input[type=email],form input[type=tel],form select,form textarea{border-radius:0;border:1px solid var(--line);background:var(--ivory)}
form input:focus,form select:focus,form textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(168,132,75,.15)}
.chips a{border-radius:0;background:#fff}
.chips a:hover{border-color:var(--gold);color:var(--gold-2)}
.map-facade{background:var(--sand) repeating-linear-gradient(45deg,rgba(168,132,75,.06) 0 12px,transparent 12px 24px);border:1px solid var(--line);border-radius:0}

/* footer warm donker voor contrast */
.site-footer{background:var(--ink);color:#bfb2a0;border-top:1px solid var(--gold)}
.site-footer a{color:#efe5d4}
.site-footer a:hover{color:var(--gold-soft)}
.f-title{color:var(--gold-soft)}
.social a{border-radius:0;background:transparent;border:1px solid rgba(255,255,255,.15)}
.social a:hover{background:var(--gold);color:#fff}
.site-footer .hours tr.today th,.site-footer .hours tr.today td{color:var(--gold-soft)}

.mobile-bar{background:var(--ivory);border-top:1px solid var(--gold)}
.mobile-bar a{color:var(--gold-2);border-radius:0}
.mobile-bar a.primary{background:linear-gradient(135deg,#c8a76c,var(--gold));color:#fff}
.lightbox img{border-radius:0}