/* ==========================================================================
   SNOW Daily: the Maison style (preview branch, 14 November 2026)
   Original stays the default and is untouched. Maison is chosen with the
   header style button (app.js), which sets html[data-style='maison'] and
   loads maison-skin.css (generated: the Original rules, scoped and recoloured
   to noir, snow white and First Light gold) followed by this file. Every rule
   here is scoped the same way, apart from the style button itself.

   Maison: the Crystal Seal (black and white) beside a one-line wordmark,
   Bodoni Moda page headlines, Jost for the wordmark, labels and body text,
   wide-tracked capitals, square buttons. Tables and figures keep Libre
   Franklin so columns of numbers stay aligned.
   ========================================================================== */
/* Maison's type tokens (Bodoni Moda headlines, Jost text) are set in maison-skin.css by the generator. */
html[data-style='maison'] body { font-family: var(--font-body); font-weight: 400; }

/* ---------- page headlines: Bodoni Moda, upright ---------- */
html[data-style='maison'] .page-title, html[data-style='maison'] .page-head .page-title,
html[data-style='maison'] .answer-board .ab-question, html[data-style='maison'] #answerHome .ab-question,
html[data-style='maison'] .ab-verdict, html[data-style='maison'] .about-box__h {
  font-family: var(--ab-page); font-weight: 400; letter-spacing: -0.005em;
}
html[data-style='maison'] .page-head .page-title { line-height: 1.04; }

/* ---------- labels, section titles and navigation: wide-tracked capitals ---------- */
html[data-style='maison'] .eyebrow, html[data-style='maison'] .ticker__label, html[data-style='maison'] .footer-h,
html[data-style='maison'] .snow-update__h, html[data-style='maison'] .section-h, html[data-style='maison'] .panel__title,
html[data-style='maison'] .sc-card__h {
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif; font-weight: 500; letter-spacing: 0.26em; text-transform: uppercase;
}
html[data-style='maison'] .panel__title, html[data-style='maison'] .section-h { font-size: 0.82rem; }
html[data-style='maison'] .site-nav a, html[data-style='maison'] .nav-menu__btn {
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif; font-size: 0.76rem; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase;
}
html[data-style='maison'] .site-nav a.is-active { font-weight: 500; }
html[data-style='maison'] .site-nav a.is-active::after { background: var(--color-text); border-bottom-color: var(--color-text); height: 1px; }
html[data-style='maison'] .tab.is-active { background: none; border-bottom-color: var(--color-text); }   /* tabs keep their own height (owner, 14 Nov 2026: the event tabs' rule overlapped the text) */
html[data-style='maison'] .site-nav a:hover { background: none; }

/* ---------- buttons: square, tracked capitals ---------- */
html[data-style='maison'] .btn, html[data-style='maison'] .fc-btn, html[data-style='maison'] .chip {
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif; text-transform: uppercase; letter-spacing: 0.18em; font-weight: 500; font-size: 0.74rem;
}
html[data-style='maison'] .btn { min-height: 2.9rem; padding: 0.7rem 1.5rem; border-radius: 0; }
html[data-style='maison'] .chip { border-radius: 0 !important; }   /* the Season Pass and Member pills stay as in Original */

/* ---------- header: snow white bar and the one-line wordmark (SNOW DAILY, DAILY close to SNOW) ---------- */
html[data-style='maison'] .site-header { background: color-mix(in oklab, var(--color-bg) 96%, transparent); }
html[data-style='maison'] .brand__snow { display: none; }   /* no falling snow behind the wordmark: restraint */
html[data-style='maison'] .brand--stack .brand__word { display: flex; align-items: baseline; gap: 0.16em; }   /* DAILY close to SNOW (owner, 14 Nov 2026) */
html[data-style='maison'] .brand--stack .brand__ski, html[data-style='maison'] .brand--stack .brand__daily {
  font-family: 'Jost', 'Futura', 'Helvetica Neue', Arial, sans-serif; font-weight: 600; font-size: 1.32rem;
  letter-spacing: 0.42em; margin: 0; margin-right: -0.42em; padding: 0; color: var(--color-text);
}
html[data-style='maison'] .brand--stack .brand__ski { margin-right: 0; }
html[data-style='maison'][data-theme='light'] .site-header .brand--stack .brand__daily { color: var(--color-text); }

