/* ==========================================================================
   La Vella Sol identity system (October 2026)
   1. Brand lettering: the custom La Vella Sol wordmark (/brand/*.svg), used as a mask so it takes any flat colour.
   2. Editorial serif: Newsreader (Production Type, SIL OFL) for selected headlines and quotations.
   3. Text sans: Schibsted Grotesk (SIL OFL) for descriptions, prices, navigation and booking.
   Material: real brushed bronze photographed from the VALSIA tags (/brand/bronze.jpg), used sparingly.
   ========================================================================== */
@font-face{font-family:'LVS Serif';src:url(/fonts/newsreader.woff) format('woff');font-weight:300 500;font-style:normal;font-display:swap}
@font-face{font-family:'LVS Serif';src:url(/fonts/newsreader-italic.woff) format('woff');font-weight:300 500;font-style:italic;font-display:swap}
@font-face{font-family:'LVS Sans';src:url(/fonts/schibsted-grotesk.woff) format('woff');font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:'LVS Sans';src:url(/fonts/schibsted-grotesk-italic.woff) format('woff');font-weight:400 900;font-style:italic;font-display:swap}

:root{
  --serif:'LVS Serif',Georgia,'Times New Roman',serif;
  --sans:'LVS Sans','Helvetica Neue',Arial,sans-serif;
  --lvs-walnut:#221710;--lvs-cocoa:#3a2a22;--lvs-cocoa2:#4a372d;--lvs-taupe:#a8927f;--lvs-taupe-lt:#cdbcaa;--lvs-ivory:#efe6da;--lvs-ink:#2a2019;
  --lvs-bronze:#c9a27a;--lvs-bronze-dk:#8a6448;--lvs-bronze-tex:url(/brand/bronze.jpg);
  --lvs-ease:cubic-bezier(.2,.7,.2,1);
}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-optical-sizing:auto}
body{font-family:var(--sans)!important;font-weight:400;font-size:16px;line-height:1.62;font-feature-settings:'case' 0}

/* ---------- 1. the wordmark ---------- */
.wm{display:inline-block;vertical-align:middle;background:currentColor;aspect-ratio:5.019;height:1em;
  -webkit-mask:url(/brand/lvs-wordmark.svg) center/contain no-repeat;mask:url(/brand/lvs-wordmark.svg) center/contain no-repeat}
.wm.s{aspect-ratio:5.06;-webkit-mask-image:url(/brand/lvs-wordmark-small.svg);mask-image:url(/brand/lvs-wordmark-small.svg)}
.wm.c{aspect-ratio:1.693;-webkit-mask-image:url(/brand/lvs-wordmark-compact.svg);mask-image:url(/brand/lvs-wordmark-compact.svg)}
.wm.bronze{background:url(/brand/bronze.jpg) 62% 50%/190% 240%,var(--lvs-bronze)}
.vh,.wm-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.logo{font-size:0!important;letter-spacing:0!important;line-height:0!important;color:#e7d3bf!important;display:inline-flex;align-items:center}
.logo .wm{height:26px;background:url(/images/material/bronze-lettering.jpg) 85% 20%/700px auto,#a07c56}
@media(max-width:760px){.logo .wm{height:21px}}

/* ---------- 2. editorial serif, used selectively ---------- */
h1,h2,h3{font-family:var(--serif)!important;font-weight:300!important;text-transform:none!important;letter-spacing:-.012em!important;line-height:1.06}
h2 em,h1 em,h3 em{font-style:italic;font-weight:300}
h4,h5,h6{font-family:var(--sans)!important;font-weight:600!important;letter-spacing:.12em;text-transform:uppercase;font-size:12px}
.lead,.ser,blockquote,.quote,.q{font-family:var(--serif)!important}

/* ---------- 3. text sans: labels, prices, navigation, booking ---------- */
.k,.pn,.cap,small,.legal,dt{font-family:var(--sans)!important;font-weight:600!important;letter-spacing:.13em!important;font-size:12px}
nav a,.drawer a,footer a,.btn,button,input,select,textarea,label,.pr,.price,.dur,.for,dd{font-family:var(--sans)!important}
.pr,.price,.dur,dd{font-variant-numeric:tabular-nums lining-nums}
nav .l{font-weight:500!important;letter-spacing:.1em!important;font-size:12.5px!important}
p,li,dd,td{font-weight:400}

/* buttons: one material moment, the primary booking action wears real brushed bronze */
.btn{font-weight:600!important;letter-spacing:.09em!important;font-size:13px!important;border-radius:0}
.btn.f,a.btn.f{background:url(/brand/bronze.jpg) 30% 50%/260% 100%,var(--lvs-bronze)!important;color:#20140e!important;border:1px solid #9b744f!important;text-shadow:none!important;transition:background-position .9s var(--lvs-ease),filter .3s}
.btn.f:hover{background-position:70% 50%,0 0!important;filter:brightness(1.06)}
.btn:not(.f){border:1px solid rgba(201,162,122,.55)!important;color:#efe3d6}
.btn:focus-visible,a:focus-visible,button:focus-visible{outline:2px solid var(--lvs-bronze);outline-offset:3px}


/* footer wordmark */
.ft h2{font-size:0!important;line-height:0!important}
.ft h2 .wm{height:40px;color:#e7d3bf}

@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}
.btn.f,a.btn.f{color:#1f130d!important;font-weight:700!important}
.btn.f:hover{color:#1f130d!important}
dd{font-variant-numeric:normal}
.pr,.price,.dur{font-variant-numeric:tabular-nums lining-nums}
.btn.f,a.btn.f{-webkit-text-fill-color:#1f130d!important}
html body .btn.f,html body a.btn.f,html body button.btn.f{background:url(/brand/bronze.jpg) 30% 50%/260% 100%,var(--lvs-bronze)!important;color:#1f130d!important;-webkit-text-fill-color:#1f130d!important;border:1px solid #9b744f!important}
.nav-brand .brand-mark{font-size:0!important;line-height:0!important;letter-spacing:0!important;color:#e7d3bf}
.nav-brand .brand-mark .wm{height:26px;background:url(/images/material/bronze-lettering.jpg) 85% 20%/700px auto,#a07c56}
.nav-brand a > p:not(.brand-mark){font-family:var(--sans)!important;font-weight:600;letter-spacing:.14em!important;font-size:10.5px!important;margin-top:6px}
html body .nav-links .book-link a{background:url(/images/material/bronze-lettering.jpg) 50% 60%/900px auto,#93704c!important;color:#1f130d!important;-webkit-text-fill-color:#1f130d!important;padding:10px 16px!important;border:1px solid rgba(214,182,140,.6)!important;text-decoration:none!important;font-weight:700!important}
html body .nav-links .book-link a::after{display:none!important}
.story-eyebrow,.story-aside .label,.label,.eyebrow{letter-spacing:.16em!important}
