/* ============================================================
   LAKA EVENT COMPANY — index-2.css
   Editorial landing modelled closely on torcianowedding.com,
   rebuilt on Laka's bordeaux / gold / cream palette.
   Type system: Playfair Display (Latin display) · Noto Serif
   Georgian (GE display) · Jost (UI/eyebrows) · EB Garamond
   (italic accents) · FiraGO (GE body).
   Loads AFTER style.css and only on this page, so header/hero
   overrides here are page-scoped by file, not by selector.
   ============================================================ */

:root{
  --disp: "Playfair Display", "Noto Serif Georgian", Georgia, serif;
  --ge-disp: "Noto Serif Georgian", "Playfair Display", Georgia, serif;
  --brand-head: "Bebas Neue", "FiraGO", "Noto Serif Georgian", Georgia, sans-serif; /* Latin→Bebas, Georgian→FiraGO ExtraBold */
  --ui: "Jost", "FiraGO", "Noto Sans Georgian", sans-serif;
  --accent: "EB Garamond", "Cormorant Garamond", Georgia, serif;
  --head: #3A171F;            /* deep, solid bordeaux-charcoal for headings */
  --tan:  #C6AF83;            /* champagne band */
  --tan-soft:#E7DFCD;
  --cream-2:#EADFCA;          /* deepened a touch so light sections step clearly */
  --seam:rgba(58,23,31,.07);  /* hairline between light sections */
}

/* ---------- editorial type primitives ---------- */
.eyebrow{
  display:block;
  font-family:var(--ui);
  font-size:11px; font-weight:500;
  letter-spacing:.34em; text-transform:uppercase;
  color:var(--gold);
  margin-bottom:20px;
}
.section-head .eyebrow{ text-align:center; }
.script-accent{
  font-family:var(--accent);
  font-style:italic; font-weight:500;
  font-size:clamp(28px, 3.2vw, 46px);
  line-height:1.1;
  color:var(--gold);
  display:block;
}

/* headings tuned to the reference (uppercase, tracked, solid) */
.ed-h{
  font-family:var(--brand-head);
  color:var(--head);
  text-transform:uppercase;
  letter-spacing:.05em;
  font-weight:800;
  line-height:1.12;
}
h1.ed-h{ font-size:clamp(40px, 5vw, 66px); }
h2.ed-h{ font-size:clamp(30px, 3.8vw, 52px); }
.section-head{ text-align:center; margin-bottom:clamp(40px, 5vw, 66px); }
.section-head .ed-h{ margin-inline:auto; max-width:22ch; }
.section-sub{
  margin:18px auto 0; max-width:60ch;
  color:var(--ink-soft); font-size:15px; line-height:1.7;
}
.rule{
  display:block; width:50px; height:1px;
  background:linear-gradient(90deg, transparent, var(--gold), transparent);
  margin:16px auto 0;
}

/* ---------- editorial buttons / links ---------- */
.btn-line{
  display:inline-flex; align-items:center; gap:12px;
  font-family:var(--ui);
  font-size:11px; font-weight:500;
  letter-spacing:.26em; text-transform:uppercase;
  color:var(--wine);
  background:transparent;
  border:1px solid rgba(87,26,40,.38);
  padding:15px 30px; border-radius:2px;
  transition:background .4s var(--ease-out), color .4s, border-color .4s, transform .45s var(--ease-out);
}
.btn-line .arw{ transition:transform .45s var(--ease-out); }
.btn-line:hover{ background:var(--wine); color:var(--cream); border-color:var(--wine); transform:translateY(-2px); }
.btn-line:hover .arw{ transform:translateX(5px); }
.btn-line.light{ color:var(--cream); border-color:rgba(245,241,232,.5); }
.btn-line.light:hover{ background:var(--cream); color:var(--wine); border-color:var(--cream); }
.btn-line.gold{ border-color:rgba(198,175,131,.65); color:var(--wine-deep); background:var(--gold-2); }
.btn-line.gold:hover{ background:var(--cream); border-color:var(--cream); color:var(--wine); }

/* ============================================================
   HEADER — centered logo, split nav, transparent over hero
   ============================================================ */
#siteHeader{
  background:transparent;
  box-shadow:none;
  backdrop-filter:none; -webkit-backdrop-filter:none;
}
#siteHeader::after{  /* faint top scrim so nav reads on the video */
  content:""; position:absolute; inset:0 0 auto 0; height:150%;
  background:linear-gradient(180deg, rgba(42,9,15,.42), transparent);
  z-index:-1; pointer-events:none;
  transition:opacity .45s;
}
.header-inner{
  position:relative;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:24px;
  padding:24px 0;
}
.header-inner .main-nav{ margin:0; }
.burger{ position:absolute; right:0; top:50%; transform:translateY(-50%); }
.nav-left{ justify-self:start; }
.nav-right{ justify-self:end; align-items:center; }
.header-inner .logo{ justify-self:center; }
.header-inner .logo img{
  height:58px; width:auto;
  filter:brightness(0) invert(1);       /* white over the video */
  transition:height .45s var(--ease-out), filter .45s;
}
.main-nav .nav-link{
  font-family:var(--ui);
  font-size:11px; font-weight:500;
  letter-spacing:.2em; text-transform:uppercase;
  color:rgba(245,241,232,.92);
  padding:6px 0;
}
.main-nav .nav-link::after{ background:var(--gold-2); height:1px; }
.main-nav .nav-link:hover,
.main-nav .nav-link.active{ color:#fff; }
.hdr-cta{
  font-family:var(--ui);
  font-size:10.5px; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--wine-deep);
  background:var(--gold-2);
  padding:11px 22px; border-radius:2px;
  border:1px solid transparent;
  transition:background .35s, color .35s, transform .45s var(--ease-out);
}
.hdr-cta:hover{ transform:translateY(-2px); background:var(--cream); }
.burger span{ background:var(--cream); }

/* scrolled state → solid cream, dark text, natural logo */
#siteHeader.scrolled{
  background:rgba(253,249,242,.9);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  box-shadow:0 10px 34px -20px rgba(69,16,29,.28);
}
#siteHeader.scrolled::after{ opacity:0; }
#siteHeader.scrolled .header-inner{ padding:12px 0; }
#siteHeader.scrolled .logo img{ height:44px; filter:none; }
#siteHeader.scrolled .main-nav .nav-link{ color:var(--ink); }
#siteHeader.scrolled .main-nav .nav-link:hover,
#siteHeader.scrolled .main-nav .nav-link.active{ color:var(--wine); }
#siteHeader.scrolled .burger span{ background:var(--wine); }

