/* refine.css — 15 Oct 2026, round 2. Loaded after base/ui/fx/creator. */

:root{
  --soft:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent),linear-gradient(180deg,transparent,#000 13%,#000 87%,transparent);
}

/* ---------- Top nav: larger labels, same footprint ---------- */
.nav__links{gap:clamp(10px,1.3vw,22px)}
.nav__links a{font-size:clamp(.74rem,.28rem + .66vw,.9rem);letter-spacing:.15em}

/* ---------- Side rail: larger, readable, tick can't collapse ---------- */
.railnav a{font-size:.66rem;letter-spacing:.14em;color:var(--smoke)}
.railnav i{flex:none}

/* ---------- Soft edges: no hard frames anywhere ---------- */
.split__media,.buy__media,.cr-shot,.poster{border:0!important;box-shadow:none!important;background:transparent!important;overflow:visible!important}
.split__media::after,.cr-shot::after{display:none!important}
.split__media img,.buy__media img,.cr-shot img,.poster img{
  -webkit-mask-image:var(--soft);-webkit-mask-composite:source-in;
  mask-image:var(--soft);mask-composite:intersect}
.split__media:hover img,.cr-shot:hover img{transform:none}

/* Each image keeps its own shape */
.split__media--tall{max-width:470px;width:100%;justify-self:center}
#tasting .split__media{max-width:420px!important}
#tasting .split__media img{width:100%}
.buy__media img{aspect-ratio:4/5;object-fit:cover;object-position:50% 45%}

/* ---------- Hero: photograph, no straight edges, alive ---------- */
.hero__halo,.hero__rim{display:none!important}
.hero__bottle::after{display:none!important}
.hero__bottle{perspective:none;--px:0;--py:0}
/* gentle pointer parallax (inline script sets --px/--py); overrides the old 3D spin */
.hero__rig{width:100%;transform:translate3d(calc(var(--px) * -22px),calc(var(--py) * -14px),0)!important;transition:none}
.hero__bottle img{
  position:relative;z-index:1;
  width:100%;max-width:none;max-height:none;height:min(80vh,740px);
  object-fit:cover;object-position:50% 20%;filter:none;
  -webkit-mask-image:radial-gradient(ellipse 50% 50% at 52% 47%,#000 52%,rgba(0,0,0,.55) 76%,transparent 100%);
  mask-image:radial-gradient(ellipse 50% 50% at 52% 47%,#000 52%,rgba(0,0,0,.55) 76%,transparent 100%);
  animation:heroDrift 18s ease-in-out infinite alternate;transform-origin:52% 48%}
@keyframes heroDrift{from{transform:scale(1.02) translateY(0)}to{transform:scale(1.1) translateY(-1.2%)}}
/* brass rings circle the bottle, visible where the photo dissolves */
.hero__arm{display:block!important;z-index:0;top:47%;width:118%;opacity:.55}
/* slow light sweep across the label */
.hero__sheen{display:block!important;z-index:2;opacity:.9;
  background:linear-gradient(100deg,transparent 40%,rgba(246,234,200,.06) 46%,rgba(246,234,200,.22) 50%,rgba(246,234,200,.06) 54%,transparent 60%) 0 0/300% 100% no-repeat;
  -webkit-mask-image:radial-gradient(22% 38% at 52% 52%,#000 55%,transparent 95%);mask-image:radial-gradient(22% 38% at 52% 52%,#000 55%,transparent 95%);
  animation:heroSweep 7s ease-in-out infinite}
@keyframes heroSweep{0%,35%{background-position:100% 0}75%,100%{background-position:0 0}}
@media (prefers-reduced-motion:reduce){.hero__bottle img,.hero__sheen{animation:none}.hero__rig{transform:none!important}}

@media(min-width:861px){
  .hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);grid-template-areas:"t p" "s p";column-gap:clamp(24px,4vw,64px);row-gap:30px}
  .hero__side{grid-area:t;align-self:end;position:relative;z-index:2}
  .hero__side--r{grid-area:s;align-self:start;align-items:flex-start;text-align:left}
  .hero__side--r .spec li{justify-content:flex-start}
  .hero__bottle{grid-area:p}
}
@media(max-width:860px){
  .hero__bottle{max-width:none;width:calc(100% + 2 * var(--gut));margin-inline:calc(-1 * var(--gut))}
  .hero__bottle img{height:42vh;object-position:50% 14%;
    -webkit-mask-image:radial-gradient(ellipse 58% 56% at 50% 50%,#000 50%,rgba(0,0,0,.5) 76%,transparent 100%);
    mask-image:radial-gradient(ellipse 58% 56% at 50% 50%,#000 50%,rgba(0,0,0,.5) 76%,transparent 100%)}
  .hero__arm{width:96%;top:46%}
}

/* ---------- Creator band: text left, larger image right ---------- */
@media(min-width:821px){
  .creator{grid-template-columns:1.1fr .9fr}
  .creator .cr-shot{order:2}
}

/* ---------- Poster: its own moment ---------- */
.poster-feature{padding-block:clamp(40px,6vw,80px)}
.poster{max-width:min(560px,100%);margin:0 auto}
.poster img{width:100%}

/* ---------- Shankar Distillers credit ---------- */
.distiller{display:flex;align-items:center;gap:16px}
.distiller__mark{flex:none;width:76px;height:76px;background:url(/assets/shankar.webp) center/contain no-repeat}
.distiller p{margin:0}
.distiller--foot{margin-top:20px}
.distiller--foot p{color:var(--smoke);font-size:var(--f-sm);max-width:30ch;line-height:1.8}
.distiller--stage{flex-direction:column;justify-content:center;text-align:center;gap:20px;margin-top:clamp(40px,6vw,72px);padding-top:clamp(36px,5vw,56px);border-top:1px solid var(--line-soft)}
.distiller--stage .distiller__mark{width:clamp(140px,15vw,190px);height:clamp(140px,15vw,190px)}
.distiller--stage p{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(1.45rem,2.6vw,1.95rem);color:var(--ivory);line-height:1.3}
.distiller--stage .eyebrow{display:block;margin-bottom:8px;font-family:Jost,"Helvetica Neue",Arial,sans-serif}