:root{
  --ink:#000000;
  --paper:#ffffff;
  --porcelain:#eff0ef;
  --line:#d8d9d7;
  --line-dark:#2a2a2a;
  --muted:#5c5f5c;
  --muted-dark:#a3a5a3;
  --display:"Playfair Display",Georgia,"Times New Roman",serif;
  --text:"Commissioner","Inter",-apple-system,"Segoe UI",Roboto,sans-serif;
  --band:clamp(76px,10vw,140px);
}

html{scroll-behavior:smooth}

body{
  --bs-body-font-family:var(--text);
  --bs-body-font-size:1.0625rem;
  --bs-body-line-height:1.7;
  --bs-body-color:var(--ink);
  --bs-body-bg:var(--paper);
  --bs-link-color:var(--ink);
  --bs-link-color-rgb:0,0,0;
  --bs-link-hover-color:var(--ink);
  --bs-link-hover-color-rgb:0,0,0;
  --bs-link-underline-opacity:0;
  --bs-emphasis-color:var(--ink);
  -webkit-font-smoothing:antialiased;
}

.container{--bs-gutter-x:3rem;max-width:1440px}
@media (min-width:992px){.container{--bs-gutter-x:8rem}}

section[id]{scroll-margin-top:84px}

h1,h2,h3,.h1,.h2{font-family:var(--display);font-weight:500;letter-spacing:-.01em}
h1,.h1{font-size:clamp(2.6rem,5.4vw,5rem);line-height:1.03}
h2,.h2{font-size:clamp(2rem,3.8vw,3.4rem);line-height:1.1}
h3{font-family:var(--text);font-size:1.12rem;font-weight:500;line-height:1.4;letter-spacing:0}
.lede{font-size:1.1rem;color:var(--muted);max-width:56ch}

.eyebrow{
  font-size:.775rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);margin:0 0 1.25rem;display:flex;align-items:center;gap:.75rem;
}
.eyebrow::after{content:"";flex:0 0 44px;height:1px;background:var(--line)}

.btn{
  --bs-btn-padding-y:1rem;
  --bs-btn-padding-x:1.9rem;
  --bs-btn-font-size:.86rem;
  --bs-btn-font-weight:500;
  --bs-btn-border-radius:0;
  --bs-btn-border-width:1px;
  display:inline-flex;align-items:center;justify-content:center;gap:.62em;
  letter-spacing:.07em;text-transform:uppercase;
}
.btn:focus-visible{box-shadow:none;outline:2px solid currentColor;outline-offset:3px}
.btn svg{width:1.15em;height:1.15em;flex:none}
.btn-ink{
  --bs-btn-bg:var(--ink);--bs-btn-color:#fff;--bs-btn-border-color:var(--ink);
  --bs-btn-hover-bg:transparent;--bs-btn-hover-color:var(--ink);--bs-btn-hover-border-color:var(--ink);
  --bs-btn-active-bg:transparent;--bs-btn-active-color:var(--ink);--bs-btn-active-border-color:var(--ink);
}
.btn-paper{
  --bs-btn-bg:#fff;--bs-btn-color:var(--ink);--bs-btn-border-color:#fff;
  --bs-btn-hover-bg:transparent;--bs-btn-hover-color:#fff;--bs-btn-hover-border-color:#fff;
  --bs-btn-active-bg:transparent;--bs-btn-active-color:#fff;--bs-btn-active-border-color:#fff;
}
.btn-line-paper{
  --bs-btn-bg:transparent;--bs-btn-color:#fff;--bs-btn-border-color:#fff;
  --bs-btn-hover-bg:#fff;--bs-btn-hover-color:var(--ink);--bs-btn-hover-border-color:#fff;
  --bs-btn-active-bg:#fff;--bs-btn-active-color:var(--ink);--bs-btn-active-border-color:#fff;
}
.btn-nav{--bs-btn-padding-y:.68rem;--bs-btn-padding-x:1.35rem;--bs-btn-font-size:.78rem}