/* ============================================================
   VIDEO HERO — minimal, centered crest (torciano rhythm)
   ============================================================ */
#hero.vhero{
  position:relative;
  isolation:isolate;              /* own stacking context — keeps the video layer inside the hero */
  min-height:100svh;
  padding:150px 0 130px;
  display:flex; align-items:center; justify-content:center;
  text-align:center;
  overflow:hidden;
}
.vhero-media{ position:absolute; inset:0; z-index:0; overflow:hidden; background:var(--wine-deep); }
.vhero-media video,
.vhero-media img.vhero-poster{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center 38%;
  display:block;
}
.vhero-media img.vhero-poster{ z-index:0; }
.vhero-media video{ z-index:1; }
.vhero-veil{
  position:absolute; inset:0; z-index:1;
  pointer-events:none;
  background:
    linear-gradient(180deg, rgba(42,9,15,.24) 0%, transparent 26%, transparent 70%, rgba(42,9,15,.26) 100%),
    radial-gradient(46% 42% at 50% 50%, rgba(42,9,15,.22) 0%, transparent 62%);
}
/* light veil → keep hero text legible on the bright video with soft shadows */
.vhero-eyebrow{ text-shadow:0 2px 16px rgba(42,9,15,.6); }
.vhero-script{ text-shadow:0 3px 24px rgba(42,9,15,.55); }
.vhero-scroll{ text-shadow:0 2px 14px rgba(42,9,15,.6); }
.vhero .container{ position:relative; z-index:2; }
.vhero-content{
  max-width:900px; margin-inline:auto;
  display:flex; flex-direction:column; align-items:center;
}
.vhero-eyebrow{
  font-family:var(--ui);
  font-size:11px; font-weight:500;
  letter-spacing:.4em; text-transform:uppercase;
  color:rgba(245,241,232,.8);
  margin-bottom:30px;
}
.vhero-crest{
  height:104px; width:auto; margin-bottom:20px;
  filter:brightness(0) invert(1) drop-shadow(0 12px 30px rgba(42,9,15,.55));
  opacity:.97;
}
.vhero-script{
  font-family:var(--accent);
  font-style:italic; font-weight:500;
  font-size:clamp(26px, 3.2vw, 40px);
  color:var(--gold-2);
}
.vhero-content .divider{
  width:1px; height:54px; margin:26px auto 0;
  background:linear-gradient(var(--gold-2), transparent);
}
/* scroll cue */
.vhero-scroll{
  position:absolute; left:50%; bottom:38px; transform:translateX(-50%);
  z-index:3; display:flex; flex-direction:column; align-items:center; gap:12px;
  color:rgba(245,241,232,.85);
  font-family:var(--ui);
  font-size:10px; letter-spacing:.34em; text-transform:uppercase;
}
.vhero-scroll .arw{
  font-size:16px; animation:heroArrow 1.9s var(--ease-out) infinite;
}
@keyframes heroArrow{
  0%,100%{ transform:translateY(0); opacity:.5; }
  50%{ transform:translateY(7px); opacity:1; }
}

/* fade-in entrance for hero children (uses body.loaded from main.js) */
.vhero-content > *{ opacity:0; transform:translateY(22px); transition:opacity 1s var(--ease-out), transform 1s var(--ease-out); }
body.loaded .vhero-content > *{ opacity:1; transform:none; }
body.loaded .vhero-eyebrow{ transition-delay:.4s; }
body.loaded .vhero-crest{ transition-delay:.55s; }
body.loaded .vhero-script{ transition-delay:.75s; }
body.loaded .vhero-content .divider{ transition-delay:.95s; }
.vhero-scroll{ opacity:0; transition:opacity 1s 1.2s var(--ease-out); }
body.loaded .vhero-scroll{ opacity:1; }

/* hero slogan — main brand line, set a touch below centre */
.vhero-slogan-wrap{
  position:absolute; left:50%; top:72%; transform:translate(-50%,-50%);
  z-index:3; width:min(92%, 940px); text-align:center; pointer-events:none;
}
.vhero-slogan-line{
  display:block; width:64px; height:1px; margin:0 auto 26px;
  background:linear-gradient(90deg, transparent, var(--gold-2), transparent);
  opacity:0; transition:opacity 1s .5s var(--ease-out);
}
.vhero-slogan{
  margin:0;
  font-family:"FiraGO", "Noto Sans Georgian", sans-serif;
  font-weight:400;
  font-size:clamp(30px, 5.4vw, 68px);
  line-height:1.16; letter-spacing:.004em;
  color:var(--cream);
  text-shadow:0 3px 30px rgba(42,9,15,.55);
  opacity:0; transform:translateY(18px);
  transition:opacity 1.2s .55s var(--ease-out), transform 1.2s .55s var(--ease-out);
}
.vhero-slogan em{ font-style:normal; color:var(--gold-2); }
.vhero-slogan .q{ color:var(--gold-2); font-weight:400; }
body.loaded .vhero-slogan{ opacity:1; transform:none; }
body.loaded .vhero-slogan-line{ opacity:1; }
@media (prefers-reduced-motion: reduce){
  .vhero-slogan, .vhero-slogan-line{ transition:none; opacity:1; transform:none; }
}

/* ============================================================
   FEATURE SPLITS (image / text alternating)
   ============================================================ */
.feature{ padding:clamp(58px, 6.2vw, 100px) 0; position:relative; }
.feature.tint{ background:var(--cream-2); }
.feature .container{
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(44px, 6vw, 100px); align-items:stretch;
}
.feature.rev .feature-media{ order:2; }
.feature.rev .feature-text{ order:1; }
.feature-media{
  position:relative;
  width:100%;                              /* fill the column — no empty gap beside the photo */
  align-self:stretch;                      /* match the text column height — no floating gap */
  min-height:clamp(400px, 44vh, 500px);
  overflow:hidden; border-radius:3px;
}
.feature-media > img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; display:block;
  border-radius:3px;
}
.feature-media.f-tall{ aspect-ratio:auto; }
.feature-media.f-wide{ aspect-ratio:auto; }
.feature-media::after{           /* refined inset frame (visible inside the reveal mask) */
  content:""; position:absolute; z-index:5;
  inset:13px; border:1px solid rgba(245,241,232,.5);
  border-radius:3px; pointer-events:none;
}
.feature-text{ max-width:560px; }
.feature.rev .feature-text{ margin-left:auto; }
.feature-text .ed-h{ margin-bottom:24px; }
.feature-text p{ color:var(--ink-soft); font-size:15.5px; line-height:1.9; margin-bottom:20px; }
.feature-text p strong{ color:var(--wine); font-weight:600; }
.feature-text .btn-line{ margin-top:16px; }

