/* Facette & Co. — shared header and motion rules, loaded last on every page.
   One scroll behaviour for the whole site: the header converts to the logo as the page
   scrolls, slides up toward it when scrolling down, and returns when scrolling back up. */

/* Header slide: moves up out of the way, the gold logo mark stays at the top edge */
.hdr{transition:height .9s cubic-bezier(.22,.61,.12,1),transform .8s cubic-bezier(.22,.61,.12,1),visibility 0s linear 0s,color .6s ease}
.hdr.is-away{transform:translateY(-100%);visibility:hidden;transition:height .9s cubic-bezier(.22,.61,.12,1),transform .8s cubic-bezier(.22,.61,.12,1),visibility 0s linear .8s,color .6s ease}
body.menu-open .hdr{transform:none;visibility:visible;transition-delay:0s}
.hdr::after{display:none}

.hdr-mark{position:fixed;top:0;left:50%;z-index:31;width:40px;height:auto;margin-left:-20px;padding-top:.75rem;
  opacity:0;transform:translateY(-100%);pointer-events:none;
  transition:opacity .5s ease,transform .8s cubic-bezier(.22,.61,.12,1)}
.hdr-mark img{display:block;width:100%;height:auto}
.hdr.is-away + .hdr-mark{opacity:1;transform:none;pointer-events:auto}
body.menu-open .hdr-mark{opacity:0;pointer-events:none}

/* Residual scroll decoration removed: reading bars, scroll cue line, draw-in rules, cursor ring */
.progress,.fx-progress,.scroll-cue,.veil,.fx-cursor,.fx-cursor-dot{display:none !important}
.js .statement .rule{transform:none;transition:none}

/* Footer credit line */
.credit{color:inherit;text-decoration:none;font-size:.66rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}
.credit:hover,.credit:focus-visible{text-decoration:underline;text-underline-offset:.3em}

/* Preview round 3 (Ganesh): remove the small gold flower emblem wherever it sits as a
   decoration (above section headings, hero title, footer marks, film watermark) and the thin
   vertical scroll lines at the section edges and the hero scroll cue. The header logo stays. */
.st-mark,.hero__mark,.ft-mark,.footer__logo,.film__mark,.hero__cue,.statement::before,.statement::after{display:none !important}

/* Preview round 4 (Ganesh): the four bottom verticals are 1:1 square looping videos.
   No poster or photo is shown on them; the dark tile colour shows while a video loads.
   The thin gold dash beside each "NN — label" and the thin frame lines around the
   jewellery film are removed. */
.ev-visual.ev-tile{aspect-ratio:1/1;height:auto;align-self:center;background:#0d1a19}
.ev-visual.ev-tile .ev-par{inset:0}
.ev-visual.ev-tile video{width:100%;height:100%;object-fit:cover;display:block}
.ev-visual.ev-tile picture,.ev-visual.ev-tile img{display:none !important}
.ev-num i,.film__edge{display:none !important}
.ev-panel{border-top:0}

/* Legibility pass (Nov 11): the small gold logo mark that slid in at the top centre while scrolling
   is hidden on every page. The header logo (the brand in the header bar) is unchanged. */
.hdr-mark{display:none !important}

/* Nov 11 (rev 3): only the About page text starts on the left edge (the MENU edge).
   Every other page keeps its original centred layout. Words are unchanged. */
section.about,section.about h1,section.about h2,section.about p{text-align:left}
section.about h1,section.about h2,section.about p{margin-left:0;margin-right:auto}

/* Video tiles (2:35 revisions): the tile colour sits under each video from before its first frame
   until it plays, so no white shows while a video loads. The videos keep playing. */
.ev-video,.ev-visual.ev-tile video,.ev-par video{background-color:#0d1a19}
.ev-visual,.ev-par{background-color:#0d1a19}

/* The white came from the paper colour showing through the tile before its clip-path reveal
   (and before the first video frame). The panel itself now carries the tile's dark colour
   behind the visual's own column, so the area is dark from the moment it enters view. */
.ev-panel{background:linear-gradient(to right,#0d1a19 50%,var(--paper) 50%)}
.ev-panel.ev-flip{background:linear-gradient(to right,var(--paper) 50%,#0d1a19 50%)}
@media (max-width:900px){
  .ev-panel,.ev-panel.ev-flip{background:linear-gradient(to bottom,#0d1a19 0,#0d1a19 min(118vw,640px),var(--paper) min(118vw,640px))}
}

/* Home verticals: the video stays hidden (the dark tile shows) until its first frame is ready, so no blank or white frame shows while it loads. */
.js .ev-video:not(.is-live){opacity:0}
.ev-video{transition:opacity .6s ease}

/* Preview round 6 (Ganesh, 3:56 AM and 3:58 AM): the home-page videos are square 1:1 frames
   with no black edges. The video fills its square (object-fit cover). The two 16:9 clips
   carry a few pixels of black at the top and bottom of the file, so they are scaled a
   touch to crop those rows. The panel's surround is the page paper colour, so no dark
   strip shows around the square at 1440 or 390. */
.ev-panel,.ev-panel.ev-flip{background:var(--paper)}
@media (max-width:900px){
  .ev-panel,.ev-panel.ev-flip{background:var(--paper)}
  .ev-visual.ev-tile{height:auto;aspect-ratio:1/1}
}
.ev-visual.ev-tile video{object-fit:cover}
#gemstones-detail .ev-visual.ev-tile video,#gifting-detail .ev-visual.ev-tile video{transform:scale(1.012);transform-origin:50% 50%}
#accessories-detail .ev-par video,#accessories-detail .ev-visual.ev-tile video{object-fit:cover}

/* Fade-in removed (Ganesh, 4:16 AM Nov 11): the home-page video tiles under "Four Distinct Verticals"
   show at full opacity from the start, with no opacity fade and no clip-path wipe. Each tile shows its
   poster until the clip starts. Scroll-play is unchanged (site.js). */
.js .ev-video:not(.is-live){opacity:1}
.ev-video{transition:none}
.js .ev-visual.ev-tile,.js .ev-flip .ev-visual.ev-tile,.js .ev-panel.in .ev-visual.ev-tile{clip-path:none;transition:none}
@media (max-width:900px){
  .js .ev-visual.ev-tile,.js .ev-flip .ev-visual.ev-tile,.js .ev-panel.in .ev-visual.ev-tile{clip-path:none;transition:none}
}