.textlink{
  display:inline-block;color:var(--ink);font-size:.88rem;font-weight:500;letter-spacing:.06em;
  text-transform:uppercase;text-decoration:none;
  padding-bottom:.35rem;border-bottom:1px solid var(--ink);transition:opacity .2s ease;
}
.textlink:hover{opacity:.55}
.textlink-paper{color:#fff;border-bottom-color:#fff}

.topbar{background:var(--ink);color:#fff;font-size:.775rem;letter-spacing:.04em}
.topbar .container{min-height:42px}
.topbar a{color:#fff;text-decoration:none;opacity:.78;transition:opacity .2s}
.topbar a:hover{opacity:1}

.masthead{border-bottom:1px solid var(--line)}
.wordmark{display:block;width:clamp(178px,20vw,290px)}
.wordmark img{width:100%;height:auto}

.site-nav{
  background:rgba(255,255,255,.94);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);padding:0;
}
.site-nav .navbar-nav{gap:clamp(1rem,2.4vw,2.3rem)}
.site-nav .nav-link{
  font-size:.83rem;letter-spacing:.075em;text-transform:uppercase;color:var(--ink);
  padding:1.15rem 0;border-bottom:1px solid transparent;
}
.site-nav .nav-link:hover,.site-nav .nav-link:focus{color:var(--ink);border-bottom-color:var(--ink)}
.navbar-toggler{
  border:1px solid var(--line);border-radius:0;margin-block:.85rem;
  font-size:.78rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;padding:.55rem .8rem;
}
.navbar-toggler:focus{box-shadow:none}
@media (max-width:991.98px){
  .site-nav .navbar-nav{gap:0}
  .site-nav .nav-link{padding:.8rem 0;border-bottom:1px solid var(--line)}
}

.site-nav .has-sub{position:relative}
.site-nav .caret{
  display:inline-block;width:.4em;height:.4em;margin-left:.45em;vertical-align:.15em;
  border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:rotate(45deg);
}
.nav-sub{
  list-style:none;margin:0;padding:0;
}
.nav-sub .dropdown-item{
  display:block;padding:.7rem 1.1rem;font-size:.86rem;color:var(--ink);
  text-decoration:none;white-space:nowrap;border:0;background:none;
}
.nav-sub .dropdown-item:hover,.nav-sub .dropdown-item:focus{background:var(--ink);color:#fff}
@media (min-width:992px){
  .site-nav .nav-sub{
    position:absolute;top:100%;left:0;z-index:70;min-width:268px;
    background:#fff;border:1px solid var(--line);
    opacity:0;visibility:hidden;transform:translateY(6px);
    transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
  }
  .site-nav .has-sub:hover .nav-sub,
  .site-nav .has-sub:focus-within .nav-sub{opacity:1;visibility:visible;transform:translateY(0)}
}
@media (max-width:991.98px){
  .site-nav .nav-sub{border-bottom:1px solid var(--line)}
  .site-nav .nav-sub .dropdown-item{padding:.6rem 0 .6rem 1.2rem;color:var(--muted)}
  .site-nav .nav-sub .dropdown-item:hover{background:none;color:var(--ink)}
}

.hero{position:relative;overflow:hidden;background:var(--ink);min-height:clamp(520px,78vh,820px)}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.50) 0%,rgba(0,0,0,.68) 48%,rgba(0,0,0,.60) 100%);
}
.hero .container{position:relative;z-index:1;padding-block:clamp(72px,9vw,120px)}
.hero-title{
  font-size:clamp(2.4rem,4.6vw,4.3rem);line-height:1.03;
  max-width:20ch;text-wrap:balance;color:#fff;
}
.hero-sub{max-width:640px;font-size:1.08rem;line-height:1.65;color:rgba(255,255,255,.86);text-wrap:pretty}

.stats{border-bottom:1px solid var(--line);padding-block:clamp(34px,4vw,56px)}
.stat{padding-inline:clamp(16px,2.2vw,40px);border-left:1px solid var(--line)}
.stat b{
  display:block;font-family:var(--display);font-weight:500;
  font-size:clamp(2rem,3.1vw,2.9rem);line-height:1;letter-spacing:-.02em;
}
.stat span{display:block;margin-top:.6rem;font-size:.86rem;line-height:1.45;color:var(--muted)}
@media (min-width:992px){.stat:nth-child(4n+1){border-left:0;padding-left:0}}
@media (max-width:991.98px){
  .stat{padding-block:.9rem}
  .stat:nth-child(odd){border-left:0;padding-left:0}
}
@media (max-width:575.98px){
  .stat{border-left:0;padding-left:0;display:flex;align-items:baseline;gap:1rem}
  .stat span{margin-top:0}
}

