.elementor-kit-8{--e-global-color-primary:#C89FA3;--e-global-color-secondary:#A3B49F;--e-global-color-text:#F8F7F4;--e-global-color-accent:#D4C7A1;--e-global-typography-primary-font-family:"Inter";--e-global-typography-primary-font-size:17px;--e-global-typography-primary-font-weight:500;--e-global-typography-secondary-font-family:"Playfair Display";--e-global-typography-secondary-font-weight:700;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Playfair Display";--e-global-typography-accent-font-size:18px;--e-global-typography-accent-font-weight:500;background-color:#1C1C1E;}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1500px;}.e-con{--container-max-width:1500px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */:root{
  --hero-bg:#0b0b0c;
  --ink:#eae6da; 
  --ink-sub:#cfc9bb;
  --header-h: 84px; /* adjust to your header height */
}

/* SECTION */
.hero{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  background: var(--hero-bg);
}

/* Spotlight under bottles */
.hero::after{
  content:"";
  position:absolute; left:50%; transform:translateX(-50%);
  top:60vh;
  width:min(1200px, 92vw); height:520px;
  background: radial-gradient(38% 60% at 50% 50%,
              rgba(255,255,255,0.10),
              rgba(255,255,255,0.02) 55%,
              rgba(255,255,255,0) 75%);
  filter: blur(18px);
  pointer-events:none; z-index:0;
}

/* HEADING */
.hero-title{
  position:relative; z-index:2;
  font-family:"Cormorant Garamond", serif;
  color:#fff; text-align:center;
  font-size:clamp(42px,6.2vw,76px); line-height:1.06; letter-spacing:.02em;
  margin-top:min(6vh,40px);
}

/* BOTTLES – full width, tall */
.bottles-wrap{ position:relative; z-index:2; }
.bottles--wide{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:clamp(18px, 3vw, 42px);
  align-items:end; justify-items:center;
  width:min(94vw,1440px);
  margin:min(3vh,30px) auto 0;
  padding:0 2vw;
}

/* Bottle card (NO hover rectangle popup) */
.bottle{
  position:relative; 
  background:none; border:0; padding:0; cursor:pointer;
  transform:translateZ(0);
  transition:transform .18s ease;
}
.bottle:hover{ transform: translateY(-3px); }

/* Image fills height; make bottles bigger */
.bottle img{
  display:block;
  height: clamp(36vh, 24vw, 56vh); /* ↑ bigger */
  width:auto;
  user-select:none; pointer-events:none;
}

/* Gentle glass sweep ONLY (no background block) */
.bottle::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(120deg, rgba(255,255,255,0) 40%,
                                       rgba(255,255,255,0.10) 50%,
                                       rgba(255,255,255,0) 60%);
  transform: translateX(-140%);
  transition: transform 600ms ease;
  pointer-events:none; opacity:.22;
}
.bottle:hover::after{ transform: translateX(140%); }

/* LABEL ON THE BOTTLE  — anchored to image box */
.bottle .label{
  position:absolute;
  left:50%; transform:translateX(-50%);
  /* Position the label higher so it sits over the bottle’s paper label.
     Tweak this value until it sits perfectly on YOUR image */
  bottom: 20%;                /* was ~10–14px; now relative to image height */
  min-width: 58%;
  max-width: 72%;
  background: rgba(10,10,11,0.30);
  backdrop-filter: blur(2px) saturate(110%);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 6px;
  padding: 6px 10px;
  text-align:center;
}
.label-word{
  font-family:"Cormorant Garamond", serif;
  font-size: clamp(16px, 2.2vw, 22px);
  color: var(--ink); letter-spacing: .02em;
}
.label-sub{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
  font-size: 12px; color: var(--ink-sub); margin-top: 2px;
}

/* CTA (slow fade-in) */
.cta-row{
  position:relative; z-index:2;
  display:grid; grid-template-columns:1fr auto 1fr;
  gap:16px; align-items:center;
  width:min(900px, 92vw);
  margin:min(3.5vh,36px) auto 0;
  opacity:0; transform:translateY(8px);
  transition:opacity 900ms ease, transform 900ms ease;
}
.cta-row.is-visible{ opacity:1; transform:translateY(0); }

.cta-left,.cta-right{ color:#bdb8a9; font-size:14px; opacity:.9; text-align:center; }
.cta-btn .elementor-button{ border-radius:9999px; padding:14px 26px; }

/* KEEP EXPLORING — fixed to bottom of viewport inside hero */
.keep-exploring{
  position:absolute;
  left:50%; bottom:14px; transform:translateX(-50%);
  z-index:3;
}
.keep-exploring-link{
  color:#bdb8a9; font-size:14px; opacity:.75; text-decoration:none;
  transition:opacity .2s ease, transform .2s ease;
}
.keep-exploring-link:hover{ opacity:1; transform:translateY(-1px); }

/* HEADER stays in DOM, just off-screen while hero is visible */
body.header-offscreen .elementor-location-header,
body.header-offscreen .site-header{
  position:sticky; top:0; /* keep its layout context */
  transform: translateY(calc(-1 * var(--header-h)));
  transition: transform .25s ease;
}
.elementor-location-header, .site-header{ transition: transform .25s ease; }

/* Responsive */
@media (max-width:1100px){ .bottles--wide{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width:680px){
  .bottles--wide{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:clamp(16px,4vw,28px); }
  .cta-left,.cta-right{ display:none; }
  .bottle .label{ min-width:64%; bottom: 18%; } /* small tweak for phone aspect */
}

/* Reduced motion (keep simple) */
@media (prefers-reduced-motion: reduce){
  .bottle:hover{ transform:none; }
  .bottle::after{ display:none; }
  .cta-row{ opacity:1; transform:none; transition:none; }
}/* End custom CSS */