/* =========================================================
   Vine & Fire — Art layer (v2 polish)
   Editorial / museum-grade refinement.
   No copy, structure, colour or font changes.
   ========================================================= */

:root{
  --vf-grain-opacity: .035;
  --vf-vignette: 0 0 240px 40px rgba(0,0,0,.55) inset;
  --vf-ease-museum: cubic-bezier(.16,.84,.24,1);
}

/* ---------- Refined typography micro-treatments ---------- */
.vf-body{
  font-feature-settings: "kern" 1, "liga" 1, "dlig" 1, "calt" 1, "onum" 1;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.vf-display,
.vf-title,
.vf-chef-name,
.vf-arc-list h3{
  font-feature-settings: "kern" 1, "liga" 1, "dlig" 1, "swsh" 1;
  text-wrap: balance;
}
.vf-section-eyebrow,
.vf-overline{
  font-feature-settings: "kern" 1, "tnum" 1;
  letter-spacing: .28em !important;
}
.vf-arc-time{
  font-feature-settings: "kern" 1, "lnum" 1;
  font-variant-numeric: lining-nums;
}

/* tighten optical alignment on display italics */
.vf-display em,
.vf-title em{
  letter-spacing: -0.005em;
}

/* ---------- Subtle film grain (the "museum print" feel) ---------- */
body::after{
  content:"";
  position: fixed;
  inset:0;
  pointer-events:none;
  z-index: 9999;
  opacity: var(--vf-grain-opacity);
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  background-size: 160px 160px;
}
@media (prefers-reduced-motion: reduce){ body::after{ opacity: calc(var(--vf-grain-opacity) * .6); } }

/* ---------- Cinematic vignettes on dark sections ---------- */
.vf-hero,
.vf-arc,
.vf-news,
.vf-final{
  position: relative;
}
.vf-hero > .vf-hero-veil,
.vf-arc > .vf-arc-veil,
.vf-final > .vf-final-veil{
  box-shadow: var(--vf-vignette);
}

/* a faint top-edge gold whisper on each dark section (drawn-line feel) */
.vf-arc::before,
.vf-news::before,
.vf-final::before{
  width: 1px !important;
  height: 0 !important;
  top: 0;
  left: 50%;
  background: linear-gradient(180deg, rgba(231,196,123,0), rgba(231,196,123,.65), rgba(231,196,123,0)) !important;
  transition: height 1800ms var(--vf-ease-museum) 200ms;
  opacity: 1 !important;
}
.vf-arc.in-view::before,
.vf-news.in-view::before,
.vf-final.in-view::before,
.vf-arc:has(.in-view)::before,
.vf-news:has(.in-view)::before,
.vf-final:has(.in-view)::before{
  height: 88px !important;
}

/* ---------- Section reveals — slower, museum-grade ---------- */
[data-reveal]{
  transition:
    opacity 1500ms var(--vf-ease-museum),
    transform 1500ms var(--vf-ease-museum) !important;
  transform: translateY(22px);
}
[data-reveal].in-view{ transform: translate3d(0,0,0); }

/* ---------- Editorial dividers (drawn gold lines) ---------- */
.vf-arc-divider span,
.vf-hero-rule span{
  position: relative;
  overflow: hidden;
  background: rgba(201,165,103,.18) !important;
}
.vf-arc-divider span::after,
.vf-hero-rule span::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, rgba(231,196,123,0), rgba(231,196,123,.85), rgba(231,196,123,0));
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform 1600ms var(--vf-ease-museum) 200ms;
}
.vf-arc-divider span:last-of-type::after,
.vf-hero-rule span:last-of-type::after{
  transform-origin: 100% 50%;
}
.in-view .vf-arc-divider span::after,
.in-view .vf-hero-rule span::after,
.vf-arc-divider.in-view span::after,
.vf-hero-rule.in-view span::after{
  transform: scaleX(1);
}

/* ---------- Hero — frame as artefact ---------- */
.vf-hero-content{
  padding: clamp(28px, 5vw, 64px) clamp(20px, 4vw, 48px) !important;
}
.vf-overline{
  font-size: 11px !important;
  opacity: .82 !important;
}
.vf-title-amp{
  opacity: .85 !important;
}
.vf-subtitle{
  max-width: 560px;
  margin-left: auto !important;
  margin-right: auto !important;
  line-height: 1.55 !important;
}
.vf-hero-meta{
  letter-spacing: .14em !important;
  opacity: .8 !important;
}
.vf-hero-meta i{ opacity: .45; margin: 0 .35em; }