/* ============================================================
   AS SEEN IN / PARTNERS
   ============================================================ */
.seenin{
  background:var(--tan);
  padding:clamp(38px, 4.5vw, 58px) 0;
}
.seenin .eyebrow{
  text-align:center; color:var(--wine-deep);
  opacity:.7; margin-bottom:26px;
}
.seenin-row{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:clamp(30px, 6vw, 74px);
}
.seenin-logo{
  font-family:var(--disp);
  font-size:clamp(18px, 2vw, 26px);
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--wine-deep);
  opacity:.55;
  transition:opacity .4s;
}
.seenin-logo small{
  display:block; font-family:var(--ui);
  font-size:8.5px; letter-spacing:.2em; opacity:.8; margin-top:2px;
}
.seenin-logo:hover{ opacity:.85; }

/* ============================================================
   FILMS & REELS
   ============================================================ */
.reels{ padding:clamp(80px, 10vw, 140px) 0; background:var(--cream-2); }
.reels-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:clamp(16px, 2vw, 24px); }
.reel{
  position:relative; border-radius:4px; overflow:hidden;
  aspect-ratio:3/4; cursor:pointer;
  box-shadow:0 26px 54px -32px rgba(42,9,15,.55);
}
.reel img{ width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease-out), filter .6s; }
.reel::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(42,9,15,.72) 0%, rgba(42,9,15,.05) 46%, rgba(42,9,15,.16) 100%);
}
.reel:hover img{ transform:scale(1.06); filter:saturate(1.06); }
.reel-play{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  z-index:3; width:60px; height:60px; border-radius:50%;
  display:grid; place-items:center;
  background:rgba(245,241,232,.94); color:var(--wine);
  box-shadow:0 12px 30px -10px rgba(42,9,15,.6);
  transition:transform .45s var(--ease-out), background .35s;
}
.reel-play svg{ margin-left:3px; }
.reel:hover .reel-play{ transform:translate(-50%,-50%) scale(1.12); background:var(--gold-2); }
.reel figcaption{
  position:absolute; left:0; right:0; bottom:0; z-index:3;
  padding:18px 16px 16px; color:var(--cream);
  font-family:var(--ge-disp); font-size:14px; letter-spacing:.02em;
  display:flex; flex-direction:column; gap:4px;
}
.reel figcaption em{
  font-style:normal; font-family:var(--ui);
  color:var(--gold-2); font-size:10px; letter-spacing:.24em; text-transform:uppercase;
}
.reels-grid > .reveal:nth-child(2){ transition-delay:.1s; }
.reels-grid > .reveal:nth-child(3){ transition-delay:.2s; }
.reels-grid > .reveal:nth-child(4){ transition-delay:.3s; }
/* inline playback — the reel plays right inside its own frame */
.reel-video{
  position:absolute; inset:0; z-index:4;
  width:100%; height:100%; object-fit:cover;
  background:#000; border:0; border-radius:inherit;
}
.reel.playing{ cursor:default; }
.reel.playing::after,
.reel.playing .reel-play,
.reel.playing figcaption{ opacity:0; pointer-events:none; transition:opacity .3s; }

/* ============================================================
   MEMORIES  (uniform grid — every tile the same size)
   ============================================================ */
.memories{ padding:clamp(80px, 10vw, 140px) 0; background:var(--cream); }
.mem-masonry{ display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; }
.mem-masonry .shot{ margin:0; border-radius:6px; aspect-ratio:1/1; }
.mem-masonry .shot img{ width:100%; height:100%; object-fit:cover; }
.mem-masonry .shot figcaption{ padding:34px 14px 14px; }
@media (max-width:1000px){ .mem-masonry{ grid-template-columns:repeat(3, 1fr); } }
@media (max-width:640px){ .mem-masonry{ grid-template-columns:repeat(2, 1fr); gap:12px; } }

/* ============================================================
   MENUS / PACKAGES — two wide cards
   ============================================================ */
.menus{ padding:clamp(80px, 10vw, 140px) 0; background:var(--cream); }
.menus-intro{ max-width:640px; margin:0 auto clamp(40px,5vw,60px); text-align:center; color:var(--ink-soft); font-size:15px; line-height:1.8; }
.menu-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px, 2.6vw, 32px); }
.menu-card{
  position:relative; overflow:hidden; border-radius:4px;
  display:flex; align-items:flex-end; min-height:clamp(300px, 34vw, 420px);
  box-shadow:0 30px 60px -34px rgba(42,9,15,.5);
}
.menu-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease-out); z-index:0; }
.menu-card::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(to top, rgba(42,9,15,.82), rgba(42,9,15,.15) 60%, rgba(42,9,15,.05)); }
.menu-card:hover img{ transform:scale(1.06); }
.menu-body{ position:relative; z-index:2; padding:34px 30px 30px; color:var(--cream); }
.menu-body .eyebrow{ color:var(--gold-2); margin-bottom:10px; }
.menu-body h3{
  font-family:var(--ge-disp); color:var(--cream);
  font-size:clamp(22px, 2.4vw, 28px); line-height:1.2;
  margin-bottom:18px; max-width:20ch;
}
.menu-body .btn-line{ color:var(--cream); border-color:rgba(245,241,232,.5); }
.menu-body .btn-line:hover{ background:var(--cream); color:var(--wine); border-color:var(--cream); }

/* ============================================================
   PROJECTS — portfolio carousel
   ============================================================ */
