/* We Brand U - Ultra Premium Architecture (20K+ Version) */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&family=Space+Grotesk:wght@300;400;500&display=swap');

:root {
    --bg: #030a06;
    --bg-darker: #010402;
    --bg-lighter: #05140b;
    --text: #F4F4F4;
    --gold: #C5A059;
    --gold-dim: rgba(197, 160, 89, 0.5);
    --emerald: #061F11;
    --gap: 2vw;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
body { background-color: var(--bg); color: var(--text); font-family: 'Space Grotesk', sans-serif; overflow-x: hidden; cursor: none; -webkit-font-smoothing: antialiased; }

/* Custom Cursor */
.cursor { position: fixed; top: 0; left: 0; width: 12px; height: 12px; background-color: var(--gold); border-radius: 50%; transform: translate(-50%, -50%); pointer-events: none; z-index: 9999; mix-blend-mode: difference; transition: width 0.3s, height 0.3s, background-color 0.3s; display: flex; justify-content: center; align-items: center; }
.cursor.hover { width: 80px; height: 80px; background-color: transparent; border: 1px solid var(--gold); backdrop-filter: blur(2px); }
.cursor-text { font-family: 'Cinzel', serif; font-size: 12px; color: var(--gold); opacity: 0; transition: opacity 0.3s; letter-spacing: 0.1em; }
.cursor.hover .cursor-text { opacity: 1; }

/* Utilities */
.mt-4 { margin-top: 2vw; }
.mt-8 { margin-top: 4vw; }
.mt-16 { margin-top: 10vw; }
.mb-8 { margin-bottom: 4vw; }
.text-center { text-align: center; }

/* Typography */
h1, h2, h3, h4, .serif { font-family: 'Cinzel', serif; font-weight: 400; }
.huge-text { font-size: 11vw; line-height: 0.8; text-transform: uppercase; letter-spacing: -0.02em; color: var(--gold); }
.massive-text { font-size: 15vw; line-height: 0.8; letter-spacing: -0.05em; color: rgba(197, 160, 89, 0.1); white-space: nowrap; }
.section-label { font-size: 0.8vw; letter-spacing: 0.2em; color: var(--gold-dim); text-transform: uppercase; margin-bottom: 1vw; }
.body-text { font-size: 1.2vw; line-height: 1.8; color: rgba(255, 255, 255, 0.7); }
.drop-cap::first-letter { font-family: 'Cinzel', serif; font-size: 6vw; float: left; line-height: 0.8; padding-right: 1vw; color: var(--gold); }

/* Navigation */
.navbar { position: fixed; top: 0; width: 100%; padding: 2vw 4vw; display: flex; justify-content: space-between; align-items: center; z-index: 100; mix-blend-mode: difference; }
.solid-nav { mix-blend-mode: normal; background: linear-gradient(to bottom, rgba(3,10,6,0.9), transparent); }
.nav-links { display: flex; gap: 3vw; }
.nav-item { color: var(--text); text-decoration: none; font-size: 0.8rem; letter-spacing: 0.2em; text-transform: uppercase; transition: color 0.3s; }
.nav-item:hover { color: var(--gold); }
.logo { font-family: 'Cinzel', serif; font-size: 1.5rem; letter-spacing: 0.2em; color: var(--gold); text-decoration: none; }

/* Buttons */
.btn-discover { display: inline-block; padding-bottom: 0.5vw; border-bottom: 1px solid var(--gold); color: var(--gold); text-decoration: none; font-size: 0.8vw; letter-spacing: 0.2em; text-transform: uppercase; transition: color 0.3s, border-color 0.3s; cursor: none; background: none; border-top: none; border-left: none; border-right: none; }
.btn-discover:hover { color: var(--text); border-color: var(--text); }
.btn-submit { background: var(--gold); color: var(--bg); border: none; padding: 1.5vw 3vw; font-size: 1vw; cursor: none; transition: 0.3s; text-transform: uppercase; letter-spacing: 0.1em;}

/* Marquee */
.marquee {
    overflow: hidden;
    padding: 3vw 0;
    white-space: nowrap;
    display: flex;
    align-items: center;
}
.marquee-track {
    display: flex;
    font-family: 'Cinzel', serif;
    font-size: 5vw;
    letter-spacing: 0.05em;
    width: max-content;
}
.btn-submit:hover { background: var(--text); }

/* Heroes */
.hero { height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; overflow: hidden; }
.hero-img-wrapper { position: absolute; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 1; }
.hero-img { width: 100%; height: 100%; object-fit: cover; filter: brightness(0.8); transform: scale(1.1); }
.hero-title { position: relative; z-index: 2; text-align: center; color: #fff; mix-blend-mode: overlay; }
.scroll-indicator { position: absolute; bottom: 3vw; left: 50%; transform: translateX(-50%); z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 1vw; }
.scroll-line { width: 1px; height: 50px; background: linear-gradient(to bottom, var(--gold), transparent); }

.subpage-hero { height: 80vh; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.subpage-hero::after { content: ''; position: absolute; top:0; left:0; width:100%; height:100%; background: linear-gradient(to bottom, transparent, var(--bg)); z-index: 2; }
.subpage-title { position: relative; z-index: 3; text-align: center; font-size: 9vw; }

/* Grids & Layouts */
.text-block-section { padding: 15vw 4vw; display: flex; justify-content: center; position: relative; }
.text-container { width: 50%; text-align: center; }
.text-container.wide { width: 70%; }
.full-img-section { width: 100vw; height: 100vh; overflow: hidden; margin: 5vw 0; position: relative; }
.full-img-section img { width: 100%; height: 100%; object-fit: cover; }

.split-section { display: flex; padding: 10vw 4vw; gap: 8vw; align-items: center; min-height: 100vh; }
.split-section.reverse { flex-direction: row-reverse; }
.split-img { width: 50%; height: 90vh; overflow: hidden; position: relative; }
.split-img img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.1); }
.split-content { width: 50%; padding: 4vw; }

/* Heritage Timeline (Robust) */
.timeline-section { display: flex; padding: 10vw 4vw; gap: 6vw; position: relative; }
.timeline-left { width: 40%; position: relative; }
.timeline-sticky { position: sticky; top: 20vh; height: 60vh; display: flex; flex-direction: column; justify-content: center; }
.timeline-right { width: 60%; display: flex; flex-direction: column; gap: 20vh; padding-top: 10vh; padding-bottom: 20vh; }
.timeline-block { display: flex; flex-direction: column; gap: 2vw; }
.timeline-img-wrapper { width: 100%; height: 60vh; overflow: hidden; }
.timeline-img-wrapper img { width: 100%; height: 100%; object-fit: cover; }
.year-marker { font-size: 8vw; color: rgba(197, 160, 89, 0.2); line-height: 0.8; margin-bottom: 1vw; }

/* Product Deep Dive (Robust) */
.product-view { display: flex; padding: 15vh 4vw 0vw 4vw; gap: 6vw; min-height: 100vh; }
.product-visual { width: 50%; position: relative; }
.sticky-product-img { position: sticky; top: 15vh; height: 80vh; width: 100%; overflow: hidden; }
.sticky-product-img img { width: 100%; height: 100%; object-fit: cover; }
.product-data { width: 50%; padding-top: 5vh; padding-bottom: 15vh; }
.product-title { font-size: 5vw; color: var(--text); margin-bottom: 1vw; line-height: 1; }
.specs-list { margin-top: 5vw; border-top: 1px solid rgba(255,255,255,0.1); }
.spec-item { display: flex; justify-content: space-between; padding: 2vw 0; border-bottom: 1px solid rgba(255,255,255,0.1); }
.spec-label { font-size: 1vw; color: var(--gold-dim); text-transform: uppercase; letter-spacing: 0.1em; }
.spec-val { font-size: 1.2vw; font-family: 'Cinzel', serif; }

.gallery-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2vw; padding: 5vw 4vw; }
.gallery-item { width: 100%; height: 60vh; overflow: hidden; }
.gallery-item.large { grid-column: 1 / -1; height: 90vh; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(30%); transition: 1s; }
.gallery-item:hover img { filter: grayscale(0%); transform: scale(1.05); }