.vf-hero-foot{
  font-style: italic;
  opacity: .55 !important;
  letter-spacing: .02em !important;
}

/* ---------- Buttons — quieter, more deliberate ---------- */
.vf-btn{
  letter-spacing: .26em !important;
  font-size: 12px !important;
  padding: 18px 40px !important;
  transition:
    box-shadow 700ms var(--vf-ease-museum),
    transform 700ms var(--vf-ease-museum),
    background-color 700ms var(--vf-ease-museum),
    color 700ms var(--vf-ease-museum) !important;
}
.vf-btn span{ position: relative; z-index: 2; }
@media (hover:hover){
  .vf-btn:hover{
    transform: translateY(-1px);
  }
}

/* ---------- Section eyebrow with hairline mark ---------- */
.vf-section-eyebrow{
  position: relative;
  display: inline-block;
  padding: 0 22px;
}
.vf-section-eyebrow::before,
.vf-section-eyebrow::after{
  content:"";
  position: absolute;
  top: 50%;
  width: 14px;
  height: 1px;
  background: currentColor;
  opacity: .4;
}
.vf-section-eyebrow::before{ left: 0; }
.vf-section-eyebrow::after { right: 0; }

/* ---------- Intro polish ---------- */
.vf-intro-body{
  line-height: 1.65 !important;
  letter-spacing: .002em;
  text-wrap: pretty;
}
.vf-intro-body em{
  font-style: italic;
  background: linear-gradient(180deg, transparent 70%, rgba(201,165,103,.22) 70%) !important;
}

/* ---------- Partners — gallery card treatment ---------- */
.vf-partner-frame{
  border: 1px solid rgba(201,165,103,.14) !important;
  position: relative;
  overflow: hidden;
}
.vf-partner-frame:not(.vf-partner-frame--cream){
  background-color: rgba(8,20,13,.85);
}
.vf-partner-frame--cream{
  border-color: rgba(178,120,98,.22) !important;
}
.vf-partner-frame--cream::before{
  border-color: rgba(178,120,98,.18) !important;
}
@media (hover:hover){
  .vf-partner:hover .vf-partner-frame--cream::before{
    border-color: rgba(178,120,98,.45) !important;
  }
}
.vf-arvad-logo{
  max-width: 260px !important;
  opacity: 1 !important;
  filter: brightness(0) saturate(100%) invert(43%) sepia(48%) saturate(880%) hue-rotate(341deg) brightness(91%) contrast(88%);
  mix-blend-mode: normal;
}
.vf-partner-frame::before{
  content:"";
  position: absolute;
  inset: 14px;
  border: 1px solid rgba(201,165,103,.1);
  pointer-events: none;
  transition: inset 700ms var(--vf-ease-museum), border-color 700ms var(--vf-ease-museum);
}
@media (hover:hover){
  .vf-partner:hover .vf-partner-frame::before{
    inset: 10px;
    border-color: rgba(231,196,123,.32);
  }
}
.vf-partner-kind{
  letter-spacing: .32em !important;
  font-size: 10px !important;
}

/* ---------- Arc — long-table museum quality ---------- */
.vf-arc-list{
  border-top: 1px solid rgba(201,165,103,.14);
  margin-top: 56px !important;
}
.vf-arc-list li{
  padding: 30px 0 !important;
  align-items: center !important;
}
.vf-arc-time{
  font-size: clamp(48px, 5vw, 64px) !important;
  letter-spacing: .04em !important;
  opacity: .88;
  transition: opacity 700ms var(--vf-ease-museum), transform 700ms var(--vf-ease-museum) !important;
}
@media (hover:hover){
  .vf-arc-list li:hover .vf-arc-time{
    opacity: 1;
    transform: translateX(-2px);
  }
}
.vf-arc-list h3{
  letter-spacing: .005em;
  font-weight: 400 !important;
}
.vf-arc-list p{
  font-style: italic;
  opacity: .72;
}
.vf-arc-cta{ margin-top: 80px !important; }

.vf-chef-body p{
  text-wrap: pretty;
}

/* ---------- Newsletter — invitation card ---------- */
.vf-news-card{
  border-radius: 1px;
  border: 1px solid rgba(201,165,103,.22) !important;
  position: relative;
}
.vf-news-card::before,
.vf-news-card::after{
  content:"";
  position: absolute;
  width: 22px; height: 22px;
  border: 1px solid rgba(231,196,123,.55);
  pointer-events: none;
}
.vf-news-card::before{ top: 14px; left: 14px; border-right: none; border-bottom: none; }
.vf-news-card::after { bottom: 14px; right: 14px; border-left: none; border-top: none; }