.projects{
  padding:clamp(80px, 10vw, 140px) 0;
  background:var(--cream);
  border-top:1px solid var(--seam);
  overflow:hidden;
}
.proj-head{
  display:flex; align-items:flex-end; justify-content:space-between; gap:28px;
  margin-bottom:clamp(28px, 3.5vw, 46px);
}
.proj-head-text{ text-align:left; max-width:640px; }
.proj-head-text .eyebrow{ text-align:left; }
.proj-head-text .section-sub{ margin:14px 0 0; }
.proj-all{ margin-top:22px; }
.proj-nav{ display:flex; gap:12px; flex:0 0 auto; }
.proj-viewport{ overflow:hidden; }
.proj-track{
  display:flex; align-items:flex-start; gap:clamp(20px, 2.4vw, 34px);
  padding:44px 0 10px;
  cursor:grab; user-select:none; -webkit-user-select:none;
  will-change:transform;
}
.proj-track.dragging{ cursor:grabbing; }
.proj-card{
  flex:0 0 clamp(270px, 30vw, 366px);
  text-decoration:none; color:inherit;
}
.proj-card:nth-child(even){ margin-top:44px; }          /* editorial stagger */
.proj-media{
  position:relative; aspect-ratio:4 / 5;
  overflow:hidden; border-radius:3px;
}
.proj-media img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease-out); pointer-events:none; -webkit-user-drag:none; }
.proj-card:hover .proj-media img{ transform:scale(1.05); }
.proj-media::after{                                     /* refined inset frame */
  content:""; position:absolute; inset:14px;
  border:1px solid rgba(245,241,232,.55);
  z-index:2; pointer-events:none;
  transition:inset .55s var(--ease-out), border-color .4s;
}
.proj-card:hover .proj-media::after{ inset:9px; border-color:rgba(198,175,131,.9); }
.proj-num{
  position:absolute; top:12px; left:18px; z-index:3;
  font-family:var(--disp); font-weight:500;
  font-size:clamp(30px, 3vw, 42px); line-height:1;
  color:var(--cream); text-shadow:0 2px 22px rgba(42,9,15,.6);
}
.proj-body{ padding:18px 4px 0; }
.proj-cat{
  display:block; font-family:var(--ui);
  font-size:10.5px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--gold); margin-bottom:9px;
}
.proj-title{
  font-family:var(--ge-disp); color:var(--head);
  font-size:clamp(19px, 2vw, 24px); line-height:1.22; letter-spacing:.01em;
  position:relative; display:inline-block; padding-bottom:6px;
}
.proj-title::after{
  content:""; position:absolute; left:0; bottom:0; width:22px; height:1.5px;
  background:var(--gold); transition:width .45s var(--ease-out);
}
.proj-card:hover .proj-title::after{ width:52px; }
.proj-arrow{
  width:52px; height:52px; border-radius:50%;
  border:1px solid rgba(156,124,59,.5);
  background:transparent; color:var(--wine);
  display:grid; place-items:center; font-size:24px; line-height:0; padding-bottom:4px;
  transition:background .3s, color .3s, transform .35s var(--ease-out), border-color .3s, opacity .3s;
}
.proj-arrow:hover{ background:var(--wine); color:var(--cream); border-color:var(--wine); transform:translateY(-2px); }
.proj-arrow:disabled{ opacity:.3; }
.proj-arrow:disabled:hover{ background:transparent; color:var(--wine); border-color:rgba(156,124,59,.5); transform:none; }
@media (max-width: 640px){
  .proj-card{ flex-basis:78vw; }
  .proj-card:nth-child(even){ margin-top:0; }
  .proj-head{ flex-direction:column; align-items:flex-start; gap:18px; }
}

/* ============================================================
   PROJECTS ARCHIVE (works.html — grid, no hero)
   ============================================================ */
/* solid header for hero-less pages (dark text on cream) */
#siteHeader.header-solid{
  background:rgba(253,249,242,.92);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  box-shadow:0 10px 34px -20px rgba(69,16,29,.28);
}
#siteHeader.header-solid::after{ opacity:0; }
#siteHeader.header-solid .logo img{ filter:none; }
#siteHeader.header-solid .main-nav .nav-link{ color:var(--ink); }
#siteHeader.header-solid .main-nav .nav-link:hover,
#siteHeader.header-solid .main-nav .nav-link.active{ color:var(--wine); }
#siteHeader.header-solid .burger span{ background:var(--wine); }

.works-archive{
  padding:clamp(132px, 16vh, 190px) 0 clamp(80px, 10vw, 140px);
  background:var(--cream);
}
.works-intro{ text-align:center; max-width:640px; margin:0 auto clamp(40px, 5vw, 64px); }
.works-intro .ed-h{ margin-bottom:14px; }
.works-intro .section-sub{ margin-inline:auto; }
.works-grid{
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:clamp(26px, 3vw, 44px) clamp(20px, 2.2vw, 32px);
}
.works-grid .proj-card{ margin-top:0; }
@media (max-width: 900px){ .works-grid{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width: 560px){ .works-grid{ grid-template-columns:1fr; max-width:400px; margin-inline:auto; } }

/* project detail — meta list inside the dark book-card */
.pj-meta{ display:grid; gap:2px; margin:4px 0 24px; }
.pj-meta li{
  display:flex; justify-content:space-between; gap:14px;
  padding:11px 0; border-bottom:1px solid rgba(220,192,132,.22);
  font-family:var(--ui); font-size:13.5px;
}
.pj-meta li span{ color:rgba(251,246,238,.62); letter-spacing:.04em; }
.pj-meta li strong{ color:var(--cream); font-weight:500; }

/* ============================================================
   EVENTS — two wide category cards
   ============================================================ */
.events{ padding:clamp(80px, 10vw, 140px) 0; background:var(--cream-2); }
.ev-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px, 2.6vw, 32px); }
.ev-card{
  position:relative; overflow:hidden; border-radius:4px;
  display:flex; align-items:center; justify-content:center; text-align:center;
  min-height:clamp(320px, 36vw, 460px);
  box-shadow:0 30px 60px -34px rgba(42,9,15,.5);
}
.ev-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease-out); z-index:0; }
.ev-card::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(42,9,15,.35), rgba(42,9,15,.62)); transition:background .5s; }
.ev-card:hover img{ transform:scale(1.06); }
.ev-card:hover::after{ background:linear-gradient(180deg, rgba(42,9,15,.3), rgba(42,9,15,.55)); }
.ev-body{ position:relative; z-index:2; color:var(--cream); padding:30px; max-width:34ch; }
.ev-body .eyebrow{ color:var(--gold-2); }
.ev-body h3{
  font-family:var(--ge-disp); color:var(--cream);
  font-size:clamp(26px, 3vw, 40px); text-transform:uppercase; letter-spacing:.05em;
  margin-bottom:14px;
}
.ev-body p{ color:rgba(245,241,232,.82); font-size:14.5px; line-height:1.7; margin-bottom:24px; }
.ev-body .btn-line{ color:var(--cream); border-color:rgba(245,241,232,.55); }
.ev-body .btn-line:hover{ background:var(--cream); color:var(--wine); border-color:var(--cream); }

