@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300;1,400&family=Montserrat:wght@200;300;400;500&display=swap');

* { box-sizing: border-box; margin: 0; padding: 0; }
body { background: #000; }

/* ─── SCROLLBAR ─────────────────────────────────────────────── */

::-webkit-scrollbar              { width: 4px; }
::-webkit-scrollbar-track        { background: transparent; }
::-webkit-scrollbar-thumb        { background: rgba(210,185,140,0.22); border-radius: 2px; }
::-webkit-scrollbar-thumb:hover  { background: rgba(210,185,140,0.45); }

* { scrollbar-width: thin; scrollbar-color: rgba(210,185,140,0.22) transparent; }
.page { background: #000; min-height: 100vh; }

.hero-wrap { position:relative; width:100%; height:420px; overflow:hidden; background:#0a0a0a; }
.hero-bg { position:absolute; inset:0; background-image:url('../img/Gemini_Generated_Image_zfv8wgzfv8wgzfv8.png'); background-size:cover; background-position:center; filter:brightness(0.88) contrast(1.08) saturate(1.1); }
.hero-vignette { position:absolute; inset:0; background:radial-gradient(ellipse at 50% 50%,transparent 35%,rgba(0,0,0,0.55) 100%); z-index:2; }
.hero-top { position:absolute; top:0;left:0;right:0;height:110px; background:linear-gradient(to bottom,rgba(0,0,0,0.78),transparent); z-index:3; }
.hero-bottom { position:absolute; bottom:0;left:0;right:0;height:110px; background:linear-gradient(to top,rgba(0,0,0,0.6),transparent); z-index:3; }
.hero-lf { position:absolute; top:0;left:0;bottom:0;width:120px; background:linear-gradient(to right,rgba(0,0,0,0.35),transparent); z-index:3; }
.hero-rf { position:absolute; top:0;right:0;bottom:0;width:80px; background:linear-gradient(to left,rgba(0,0,0,0.35),transparent); z-index:3; }
.hero-text { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; z-index:10; text-align:center; padding:0 2rem; }
.hero-eyebrow { font-family:'Montserrat',sans-serif; font-weight:400; font-size:11px; letter-spacing:0.4em; text-transform:uppercase; color:rgba(225,205,165,1); margin-bottom:14px; text-shadow:0 0 6px rgba(0,0,0,1),0 0 12px rgba(0,0,0,1),0 1px 3px rgba(0,0,0,1),0 2px 10px rgba(0,0,0,1),0 4px 24px rgba(0,0,0,.95),-3px 0 14px rgba(0,0,0,1),3px 0 14px rgba(0,0,0,1); }
.headline { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:56px; line-height:1.1; color:#f0e8d8; text-shadow:0 1px 4px rgba(0,0,0,.99),0 4px 16px rgba(0,0,0,.9),0 8px 40px rgba(0,0,0,.75); }
.headline em { font-style:italic; color:#d4b896; }
.divider-line { width:40px; height:0.5px; background:rgba(210,185,140,0.6); margin:14px auto 0; }
.tagline { font-family:'Montserrat',sans-serif; font-weight:300; font-size:11px; letter-spacing:0.25em; color:rgba(240,232,216,0.85); text-transform:uppercase; margin-top:16px; text-shadow:0 1px 4px rgba(0,0,0,.99),0 3px 16px rgba(0,0,0,.9),0 6px 30px rgba(0,0,0,.85); }

.section-label { font-family:'Montserrat',sans-serif; font-weight:400; font-size:11px; letter-spacing:0.4em; text-transform:uppercase; color:rgba(210,185,140,0.7); text-align:center; }

.about-section { max-width:700px; margin:0 auto; padding:72px 32px 64px; text-align:center; opacity:0; transform:translateY(36px); transition:opacity 0.8s ease, transform 0.8s cubic-bezier(0.22,1,0.36,1); }
.about-section.visible { opacity:1; transform:translateY(0); }
.about-section .section-label { margin-bottom:28px; }
.about-name { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:38px; color:#f0e8d8; line-height:1.15; margin-bottom:24px; margin-top:28px; }
.about-name em { font-style:italic; color:#c8a87a; }
.about-divider { width:48px; height:0.5px; background:rgba(210,185,140,0.35); margin:0 auto 28px; }
.about-text { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:19px; color:rgba(240,232,216,0.65); line-height:1.85; }
.about-text strong { font-weight:400; color:rgba(240,232,216,0.9); font-style:italic; }

.collection-header { padding:16px 0 48px; border-top:0.5px solid rgba(210,185,140,0.12); margin:0 48px; text-align:center; }

.product-card { display:flex; align-items:stretch; max-width:1100px; margin:0 auto 100px; padding:0 32px; gap:0; opacity:0; transition:opacity 0.7s ease; scroll-margin-top:15vh; }
.product-card.visible { opacity:1; }
.product-card.reverse { flex-direction:row-reverse; }

.img-side { flex:1; position:relative; overflow:hidden; border-radius:4px 0 0 4px; min-height:440px; transform:translateX(-70px); transition:transform 0.75s cubic-bezier(0.22,1,0.36,1); }
.product-card.reverse .img-side { border-radius:0 4px 4px 0; transform:translateX(70px); }
.product-card.visible .img-side { transform:translateX(0); }
.img-side img { width:100%; height:100%; object-fit:cover; display:block; transition:opacity 0.4s ease; }

.dots { position:absolute; bottom:16px; left:0; right:0; display:flex; justify-content:center; gap:8px; z-index:5; }
.dot { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,0.4); border:none; cursor:pointer; transition:background 0.2s,transform 0.2s; padding:0; }
.dot.active { background:rgba(255,255,255,0.95); transform:scale(1.2); }

.info-side { flex:0 0 320px; background:rgba(18,14,10,0.96); border:0.5px solid rgba(210,185,140,0.2); border-left:none; border-radius:0 4px 4px 0; padding:48px 36px; display:flex; flex-direction:column; justify-content:center; transform:translateX(70px); transition:transform 0.75s cubic-bezier(0.22,1,0.36,1) 0.1s; }
.product-card.reverse .info-side { border-left:0.5px solid rgba(210,185,140,0.2); border-right:none; border-radius:4px 0 0 4px; transform:translateX(-70px); }
.product-card.visible .info-side { transform:translateX(0); }

.product-label { font-family:'Montserrat',sans-serif; font-weight:300; font-size:9px; letter-spacing:0.4em; text-transform:uppercase; color:rgba(210,185,140,0.6); margin-bottom:14px; }
.product-name { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:34px; color:#f0e8d8; line-height:1.15; margin-bottom:8px; }
.product-name em { font-style:italic; color:#c8a87a; }
.product-sub { font-family:'Montserrat',sans-serif; font-weight:300; font-size:10px; letter-spacing:0.2em; text-transform:uppercase; color:rgba(210,185,140,0.5); margin-bottom:24px; }
.accent-line { width:32px; height:0.5px; background:rgba(210,185,140,0.4); margin-bottom:24px; }
.product-desc { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:17px; color:rgba(240,232,216,0.75); line-height:1.8; margin-bottom:32px; }
.product-link { display:inline-block; font-family:'Montserrat',sans-serif; font-weight:400; font-size:9px; letter-spacing:0.35em; text-transform:uppercase; color:rgba(210,185,140,0.9); text-decoration:none; border-bottom:0.5px solid rgba(210,185,140,0.4); padding-bottom:4px; transition:color 0.2s,border-color 0.2s; cursor:pointer; }
.product-link:hover { color:#fff; border-color:rgba(255,255,255,0.6); }