.about{background:var(--porcelain);padding-block:var(--band)}
.about-art{position:relative;padding-bottom:clamp(40px,5vw,72px)}
.about-art>img{width:88%;aspect-ratio:4/5;object-fit:cover}
.about-art .inset{position:absolute;right:0;bottom:0;width:48%;border:12px solid var(--porcelain)}
.about-art .inset img{width:100%;aspect-ratio:1/1;object-fit:cover}
.about-body h2{margin-bottom:1.6rem;max-width:16ch}
.about-body p{color:var(--muted);max-width:54ch}
.about-body .textlink{margin-top:1.2rem}

.ribbon{overflow:hidden;padding-block:clamp(34px,4.6vw,62px);border-bottom:1px solid var(--line)}
.ribbon-track{display:flex;width:max-content;animation:ribbon 46s linear infinite}
.ribbon-track span{
  font-family:var(--display);font-size:clamp(2.6rem,6.4vw,6rem);line-height:1.05;
  padding-right:.5em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px #b9bbb9;
}
@keyframes ribbon{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.cats{padding-block:var(--band)}
.cats-head{max-width:46ch;margin-bottom:clamp(38px,5vw,68px)}
.cats-head h2{margin-bottom:1.1rem}
.cats-head p{color:var(--muted)}
.cat{
  color:var(--ink);border:1px solid var(--line);padding:clamp(24px,2.6vw,36px);
  display:flex;flex-direction:column;text-decoration:none;height:100%;
  transition:border-color .25s ease,background .25s ease;
}
.cat:hover{border-color:var(--ink);background:var(--porcelain)}
.cat-shot{height:180px;display:flex;align-items:center;justify-content:center;margin-bottom:1.7rem}
.cat-shot img{height:100%;width:100%;object-fit:contain}
.cat h3{margin-bottom:.55rem}
.cat p{font-size:.92rem;color:var(--muted);line-height:1.6;flex:1;margin:0}
.cat .more{
  margin-top:1.4rem;padding-top:1rem;border-top:1px solid var(--line);
  font-size:.78rem;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);
}
.cat:hover .more{color:var(--ink)}

