/* ==========================================================================
   VAN BERGEN 1795 | IVORY TEST BUILD
   Every watch is shown on a light ground: white, ivory or cream.
   Dark is kept only for text, photography of events and the closing call.
   Loaded after resonance.css in the test build only.
   ========================================================================== */

/* ---------- Home: the hero on ivory ---------- */
.hero{background:var(--ivory)}
.hero__backdrop{background:
  radial-gradient(46% 52% at 72% 64%,rgba(255,255,255,.95),rgba(255,255,255,0) 72%),
  radial-gradient(60% 55% at 72% 60%,rgba(160,108,61,.12),transparent 70%),
  linear-gradient(180deg,#F2ECE1 0%,var(--ivory) 55%,#EEE6D8 100%)}
.hero__shaft{mix-blend-mode:normal;background:radial-gradient(ellipse 22% 62% at 50% 0%,rgba(255,255,255,.85),rgba(255,252,246,.3) 55%,transparent 80%)}
.hero__dust{display:none}
.hero__bell img{filter:saturate(1.05) contrast(1.02)}
.hero__watch img{filter:drop-shadow(0 34px 34px rgba(70,48,24,.20)) drop-shadow(0 6px 10px rgba(70,48,24,.14))}
.hero__shadow{background:radial-gradient(closest-side,rgba(70,48,24,.28),transparent)}
.hero__sheen{display:none}
.hero__title{color:var(--ink)}
.hero__line+.hero__line>span{color:var(--gold-ink)}
.hero__sub{color:var(--ink-soft)}
.hero__sound-note{color:var(--ink-mute)}
.hero .sound-btn{color:var(--ink)}
.hero .sound-btn__icon{border-color:var(--line-light)}
.hero__tagline{color:var(--ink-mute)}
.hero .passage__track{stroke:var(--line-light)}
.hero .passage__text{color:var(--ink-mute)}
.hero .passage__text b{color:var(--ink)}
.hero__partner{color:var(--ink-soft)}
.hero__partner:hover{color:var(--ink)}
.hero__partner-crest{filter:drop-shadow(0 4px 10px rgba(90,60,10,.18))}
.hero__partner-over{color:var(--ink-mute)}
.hero__partner-name{color:var(--gold-ink)}
.hero__portal{background:var(--paper)}

/* ---------- Collection page ---------- */
.collection-head{background:
  radial-gradient(42% 58% at 70% 52%,rgba(255,255,255,.95),rgba(255,255,255,0) 72%),
  linear-gradient(180deg,#F1EADF,var(--ivory))}
.collection-head__watch img{filter:drop-shadow(0 40px 40px rgba(70,48,24,.20)) drop-shadow(0 8px 12px rgba(70,48,24,.12))}
.collection-head__halo{border-color:rgba(122,90,22,.20);box-shadow:0 0 0 60px rgba(122,90,22,.03)}
[data-theme="light"] .link-draw--light{color:var(--gold-ink)}

.editions[data-theme="light"]{background:var(--vellum)}
.editions[data-theme="light"] .edition{border-color:var(--line-light)}
.edition__count{color:var(--ink-mute)}
.editions[data-theme="dark"] .edition__count{color:var(--on-dark-mute)}
.editions[data-theme="light"] .edition__price{color:var(--ink)}
.editions[data-theme="light"] .edition__vat{color:var(--ink-mute)}
.editions[data-theme="light"] .edition__media{background:radial-gradient(closest-side,#fff,rgba(255,255,255,0))}
.editions[data-theme="light"] .edition__media img{filter:drop-shadow(0 26px 30px rgba(70,48,24,.18))}
.editions[data-theme="light"] .edition--monaco .edition__media{background:radial-gradient(closest-side,#fff,rgba(255,255,255,0))}
.editions[data-theme="light"] .edition--unique .edition__media img{box-shadow:0 24px 50px rgba(70,48,24,.22)}

/* ---------- Model pages: the calibre on ivory ---------- */
.calibre-band[data-theme="light"]{background:var(--ivory)}
.calibre-band[data-theme="light"] .calibre-band__media{aspect-ratio:1;background:var(--paper)}
.calibre-band[data-theme="light"] .calibre-band__figures,
.calibre-band[data-theme="light"] .calibre-band__figures div{border-color:var(--line-light)}
.calibre-band[data-theme="light"] .calibre-band__figures dt{color:var(--gold-ink)}

/* ---------- Las Vegas page ---------- */
.page-head--light{background:linear-gradient(180deg,#F1EADF,var(--ivory))}
.page-head--light .page-head__veil{background:linear-gradient(90deg,var(--ivory) 0%,rgba(247,243,236,.9) 34%,rgba(247,243,236,0) 62%)}
.page-head--light .page-head__media img{filter:drop-shadow(0 30px 40px rgba(70,48,24,.18))}
.page-head--light .page-head__lead{color:var(--ink-soft)!important}
.page-head--light .page-head__cue{background:var(--line-light)}
.facts-row[data-theme="light"]{background:var(--vellum)}
.facts-row[data-theme="light"] .facts-row__media img{filter:drop-shadow(0 30px 36px rgba(70,48,24,.2))}

/* ---------- The menu: watches previewed on cream ---------- */
.menu__preview{background:radial-gradient(circle at 50% 45%,#FFFFFF,var(--vellum) 75%)}
.menu__preview img:not(.is-cover){filter:drop-shadow(0 24px 28px rgba(70,48,24,.2))}
/* on ivory the bell is shown whole; the fade into darkness belongs to the night version */
.hero__bell img{-webkit-mask-image:none;mask-image:none;filter:drop-shadow(0 30px 40px rgba(70,48,24,.16))}
.page-head--light .page-head__media{inset:6% 0 0}
.page-head--light .page-head__media img{object-fit:contain;object-position:right center}

/* ==========================================================================
   Round two
   1. Watches on a titanium bracelet always stand on pure white.
   2. A watch is never put in a box: it stands flush on the page.
   ========================================================================== */
.selector.is-paper{background:var(--paper)}
.selector.is-paper .selector__watch{filter:drop-shadow(0 26px 30px rgba(40,30,20,.16))}
.editions.is-paper{background:var(--paper)}
.editions.is-paper .edition{border-color:var(--hair)}
.editions.is-paper .edition__media,.editions.is-paper .edition--monaco .edition__media{background:none}
.editions.is-paper .edition__media img{filter:drop-shadow(0 22px 26px rgba(40,30,20,.14))}
.tale.is-paper .tale__media{background:none}
.tale.is-paper .tale__media::after{display:none}
.page-head--light{background:var(--paper)}
.page-head--light .page-head__veil{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.92) 34%,rgba(255,255,255,0) 62%)}
.facts-row.is-paper{background:var(--paper)}

/* the menu on ivory, watches flush on the page */
.menu{background:var(--ivory);color:var(--ink)}
.menu-open .nav{color:var(--ink)}
.menu__item{border-bottom-color:var(--line-light)}
.menu__note{color:var(--ink-mute)}
.menu__item:hover .menu__name,.menu__item:focus-visible .menu__name,.menu__item[aria-current="page"] .menu__name{color:var(--gold-ink)}
.menu .label{color:var(--gold-ink)}
.menu__contact p{color:var(--ink-soft)}
.menu__contact a{border-bottom-color:var(--line-light)}
.menu .passage__track{stroke:var(--line-light)}
.menu .passage__text{color:var(--ink-mute)}
.menu .passage__text b{color:var(--ink)}
.menu__preview{background:none;overflow:visible}
.menu__preview img:not(.is-cover){filter:drop-shadow(0 22px 26px rgba(70,48,24,.16))}

/* the caviar tin: the whole photograph, edge to edge, nothing cropped */
.showcase{display:block;min-height:0;padding:0;background:#140e0a}
.showcase__media{position:relative;inset:auto;z-index:auto}
.showcase__media img{width:100%;height:auto;object-fit:initial;display:block}
.showcase__veil{z-index:1;background:linear-gradient(90deg,rgba(14,10,7,.86) 0%,rgba(14,10,7,.70) 24%,rgba(14,10,7,.30) 42%,rgba(14,10,7,0) 58%)}
.showcase__copy{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);z-index:2}
@media (max-width:1100px){
  .showcase .display-1{font-size:clamp(2.2rem,4.4vw,3.4rem)}
  .showcase .prose{font-size:1.02rem}
}
@media (max-width:980px){
  .showcase__veil{display:none}
  .showcase__copy{position:relative;top:auto;transform:none;padding-block:40px 64px}
}
.selector.is-paper .selector__halo{display:none}
.showcase__copy>*{max-width:min(30rem,31vw)}
.showcase .display-1{font-size:clamp(2.4rem,4vw,4.6rem)}
@media (max-width:1199px){
  .showcase__veil{display:none}
  .showcase__copy{position:relative;top:auto;transform:none;padding-block:44px 64px}
  .showcase__copy>*{max-width:34rem}
  .showcase .display-1{font-size:clamp(2.2rem,6vw,3.4rem)}
}

/* the real Van Bergen bell, cast at Midwolda, hanging from a single cord */
.hero__bell{top:9vh;width:min(33vw,52vh);right:calc(var(--gutter) + 6vw)}
.hero__bell img{-webkit-mask-image:none;mask-image:none;filter:drop-shadow(0 30px 34px rgba(70,48,24,.18)) saturate(1.04)}
.hero__bell::before{content:"";position:absolute;left:50%;bottom:calc(100% - 6px);width:3px;height:100vh;margin-left:-1.5px;background:linear-gradient(180deg,#3a2c1f,#5b4733);border-radius:2px}
@media (max-width:980px){
  .hero__bell{top:5svh;width:min(54vw,32svh);margin-left:calc(min(54vw,32svh) / -2)}
}
/* the bell to the right of the headline; the watch overlaps only its lip */
.hero__bell{top:6vh;width:min(30vw,48vh);right:calc(var(--gutter) + 1vw)}
@media (max-width:980px){
  .hero__bell{top:3svh;width:min(46vw,27svh);margin-left:calc(min(46vw,27svh) * -0.96)}
  .hero__watch{margin-left:calc(min(40vw,25svh) * -0.18)}
}
.hero__bell{top:11vh;width:min(28vw,44vh)}
@media (max-width:980px){
  .hero__bell{top:4svh}
  .hero__bell::before{height:calc(4svh + 8px)}
}
@media (max-width:980px){
  .hero__bell{width:min(46vw,27svh)}
}

/* ==========================================================================
   Round three: the bell leaves the opening; the watch carries it alone.
   The native cursor is used throughout.
   ========================================================================== */
.hero__title{font-size:clamp(2.6rem,5.2vw,5.8rem)}
.hero__shadow{display:none}

/* one watch, larger */
.hero__watch--solo{right:calc(var(--gutter) + 5vw);bottom:auto;top:calc(50% - min(30vw,60vh) * .70);width:min(30vw,60vh)}
.hero__watch--solo img{filter:drop-shadow(0 40px 40px rgba(70,48,24,.20)) drop-shadow(0 8px 12px rgba(70,48,24,.12))}

/* two watches: Bourdon Blue on its bracelet behind, Vesper Violet in front.
   A titanium bracelet stands on pure white, so this opening is white. */
.hero--white,.hero--white .hero__backdrop{background:#fff}
.hero__watch--duo{right:var(--gutter);bottom:auto;top:calc(50% - min(40vw,82vh) * .44);width:min(40vw,82vh)}
.hero__watch--duo .hero__watch-tilt{position:relative;aspect-ratio:1 / .934}
.hero__watch--duo .hero__w{position:absolute;width:58%;height:auto}
.hero__watch--duo .hero__w--back{left:0;top:0;z-index:1;filter:drop-shadow(0 30px 30px rgba(40,30,20,.14))}
.hero__watch--duo .hero__w--front{left:42%;top:10%;z-index:2;filter:drop-shadow(-22px 26px 28px rgba(40,30,20,.22)) drop-shadow(0 8px 12px rgba(40,30,20,.10))}

@media (max-width:980px){
  .hero__watch--solo{top:auto;bottom:0;left:50%;right:auto;width:min(56vw,34svh);margin-left:calc(min(56vw,34svh) / -2)}
  .hero__watch--duo{top:auto;bottom:0;left:50%;right:auto;width:min(86vw,46svh);margin-left:calc(min(86vw,46svh) / -2)}
}

/* ==========================================================================
   Round four: the photographs themselves. Every watch is a photograph on
   white, so where a section is white it needs no shadow and no cut out.
   ========================================================================== */
.viewer__caption{margin-top:12px;font-family:var(--f-body);font-style:italic;font-size:1rem;color:var(--ink-mute);min-height:1.5em;transition:opacity var(--d-strike) var(--ease-settle)}
.selector.is-paper .selector__watch,
.editions.is-paper .edition__media img,
.facts-row.is-paper .facts-row__media img,
.page-head--light .page-head__media img{filter:none}
.editions.is-paper .edition__media img{width:92%;height:92%}
.facts-row.is-paper .facts-row__media{max-width:520px}

/* ==========================================================================
   Round five: the details
   ========================================================================== */
/* opening: the name of the maison */
.hero__title{font-size:clamp(3.4rem,7vw,7.6rem);letter-spacing:-.02em;margin-bottom:30px}
.hero__line>span{color:var(--ink)}
.hero__gold{color:var(--gold-ink)}
.hero__sub{max-width:34rem}

/* the selector heading and its line beneath */
.selector__panel .display-2{margin-bottom:14px}
.selector__sub{font-family:var(--f-body);font-style:italic;font-size:.98rem;color:var(--ink-mute);margin-bottom:28px;max-width:34rem}

/* quotations close as they open */
.voice__quote::after{content:"\201D";color:var(--gold-ink)}
[data-theme="dark"] .voice__quote::after{color:var(--gold)}

/* the largest hammer: the photograph is the section */
.record--full{position:relative;min-height:100vh;display:flex;align-items:center;padding-block:calc(var(--section) * .8);isolation:isolate;background:#050505}
.record__bg{position:absolute;inset:0;margin:0;z-index:-2;overflow:hidden}
.record__bg img{width:100%;height:100%;object-fit:cover;object-position:70% 38%}
.record__veil{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,rgba(5,5,6,.90) 0%,rgba(5,5,6,.78) 30%,rgba(5,5,6,.30) 52%,rgba(5,5,6,0) 68%),
             linear-gradient(0deg,rgba(5,5,6,.92) 0%,rgba(5,5,6,.55) 22%,rgba(5,5,6,0) 42%)}
.record--full .record__grid{width:100%}
.record--full .record__copy{grid-column:1 / span 5}
.record--full .record__copy .prose{color:#E7E1D6!important;text-shadow:0 1px 18px rgba(0,0,0,.5)}
.record--full .display-1{text-shadow:0 2px 30px rgba(0,0,0,.4)}
.record--full .caliper{margin-top:clamp(56px,9vh,110px)}
@media (max-width:980px){
  .record--full{align-items:flex-end;min-height:110svh}
  .record__bg img{object-position:62% 30%}
  .record__veil{background:linear-gradient(0deg,rgba(5,5,6,.95) 0%,rgba(5,5,6,.85) 55%,rgba(5,5,6,.2) 80%,rgba(5,5,6,0) 100%)}
  .record--full .record__copy{grid-column:1 / -1}
}

/* the timeline: when it travels sideways it fits the window, text included */
.lineage.is-pinned{height:100vh;height:100svh;padding-block:calc(var(--nav-h) + 3vh) 3vh;display:flex;flex-direction:column}
.lineage.is-pinned .lineage__head{margin-bottom:3.5vh}
.lineage.is-pinned .lineage__head .display-2{font-size:clamp(1.9rem,3.2vw,3rem)}
.lineage.is-pinned .lineage__viewport{flex:1;min-height:0}
.lineage.is-pinned .era{padding-top:16px}
.lineage.is-pinned .era figure{aspect-ratio:auto;height:min(28vh,260px);margin-bottom:14px}
.lineage.is-pinned .era__year{font-size:clamp(2.2rem,3.6vw,3.4rem);margin-bottom:4px}
.lineage.is-pinned .era__title{font-size:1.35rem;margin-bottom:6px}
.lineage.is-pinned .era .prose,.lineage.is-pinned .era p:not(.era__year):not(.era__title){font-size:1rem;line-height:1.6}
.lineage.is-pinned .lineage__progress{margin-top:2vh}
.overture__title{font-size:clamp(2.2rem,3.6vw,3.6rem);line-height:1.1}
.hero__sub{font-size:var(--t-lead)}
.record__bg img{object-position:62% 50%}
.record__veil{background:linear-gradient(90deg,rgba(0,0,0,.86) 0%,rgba(0,0,0,.66) 30%,rgba(0,0,0,.15) 50%,rgba(0,0,0,0) 62%),
             linear-gradient(0deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.4) 20%,rgba(0,0,0,0) 36%)}
.record__bg img{object-position:12% 50%}
.record--full .record__copy .prose{font-size:var(--t-body)}
@media (max-width:980px){
  .record--full{display:block;min-height:0;padding:0 0 64px;background:#000}
  .record__bg{position:relative;inset:auto;aspect-ratio:4/3;z-index:auto}
  .record__bg img{object-position:62% 50%}
  .record__veil{inset:0 0 auto;height:0;aspect-ratio:4/3;width:100%;height:auto;background:linear-gradient(0deg,#000 0%,rgba(0,0,0,0) 35%)}
  .record--full .record__grid{margin-top:-24px;position:relative}
}
.record--full .record__copy{max-width:31rem}
.record__veil{background:linear-gradient(90deg,rgba(0,0,0,.90) 0%,rgba(0,0,0,.82) 32%,rgba(0,0,0,.38) 50%,rgba(0,0,0,0) 64%),
             linear-gradient(0deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.4) 20%,rgba(0,0,0,0) 36%)}
@media (max-width:980px){.record--full .record__copy{max-width:none}.record__veil{background:linear-gradient(0deg,#000 0%,rgba(0,0,0,0) 35%)}}

/* timeline photographs shown whole: the card width follows the window height, the image keeps its own proportion */
.lineage.is-pinned .era{width:clamp(250px,min(26vw,48vh),420px)}
.lineage.is-pinned .era figure{height:auto;aspect-ratio:10/7}
.lineage .era figure img{object-position:50% 30%}
.lineage .era figure img[src*="prince-presentation"]{object-position:50% 8%}
.lineage .era figure img[src*="queen-juliana"]{object-position:50% 0%}
/* room for the descenders (the g of Bergen) inside the reveal mask */
.hero__line{padding-bottom:.24em;margin-bottom:-.16em}
.split-w{padding-bottom:.22em;margin-bottom:-.22em}
.lineage .era figure img[src*="img-bell-1795"],.lineage .era figure img[src*="foundry-pour"]{object-position:50% 0%}

/* ==========================================================================
   The collection, made clear: one entry, three editions
   ========================================================================== */
/* navigation: Collection opens onto the three editions */
.nav__drop{position:relative;display:flex;align-items:center}
.nav__panel{position:absolute;left:50%;top:calc(100% + 14px);width:330px;margin-left:-165px;padding:10px;background:var(--ivory);color:var(--ink);border:1px solid var(--line-light);border-radius:4px;box-shadow:0 24px 48px rgba(40,30,20,.12);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity var(--d-strike) var(--ease-settle),transform var(--d-strike) var(--ease-settle),visibility 0s linear var(--d-strike)}
.nav__panel::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
.nav__drop:hover .nav__panel,.nav__drop:focus-within .nav__panel{opacity:1;visibility:visible;transform:none;transition:opacity var(--d-strike) var(--ease-settle),transform var(--d-strike) var(--ease-settle),visibility 0s}
.nav__ed{display:grid;gap:2px;padding:12px 14px;border-radius:3px;transition:background-color var(--d-tick) var(--ease-damp)}
.nav__ed span{font-family:var(--f-display);font-size:1.15rem;line-height:1.2;color:var(--ink)}
.nav__ed small{font-family:var(--f-body);font-style:italic;font-size:.88rem;color:var(--ink-mute)}
.nav__ed:hover,.nav__ed:focus-visible{background:rgba(21,21,26,.05)}
.nav__ed--all{border-top:1px solid var(--line-light);border-radius:0 0 3px 3px;margin-top:4px;padding-top:14px}
.nav__ed--all span{font-family:var(--f-label);font-size:.62rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink)}

/* the full screen menu: the editions beneath the collection */
.menu__sub{display:flex;flex-wrap:wrap;gap:6px 22px;padding:2px 0 14px;border-bottom:1px solid var(--line-light);margin-top:-1px}
.menu__sub a{font-family:var(--f-body);font-style:italic;font-size:1.02rem;color:var(--ink-soft);transition:color var(--d-tick) var(--ease-damp)}
.menu__sub a:hover,.menu__sub a:focus-visible{color:var(--gold-ink)}
.menu__list li:has(.menu__sub)>.menu__item{border-bottom:0}

/* the three editions on the collection page */
.eds{padding-block:var(--section)}
.eds__anchor{position:relative;top:-120px;display:block}
.eds__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:20px 40px;margin-bottom:clamp(30px,4vw,56px)}
.eds__head .prose{max-width:30rem}
.eds__tabs{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);margin-bottom:clamp(36px,4vw,60px)}
.eds__tab{position:relative;display:grid;gap:4px;padding:22px 24px 20px;text-align:left;color:var(--ink-mute);transition:color var(--d-strike) var(--ease-settle),background-color var(--d-strike) var(--ease-settle)}
.eds__tab+.eds__tab{border-left:1px solid var(--hair)}
.eds__tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--gold-ink);transform:scaleX(0);transform-origin:left;transition:transform var(--d-strike) var(--ease-strike)}
.eds__tab-name{font-family:var(--f-display);font-size:clamp(1.3rem,1.9vw,1.75rem);line-height:1.15;color:inherit}
.eds__tab-count{font-family:var(--f-label);font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.eds__tab:hover{color:var(--ink)}
.eds__tab[aria-selected="true"]{color:var(--ink)}
.eds__tab[aria-selected="true"]::after{transform:scaleX(1)}
.eds__tab[aria-selected="true"] .eds__tab-count{color:var(--gold-ink)}
.eds__panel{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,4vw,64px);align-items:start}
.eds__panel.is-shown{animation:edsIn 700ms var(--ease-strike)}
@keyframes edsIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.eds__info{position:sticky;top:calc(var(--nav-h) + 24px);display:grid;gap:16px;justify-items:start}
.eds__label{font-family:var(--f-label);font-size:var(--t-label);font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-ink)}
.eds__line{font-family:var(--f-body);font-style:italic;color:var(--ink-mute);font-size:1.08rem;margin-top:-6px}
.eds__facts{width:100%;border-top:1px solid var(--hair)}
.eds__facts div{display:grid;grid-template-columns:5.5rem 1fr;gap:14px;padding:12px 0;border-bottom:1px solid var(--hair);align-items:baseline}
.eds__facts dt{font-family:var(--f-label);font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-mute)}
.eds__facts dd{text-align:left;font-size:1rem;color:var(--ink)}
.eds__items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-left:1px solid var(--hair);border-top:1px solid var(--hair)}
.eds__items>*{border-right:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.ed-shot{display:grid;align-content:start;background:var(--paper);color:var(--ink)}
.ed-shot__media{display:block;aspect-ratio:4/5;overflow:hidden}
.ed-shot__media img{width:100%;height:100%;object-fit:contain;padding:6% 8% 2%;transition:transform 1400ms var(--ease-strike)}
.ed-shot:hover .ed-shot__media img{transform:scale(1.035)}
.ed-shot__cap{padding:16px 22px 24px;font-family:var(--f-body);font-style:italic;color:var(--ink-soft);font-size:1rem}
.ed-shot--crest{display:grid;place-items:center;padding:28px}
.ed-shot--crest .lockup{flex-direction:column;align-items:center;text-align:center;gap:18px}
.ed-shot--crest .lockup__crest{width:min(70%,170px)}
.ed-shot--crest .lockup__type{border-left:0;padding-left:0;justify-items:center}
.eds__unique{margin-top:clamp(40px,5vw,72px);border:1px solid var(--hair);grid-template-columns:auto 1fr auto}
.eds__unique .commission__copy{gap:10px}
@media (max-width:980px){
  .eds__panel{grid-template-columns:1fr}
  .eds__info{position:static}
  .eds__items{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .eds__tabs{grid-template-columns:1fr}
  .eds__tab+.eds__tab{border-left:0;border-top:1px solid var(--hair)}
  .eds__tab{padding:16px 4px}
  .eds__unique{grid-template-columns:1fr}
}
.ed-shot--more{display:grid;align-content:center;justify-items:start;gap:14px;padding:32px;background:var(--ivory);transition:background-color var(--d-strike) var(--ease-settle)}
.ed-shot--more:hover{background:var(--vellum)}
.ed-more__n{font-family:var(--f-display);font-weight:300;font-size:4.2rem;line-height:1;color:var(--gold-ink)}
.ed-more__t{font-family:var(--f-display);font-size:1.45rem;line-height:1.2;max-width:12em}
.ed-more__l{font-family:var(--f-label);font-size:.62rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink);border-bottom:1px solid currentColor;padding-bottom:3px}
/* the opening is one screen; it no longer holds for a second, nearly empty one */
.hero{height:100vh;height:100svh}
.hero__sticky{position:relative}
@media (max-width:980px){.hero{height:auto}}

/* the closing call: received, not purchased, with a watch beside it */
.receive--watch{background:var(--paper);padding-block:clamp(70px,9vw,130px)}
.receive--watch .receive__rings{display:none}
.receive--watch .receive__inner{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);column-gap:clamp(30px,6vw,110px);align-items:center;justify-items:start}
.receive--watch .receive__inner>*:not(.receive__watch){grid-column:1}
.receive--watch .receive__watch{grid-column:2;grid-row:1 / span 3;justify-self:center;width:min(100%,440px);margin:0}
.receive--watch .receive__watch img{width:100%;height:auto}
.receive--watch .receive__body{color:var(--ink-soft)!important}
@media (max-width:980px){
  .receive--watch .receive__inner{grid-template-columns:1fr}
  .receive--watch .receive__watch{grid-column:1;grid-row:auto;order:-1;width:min(70%,340px)}
}
@media (min-width:981px){
  .receive--watch .receive__inner{grid-template-rows:1fr auto auto auto 1fr;row-gap:0}
  .receive--watch .receive__inner>h2{grid-row:2;margin-bottom:24px}
  .receive--watch .receive__inner>.receive__body{grid-row:3;margin-bottom:30px}
  .receive--watch .receive__inner>.receive__actions{grid-row:4;margin-top:0}
  .receive--watch .receive__watch{grid-row:1 / -1}
}

/* ---------- The collection bar ----------
   Under the main navigation on the collection, All models and every model
   page. When the navigation slides away on the way down, the bar stays at
   the top, so the editions are always one touch away. */
:root{--nav-base:84px;--colbar-h:50px}
body.has-colbar{--nav-h:calc(var(--nav-base) + var(--colbar-h))}
.has-colbar .nav{height:var(--nav-base)}
.has-colbar .nav.is-scrolled{height:68px}
.nav__panel{z-index:3}
.colbar{position:absolute;left:0;right:0;top:100%;z-index:1;height:var(--colbar-h);color:var(--ink);
  border-top:1px solid var(--line-light);border-bottom:1px solid var(--line-light);background:rgba(247,243,236,0);
  transition:background-color var(--d-strike) var(--ease-settle),opacity var(--d-strike) var(--ease-settle),visibility 0s}
.nav.is-scrolled .colbar{background:rgba(247,243,236,.94);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%)}
.menu-open .colbar{opacity:0;visibility:hidden;transition:opacity var(--d-strike) var(--ease-settle),visibility 0s linear var(--d-strike)}
.colbar__inner{height:100%;max-width:var(--max);margin:0 auto;padding-inline:var(--gutter);display:flex;align-items:center;gap:40px}
.colbar__home{position:relative;display:flex;align-items:center;flex-shrink:0;font-family:var(--f-display);font-size:1.08rem;line-height:1;white-space:nowrap;transition:color var(--d-tick) var(--ease-damp)}
.colbar__home::before{content:"";position:absolute;left:-14px;top:50%;margin-top:-2.5px;width:5px;height:5px;border-radius:50%;background:var(--gold-ink);transform:scale(0);transition:transform var(--d-strike) var(--ease-strike)}
.colbar__home[aria-current]::before,.colbar__home:hover::before{transform:scale(1)}
.colbar__links{display:flex;align-items:stretch;align-self:stretch;gap:34px;margin-left:auto}
.colbar__link{position:relative;display:flex;align-items:center;gap:6px;font-family:var(--f-label);font-size:.62rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;color:var(--ink-mute);transition:color var(--d-tick) var(--ease-damp)}
.colbar__link sup{font-size:.85em;letter-spacing:.05em;color:var(--gold-ink);transform:translateY(-.35em)}
.colbar__link::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--gold-ink);transform:scaleX(0);transform-origin:left center;transition:transform var(--d-strike) var(--ease-settle)}
.colbar__link:hover,.colbar__link[aria-current]{color:var(--ink)}
.colbar__link[aria-current]::after{transform:none}
.colbar__link:hover::after{transform:none;opacity:.5}
.colbar__link[aria-current]:hover::after{opacity:1}
.colbar a:focus-visible{outline:1px solid var(--gold-ink);outline-offset:4px}
@media (max-width:980px){
  :root{--nav-base:72px;--colbar-h:46px}
  .colbar__inner{gap:26px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .colbar__inner::-webkit-scrollbar{display:none}
  .colbar__inner{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 28px),transparent)}
  .colbar__home{font-size:1rem;margin-left:12px}
  .colbar__links{gap:26px;margin-left:0;padding-right:var(--gutter)}
}

/* ---------- Bracelet and strap, on the model page ---------- */
.piece__delivery{display:grid;gap:8px;padding:18px 0 4px}
.piece__delivery p:last-child{font-family:var(--f-body);font-size:1.02rem;line-height:1.6;color:var(--ink-soft);text-align:justify;hyphens:none}

/* ---------- Monaco: two models side by side in the editions ---------- */
.eds__items--monaco{grid-template-columns:repeat(2,minmax(0,1fr))}

/* ---------- Presented in a Van Bergen bell: the photograph, full width ---------- */
.showcase--bell .showcase__col{display:grid;gap:20px;justify-items:start}
.showcase--bell .showcase__copy>.showcase__col{max-width:34rem}
.showcase--bell .showcase__col>*{max-width:100%}
.showcase--bell .display-1{max-width:none}
.showcase--bell .prose{text-align:justify;hyphens:none}
@media (min-width:1200px){
  .showcase--bell .showcase__veil{background:radial-gradient(ellipse 52% 72% at 84% 30%,rgba(14,10,7,.80) 0%,rgba(14,10,7,.62) 40%,rgba(14,10,7,0) 100%)}
  .showcase--bell .showcase__copy{top:0;bottom:0;transform:none;display:flex;align-items:flex-start;padding-top:clamp(40px,5vw,96px)}
  .showcase--bell .showcase__copy>.showcase__col{width:min(27rem,29vw);max-width:none;margin-left:auto}
  .showcase--bell .display-1{font-size:clamp(2.2rem,3.3vw,3.9rem)}
  .showcase--bell .prose{font-size:1.05rem}
}

/* ---------- Calibre page: the strike may be silenced; finished by hand, one photograph ---------- */
.strike__silence{text-align:justify;hyphens:none}
.showcase--macro{background:#000}
.showcase--macro .showcase__veil{background:linear-gradient(90deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.25) 34%,rgba(0,0,0,0) 50%)}
.showcase--macro .prose{text-align:justify;hyphens:none}
@media (max-width:980px){
  .showcase--macro .showcase__media img{height:78vw;object-fit:cover;object-position:right center}
}

/* ---------- Calibre page: the philosophy, with the case back dissolving into the page ---------- */
.philosophy--media{overflow:hidden}
.philosophy--media .philosophy__grid{align-items:center;row-gap:0}
.philosophy--media .philosophy__grid .display-1{grid-column:1 / span 6;grid-row:1;font-size:clamp(2.4rem,3.9vw,4.4rem);margin-bottom:clamp(28px,3vw,44px);align-self:end}
.philosophy--media .philosophy__body{grid-column:1 / span 6;grid-row:2;align-self:start}
.philosophy--media .philosophy__body .prose{text-align:justify;hyphens:none}
.philosophy__media{grid-column:7 / -1;grid-row:1 / span 2;margin:0;position:relative}
.philosophy__media img{display:block;width:114%;max-width:none;height:auto;margin-left:-8%;
  -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 58%,rgba(0,0,0,.6) 78%,transparent 100%);
          mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 58%,rgba(0,0,0,.6) 78%,transparent 100%)}
@media (max-width:980px){
  .philosophy--media .philosophy__grid .display-1,.philosophy--media .philosophy__body,.philosophy__media{grid-column:1 / -1;grid-row:auto}
  .philosophy__media{margin:0 calc(-1 * var(--gutter)) 18px}
  .philosophy__media img{width:116%;margin-left:-8%}
}

/* ---------- The Maison: the archive photograph across the whole header ---------- */
.page-head--archive{background:#1c1c1c}
.page-head--archive .page-head__media img{object-position:center 38%}
.page-head--archive .page-head__veil{background:
  linear-gradient(180deg,rgba(18,18,18,.55) 0%,rgba(18,18,18,0) 22%,rgba(18,18,18,0) 48%,rgba(18,18,18,.82) 86%,#1c1c1c 100%),
  linear-gradient(90deg,rgba(18,18,18,.55) 0%,rgba(18,18,18,0) 48%)}
@media (max-width:980px){ .page-head--archive .page-head__media img{object-position:42% center} }

/* ---------- The Maison: portraits framed by a thin double line ---------- */
.person__portrait{position:relative;padding:10px;border:1px solid rgba(176,141,74,.65);border-radius:0}
.person__portrait::after{content:"";position:absolute;inset:5px;border:1px solid rgba(176,141,74,.65);pointer-events:none;z-index:1}
.person__portrait img{display:block}

/* ---------- Navigation: room for Events and Retailers ---------- */
.nav__link{white-space:nowrap}
.nav__panel--events{width:400px;margin-left:-200px}
@media (max-width:1400px){ .nav__primary{gap:24px} .nav__inner{gap:22px} }
@media (max-width:1320px){ .nav__primary{gap:20px} .nav__link{letter-spacing:.14em} .nav__cta{padding-inline:18px} }
@media (max-width:1260px) and (min-width:1181px){ .wordmark__text{display:none} }

/* ---------- World Caviar Awards: the presentation box alone on white ---------- */
.present{background:#fff;padding-block:clamp(70px,9vw,140px)}
.present__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(36px,6vw,110px);align-items:center}
.present__media{margin:0}
.present__media img{display:block;width:100%;height:auto}
.present__copy{display:grid;gap:22px;justify-items:start;max-width:32rem}
.present__label{font-family:var(--f-label);font-size:var(--t-label);font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-ink)}
.present__copy .prose{text-align:justify;hyphens:none}
.present__note{display:flex;align-items:center;gap:14px;font-family:var(--f-body);font-style:italic;color:var(--ink-mute);font-size:1.02rem}
.present__note::before{content:"";width:34px;height:1px;background:currentColor;opacity:.7}
@media (max-width:980px){
  .present__grid{grid-template-columns:1fr}
  .present__media{max-width:560px;margin-inline:auto}
}

/* ==========================================================================
   MOBILE ONLY (from here on, every change sits inside a phone breakpoint)
   ========================================================================== */
@media (max-width:600px){
  /* the footer wordmark fits the narrowest phones */
  .footer__mark span{font-size:clamp(1.5rem,7.4vw,2.2rem);letter-spacing:.04em}
  .footer__mark img{height:44px}
}
@media (max-width:980px){
  /* the hammer: the photograph above, the title clear beneath it */
  .record--full .record__veil{display:none}
  .record--full .record__bg{position:relative}
  .record--full .record__bg::after{content:"";position:absolute;left:0;right:0;bottom:0;height:28%;background:linear-gradient(0deg,#000 0%,rgba(0,0,0,0) 100%);pointer-events:none}
  .record--full .record__grid{margin-top:0;padding-top:clamp(20px,6vw,36px)}
}
@media (max-width:980px){
  /* older phone browsers without aspect-ratio still give the photograph its height */
  @supports not (aspect-ratio:4/3){
    .record--full .record__bg{height:0;padding-bottom:75%}
    .record--full .record__bg img{position:absolute;inset:0}
  }
  .record--full .record__grid{position:relative;z-index:1}
}
@media (max-width:1180px){
  /* with the text navigation hidden, the menu button goes to the right edge */
  .nav__actions{margin-left:auto}
}

/* the two watches of the opening at exactly the same scale */
.hero__watch--duo .hero__w--back{width:54%}
.hero__watch--duo .hero__w--front{width:53.25%;left:45.5%;top:8%}   /* same dial size (measured); half the Bourdon Blue's crown left in view */