/* ============================================================
   CTA — "your story begins here"
   ============================================================ */
.ed-cta{
  position:relative; overflow:hidden; text-align:center;
  padding:clamp(110px, 14vw, 180px) 0;
  background:var(--wine-deep);
}
.ed-cta-bg{ position:absolute; inset:0; z-index:0; opacity:.2; }
.ed-cta-bg img{ width:100%; height:100%; object-fit:cover; filter:saturate(.5); }
.ed-cta::before{ content:""; position:absolute; inset:0; z-index:1; background:radial-gradient(70% 90% at 50% 50%, transparent, var(--wine-deep) 92%); }
.ed-cta .container{ position:relative; z-index:2; }
.ed-cta .script-accent{ color:var(--gold-2); margin-bottom:14px; }
.ed-cta h2{ color:var(--cream); max-width:20ch; margin:0 auto 22px; }
.ed-cta p{ color:rgba(245,241,232,.78); max-width:540px; margin:0 auto 36px; font-size:15.5px; line-height:1.8; }
.ed-cta-actions{ display:flex; gap:26px; align-items:center; justify-content:center; flex-wrap:wrap; }
.ed-cta-phone{
  font-family:var(--ui); font-size:12px; letter-spacing:.16em;
  color:var(--gold-2); transition:color .3s;
}
.ed-cta-phone:hover{ color:var(--cream); }

/* ============================================================
   KEEP IN TOUCH
   ============================================================ */
.keep{
  position:relative; overflow:hidden; text-align:center;
  padding:clamp(80px, 10vw, 130px) 0;
  background:
    radial-gradient(60% 80% at 50% 0%, rgba(220,192,132,.16), transparent 70%),
    var(--cream);
}
.keep .container{ position:relative; z-index:1; max-width:680px; }
.keep h2{ margin:0 auto 14px; }
.keep p{ color:var(--ink-soft); font-size:15px; line-height:1.8; margin-bottom:30px; }
.keep .newsletter{ margin-inline:auto; max-width:520px; min-width:0; }

/* ============================================================
   FOOTER — photo strip + numbered nav + get in touch
   ============================================================ */
.foot-strip{ display:grid; grid-template-columns:repeat(8, 1fr); }
.foot-strip a{ position:relative; overflow:hidden; aspect-ratio:1; }
.foot-strip img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--ease-out), filter .5s; filter:saturate(.9); }
.foot-strip a:hover img{ transform:scale(1.08); filter:saturate(1.05); }

.ed-foot{ background:var(--wine-deep); color:var(--cream); }
.ed-foot-grid{
  display:grid; grid-template-columns:1.3fr 1fr 1fr;
  gap:clamp(34px, 5vw, 70px);
  padding:clamp(56px, 7vw, 88px) 0 46px;
  align-items:start;
}
.ed-foot .fb-logo{ height:60px; width:auto; margin-bottom:20px; filter:brightness(0) invert(1); opacity:.95; }
.ed-foot-brand p{ color:rgba(245,241,232,.66); font-size:13.5px; line-height:1.8; max-width:34ch; }
.ed-foot h5{
  font-family:var(--ui); font-size:11px; font-weight:500;
  letter-spacing:.24em; text-transform:uppercase; color:var(--gold-2);
  margin-bottom:20px;
}
.foot-nav{ display:grid; gap:11px; }
.foot-nav a{
  display:flex; gap:12px; align-items:baseline;
  font-family:var(--ge-disp); font-size:15px; letter-spacing:.04em; text-transform:uppercase;
  color:rgba(245,241,232,.9); transition:color .3s, padding-left .35s var(--ease-out);
}
.foot-nav a .n{ font-family:var(--ui); font-size:10px; letter-spacing:.1em; color:var(--gold); }
.foot-nav a:hover{ color:#fff; padding-left:5px; }
.get-in-touch a{ display:block; color:rgba(245,241,232,.85); font-size:14px; padding:5px 0; transition:color .3s; }
.get-in-touch a:hover{ color:var(--gold-2); }
.get-in-touch .git-line{ display:flex; align-items:center; gap:10px; }
.ed-foot .btn-line{ margin-top:16px; color:var(--cream); border-color:rgba(245,241,232,.4); }
.ed-foot .btn-line:hover{ background:var(--gold-2); color:var(--wine-deep); border-color:var(--gold-2); }
.ed-foot-bar{
  border-top:1px solid rgba(245,241,232,.12);
  padding:22px 0;
}
.ed-foot-bar .fb-inner{
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
  font-family:var(--ui); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(245,241,232,.55);
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1000px){
  .reels-grid{ grid-template-columns:repeat(2, 1fr); }
  .reels-grid > .reveal:nth-child(3){ transition-delay:.1s; }
  .reels-grid > .reveal:nth-child(4){ transition-delay:.2s; }
}
@media (max-width: 900px){
  .feature .container{ grid-template-columns:1fr; gap:40px; }
  .feature .feature-media, .feature.rev .feature-media,
  .feature .feature-text, .feature.rev .feature-text{ order:0; margin:0 auto; }
  .feature-media{ max-width:560px; width:100%; }
  .menu-grid, .ev-grid{ grid-template-columns:1fr; }
  .ed-foot-grid{ grid-template-columns:1fr 1fr; }
  .ed-foot-brand{ grid-column:1 / -1; }
  .foot-strip{ grid-template-columns:repeat(4, 1fr); }
}
@media (max-width: 620px){
  .reels-grid{ grid-template-columns:1fr 1fr; gap:12px; }
  .ed-foot-grid{ grid-template-columns:1fr; text-align:center; }
  .ed-foot-brand{ display:flex; flex-direction:column; align-items:center; }
  .foot-nav a{ justify-content:center; }
  .get-in-touch .git-line{ justify-content:center; }
  .ed-foot-bar .fb-inner{ justify-content:center; text-align:center; }
  .foot-strip{ grid-template-columns:repeat(4, 1fr); }
  .vhero-crest{ height:80px; }
}

/* ============================================================
   INNER PAGES (about / services / service)
   ============================================================ */
/* premium centered page hero (overrides style.css .page-hero) */
.page-hero{
  min-height:clamp(680px, 96vh, 940px);
  align-items:center;
  text-align:center;
  padding:180px 0 140px;
}
.page-hero .ph-bg img{ animation:phZoom 9s var(--ease-out) both; object-position:center 28%; }
@keyframes phZoom{ from{ transform:scale(1.12); } to{ transform:scale(1); } }
.page-hero .ph-veil{
  background:
    linear-gradient(180deg, rgba(42,9,15,.28) 0%, rgba(42,9,15,.06) 46%, rgba(42,9,15,.40) 100%),
    radial-gradient(60% 56% at 50% 52%, rgba(42,9,15,.30) 0%, transparent 72%);
}
.page-hero .ph-veil::before{ display:none; }
.page-hero .container{ position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; }
.page-hero .eyebrow{ color:var(--gold-2); margin-bottom:18px; }
.page-hero .ph-title{
  font-family:var(--brand-head);
  font-weight:800;
  letter-spacing:.05em;
  font-size:clamp(46px, 6vw, 84px);
  margin-bottom:22px;
}
.breadcrumb{
  font-family:var(--ui); font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  justify-content:center;
}

/* embedded video inside a feature slot (founder / about) */
.feature-media > video{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; display:block;
  border-radius:3px; background:#000;
}
.about-vid{ cursor:pointer; }
.about-vid .vid-play{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  z-index:6; width:76px; height:76px; border-radius:50%;
  display:grid; place-items:center;
  background:rgba(245,241,232,.94); color:var(--wine);
  box-shadow:0 16px 40px -12px rgba(42,9,15,.6);
  transition:transform .45s var(--ease-out), background .35s, opacity .35s;
}
.about-vid .vid-play svg{ margin-left:4px; }
.about-vid:hover .vid-play{ transform:translate(-50%,-50%) scale(1.1); background:var(--gold-2); }
.about-vid.playing .vid-play{ opacity:0; pointer-events:none; }
.about-vid .frame-tag{
  position:absolute; left:16px; bottom:16px; z-index:6;
  font-family:var(--ui); font-size:10px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--cream); background:rgba(42,9,15,.5); padding:7px 12px; border-radius:2px;
  backdrop-filter:blur(4px); transition:opacity .35s;
}
.about-vid.playing .frame-tag{ opacity:0; }