.vf-form{
  gap: 26px !important;
}
.vf-promise{
  margin-top: 56px !important;
  padding-top: 36px;
  border-top: 1px solid rgba(201,165,103,.16);
}
.vf-promise li{
  text-align: center;
}
.vf-promise li strong{
  display: block;
  font-size: clamp(28px, 3vw, 38px) !important;
  font-weight: 400 !important;
  margin-bottom: 6px;
}
.vf-promise li span{
  letter-spacing: .18em !important;
  font-size: 11px !important;
  text-transform: uppercase;
  opacity: .75;
}

/* ---------- FAQ — quiet, refined accordion ---------- */
.vf-faq{
  border-top: 1px solid rgba(13,31,21,.10);
}
.vf-faq details{
  border-bottom: 1px solid rgba(13,31,21,.08) !important;
}
.vf-faq summary{
  font-size: clamp(17px, 1.6vw, 19px) !important;
  letter-spacing: .005em;
  padding: 26px 44px 26px 0 !important;
  position: relative;
}
.vf-faq summary::after{
  font-family: var(--vf-display) !important;
  font-weight: 300 !important;
  font-size: 22px !important;
  transition: transform 600ms var(--vf-ease-museum), color 400ms var(--vf-ease-museum) !important;
}
.vf-faq details[open] summary::after{
  color: var(--vf-gold) !important;
}
.vf-faq details > div{
  padding-bottom: 28px !important;
  font-style: italic;
  opacity: .82;
}

/* promise card — quieter */
.vf-promise-card{
  padding: clamp(36px, 4vw, 56px) !important;
}
.vf-promise-card h3{
  letter-spacing: .005em;
  font-weight: 400 !important;
  text-wrap: balance;
}
.vf-promise-card ul li{
  padding-left: 22px;
  position: relative;
}
.vf-promise-card ul li::before{
  content:"";
  position: absolute;
  left: 0; top: .65em;
  width: 12px; height: 1px;
  background: var(--vf-gold);
  opacity: .8;
}

/* ---------- Final / closing — chapter close ---------- */
.vf-final-photo img{
  filter: saturate(.6) brightness(.26) contrast(1.05) !important;
}
.vf-final-veil{
  background:
    radial-gradient(ellipse 65% 60% at 50% 50%, rgba(8,20,13,.55), rgba(8,20,13,.95) 80%) !important;
  box-shadow: var(--vf-vignette);
}
.vf-final-inner{
  padding: clamp(60px, 8vh, 100px) 0 !important;
}
.vf-final-attr{
  letter-spacing: .18em !important;
  font-size: 11px !important;
  opacity: .7 !important;
  text-transform: uppercase;
  font-style: normal !important;
}

/* ---------- Footer — quiet imprint ---------- */
.vf-foot{
  border-top: 1px solid rgba(201,165,103,.14);
  padding: 80px 0 !important;
}
.vf-foot .foot-row{
  align-items: center;
}
.vf-foot .foot-sub{
  font-size: 11px !important;
  letter-spacing: .14em !important;
  opacity: .55;
  text-transform: uppercase;
  margin-top: 18px;
}
.social-icon{
  transition: transform 600ms var(--vf-ease-museum), color 400ms var(--vf-ease-museum) !important;
}
@media (hover:hover){
  .social-icon:hover{ color: var(--vf-gold); transform: translateY(-2px); }
}

/* ---------- Mobile cinematic refinements ---------- */
@media (max-width: 680px){
  body::after{ opacity: calc(var(--vf-grain-opacity) * .8); }
  .vf-hero-content{ padding: 28px 18px !important; }
  .vf-arc-time{ font-size: 38px !important; }
  .vf-news-card::before, .vf-news-card::after{ width: 16px; height: 16px; top: 10px; }
  .vf-news-card::after{ top: auto; bottom: 10px; right: 10px; left: auto; }
  .vf-section-eyebrow{ padding: 0 18px; }
  .vf-section-eyebrow::before,
  .vf-section-eyebrow::after{ width: 10px; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .vf-arc::before,
  .vf-news::before,
  .vf-final::before,
  .vf-arc-divider span::after,
  .vf-hero-rule span::after,
  .vf-partner-frame::before,
  .social-icon,
  .vf-faq summary::after,
  .vf-arc-list li,
  .vf-arc-time,
  .vf-btn{
    transition: none !important;
    animation: none !important;
  }
  .vf-arc-divider span::after,
  .vf-hero-rule span::after{ transform: scaleX(1); }
  .vf-arc::before,
  .vf-news::before,
  .vf-final::before{ height: 60px !important; }
}