.horeca{background:var(--ink);color:#fff}
.horeca-body{padding:clamp(32px,4vw,64px)}
.horeca-body h3{font-family:var(--display);font-size:clamp(1.7rem,2.8vw,2.6rem);font-weight:500;line-height:1.1;margin-bottom:1.1rem}
.horeca-body p{color:var(--muted-dark);max-width:48ch;margin-bottom:2.1rem}
.horeca-shot{min-height:300px}
.horeca-shot img{width:100%;height:100%;object-fit:cover}

.reviews{background:var(--porcelain);padding-block:var(--band)}
.reviews-head{margin-bottom:clamp(28px,3.4vw,46px)}
.reviews-head h2{max-width:15ch}
.quote{
  font-family:var(--display);font-size:clamp(1.5rem,2.9vw,2.4rem);font-weight:400;
  line-height:1.3;margin:0 0 2.2rem;max-width:23ch;text-indent:-.42em;
}
.byline b{display:block;font-size:.95rem;font-weight:500}
.byline span{display:block;font-size:.83rem;color:var(--muted)}
.reviews .carousel-inner{margin-left:-.8em;padding-left:.8em}
.reviews .carousel-item{min-height:250px}
.reviews .carousel-indicators{
  position:static;margin:2.4rem 0 0;justify-content:flex-start;gap:.65rem;
}
.reviews .carousel-indicators [data-bs-target]{
  width:34px;height:2px;margin:0;border:0;background:var(--line);opacity:1;
  transition:background .2s ease;
}
.reviews .carousel-indicators .active{background:var(--ink)}
.reviews-art img{width:100%;aspect-ratio:4/5;object-fit:cover}


.foot{background:var(--ink);color:#fff;padding-top:clamp(48px,6vw,84px);border-top:1px solid var(--line-dark)}
.wordmark-foot{display:block;width:176px;margin-bottom:2rem}
.wordmark-foot img{width:100%;height:auto;filter:invert(1)}
.foot-statement{
  font-family:var(--display);font-size:clamp(1.5rem,2.2vw,2.1rem);font-weight:500;
  line-height:1.16;max-width:18ch;margin:0 0 1.9rem;text-wrap:balance;
}
.foot h3{font-size:.78rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-dark);margin-bottom:1.3rem}
.foot ul{margin:0;padding:0;list-style:none;display:grid;gap:.72rem}
.foot a{color:#fff;text-decoration:none;font-size:.94rem;opacity:.82;transition:opacity .2s}
.foot a:hover{opacity:1;text-decoration:underline;text-underline-offset:4px}
.foot address{font-style:normal;font-size:.94rem;line-height:1.75;color:var(--muted-dark);margin:0}
.foot address a{display:inline-block;margin-top:.5rem}
.foot-bottom{
  border-top:1px solid var(--line-dark);margin-top:clamp(44px,5vw,72px);
  padding-block:1.6rem;font-size:.83rem;color:var(--muted-dark);
}
.foot-bottom ul{display:flex;gap:1.4rem}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
  .ribbon-track{animation:none}
}

.page-banner{position:relative;overflow:hidden;background:var(--ink);color:#fff;text-align:center}
.page-banner-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.page-banner::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.68)}
.page-banner .container{position:relative;z-index:1;padding-block:clamp(64px,8vw,110px)}
.page-title{font-family:var(--display);font-weight:500;font-size:clamp(2.2rem,4.4vw,3.8rem);line-height:1.05;letter-spacing:-.012em;margin:0}
.page-banner .breadcrumb{
  --bs-breadcrumb-divider:"/";
  --bs-breadcrumb-item-padding-x:.6rem;
  justify-content:center;margin:1.4rem 0 0;
  font-size:.78rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
}
.page-banner .breadcrumb-item,.page-banner .breadcrumb-item::before{color:rgba(255,255,255,.6)}
.page-banner .breadcrumb-item a{color:rgba(255,255,255,.6);text-decoration:none}
.page-banner .breadcrumb-item a:hover{color:#fff}
.page-banner .breadcrumb-item.active{color:#fff}

.detail-area{padding-block:var(--band)}
@media (min-width:992px){
  .col-71{width:71%;flex:0 0 auto}
  .col-29{width:29%;flex:0 0 auto}
  .side-aside{padding-right:20px}
}

.side-nav{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.side-nav a{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  border:1px solid var(--line);padding:15px 22px;background:#fff;
  font-size:1.02rem;font-weight:500;color:var(--ink);text-decoration:none;
  transition:background .25s ease,color .25s ease,border-color .25s ease;
}
.side-nav a svg{width:20px;height:20px;flex:none;opacity:.4;transition:opacity .25s ease,transform .25s ease}
.side-nav a:hover,.side-nav .active a{background:var(--ink);color:#fff;border-color:var(--ink)}
.side-nav a:hover svg,.side-nav .active a svg{opacity:1}
.side-nav a:hover svg{transform:translateX(3px)}

.detail-content h2.title{max-width:24ch;margin-bottom:1.7rem}
.detail-content p{color:var(--muted);max-width:70ch}
.detail-content .title-two{
  font-family:var(--display);font-weight:500;letter-spacing:-.01em;
  font-size:clamp(1.5rem,2.2vw,2.05rem);line-height:1.15;
  margin:clamp(36px,3.8vw,56px) 0 1.1rem;
}
.detail-list{margin:0;padding:0;list-style:none;display:grid;gap:.9rem;max-width:70ch}
.detail-list li{position:relative;padding-left:1.6rem;color:var(--muted)}
.detail-list li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;background:var(--ink)}
.detail-list b{color:var(--ink);font-weight:500}

.gallery-section{margin-top:clamp(40px,4.4vw,64px)}
.gallery-section :has(> .d-flex).row{row-gap:var(--bs-gutter-x)}
.gallery-section .img-fluid{object-fit:cover}
.gallery-section .faq-gal-img{aspect-ratio:1/1}
.effect-image-1{position:relative;display:block}
.overlay{
  position:absolute;display:grid;place-content:center;
  width:100%;height:100%;left:0;top:0;
  background:rgba(0,0,0,.2);
  opacity:0;visibility:hidden;transition:all .4s linear;
}
.simple-overlay{opacity:0;visibility:hidden}
.effect-image-1:hover .simple-overlay{visibility:visible;opacity:1}

.lg-backdrop{background-color:rgba(0,0,0,.97);z-index:1990}
.lg-outer{z-index:2000}
.lg-outer .lg-thumb-outer{background-color:transparent}
.lg-toolbar{padding-top:env(safe-area-inset-top,0px)}

@media (max-width:767.98px){
  .gallery-section .row{--bs-gutter-x:.75rem;row-gap:.75rem}
}