/* inner section heads reuse .ed-h; keep old .script-label as gold eyebrow-italic if present */
.page-section .section-head .ed-h{ margin-inline:auto; }

/* services archive cards keep style.css .svc-card, add editorial link arrow */
.svc-card .svc-link .arw{ transition:transform .4s var(--ease-out); display:inline-block; }
.svc-card:hover .svc-link .arw{ transform:translateX(5px); }

/* ============================================================
   SERVICE PAGE — extensive inline booking form (per service)
   ============================================================ */
.sv-booking{
  position:relative; overflow:hidden;
  padding:clamp(74px, 9vw, 128px) 0;
  background:
    radial-gradient(60% 70% at 12% 0%, rgba(220,192,132,.18), transparent 62%),
    radial-gradient(60% 70% at 100% 100%, rgba(135,33,49,.06), transparent 60%),
    var(--cream-2);
}
.svb-head{ text-align:center; max-width:620px; margin:0 auto clamp(34px, 4vw, 52px); }
.svb-head .script-accent{ color:var(--gold); margin-bottom:10px; }
.svb-head p{ color:var(--ink-soft); font-size:15px; line-height:1.8; margin-top:14px; }

.svb-card{
  max-width:940px; margin:0 auto;
  background:#fff;
  border:1px solid rgba(185,138,62,.22);
  border-radius:24px;
  padding:clamp(26px, 3.6vw, 48px);
  box-shadow:var(--shadow-soft);
}

/* the selected-service banner (auto-filled per page) */
.svb-chip{
  display:flex; align-items:center; gap:16px;
  background:
    radial-gradient(80% 120% at 90% 0%, rgba(135,33,49,.28), transparent 60%),
    linear-gradient(135deg, var(--wine), var(--wine-deep));
  color:var(--cream);
  border-radius:16px;
  padding:18px 24px;
  margin-bottom:28px;
}
.svb-chip .svb-chip-ic{
  flex:0 0 auto; width:46px; height:46px; border-radius:12px;
  display:grid; place-items:center;
  background:rgba(220,192,132,.16); color:var(--gold-2);
  border:1px solid rgba(220,192,132,.4);
}
.svb-chip .svb-chip-txt{ display:flex; flex-direction:column; gap:3px; }
.svb-chip .k{ font-family:var(--ui); font-size:10.5px; font-weight:500; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-2); }
.svb-chip .v{ font-family:var(--ge-disp); font-size:clamp(19px, 2vw, 24px); letter-spacing:.02em; color:var(--cream); }