/* ---------- footer: noir band, wordmark in snow white ---------- */
html[data-style='maison'] .site-footer { background: #0a0a0a; color: #c9c9c4; border-top: 0; }
html[data-style='maison'] .brand--footer.brand--stack .brand__ski, html[data-style='maison'] .brand--footer.brand--stack .brand__daily,
html[data-style='maison'][data-theme='light'] .brand--footer.brand--stack .brand__ski,
html[data-style='maison'][data-theme='light'] .brand--footer.brand--stack .brand__daily { color: #fafaf7; font-size: 1.2rem; }
html[data-style='maison'] .footer-h, html[data-style='maison'][data-theme='light'] .footer-h { color: #a9a9a4; }

/* ---------- ticker: a quiet noir line, label in First Light ---------- */
html[data-style='maison'] .ticker { background: #0a0a0a; border-bottom: 0; }
html[data-style='maison'] .ticker__label, html[data-style='maison'][data-theme='light'] .ticker__label { color: #c2a26e; }

/* ---------- small refinements ---------- */
html[data-style='maison'] .about-box { border-top: 1px solid var(--color-text); }
html[data-style='maison'] ::selection { background: var(--color-text); color: var(--color-bg); }

/* phones: the one-line wordmark, smaller */
@media (max-width: 640px) {
  html[data-style='maison'] .brand--stack .brand__ski, html[data-style='maison'] .brand--stack .brand__daily { font-size: 0.98rem; letter-spacing: 0.28em; margin-right: -0.28em; }
  html[data-style='maison'] .brand--stack .brand__ski { margin-right: 0; }
}

/* ---------- the Style button and picker (#270, restored 14 Nov 2026 with Original and Maison) ---------- */
.site-header__tools .style-toggle, html[data-style='maison'] .site-header__tools .style-toggle { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0; width:44px; height:48px; font-size:9px; line-height:1; }
.site-header__tools .style-toggle > span { margin-top: 1px; }
.site-header__tools .style-toggle > svg { width: 17px; height: 17px; }   /* owner, 15 Nov 2026: the four squares at the globe's size */   /* the word sits close under the four squares (owner, 14 Nov 2026) */
.site-header__tools .style-toggle[hidden], html[data-style='maison'] .site-header__tools .style-toggle[hidden] { display:none; }
.style-toggle:focus-visible, .style-picker button:focus-visible { outline:3px solid var(--color-primary); outline-offset:3px; }
.style-picker { margin:auto; width:min(560px,calc(100vw - 24px)); max-height:calc(100dvh - 32px); overflow-y:auto; overscroll-behavior:contain; padding:24px; border:1px solid var(--color-border); border-radius:20px; background:var(--color-surface); color:var(--color-text); box-shadow:0 20px 80px #0005; }
.style-picker::backdrop { background:#0008; backdrop-filter:blur(4px); }
body:has(.style-picker[open]) { overflow:hidden; }
.style-picker__head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.style-picker__head h2 { font:500 26px 'Newsreader',serif; }
.style-picker__head button { min-width:44px; min-height:44px; font-size:28px; }
#stylePickerHint { font-size:13px; line-height:1.5; color:var(--color-text-muted); margin:8px 0 20px; }
.style-picker__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.style-option { position:relative; display:flex; flex-direction:column; align-items:stretch; text-align:left; gap:8px; padding:12px; border:1px solid var(--color-border); border-radius:12px; background:var(--color-bg); color:var(--color-text); min-width:0; cursor:pointer; }
.style-option:hover { border-color:var(--color-primary); }
.style-option[aria-pressed='true'] { outline:2px solid var(--color-primary); outline-offset:1px; }
.style-option__palette { display:flex; height:34px; overflow:hidden; border-radius:6px; border:1px solid #8885; }
.style-option__palette span { flex:1; }
.style-option strong { font-size:14px; line-height:1.4; }
.style-option__note { font-size:11px; line-height:1.4; color:var(--color-text-muted); }
.style-option__check { font-size:10px; color:var(--color-primary); visibility:hidden; margin-top:auto; }
.style-option[aria-pressed='true'] .style-option__check { visibility:visible; }
@media(max-width:480px) { .style-picker { padding:18px; } .style-picker__grid { gap:10px; } }
@media(forced-colors:active) { .style-option[aria-pressed='true'] { outline:3px solid Highlight; } }
html[data-style='maison'] .style-picker__head h2 { font-family: 'Bodoni Moda', Georgia, serif; font-weight: 400; }

/* ---------- Member mark: the mountain and its line, no tile, beside the Style button, marks membership (owner, 14 Nov 2026).
   Owner, 15 Nov 2026: the hairline peaks (option A) in both styles, in each header's own symbol colour: Original's grey,
   like the other header symbols, and Piste Noire's full ink. The solid peaks (option C) are no longer shown. "Member"
   stays for screen readers ---------- */
.member-mark, body.has-pass .member-mark, html.has-pass-hint .member-mark {
  width: 2.5rem; height: 2.5rem; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; gap: 0 !important;
  justify-content: center; align-items: center; color: var(--color-text-muted) !important; transition: color var(--transition);
}
.member-mark:hover, .member-mark:focus-visible { color: var(--color-text) !important; }
html[data-style='maison'] .member-mark, html[data-style='maison'] body.has-pass .member-mark, html[data-style='maison'].has-pass-hint .member-mark { color: var(--color-text) !important; }
.member-mark__icon { flex: none; width: 1.25rem; height: 1.08rem; }   /* owner, 15 Nov 2026: a touch smaller, in line with the day/night and language icons */
.member-mark__icon--c { display: none !important; }

/* ---------- Maison: the resort page's Trip Planner chips at one size (My mountains matches Compare) ---------- */
html[data-style='maison'] .rt__acts .chip { letter-spacing: 0.1em; white-space: nowrap; }
@media (max-width: 640px) {
  html[data-style='maison'] .rt__acts > * { font-size: 0.72rem !important; letter-spacing: 0.08em; }
}
.site-nav .nav-style { display: none; }
@media (max-width: 640px) {
  .site-nav .nav-style { display: block; width: 100%; text-align: left; padding: var(--space-3); font-size: var(--text-base); font-weight: 400; letter-spacing: 0.04em; color: var(--color-text-muted); }
  html[data-style='maison'] .site-nav .nav-style { font-size: 0.76rem; letter-spacing: 0.18em; text-transform: uppercase; }
}

/* ---------- Maison menu: the Resorts list (Europe ... Southern Hemisphere) at the size of the other menu items ---------- */
html[data-style='maison'] .site-nav .nav-menu__list a { font-size: 0.76rem; }

/* ---------- Maison, narrower desktops: the tracked capitals and one-line wordmark need a little less room ---------- */
@media (min-width: 1141px) and (max-width: 1480px) {
  html[data-style='maison'] .site-nav a, html[data-style='maison'] .nav-menu__btn { font-size: 0.7rem; letter-spacing: 0.12em; }
  html[data-style='maison'] .site-header .brand--stack .brand__ski, html[data-style='maison'] .site-header .brand--stack .brand__daily { font-size: 1.12rem; letter-spacing: 0.34em; margin-right: -0.34em; }
  html[data-style='maison'] .site-header .brand--stack .brand__ski { margin-right: 0; }
}
@media (min-width: 1141px) and (max-width: 1300px) {
  html[data-style='maison'] .site-nav a, html[data-style='maison'] .nav-menu__btn { font-size: 0.66rem; letter-spacing: 0.06em; }
  html[data-style='maison'] .site-header .brand--stack .brand__ski, html[data-style='maison'] .site-header .brand--stack .brand__daily { font-size: 1rem; letter-spacing: 0.26em; margin-right: -0.26em; }
  html[data-style='maison'] .site-header .brand--stack .brand__ski { margin-right: 0; }
}
@media (min-width: 1141px) and (max-width: 1200px) {
  html[data-style='maison'] .site-header .brand--stack .brand__ski, html[data-style='maison'] .site-header .brand--stack .brand__daily { font-size: 0.92rem; letter-spacing: 0.22em; margin-right: -0.22em; }
  html[data-style='maison'] .site-header .brand--stack .brand__ski { margin-right: 0; }
}

/* ---------- phones (both styles): Season Pass moves from the header to the foot of the menu (owner, 14 Nov 2026) ----------
   Signed-in members have the mountain Member mark in the header instead, which opens their Season Pass settings. */
.site-nav .nav-pass { display: none; }
@media (max-width: 640px) {
  .site-header__tools .pass-cta, html[data-style='maison'] .site-header__tools .pass-cta { display: none !important; }
  .site-nav .nav-pass { display: flex; align-items: center; gap: 0.5rem; margin-top: var(--space-2); padding: var(--space-3); font-weight: 600; color: var(--color-text); }
  body.has-pass .site-nav .nav-pass, html.has-pass-hint .site-nav .nav-pass { display: none; }
  html[data-style='maison'] .site-nav .nav-pass { font-size: 0.76rem; letter-spacing: 0.18em; text-transform: uppercase; }
}
@media (max-width: 380px) {
  html[data-style='maison'] .brand--stack .brand__ski, html[data-style='maison'] .brand--stack .brand__daily { font-size: 0.84rem; letter-spacing: 0.22em; margin-right: -0.22em; }
  html[data-style='maison'] .brand--stack .brand__ski { margin-right: 0; }
}

/* the picker's style names stay on one line (owner, 14 Nov 2026) */
.style-option strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 480px) { .style-option { padding: 10px; } .style-option strong { font-size: 13px; letter-spacing: -0.01em; } }
@media (max-width: 360px) { .style-picker__grid { grid-template-columns: 1fr; } }

/* the menu button: three lines in Original, two fine lines in Haute Route (owner, 14 Nov 2026) */
.nav-toggle .nav-toggle__two { display: none; }
html[data-style='maison'] .nav-toggle .nav-toggle__three { display: none; }
html[data-style='maison'] .nav-toggle .nav-toggle__two { display: block; }

/* ---------- Piste Noire header: full ink, not Original's grey (owner, 14 Nov 2026) ---------- */
html[data-style='maison'] .site-header .icon-btn, html[data-style='maison'] .site-header .sd-lang__btn,
html[data-style='maison'] .site-header .style-toggle, html[data-style='maison'] .site-header .site-nav a,
html[data-style='maison'] .site-header .nav-menu__btn, html[data-style='maison'] .site-header .nav-find__input,
html[data-style='maison'][data-theme='light'] .site-nav a, html[data-style='maison'][data-theme='dark'] .site-nav a { color: var(--color-text); }
html[data-style='maison'] .site-header .nav-find__input::placeholder { color: var(--color-text); opacity: 0.7; }

/* ---------- Piste Noire, resort page Trip Planner row (owner, 14 Nov 2026): one height, centred labels, square corners;
   the star level with the capitals ---------- */
html[data-style='maison'] .rt__acts > .chip, html[data-style='maison'] .rt__acts > .btn {
  display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;
  min-height: 2.9rem; padding: 0.7rem 1.4rem; line-height: 1.2; border-radius: 0 !important; font-size: 0.78rem; letter-spacing: 0.12em;
}
html[data-style='maison'] .chip .chip-star { position: relative; top: -0.08em; }
@media (min-width: 641px) { html[data-style='maison'] .rt__acts > .btn, html[data-style='maison'] .rt__acts > a.chip { min-width: 16rem; } }

/* ---------- Piste Noire on phones: the home headline, the label above the resort and the My mountains greeting fill
   the width (balanced wrapping left them short in Bodoni Moda; owner, 14 Nov 2026) ---------- */
@media (max-width: 640px) {
  html[data-style='maison'] #answerHome .ab-question, html[data-style='maison'] #answerHome .ab-kicker,
  html[data-style='maison'] .hello__t, html[data-style='maison'] .hello__s { text-wrap: wrap; }
}

/* ---------- Piste Noire on phones: the My mountains chips fit their words (owner, 14 Nov 2026) ---------- */
@media (max-width: 640px) {
  html[data-style='maison'] .tp-only-chip { text-transform: none; letter-spacing: 0.02em; font-size: 0.8rem; padding: 0.45rem 0.6rem; white-space: nowrap; }
  html[data-style='maison'] #regionPins .chip { text-transform: none; letter-spacing: 0; padding: 0.55rem 0.3rem; font-size: clamp(0.6rem, 3vw, 0.8rem); white-space: nowrap; }
  html[data-style='maison'][lang="fr"] #regionPins .chip { font-size: clamp(0.56rem, 2.55vw, 0.72rem); }
}

/* ---------- settings page (both styles): links inside the Trip notes block read as links (owner, 14 Nov 2026) ---------- */
#passTripNotes a { text-decoration: underline; text-underline-offset: 2px; }

/* switches (owner, 14 November 2026): a snow white knob on noir in Piste Noire, not gold */
html[data-style='maison'] .opt-in--switch input[type="checkbox"]:checked { background: radial-gradient(circle at calc(100% - 0.72rem) 50%, #FAFAF7 0 0.56rem, transparent 0.6rem) no-repeat, #0A0A0A; border-color: #0A0A0A; }
html[data-style='maison'] .ar-switch input:checked + .ar-switch__ui { background: #0A0A0A; border-color: #0A0A0A; }
html[data-style='maison'] .ar-switch input:checked + .ar-switch__ui::after { background: #FAFAF7; }
html[data-style='maison'][data-theme='dark'] .opt-in--switch input[type="checkbox"]:checked { background: radial-gradient(circle at calc(100% - 0.72rem) 50%, #0A0A0A 0 0.56rem, transparent 0.6rem) no-repeat, #FAFAF7; border-color: #FAFAF7; }
html[data-style='maison'][data-theme='dark'] .ar-switch input:checked + .ar-switch__ui { background: #FAFAF7; border-color: #FAFAF7; }
html[data-style='maison'][data-theme='dark'] .ar-switch input:checked + .ar-switch__ui::after { background: #0A0A0A; }

/* Le Domaine in Piste Noire: square corners, noir opening section, Bodoni title (owner, 15 Nov 2026) */
html[data-style='maison'] .dm-hero, html[data-style='maison'] .dm-card__b, html[data-style='maison'] .dm-detail, html[data-style='maison'] .dm-empty { border-radius: 0; }
html[data-style='maison'] .dm-hero { background: #0a0a0a; }
html[data-style='maison'] .dm-btn { border-radius: 0; }
html[data-style='maison'][data-theme='dark'] .dm-hero { border: 1px solid rgba(250, 250, 247, 0.18); }

/* ---------- Bodoni Moda's hairlines a touch stronger (owner, 15 Nov 2026) ----------
   The same font, a 0.2 px outline on every Piste Noire text set in Bodoni Moda, so the thin straight strokes (the left of
   the M, the tops of r and a) do not fade, above all on the dark theme. The outline is inherited by spans and links inside
   these. Bodoni Moda is the --ab-page face in Piste Noire: keep this list in step with the rules that use var(--ab-page). */
html[data-style='maison'] :is(.page-title, .ab-question, .ab-verdict, .hello__t, .ab-cell__t, .news-item__title,
  .hero__caption h3, .rep-brief__t p, .rep__why li, .rep__why p, .style-picker__head h2) {
  -webkit-text-stroke: 0.2px currentColor;
}
/* text in Jost inside those, and the resort page's name (Jost capitals), stay without it */
html[data-style='maison'] :is(.ab-resort .page-head--resort .page-title, .rep-brief__n, .rep__why .fc__note, .rep__why li span) { -webkit-text-stroke: 0; }

