/* RubyDress — Chanel-inspired minimal */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&family=Inter:wght@200;300;400;500&display=swap');

:root{--gold:#C9A96E;--black:#000;--white:#fff;--muted:#666;--border:#e8e3da;--cream:#faf8f5}
body{font-family:'Inter',sans-serif;color:#000;background:#fff;line-height:1.6;margin:0;-webkit-font-smoothing:antialiased}
a{color:#000;text-decoration:none;transition:color .3s}
a:hover{color:var(--gold)}
img{max-width:100%;display:block}
h1,h2,h3{font-family:'Playfair Display',serif;font-weight:600;line-height:1.15;margin:0}
h1{font-size:clamp(1.8rem,4vw,2.6rem)}
h2{font-size:clamp(1.4rem,3vw,2rem)}
h3{font-size:clamp(1.1rem,2vw,1.4rem)}
p{font-size:.9rem;color:#444;line-height:1.8}
.container{max-width:1200px;margin:0 auto;padding:0 24px}

/* Nav — ultra-minimal */
.navbar{background:#fff;border-bottom:none;padding:20px 0;position:fixed;top:0;width:100%;z-index:100;transition:box-shadow .3s}
.navbar.scrolled{box-shadow:0 1px 20px rgba(0,0,0,.06)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:0 auto;padding:0 24px}
.nav-brand{font-family:'Playfair Display',serif;font-size:22px;letter-spacing:5px;text-transform:uppercase;color:#000}
.nav-links{display:flex;gap:32px;list-style:none;margin:0;padding:0}
.nav-links a{font-size:12.5px;letter-spacing:2px;text-transform:uppercase;color:#666;font-weight:400}
.nav-links a:hover,.nav-links a.active{color:var(--gold)}

/* Section */
.sec{padding:90px 0}
.sec-label{font-size:10px;letter-spacing:4px;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
.sec-title{margin-bottom:12px}
.sec-line{width:40px;height:1px;background:var(--gold);margin-bottom:24px}
.sec .lead{max-width:640px;font-size:.95rem;color:var(--muted)}

/* Full-bleed hero */
.hero{position:relative;height:100vh;min-height:600px;overflow:hidden;margin-top:-80px}
.hero img{width:100%;height:100%;object-fit:cover;filter:brightness(.45)}
.hero .hero-text{position:absolute;bottom:12%;left:50%;transform:translateX(-50%);text-align:center;color:#fff;width:90%;max-width:700px}
.hero .hero-text h1{font-size:clamp(2rem,6vw,4rem);letter-spacing:8px;text-transform:uppercase;color:#fff;font-weight:600}
.hero .hero-text .hl{width:60px;height:1px;background:var(--gold);margin:20px auto}
.hero .hero-text p{color:rgba(255,255,255,.8);font-size:.9rem;letter-spacing:2px;margin-bottom:24px;font-weight:300}
.hero .hero-text .btn{display:inline-block;border:1px solid rgba(255,255,255,.5);color:#fff;padding:12px 36px;font-size:10px;letter-spacing:3px;text-transform:uppercase;transition:all .4s}
.hero .hero-text .btn:hover{background:var(--gold);border-color:var(--gold);color:#000}

/* Grid */
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.pcard{position:relative;overflow:hidden;cursor:pointer}
.pcard img{width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform .7s}
.pcard:hover img{transform:scale(1.03)}
.pcard .plabel{position:absolute;bottom:0;left:0;right:0;padding:16px;background:linear-gradient(transparent,rgba(0,0,0,.65));color:#fff}
.pcard .plabel small{font-size:9px;letter-spacing:2px;text-transform:uppercase;opacity:.7}
.pcard .plabel h5{font-family:'Playfair Display',serif;font-size:.95rem;margin:3px 0 0;font-weight:600}

/* CTA strip */
.cta{background:#000;color:#fff;text-align:center;padding:80px 0}
.cta h3{color:#fff;font-size:1.5rem;margin-bottom:8px}
.cta p{color:#999;font-size:.85rem;margin-bottom:20px}
.cta .btn{display:inline-block;background:var(--gold);color:#fff;padding:12px 36px;font-size:10px;letter-spacing:3px;text-transform:uppercase;border:2px solid var(--gold);transition:all .3s}
.cta .btn:hover{background:#fff;color:#000;border-color:#fff}

/* Footer */
.ftr{background:#000;color:#fff;padding:50px 0 30px}
.ftr-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;max-width:1000px;margin:0 auto;padding:0 24px}
.ftr h4{color:#fff;font-size:12px;letter-spacing:2px;text-transform:uppercase;margin-bottom:12px}
.ftr a{color:#888;font-size:13px;display:block;margin:5px 0;transition:color .3s}
.ftr a:hover{color:var(--gold)}
.ftr-copy{color:#444;font-size:11px;text-align:center;padding-top:24px;margin-top:24px;border-top:1px solid #222}

/* Timeline */
.tl{position:relative;padding:20px 0}
.tl::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--border);transform:translateX(-50%)}
.tl-item{position:relative;margin-bottom:30px}
.tl-item:nth-child(odd) .tl-card{margin-left:auto;margin-right:60px;text-align:right}
.tl-item:nth-child(even) .tl-card{margin-left:60px}
.tl-card{width:40%;padding:20px 24px;background:#fff;border:1px solid var(--border)}
.tl-card .yr{color:var(--gold);font-family:'Playfair Display',serif;font-size:1.1rem;font-weight:700}
.tl-card h5{font-size:.9rem;margin:3px 0}
.tl-card p{font-size:.8rem;color:var(--muted);margin:0}
.tl-dot{position:absolute;left:50%;top:14px;transform:translateX(-50%);width:8px;height:8px;background:var(--gold);border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 2px var(--gold);z-index:1}

@media(max-width:768px){
.grid2,.grid3,.grid4{grid-template-columns:repeat(2,1fr)}
.nav-links{display:none}
.hero .hero-text h1{font-size:1.8rem;letter-spacing:4px}
.tl::before{left:20px}.tl-dot{left:20px}.tl-card{width:80%!important;margin:0 0 0 40px!important;text-align:left!important}
.ftr-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){.grid2,.grid3,.grid4{grid-template-columns:1fr}.ftr-grid{grid-template-columns:1fr}}