.svb-form{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.svb-form label{
  display:flex; flex-direction:column; gap:8px;
  font-family:var(--ui);
  font-size:12px; font-weight:500; letter-spacing:.04em;
  color:var(--wine); text-align:left;
}
.svb-form label .req{ color:var(--red); }
.svb-form input,
.svb-form select,
.svb-form textarea{
  width:100%;
  font-family:var(--sans);
  font-size:14.5px; font-weight:300;
  color:var(--ink);
  padding:13px 16px;
  border:1px solid rgba(109,26,43,.22);
  border-radius:12px;
  background:var(--cream);
  outline:none;
  transition:border-color .3s, box-shadow .3s, background .3s;
}
.svb-form input::placeholder,
.svb-form textarea::placeholder{ color:rgba(92,74,79,.5); }
.svb-form input:focus,
.svb-form select:focus,
.svb-form textarea:focus{
  border-color:var(--gold);
  background:#fff;
  box-shadow:0 0 0 3px rgba(185,138,62,.15);
}
.svb-form textarea{ resize:vertical; min-height:104px; }
.svb-full{ grid-column:1 / -1; }
.svb-submit{ grid-column:1 / -1; margin-top:6px; }
.svb-form .btn{ width:100%; }
.svb-note{
  grid-column:1 / -1;
  font-family:var(--ui); font-size:11.5px; letter-spacing:.02em;
  color:var(--ink-soft); text-align:center; margin-top:2px;
}

/* success state */
.svb-success{ text-align:center; padding:26px 10px 10px; }
.svb-check{
  width:78px; height:78px; border-radius:50%;
  display:grid; place-items:center; margin:0 auto 20px;
  background:linear-gradient(135deg, var(--wine), var(--red));
  color:var(--cream); font-size:32px;
  box-shadow:0 18px 40px -14px rgba(135,33,49,.5);
  animation:popIn .6s var(--ease-out);
}
.svb-success h4{ font-size:24px; text-transform:uppercase; letter-spacing:.05em; margin-bottom:10px; }
.svb-success p{ color:var(--ink-soft); font-size:14.5px; max-width:44ch; margin:0 auto; }

@media (max-width: 620px){
  .svb-form{ grid-template-columns:1fr; }
  .svb-card{ border-radius:18px; }
}

/* ============================================================
   SECTION SEPARATION & POLISH
   crisp seams so adjacent tones never blur into each other
   ============================================================ */
.feature,
.reels, .memories, .menus, .events, .keep,
.page-section, .sv-booking{
  border-top:1px solid var(--seam);
}

/* light closing CTA — no more stacked dark blocks before the footer */
.cta-strip.cta-light{
  background:
    radial-gradient(66% 92% at 50% 0%, rgba(220,192,132,.20), transparent 72%),
    var(--cream);
  border-top:1px solid var(--seam);
}
.cta-strip.cta-light .script-accent{ color:var(--gold); }
.cta-strip.cta-light h2{ color:var(--head); }
.cta-strip.cta-light p{ color:var(--ink-soft); }
.cta-strip.cta-light .btn-line.light{
  color:var(--wine); border-color:rgba(87,26,40,.42); background:transparent;
}
.cta-strip.cta-light .btn-line.light:hover{
  background:var(--wine); color:var(--cream); border-color:var(--wine);
}

/* page-scoped mission band tone (keeps clean alternation on about) */
.mission-band.mb-light{
  background:
    radial-gradient(60% 70% at 10% 100%, rgba(135,33,49,.06), transparent 60%),
    var(--cream);
}

/* keep the founder section padding in step with the other feature blocks */
#founder.feature{ padding-block:clamp(58px, 6.2vw, 100px); }

/* ============================================================
   FEATURED / THANK-YOU VIDEO (facebook embed) — About page
   ============================================================ */
.featured-video{
  position:relative; overflow:hidden;
  padding:clamp(74px, 9vw, 122px) 0;
  background:
    radial-gradient(72% 90% at 50% 0%, rgba(135,33,49,.22), transparent 62%),
    var(--wine-deep);
  border-top:1px solid rgba(198,175,131,.16);
}
.featured-video .eyebrow{ color:var(--gold-2); }
.featured-video .ed-h{ color:var(--cream); }
.featured-video .section-sub{ color:rgba(245,241,232,.72); }
.fv-embed{
  position:relative;
  width:min(760px, 100%); margin:0 auto;
  aspect-ratio:16 / 9;                    /* definite box, so the iframe can't collapse it */
  border:1px solid rgba(198,175,131,.30);
  border-radius:14px; overflow:hidden;
  background:#000;
  box-shadow:0 44px 90px -44px rgba(0,0,0,.8);
}
.fv-embed iframe,
.fv-embed video{
  position:absolute; inset:0;
  width:100%; height:100%; border:0; display:block;
  object-fit:cover; background:#000;
}
.fv-link{
  display:block; text-align:center; margin-top:18px;
  font-family:var(--ui); font-size:11.5px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold-2); transition:color .3s;
}
.fv-link:hover{ color:var(--cream); }

/* ============================================================
   ORNAMENTS — classic gold flourishes that draw in on scroll
   (soften transitions, add a refined editorial rhythm)
   ============================================================ */
.ornament{ display:block; --orn: var(--gold); text-align:center; }

/* horizontal section-divider flourish */
.orn-divider{ padding:clamp(22px, 3.8vw, 50px) 0; }
.orn-divider svg{
  width:min(340px, 58%); height:auto; display:block;
  margin-inline:auto; overflow:visible;
}
/* smaller accent flourish (sits under a heading) */
.orn-sm{ padding:16px 0 2px; }
.orn-sm svg{
  width:min(188px, 46%); height:auto; display:block;
  margin-inline:auto; overflow:visible;
}

/* the drawn linework (leaves, rule, diamond) */
.ornament [data-draw]{
  fill:none; stroke:var(--orn); stroke-width:1.5;
  stroke-linecap:round; stroke-linejoin:round;
  vector-effect:non-scaling-stroke;             /* even line weight regardless of svg scale */
  opacity:.95;
  stroke-dasharray:1; stroke-dashoffset:1;      /* initial hide (pathLength=1); JS drives the draw */
}
.ornament .orn-rule{ transition-duration:1.2s; transition-delay:.34s; }
.ornament.in-view [data-draw]{ stroke-dashoffset:0; }

/* fills (terminal dots + centre) fade in once the lines are drawn */
.ornament .orn-dot,
.ornament .orn-core{
  fill:var(--orn); opacity:0;
  transition:opacity .6s ease 1s;
}
.ornament.in-view .orn-dot,
.ornament.in-view .orn-core{ opacity:.9; }

/* champagne gold on dark sections */
.ornament.on-dark{ --orn: var(--gold-2); }
.ornament.on-dark [data-draw]{ opacity:.95; }

/* corner flourishes — Art-Deco frames on SECTION corners (sunburst TR + bracket BL) */
.orn-corner{
  position:absolute; width:clamp(150px, 15vw, 280px); height:auto;
  z-index:4; pointer-events:none;
}
/* every framed section anchors its corners; the ornament now sits OVER the content & photos */
.sec-framed{ position:relative; }
.sec-framed > .container{ position:relative; }
.orn-corner svg{ width:100%; height:auto; display:block; overflow:visible;
  filter:drop-shadow(0 1px 3px rgba(20,8,12,.3)); }   /* reads over photos & dark areas */
