/* ============================================================
   VELLINORE — Hero: extended creative controls (Tweakable)
   New data-* on #hero, layered on top of the existing layout/
   overlay/height/motion controls. Quiet-luxury defaults.
   ============================================================ */

/* ---- Kicker (eyebrow + hairline rule) ---- */
.hero[data-hero-eyebrow="off"] .eyebrow,
.hero[data-hero-eyebrow="off"] .hero-rule{ display:none; }

/* ---- Scroll cue ---- */
.hero[data-hero-scroll="off"] .scroll-hint{ display:none; }

/* ---- Headline: italic toggle ---- */
.hero[data-hero-italic="on"] .hero-content h1{ font-style:italic; }
.hero[data-hero-italic="off"] .hero-content h1{ font-style:normal; }

/* ---- Headline: size ---- */
.hero[data-hero-size="s"] .hero-content h1{ font-size:clamp(36px,6vw,82px); }
.hero[data-hero-size="m"] .hero-content h1{ font-size:clamp(42px,7.4vw,104px); }
.hero[data-hero-size="l"] .hero-content h1{ font-size:clamp(48px,8.6vw,120px); }
.hero[data-hero-size="xl"] .hero-content h1{ font-size:clamp(56px,11vw,168px); }

/* ---- Headline: letter-spacing ---- */
.hero[data-hero-track="tight"] .hero-content h1{ letter-spacing:-.018em; }
.hero[data-hero-track="normal"] .hero-content h1{ letter-spacing:.005em; }
.hero[data-hero-track="wide"] .hero-content h1{ letter-spacing:.07em; }

/* ---- Vertical text position (center & full-bleed layouts) ---- */
.hero[data-hero-vpos="top"] .hero-content{ justify-content:flex-start; padding-top:clamp(96px,18vh,220px); }
.hero[data-hero-vpos="center"] .hero-content{ justify-content:center; }
.hero[data-hero-vpos="bottom"] .hero-content{ justify-content:flex-end; padding-bottom:clamp(60px,14vh,160px); }

/* ---- Overlay tint / colour (combines with data-overlay strength) ---- */
.hero[data-hero-tint="espresso"] .hero-overlay{
  background:linear-gradient(180deg,rgba(54,47,36,.62) 0%,rgba(40,33,20,.18) 40%,rgba(40,33,20,.82) 100%); }
.hero[data-hero-tint="warm"] .hero-overlay{
  background:linear-gradient(180deg,rgba(74,44,22,.46) 0%,rgba(48,34,20,.20) 45%,rgba(30,20,12,.82) 100%); }
.hero[data-hero-tint="vignette"] .hero-overlay{
  background:radial-gradient(122% 82% at 50% 44%,transparent 34%,rgba(20,15,8,.72) 100%); }
.hero[data-hero-tint="none"] .hero-overlay{
  background:linear-gradient(180deg,rgba(20,15,8,.10) 0%,transparent 30%,rgba(20,15,8,.42) 100%); }

/* ---- Image focus (object-position) ---- */
.hero[data-hero-focus="top"] .hero-video, .hero[data-hero-focus="top"] .hero-photo{ object-position:50% 14%; }
.hero[data-hero-focus="center"] .hero-video, .hero[data-hero-focus="center"] .hero-photo{ object-position:50% 50%; }
.hero[data-hero-focus="bottom"] .hero-video, .hero[data-hero-focus="bottom"] .hero-photo{ object-position:50% 84%; }

