/* Merged presentation: navy masthead, light hero, alternating sections. */
:root{--paper:#faf8f3;--gold-ink:#88652d;--cream:#faf8f3}
body{background:var(--paper);color:var(--ink)}
header{background:var(--navy);color:white;border:0;padding:20px 5%}
header .logo{width:270px}
nav{color:var(--paper);gap:25px;font-size:17px}
nav a:hover{color:var(--gold)}.nav-cta{color:var(--gold);border-color:#bba46f;font-size:16px}
#menu{background:transparent;color:var(--gold);border:1px solid #bba46f}
main{background:var(--paper)}
.hero{background:var(--paper);color:var(--ink);grid-template-columns:1.05fr .95fr;min-height:670px}
.hero-copy{padding:75px 9% 45px 10%}
.hero .eyebrow{color:var(--gold-ink)}.hero h1 em{color:var(--gold-ink)}
.hero-copy>p:not(.eyebrow){color:#4f5d69}
.hero .button{background:var(--navy);color:white;border-color:var(--navy)}
.hero .button:hover{background:#294763}
.hero .text-link{color:var(--ink)}
.hero-note{color:#616a72;border-color:#d8d0c2}
.hero-media{background:var(--paper);min-height:670px}
.hero-media>img,.hero-media>video{object-fit:contain;object-position:center;background:var(--paper)}
/* A narrow feather at the image edge, never a broad colored section fade. */
.hero-media:before{background:linear-gradient(90deg,var(--paper),rgba(250,248,243,0) 12%);z-index:1}
.hero-media:after{background:linear-gradient(0deg,var(--paper),rgba(250,248,243,.95) 5%,rgba(250,248,243,0) 19%)}
.image-caption{color:var(--ink);bottom:21px;left:30px;font-size:17px}
#video-toggle{top:20px;right:20px;background:var(--navy);color:white;border:1px solid var(--gold);padding:10px 17px}
.collection,.story,.moments,.consult{border-radius:0;position:relative;padding:100px 7%}
.story:before,.story:after,.consult:before{display:none}
.collection{background:var(--navy);color:var(--paper);border-radius:50% 35% 0 0 / 26px 18px 0 0}
.collection .eyebrow,.collection .piece .eyebrow{color:var(--gold)}
.collection .section-heading>p,.collection .gallery-note{color:#c7d0da}
.piece{color:var(--paper)}
.filters button{color:var(--paper);border-color:#8190a0;background:transparent}
.filters button.active{background:var(--gold);border-color:var(--gold);color:var(--deep)}
.piece-image{background:#233750}.piece-image span{background:var(--paper);color:var(--ink)}
.story{background:var(--paper);color:var(--ink)}
.story .eyebrow,.story em{color:var(--gold-ink)}
.story-copy p:not(.eyebrow){color:#4f5d69}
.story .text-link{color:var(--ink)}
.portrait span{background:transparent;color:#79623e}
.accessories{background:var(--navy);color:var(--paper);display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:center}
.accessories .eyebrow{color:var(--gold)}.accessories em{color:var(--gold)}
.accessories-copy>p:not(.eyebrow){color:#ccd4de;max-width:450px}
.showroom-film{margin:0}.showroom-film video{width:100%;max-height:560px;display:block;background:#0e1d30;object-fit:contain}
.showroom-film figcaption{font-size:14px;color:#d9c596;margin-top:16px}
.films{background:var(--paper);color:var(--ink)}.films .eyebrow{color:var(--gold-ink)}
.film-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 26px;margin-top:38px}
.film-card{margin:0}.film-card video{width:100%;aspect-ratio:4/5;object-fit:contain;display:block;background:#102136}
.film-card figcaption{font-family:'Boston Serif',Georgia,serif;font-size:23px;line-height:1.4;margin-top:16px}
.video-error{font-size:14px;margin-top:12px}
.moments{background:var(--navy);color:var(--paper)}.moments .eyebrow{color:var(--gold)}.moments p:not(.eyebrow){color:#c7d0da}
.consult{background:var(--paper);color:var(--ink)}.consult .eyebrow,.consult em{color:var(--gold-ink)}
.consult>div>p,.consult .small{color:#586572}
.consult input,.consult textarea,.consult select{color:var(--ink);background:white;border-color:#9a9fa5}
.consult textarea::placeholder{color:#6b747c}.consult label span{color:#586572}
.consult .button{background:var(--navy);border-color:var(--navy);color:white}
.consult .button:hover{background:#294763}
.consult #download-request{color:var(--gold-ink)}
footer{background:var(--navy);color:var(--paper)}
@media(max-width:1150px){header{flex-wrap:wrap}header .logo{width:250px}#menu{display:block;padding:10px 18px;font-size:18px;font-weight:700}nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:0}nav.open{display:flex}nav a{padding:14px 0;border-bottom:1px solid #ffffff30;font-size:19px}.nav-cta{border:0;border-bottom:1px solid #ffffff30;font-size:19px}}
@media(max-width:900px){.hero-copy{padding:55px 8%}.hero,.hero-media{min-height:610px}.collection,.story,.moments,.consult,.accessories,.films{padding:75px 6%}.accessories{gap:6%}.film-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){header{padding:16px 7%}header .logo{width:205px}.hero{grid-template-columns:1fr;min-height:0}.hero-copy{padding:45px 7% 20px}.hero-media{min-height:490px}.hero-media:before{background:linear-gradient(180deg,var(--paper),rgba(250,248,243,0) 8%)}.hero-media:after{background:linear-gradient(0deg,var(--paper),rgba(250,248,243,.95) 6%,rgba(250,248,243,0) 18%)}.image-caption{font-size:16px;left:7%;right:7%}.collection,.story,.moments,.consult,.accessories,.films{padding:60px 7%}.collection{border-radius:50% 35% 0 0 / 18px 12px 0 0}.accessories{grid-template-columns:1fr;gap:30px}.film-grid{grid-template-columns:1fr;gap:34px}.film-card video{aspect-ratio:4/4.6;max-height:520px}.film-card figcaption{font-size:24px}.showroom-film video{max-height:490px}.hero-note{margin-top:25px}}
/* Portrait video presentation and restrained transitions — November 9. */
.hero{align-items:center;overflow:visible;padding-bottom:55px}
.hero h1 em{display:inline-block;color:#fff;background:var(--navy);padding:.08em .18em .14em;margin-top:.06em}
.hero-media{position:relative;width:min(330px,78%);height:680px;min-height:0;margin:45px auto 60px;background:#080a0d;border:9px solid #252a30;border-radius:55px;overflow:visible;box-shadow:0 0 0 2px #8e949b,0 0 0 4px #373d44,0 24px 42px #10213625;isolation:isolate}
.hero-media>img,.hero-media>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:45px;background:#080a0d;overflow:hidden}
.hero-media:before{content:'';position:absolute;top:13px;left:50%;right:auto;bottom:auto;transform:translateX(-50%);width:103px;height:29px;border-radius:24px;background:#060708;z-index:4;pointer-events:none}
.hero-media:after{content:'';position:absolute;left:50%;bottom:8px;top:auto;right:auto;transform:translateX(-50%);height:4px;width:105px;border-radius:4px;background:#ffffffbb;z-index:4;pointer-events:none}
#video-toggle{position:absolute;top:auto;right:14px;bottom:27px;z-index:5;padding:8px 13px;font-size:14px;background:#102136e8;border:1px solid #dac18b;border-radius:18px}
.image-caption{position:absolute;left:-50px;right:-50px;bottom:-54px;text-align:center;color:var(--ink);font-size:15px;line-height:1.4;z-index:2}
/* Each join feathers only 24px; content stays on a solid, high-contrast field. */
.collection,.story,.accessories,.films,.moments,.consult,footer{position:relative;border-radius:0;overflow:visible}
.collection:before,.story:before,.accessories:before,.films:before,.moments:before,.consult:before,footer:before{content:'';display:block;position:absolute;top:-1px;left:0;right:0;height:25px;border-radius:0;pointer-events:none;z-index:0}
.collection:before,.accessories:before,.moments:before,footer:before{background:linear-gradient(to bottom,var(--paper) 0%,rgba(250,248,243,.96) 12%,rgba(250,248,243,.5) 50%,rgba(250,248,243,.04) 88%,rgba(250,248,243,0) 100%)}
.story:before,.films:before,.consult:before{background:linear-gradient(to bottom,var(--navy) 0%,rgba(24,44,69,.96) 12%,rgba(24,44,69,.5) 50%,rgba(24,44,69,.04) 88%,rgba(24,44,69,0) 100%)}
.story:after{display:none}
footer{padding-top:65px}
@media(max-width:900px){.hero-media{width:min(290px,80%);height:600px;border-radius:49px}.hero-media>img,.hero-media>video{border-radius:39px}.hero{min-height:0}.hero-copy{padding-left:9%;padding-right:5%}}
@media(max-width:650px){.hero{padding-bottom:40px}.hero-copy{padding:45px 7% 15px}.hero-media{width:min(300px,78%);height:auto;aspect-ratio:480/1036;min-height:0;margin:30px auto 65px;border-radius:49px}.hero-media>img,.hero-media>video{border-radius:39px}.hero-media:before{background:#060708;top:12px;width:95px;height:27px}.hero-media:after{background:#ffffffbb;top:auto;bottom:8px;height:4px}.image-caption{left:-25px;right:-25px;bottom:-56px;font-size:14px}.collection:before,.story:before,.accessories:before,.films:before,.moments:before,.consult:before,footer:before{height:21px}.hero h1 em{font-size:.94em}}
/* Complete the masthead-to-hero join with the same soft edge. */
.hero{position:relative}
.hero:before{content:'';position:absolute;top:-1px;left:0;right:0;height:25px;pointer-events:none;background:linear-gradient(to bottom,var(--navy),rgba(24,44,69,.96) 12%,rgba(24,44,69,.5) 50%,rgba(24,44,69,.04) 88%,rgba(24,44,69,0));z-index:0}
@media(max-width:650px){.hero:before{height:21px}}

/* Bring neighboring sections together without crowding the content. */
.collection,.story,.accessories,.films,.moments,.consult{padding-top:64px;padding-bottom:54px}
.hero{padding-bottom:20px}
.gallery-note{margin-bottom:0}
.story-copy> :last-child,.accessories-copy> :last-child,.moments>div> :last-child{margin-bottom:0}
footer{padding-top:48px}
@media(max-width:900px){.collection,.story,.accessories,.films,.moments,.consult{padding-top:54px;padding-bottom:44px}}
@media(max-width:650px){.collection,.story,.accessories,.films,.moments,.consult{padding-top:42px;padding-bottom:34px}.hero{padding-bottom:12px}footer{padding-top:40px}}

/* Quiet jewelry-inspired linework gives the open areas a designed backdrop. */
.collection,.story,.accessories,.films,.moments,.consult{
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='520' viewBox='0 0 520 520'%3E%3Cg fill='none' stroke='%23b69659' stroke-opacity='.13' stroke-width='1'%3E%3Cpath d='M260 32 488 260 260 488 32 260Z M260 86 434 260 260 434 86 260Z'/%3E%3Ccircle cx='260' cy='260' r='156'/%3E%3Cpath d='M260 32v54m228 174h-54M260 488v-54M32 260h54'/%3E%3C/g%3E%3C/svg%3E");
 background-size:520px 520px;background-position:center top;
 padding-top:48px;padding-bottom:38px;
}
.story-copy,.accessories-copy{position:relative}
.gallery-note{margin-top:20px}
.hero{padding-bottom:8px}
@media(max-width:900px){.collection,.story,.accessories,.films,.moments,.consult{padding-top:44px;padding-bottom:34px}}
@media(max-width:650px){.collection,.story,.accessories,.films,.moments,.consult{padding-top:36px;padding-bottom:26px;background-size:380px 380px}.gallery-note{margin-top:16px}.story,.consult{gap:24px}.film-grid{gap:26px}}
/* Keep the hero composition together and soften the color transitions. */
@media(min-width:901px){
 .hero{grid-template-columns:minmax(0,660px) 350px;justify-content:center;column-gap:44px;padding-left:5%;padding-right:5%}
 .hero-copy{padding-left:0;padding-right:0}
 .hero-media{width:330px;margin-left:0;margin-right:0}
}
@media(min-width:651px) and (max-width:900px){
 .hero{grid-template-columns:minmax(0,1fr) 290px;column-gap:24px;padding-left:6%;padding-right:6%}
 .hero-copy{padding-left:0;padding-right:0}
 .hero-media{width:280px;margin-left:0;margin-right:0}
}
.hero:before,.collection:before,.story:before,.accessories:before,.films:before,.moments:before,.consult:before,footer:before{height:44px;top:-22px;z-index:1}
.collection:before,.accessories:before,.moments:before,footer:before{background:linear-gradient(to bottom,#faf8f3 0%,#f6f4ef 10%,#e4e4e1 24%,#b9bec2 38%,#89939f 50%,#58697d 64%,#30445c 80%,#1d3049 92%,#182c45 100%)}
.hero:before,.story:before,.films:before,.consult:before{background:linear-gradient(to bottom,#182c45 0%,#1d3049 8%,#30445c 20%,#58697d 36%,#89939f 50%,#b9bec2 62%,#e4e4e1 76%,#f6f4ef 90%,#faf8f3 100%)}
@media(max-width:650px){
 .hero-media{margin-top:12px}
 .hero:before,.collection:before,.story:before,.accessories:before,.films:before,.moments:before,.consult:before,footer:before{height:34px;top:-17px}
}

/* Extend the gold linework into the hero and give color joins a longer feather. */
.hero{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='520' viewBox='0 0 520 520'%3E%3Cg fill='none' stroke='%23b69659' stroke-opacity='.13' stroke-width='1'%3E%3Cpath d='M260 32 488 260 260 488 32 260Z M260 86 434 260 260 434 86 260Z'/%3E%3Ccircle cx='260' cy='260' r='156'/%3E%3Cpath d='M260 32v54m228 174h-54M260 488v-54M32 260h54'/%3E%3C/g%3E%3C/svg%3E");
 background-size:640px 640px;background-position:center center;}
.hero:before,.collection:before,.story:before,.accessories:before,.films:before,.moments:before,.consult:before,footer:before{height:72px;top:-36px}
@media(max-width:650px){.hero{background-size:420px 420px}.hero:before,.collection:before,.story:before,.accessories:before,.films:before,.moments:before,.consult:before,footer:before{height:48px;top:-24px}}
/* Keep the caption above the transition's feather. */
.hero{padding-bottom:32px}
@media(max-width:650px){.hero{padding-bottom:24px}}