/* base ornament runs from the top-left corner along both edges */
.orn-corner.tl{ top:16px;    left:16px; }
.orn-corner.tr{ top:16px;    right:16px;  transform:scaleX(-1); }
.orn-corner.bl{ bottom:16px; left:16px;   transform:scaleY(-1); }
.orn-corner.br{ bottom:16px; right:16px;  transform:scale(-1,-1); }
/* metallic gold gradient — thin L-frame + delicate floral, drawn in */
.orn-corner [data-draw]{ stroke:url(#laka-gold); stroke-width:1.5; opacity:1; }
.orn-corner .orn-thin{ stroke-width:0.85; opacity:0.6; }
.orn-corner .orn-fill{ fill:url(#laka-gold); }
.orn-corner .orn-core{ fill:url(#laka-gold); }
.orn-corner.orn-dark svg{ filter:drop-shadow(0 1px 5px rgba(0,0,0,.45)); }

/* hero emblem — logo inside a champagne medallion that draws in on load */
.vhero-emblem{
  position:relative; display:grid; place-items:center;
  width:clamp(230px, 31vw, 322px); aspect-ratio:1;
  margin-inline:auto; --orn: var(--gold-2);
}
.vhero-ring{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.vhero-ring [data-draw]{ stroke-width:1.4; }
.vhero-logo{
  position:relative; width:54%; height:auto;
  filter:brightness(0) invert(1) drop-shadow(0 10px 26px rgba(42,9,15,.55));
  transform:scale(.92);
  transition:transform 1.2s cubic-bezier(.22,1,.36,1) .25s;
}
.vhero-emblem.is-drawn .vhero-logo{ transform:scale(1); }

/* header logo flourishes — small leaf sprays flanking the logo (draw in on load) */
.header-inner .logo{ display:inline-flex; align-items:center; gap:clamp(10px, 1.5vw, 22px); }
.logo-orn{ display:block; width:clamp(38px, 4.8vw, 68px); flex:0 0 auto; }
.logo-orn-svg{ width:100%; height:auto; display:block; overflow:visible; }
.logo-orn [data-draw]{ stroke:var(--gold-2); stroke-width:1.3; }
.logo > .logo-orn:last-child{ transform:scaleX(-1); }
/* scrolled / solid header → deeper gold reads on cream */
#siteHeader.scrolled .logo-orn [data-draw],
#siteHeader.header-solid .logo-orn [data-draw]{ stroke:var(--gold); }
@media (max-width:768px){ .logo-orn{ display:none; } }

/* ============================================================
   CONTACT PAGE
   ============================================================ */
.contact-main{ padding:clamp(58px, 7vw, 108px) 0; }
.contact-grid{
  display:grid; grid-template-columns:0.95fr 1.05fr;
  gap:clamp(36px, 5vw, 78px); align-items:start;
}
.contact-info .eyebrow{ color:var(--gold); }
.contact-info > p{ margin-top:18px; max-width:46ch; color:var(--ink-soft); line-height:1.75; }
.ci-list{ list-style:none; margin:36px 0 0; padding:0; display:flex; flex-direction:column; gap:20px; }
.ci-item{ display:flex; gap:16px; align-items:center; }
.ci-ic{
  flex:0 0 auto; width:46px; height:46px; border-radius:50%;
  display:grid; place-items:center; color:var(--wine);
  background:var(--cream-2); border:1px solid rgba(156,124,59,.3);
}
.ci-txt{ display:flex; flex-direction:column; gap:3px; }
.ci-k{ font-family:var(--ui); font-size:10.5px; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-soft); }
.ci-v{ font-family:var(--ge-disp); font-size:19px; color:var(--head); text-decoration:none; transition:color .3s; }
a.ci-v:hover{ color:var(--wine); }
.ci-socials{ display:flex; flex-wrap:wrap; gap:24px; margin-top:34px; }
.ci-socials a{
  font-family:var(--ui); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--wine); text-decoration:none; position:relative; padding-bottom:4px;
}
.ci-socials a::after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:1px;
  background:var(--gold-2); transform:scaleX(.35); transform-origin:left; transition:transform .35s var(--ease-out); }
.ci-socials a:hover::after{ transform:scaleX(1); }
.contact-card{ position:relative; }
@media (max-width:860px){ .contact-grid{ grid-template-columns:1fr; } }

/* ============================================================
   DIRECTIONS
   ============================================================ */
/* latin brand label on the direction cards */
.svc-latin{
  display:block; font-family:var(--ui);
  font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold); margin-bottom:7px;
}
/* direction tag inside a project's detail card */
.pj-dir-tag{
  display:flex; align-items:center; gap:9px; margin:6px 0 18px;
  padding:11px 15px; border:1px solid rgba(156,124,59,.32); border-radius:9px;
  text-decoration:none; background:var(--cream-2); transition:border-color .3s;
}
.pj-dir-tag > span:first-child{
  font-family:var(--ui); font-size:9.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ink-soft);
}
.pj-dir-tag em{ font-family:var(--ge-disp); font-style:normal; font-size:15px; color:var(--wine); }
.pj-dir-tag .arw{ margin-left:auto; color:var(--gold); transition:transform .3s; }
.pj-dir-tag:hover{ border-color:var(--gold); }
.pj-dir-tag:hover .arw{ transform:translateX(4px); }

/* directions archive — all four cards together, perfectly responsive */
.svc-grid-4{ grid-template-columns:repeat(4, 1fr); gap:clamp(16px, 1.8vw, 26px); }
@media (max-width:1040px){ .svc-grid-4{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width:540px){ .svc-grid-4{ grid-template-columns:1fr; max-width:430px; margin-inline:auto; } }

/* ============================================================
   MOBILE POLISH
   ============================================================ */
@media (max-width:760px){
  /* corner ornaments smaller so they frame, not crowd, on phones */
  .orn-corner{ width:clamp(70px, 20vw, 104px); }
  .orn-corner.tl,.orn-corner.tr{ top:12px; }
  .orn-corner.bl,.orn-corner.br{ bottom:12px; }
  .orn-corner.tl,.orn-corner.bl{ left:12px; }
  .orn-corner.tr,.orn-corner.br{ right:12px; }
  /* hero slogan sits a touch higher & tighter on phones */
  .vhero-slogan-wrap{ top:66%; width:94%; }
  .vhero-slogan{ font-size:clamp(26px, 8.4vw, 40px); }
}
@media (max-width:440px){
  .orn-corner{ width:78px; }
}

/* ============================================================
   REDUCED MOTION
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  .vhero-scroll .arw{ animation:none; }
  .vhero-content > *{ opacity:1 !important; transform:none !important; }
  .ornament [data-draw]{ transition:none; stroke-dashoffset:0; }
  .ornament .orn-dot, .ornament .orn-core{ transition:none; opacity:.9; }
}
