

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:rgba(119,34,46,.45) var(--cream)}
html::-webkit-scrollbar{width:10px}
html::-webkit-scrollbar-track{background:var(--cream)}
html::-webkit-scrollbar-thumb{background:rgba(119,34,46,.42);border-radius:100px;border:2px solid var(--cream)}
html::-webkit-scrollbar-button{display:none;height:0}
html::-webkit-scrollbar-thumb:hover{background:rgba(119,34,46,.62)}
body{font-family:'Fira Sans',system-ui,sans-serif;background:var(--cream);color:var(--encre);line-height:1.68;
  background-image:radial-gradient(rgba(119,34,46,.025) 1px,transparent 1px);background-size:22px 22px}
img{max-width:100%}a{color:inherit}
.script{font-family:'Yellowtail',cursive;color:var(--gold-txt)}
footer .script{color:var(--gold)}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}

:root{--h-barre:52px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;cursor:pointer;
  border-radius:100px;font:600 16px 'Fira Sans';padding:14px 26px;min-height:48px;text-decoration:none}
.btn-gold{background:var(--gold);color:var(--noir)}.btn-gold:hover{background:var(--gold2)}
.btn-wine{background:var(--wine);color:var(--cream2)}.btn-wine:hover{background:var(--wine2)}

body > header{position:sticky;top:0;z-index:120;background:var(--noir);color:var(--cream2)}
.nav{display:flex;align-items:center;gap:22px;padding:10px 20px;max-width:1180px;margin:0 auto}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-height:44px}
.bt b{font-size:18px;display:block;line-height:1.1}
.bt span{font-size:12px;letter-spacing:.2em;color:var(--gold);text-transform:uppercase}
.nav-links{display:flex;gap:20px;margin-left:auto;font-size:15px}
.nav-links a{text-decoration:none;opacity:.9}.nav-links a:hover{color:var(--gold2)}

.nav>.btn{margin-left:auto;padding:10px 20px;min-height:44px}

footer{background:var(--noir);color:var(--cream2);padding:58px 0 58px}
footer .wrap{max-width:1180px}
.fgrid{display:grid;grid-template-columns:1.7fr 1fr 1.2fr 1fr;gap:34px;align-items:start}
.fgrid h3{color:var(--gold);font-size:13px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:15px}
.fgrid a,.fgrid p{display:block;font-size:14.5px;opacity:.9;text-decoration:none;margin:0 0 9px;line-height:1.45}
.fgrid a{transition:color var(--duree)}
.fgrid a:hover{color:var(--gold2)}
.fbrand p{opacity:.82;max-width:32ch;margin-bottom:8px}

.fshops p{margin-bottom:13px;line-height:1.5}
.fshops b{color:var(--gold2);font-weight:700}
.fshops a{display:inline;text-decoration:underline;opacity:.92}
.fsoc{display:flex;gap:12px;margin-top:14px}
.fsoc a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:rgba(251,246,236,.09);margin:0;transition:var(--duree)}
.fsoc a:hover{background:var(--gold);transform:translateY(-2px)}
.fsoc svg{width:20px;height:20px;fill:var(--cream2);transition:fill var(--duree)}
.fsoc a:hover svg{fill:var(--noir)}
.legal{border-top:1px solid rgba(251,246,236,.14);margin-top:40px;padding-top:20px;font-size:12.5px;opacity:.66;text-align:center;line-height:1.75}
@media(max-width:860px){.fgrid{grid-template-columns:1fr 1fr;gap:28px}}

@media(max-width:860px){
  footer{padding:40px 0 calc(var(--h-barre) + 16px)}
  .fgrid{gap:22px}
  .fgrid h3{margin-bottom:11px}
  .fgrid a,.fgrid p{margin-bottom:7px;font-size:14px}
  .fgrid a.dkl{display:none}
  .fsoc{margin-top:12px}
  .legal{margin-top:26px;padding-top:16px;font-size:12px}
}

.mbar{position:fixed;bottom:0;left:0;right:0;z-index:130;display:none;background:var(--noir);color:var(--cream2)}
.mbar a{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:15px 6px;
  font:700 15px 'Fira Sans';color:inherit;text-decoration:none;min-height:var(--h-barre)}
.mbar a.bcmd{background:var(--gold);color:var(--noir)}
.toTop{position:fixed;right:22px;bottom:88px;z-index:139;width:46px;height:46px;border-radius:50%;
  background:var(--wine);border:1.5px solid var(--gold);color:var(--gold2);font-size:20px;cursor:pointer;display:none;
  align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(24,19,20,.45)}