/* Collection Filters & Grid */
.collection-header { padding: 20vh 4vw 5vw 4vw; text-align: center; }
.filters { display: flex; justify-content: center; gap: 3vw; margin-top: 4vw; }
.filter-btn { background: none; border: none; color: rgba(255,255,255,0.4); font-family: 'Space Grotesk'; font-size: 0.9vw; letter-spacing: 0.2em; text-transform: uppercase; cursor: none; transition: 0.3s; }
.filter-btn.active, .filter-btn:hover { color: var(--gold); }
.collection-grid-section { padding: 0 4vw 10vw 4vw; }
.collection-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6vw 4vw; }
.collection-item { text-decoration: none; color: inherit; cursor: none; display: flex; flex-direction: column; align-items: center; text-align: center; }
.col-img-wrapper { width: 100%; aspect-ratio: 4/5; overflow: hidden; margin-bottom: 2vw; background: var(--bg-lighter); padding: 4vw; display: flex; justify-content: center; align-items: center; }
.col-img-wrapper img { width: 100%; height: 100%; object-fit: cover; transition: 1s; box-shadow: 0 20px 50px rgba(0,0,0,0.5); }
.collection-item:hover .col-img-wrapper img { transform: scale(1.05) translateY(-20px); }
.collection-item h3 { font-size: 2vw; color: var(--gold); margin-bottom: 0.5vw; }