/* ---- CTA style ---- */
.hero[data-hero-cta="single"] .hero-ctas .btn:nth-child(2){ display:none; }
.hero[data-hero-cta="none"] .hero-ctas{ display:none; }
.hero[data-hero-cta="outline"] .hero-ctas .btn{ background:none; border:1px solid rgba(244,236,218,.55); color:#F4ECDA; }
.hero[data-hero-cta="outline"] .hero-ctas .btn:hover{ background:rgba(244,236,218,.10); }
.hero[data-hero-cta="text"] .hero-ctas{ gap:30px; }
.hero[data-hero-cta="text"] .hero-ctas .btn{ background:none !important; border:0; border-bottom:1px solid var(--champagne); border-radius:0;
  color:#F4ECDA; padding:6px 0; letter-spacing:.2em; font-size:12px; }
.hero[data-hero-cta="text"] .hero-ctas .btn:hover{ border-color:#F4ECDA; }

/* ---- Headline accent: gild one word wrapped in <em> ---- */
.hero[data-hero-accent="on"] .hero-content h1 em{ font-style:inherit; color:var(--champagne); }

/* ---- Horizontal alignment of the hero text (independent of layout) ---- */
.hero[data-hero-halign="left"] .hero-content{ align-items:flex-start; text-align:left; }
.hero[data-hero-halign="center"] .hero-content{ align-items:center; text-align:center; }
.hero[data-hero-halign="right"] .hero-content{ align-items:flex-end; text-align:right; }
.hero[data-hero-halign="left"] .hero-ctas{ justify-content:flex-start; }
.hero[data-hero-halign="center"] .hero-ctas{ justify-content:center; }
.hero[data-hero-halign="right"] .hero-ctas{ justify-content:flex-end; }

/* ---- Split direction + ratio (image left/right, panel width) ---- */
.hero[data-layout="split-left"]{ background:var(--espresso); }
.hero[data-layout="split-left"] .hero-media, .hero[data-layout="split-left"] .hero-overlay{ left:0; right:42%; }
.hero[data-layout="split-left"] .hero-content{ left:58%; width:42%; align-items:flex-start; justify-content:center; text-align:left; padding:0 4.5vw; gap:20px; }
.hero[data-layout="split-left"] .hero-content h1{ white-space:normal; font-style:normal; font-size:clamp(38px,4.4vw,76px); }
.hero[data-split-ratio="wide"][data-layout="split"] .hero-media,
.hero[data-split-ratio="wide"][data-layout="split"] .hero-overlay{ left:54%; }
.hero[data-split-ratio="wide"][data-layout="split"] .hero-content{ width:54%; }
.hero[data-split-ratio="narrow"][data-layout="split"] .hero-media,
.hero[data-split-ratio="narrow"][data-layout="split"] .hero-overlay{ left:34%; }
.hero[data-split-ratio="narrow"][data-layout="split"] .hero-content{ width:34%; }
@media (max-width:760px){
  .hero[data-layout="split-left"] .hero-media, .hero[data-layout="split-left"] .hero-overlay{ left:0; right:0; }
  .hero[data-layout="split-left"] .hero-content{ left:0; width:auto; }
}

/* ============================================================
   MORE BILDSPRACHE — extra campaign stills + image treatments
   Authoritative: exactly one media layer shows per data-hero,
   and the video hides whenever Bildsprache is not "film".
   ============================================================ */
.hero[data-hero-treat="warm"] .hero-media{ filter:saturate(1.08) sepia(.12) brightness(1.02); }
.hero[data-hero-treat="cool"] .hero-media{ filter:saturate(.92) hue-rotate(-8deg) brightness(1.0); }
.hero[data-hero-treat="bw"] .hero-media{ filter:grayscale(1) contrast(1.06); }
.hero[data-hero-treat="sepia"] .hero-media{ filter:sepia(.48) saturate(1.1) brightness(.98); }

/* ============================================================
   MORE LAYOUTS — creative compositions
   ============================================================ */
/* framed — inset hairline frame around centered content (gallery feel) */
.hero[data-layout="framed"] .hero-content{ align-items:center; justify-content:center; text-align:center; }
.hero[data-layout="framed"]::after{ content:''; position:absolute; inset:clamp(18px,3vw,46px); z-index:3;
  border:1px solid rgba(244,236,218,.42); pointer-events:none; }
.hero[data-layout="framed"] .hero-content h1{ white-space:normal; }

/* band — text in a soft gradient band across the lower third */
.hero[data-layout="band"] .hero-content{ inset:auto 0 0 0; height:auto; justify-content:center; align-items:center;
  text-align:center; padding:clamp(44px,8vh,96px) 24px clamp(40px,7vh,84px);
  background:linear-gradient(180deg,transparent,rgba(34,28,18,.74)); gap:16px; }
.hero[data-layout="band"] .hero-content h1{ white-space:normal; font-style:normal; font-size:clamp(34px,5vw,80px); }
.hero[data-layout="band"] .hero-rule{ display:none; }
.hero[data-layout="band"] .hero-sub{ max-width:50ch; }

/* sidebar — left vertical column with a gradient scrim */
.hero[data-layout="sidebar"] .hero-content{ align-items:flex-start; justify-content:center; text-align:left;
  width:min(50%,580px); padding:0 0 0 6vw; background:linear-gradient(90deg,rgba(34,28,18,.66),transparent 92%); gap:18px; }
.hero[data-layout="sidebar"] .hero-content h1{ white-space:normal; font-style:normal; font-size:clamp(40px,5vw,86px); max-width:12ch; }
.hero[data-layout="sidebar"] .hero-sub{ max-width:34ch; }
.hero[data-layout="sidebar"] .hero-ctas{ justify-content:flex-start; }
@media (max-width:760px){
  .hero[data-layout="sidebar"] .hero-content{ width:auto; padding:0 7vw; background:linear-gradient(180deg,rgba(34,28,18,.2),rgba(34,28,18,.7)); }
}

/* ============================================================
   HERO BUTTONS — shape + accent colour
   ============================================================ */
.hero[data-hero-btnshape="pill"] .hero-ctas .btn{ border-radius:100px; }
.hero[data-hero-btnshape="sharp"] .hero-ctas .btn{ border-radius:0; }
.hero[data-hero-btncolor="gold"] .hero-ctas .btn-champ{ background:var(--gold-deep); color:#FBF7EF; }
.hero[data-hero-btncolor="cream"] .hero-ctas .btn-champ{ background:var(--cream); color:var(--espresso); }
.hero[data-hero-btncolor="ink"] .hero-ctas .btn-champ{ background:var(--ink); color:var(--cream); }
.hero[data-hero-btncolor="champagne"] .hero-ctas .btn-champ{ background:var(--champagne); color:var(--espresso); }

/* ============================================================
   INTRO (Saison-Cover) BUTTONS — count · style · shape · colour
   ============================================================ */
.sc-ctas{ display:flex; gap:16px; flex-wrap:wrap; margin-top:26px; }
body[data-introstyle="left"] .sc-ctas{ justify-content:flex-start; }
body[data-introstyle="statement"] .sc-ctas,
body[data-introstyle="numeral"] .sc-ctas,
body[data-introstyle="minimal"] .sc-ctas,
body[data-introstyle="overimage"] .sc-ctas{ justify-content:center; }

/* colour tokens (default + over-image) */
.saisoncover{ --cta:var(--gold-deep); --cta-on:var(--cream); }
body[data-introstyle="overimage"] .saisoncover{ --cta:var(--champagne); --cta-on:var(--espresso); }
body[data-introcta-color="ink"] .saisoncover{ --cta:var(--ink); --cta-on:var(--cream); }
body[data-introcta-color="gold"] .saisoncover{ --cta:var(--gold-deep); --cta-on:var(--cream); }
body[data-introcta-color="espresso"] .saisoncover{ --cta:var(--espresso); --cta-on:var(--cream); }
body[data-introcta-color="champagne"] .saisoncover{ --cta:var(--champagne); --cta-on:var(--espresso); }

/* base = text link */
.sc-cta{ display:inline-block; font-family:var(--sans); font-size:12px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--cta); background:none; border:0; border-bottom:1px solid var(--cta); padding:6px 2px; cursor:pointer;
  text-decoration:none; transition:opacity .25s var(--ease), background-color .25s var(--ease), color .25s var(--ease); }
.sc-cta:hover{ opacity:.7; }

/* style: solid */
body[data-introcta-style="solid"] .sc-cta{ border:0; background:var(--cta) !important; color:var(--cta-on) !important; padding:15px 30px; letter-spacing:.14em; }
body[data-introcta-style="solid"] .sc-cta:hover{ opacity:.9; }
body[data-introcta-style="solid"] .sc-cta-2{ background:none; color:var(--cta); border:1px solid var(--cta); }
/* style: outline */
body[data-introcta-style="outline"] .sc-cta{ border:1px solid var(--cta) !important; color:var(--cta) !important; padding:14px 28px; letter-spacing:.14em; background:none; }
body[data-introcta-style="outline"] .sc-cta:hover{ background:var(--cta); color:var(--cta-on); opacity:1; }

/* shape */
body[data-introcta-shape="pill"] .sc-cta{ border-radius:100px; }
body[data-introcta-shape="sharp"] .sc-cta{ border-radius:0; }

/* count */
body[data-introcta-count="1"] .sc-cta-2{ display:none; }
body[data-introcta-count="0"] .sc-ctas{ display:none; }