.toTop:hover{background:var(--wine2);color:#fff}

@media(max-width:860px){.nav-links{display:none}}
@media(max-width:860px){.mbar{display:flex}
  .toTop{bottom:66px;right:14px;width:44px;height:44px;font-size:18px;background:rgba(24,19,20,.86);box-shadow:0 6px 18px rgba(24,19,20,.35)}

  .nav{padding:7px 20px;gap:10px}
  .brand img{width:38px;height:32px}
  .bt b{font-size:16px}
  .bt span{font-size:12px;letter-spacing:.14em}
}
@media(max-width:860px){.toTop{bottom:66px;right:14px;width:44px;height:44px;font-size:18px}}
@media(max-width:860px){
  .fgrid a{padding:9px 0;margin-bottom:0;min-height:44px;display:flex;align-items:center}
  .fshops a{display:inline-flex;min-height:44px;align-items:center}
  .fshops p{margin-bottom:16px}
  .legal a{display:inline-block;padding:6px 2px}
}
@media(max-width:860px){
  footer .fshops a[href^="tel:"]{display:inline-flex;align-items:center;min-height:44px;padding:2px 0}
  footer .fgrid a.dkl{display:inline-flex;align-items:center;min-height:44px}
  footer .legal a{display:inline-flex;align-items:center;min-height:44px;padding:0 3px}
}
@media(max-width:520px){
  footer{padding:34px 0 calc(var(--h-barre) + 16px)}
  .fgrid{grid-template-columns:1fr 1fr;gap:20px 18px}
  .fbrand,.fshops{grid-column:1/-1}
  .fbrand img{width:70px;height:auto}
  .fbrand p{margin-bottom:5px}
  .fgrid h3{margin-bottom:8px;font-size:12px}
  .fgrid a{padding:10px 0;min-height:44px;font-size:13.5px}
  .fshops p{margin-bottom:11px;font-size:13.5px}
  .fsoc{margin-top:10px;gap:9px}
  .fsoc a{width:44px;height:44px}
  .legal{margin-top:20px;padding-top:14px;font-size:12px;line-height:1.65}
}
@media(max-width:520px){
  .fbrand{order:1}
  .fgrid > div:not(.fbrand):not(.fshops){order:2}
  .fshops{order:3}
}

@media(max-width:860px){footer .legal a{padding:0 8px;min-width:44px;justify-content:center}}

a, button, [role="button"] {
  transition: background-color var(--duree) ease, color var(--duree) ease, border-color var(--duree) ease, opacity var(--duree) ease;
}
a:focus-visible, button:focus-visible, [role="button"]:focus-visible {

  outline: 2px solid var(--gold-txt);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  a, button, [role="button"] { transition: none; }
}

@media(max-width:380px){

  .nav{gap:5px;padding:7px 20px}
  .brand{min-width:0;flex:0 1 auto}
  .bt b{font-size:15px;white-space:nowrap}
  .bt span{display:none}
}

.mbar svg{width:18px;height:18px;flex:0 0 18px;fill:currentColor}

.shoprail{height:5px;background:rgba(119,34,46,.13);border-radius:100px;overflow:hidden;margin:6px 2px 0}
.shoprail span{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--wine));
  border-radius:100px;transition:margin-left var(--duree) ease,width var(--duree) ease}

.shoprail[hidden]{display:none}

.nb{white-space:nowrap}

@media(max-width:520px){
  .fshops{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
  .fshops h3,.fshops p:last-child{grid-column:1/-1}
}

@media(max-width:360px){
  .fshops{grid-template-columns:1fr}
}

.skip{position:absolute;left:12px;top:-64px;z-index:1000;background:var(--wine);color:var(--cream2);padding:10px 16px;border-radius:0 0 12px 12px;font-weight:700;text-decoration:none;transition:top .15s}
.skip:focus{top:0;outline:2px solid var(--gold-txt);outline-offset:2px}
main:focus{outline:none}

sup{font-size:.62em;line-height:0;vertical-align:baseline;position:relative;top:-.45em}

button,input,select,textarea{font-family:inherit}
@media (min-width:861px) and (max-width:900px){.nav-links{gap:12px;font-size:14px}}

a,button,input,select,textarea,[tabindex]{scroll-margin-top:calc(var(--stick,80px) + 12px)}

@media print{
  body{background:#fff!important;color:#000!important}
  body>header{position:static!important;background:#fff!important;color:#000!important;box-shadow:none!important;border-bottom:1px solid #000}
  body>header *{color:#000!important}
  .mbar,.fab,.mburger,#mpanel,.ovl,.toast{display:none!important}

  .hero,.heropic,.hero *,.heropic *,h1{color:#000!important;text-shadow:none!important}
  .hero,.heropic{background:none!important;min-height:0!important}
  .hero::before,.hero::after,.heropic::before,.heropic::after{display:none!important}
  footer{background:#fff!important;color:#000!important}
  footer *{color:#000!important}
}

.legal a[href*="golden-view"]{color:var(--gold2);text-decoration:underline}

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.afil{font-size:13.5px;color:#6B5B52;padding:22px 0 4px}
.afil a{color:var(--wine);font-weight:700;text-decoration:none}
.afil a:hover{text-decoration:underline}

@media(max-width:860px){
  .afil a{display:inline-flex;align-items:center;min-height:44px;min-width:44px;
    justify-content:center;padding:0 6px;margin-left:-6px;margin-right:-6px}
}