/* Interactive Journal (Robust) */
.journal-featured { padding: 15vh 4vw 5vw 4vw; }
.featured-card { position: relative; width: 100%; height: 80vh; overflow: hidden; text-decoration: none; display: block; cursor: none; }
.featured-card img { width: 100%; height: 100%; object-fit: cover; transition: 1s; filter: brightness(0.7); }
.featured-card:hover img { transform: scale(1.05); filter: brightness(0.5); }
.featured-content { position: absolute; bottom: 0; left: 0; width: 100%; padding: 4vw; z-index: 2; background: linear-gradient(transparent, rgba(0,0,0,0.9)); }

/* Journal Image Fix: Replace following image with a static elegant reveal */
.journal-list { padding: 5vw 4vw 15vw 4vw; display: flex; flex-direction: column; }
.journal-list-item { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    padding: 4vw 0; 
    border-bottom: 1px solid rgba(255,255,255,0.1); 
    text-decoration: none; 
    color: var(--text); 
    cursor: none; 
    transition: 0.4s ease; 
}
.journal-list-item h3 { font-size: 3vw; transition: 0.4s ease; transform-origin: left; }
.journal-list-item:hover h3 { color: var(--gold); transform: scale(1.05); }
.journal-list-item .journal-date { transition: 0.4s ease; }
.journal-list-item:hover .journal-date { color: var(--text); }
.journal-hover-img { display: none !important; }

/* Article Page */
.article-content { max-width: 800px; margin: 0 auto; padding: 5vw 4vw 15vw 4vw; }
.article-content p { font-size: 1.2vw; line-height: 2; color: rgba(255,255,255,0.8); margin-bottom: 3vw; }
.article-quote { font-family: 'Cinzel', serif; font-size: 3vw; color: var(--gold); line-height: 1.2; text-align: center; margin: 8vw 0; border-top: 1px solid rgba(197,160,89,0.3); border-bottom: 1px solid rgba(197,160,89,0.3); padding: 4vw 0; }

/* Concierge (Robust) */
.concierge-view { display: flex; padding: 20vh 4vw 10vw 4vw; gap: 8vw; }
.concierge-left { width: 50%; }
.concierge-right { width: 50%; }
.boutique-locations { border-top: 1px solid rgba(255,255,255,0.1); margin-top: 4vw; padding-top: 4vw; }
.location-item { margin-bottom: 4vw; }
.location-item p.serif { color: var(--gold); font-size: 2vw; margin-bottom: 0.5vw; }
.services-list { margin-top: 6vw; display: flex; flex-direction: column; gap: 2vw; }
.service-item { display: flex; gap: 2vw; align-items: flex-start; }
.service-icon { font-family: 'Cinzel'; color: var(--gold); font-size: 2vw; line-height: 1; }
.form-container { background: var(--bg-lighter); padding: 5vw; border: 1px solid rgba(255,255,255,0.05); }
.form-group { margin-bottom: 4vw; }
.form-container input, .form-container select, .form-container textarea { width: 100%; background: transparent; border: none; border-bottom: 1px solid rgba(255,255,255,0.2); color: var(--text); font-family: 'Space Grotesk'; font-size: 1.2vw; padding: 1vw 0; outline: none; transition: 0.3s; cursor: none; }
.form-container input:focus, .form-container select:focus, .form-container textarea:focus { border-color: var(--gold); }
.form-container select { appearance: none; color: rgba(255,255,255,0.5); }
.form-container select option { background: var(--bg); color: var(--text); }

/* Horizontal Scroll (Collection Shop Home) */
.horizontal-scroll-wrapper { width: 100vw; height: 100vh; overflow: hidden; background: var(--emerald); position: relative; }
.horizontal-container { display: flex; width: 400vw; height: 100%; }
.panel { width: 100vw; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0 10vw; position: relative; }
.intro-panel { flex-direction: column; align-items: flex-start; }
.product-panel { gap: 6vw; cursor: none; }
.product-img-wrapper { width: 40vw; height: 75vh; overflow: hidden; background: var(--bg-darker); display: flex; justify-content: center; align-items: center; }
.product-img-wrapper img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(80%); transition: filter 1s, transform 1s; }
.product-panel:hover .product-img-wrapper img { filter: grayscale(0%); transform: scale(1.05); }
.product-info { width: 30vw; }

/* The Craft (Pinned) */
.craft-section { display: flex; padding: 10vw 4vw; gap: 4vw; position: relative; }
.craft-left { width: 50%; display: flex; flex-direction: column; }
.craft-right { width: 50%; height: 100vh; position: relative; }
.craft-img-wrapper { width: 100%; height: 80vh; overflow: hidden; position: sticky; top: 10vh; }
.craft-img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.1); }
.craft-text-block { height: 100vh; display: flex; flex-direction: column; justify-content: center; padding-right: 4vw; }
.craft-text-block h2 { font-size: 3.5vw; margin-bottom: 2vw; color: var(--text); }

/* Footers */
footer { padding: 10vw 4vw 2vw 4vw; display: flex; flex-direction: column; gap: 5vw; background: var(--bg-darker); }
.footer-top { text-align: center; }
.footer-bottom { display: flex; justify-content: space-between; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 3vw; }
.footer-col { display: flex; flex-direction: column; gap: 1vw; }
.footer-col p, .footer-col a { font-size: 1vw; color: rgba(255,255,255,0.6); text-decoration: none; transition: 0.3s; cursor: none; }
.footer-col a:hover { color: var(--gold); }
.social-links { flex-direction: row; gap: 3vw; }
.by-weteam { font-family: 'Space Grotesk', sans-serif; font-size: 0.7vw; letter-spacing: 0.3em; color: rgba(255, 255, 255, 0.3); text-transform: uppercase; margin-top: 4vw; text-align: center; border-top: 1px solid rgba(255, 255, 255, 0.05); padding-top: 2vw; }

/* Bespoke / Lifestyle Overlay */
.bespoke-section { position: relative; width: 100vw; height: 100vh; display: flex; align-items: center; justify-content: center; margin: 5vw 0; overflow: hidden; margin-left: calc(-50vw + 50%); }
.bespoke-bg { position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 1; }
.bespoke-bg img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.1);}
.bespoke-overlay { position: absolute; top:0; left:0; width:100%; height:100%; background: rgba(3, 10, 6, 0.7); z-index: 2;}
.bespoke-content { position: relative; z-index: 3; text-align: center; width: 80%; display: flex; flex-direction: column; align-items: center; }