
:root{
  --black:#0a0a0a;
  --ink:#171513;
  --cream:#f4efe8;
  --paper:#fbf9f5;
  --gold:#c69a58;
  --rose:#c79386;
  --muted:#7d756d;
  --line:#ddd5ca;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,Arial,sans-serif}
a{text-decoration:none;color:inherit}
img{display:block;width:100%}
.announcement{background:var(--black);color:white;text-align:center;padding:8px 16px;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.site-header{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:180px 1fr 100px;align-items:center;gap:20px;padding:18px 32px;background:rgba(251,249,245,.94);backdrop-filter:blur(16px);border-bottom:1px solid rgba(0,0,0,.06)}
.brand{display:flex;flex-direction:column;align-items:center;line-height:1}
.brand-mark{font-family:"Cormorant Garamond",serif;font-size:18px;font-weight:700;letter-spacing:.05em;color:var(--gold)}
.brand-name{font-family:"Cormorant Garamond",serif;font-size:19px;font-weight:600;letter-spacing:.12em}
.brand-sub{font-size:8px;letter-spacing:.33em;margin-top:4px}
.nav{display:flex;justify-content:center;gap:23px;font-size:12px;text-transform:uppercase;letter-spacing:.1em}
.nav a{position:relative;padding:6px 0}
.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--gold);transition:.25s}
.nav a:hover:after{right:0}
.cart-button,.menu-toggle{border:0;background:transparent;text-transform:uppercase;letter-spacing:.1em;cursor:pointer}
.cart-button span{display:inline-flex;align-items:center;justify-content:center;background:var(--black);color:white;border-radius:99px;width:21px;height:21px;margin-left:4px;font-size:10px}
.menu-toggle{display:none;font-size:22px}
.hero{position:relative;min-height:78vh;display:flex;align-items:center;overflow:hidden;background:#090909}
.hero>img{position:absolute;inset:0;height:100%;object-fit:cover;object-position:center}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.28) 52%,rgba(0,0,0,.08) 100%)}
.hero-content{position:relative;z-index:2;color:white;max-width:680px;padding:70px 7vw}
.eyebrow{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:#ead5b2}
.eyebrow.dark{color:#8b6d43}
h1,h2,h3{font-family:"Cormorant Garamond",serif;margin:.2em 0}
h1{font-size:clamp(54px,8vw,108px);line-height:.88;font-weight:500;max-width:760px}
h2{font-size:clamp(42px,5vw,72px);line-height:.95;font-weight:500}
h3{font-size:30px;font-weight:500}
.hero-copy{max-width:520px;line-height:1.7;color:#eee1d4}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border:1px solid transparent;text-transform:uppercase;letter-spacing:.12em;font-size:11px;cursor:pointer;transition:.2s}
.btn-gold{background:var(--gold);color:#111}
.btn-gold:hover{filter:brightness(1.08)}
.btn-ghost{border-color:rgba(255,255,255,.7);color:white}
.btn-black{background:var(--black);color:white}
.btn.full{width:100%}
.intro{max-width:950px;margin:auto;text-align:center;padding:110px 24px}
.intro p:last-child{max-width:700px;margin:24px auto 0;line-height:1.8;color:var(--muted)}
.split{display:grid;grid-template-columns:1.1fr .9fr;min-height:650px;background:#efe8de}
.split.reverse{grid-template-columns:.9fr 1.1fr;background:#f3e7e4}
.split.reverse .media{order:2}
.split.reverse .copy{order:1}
.media img{height:100%;object-fit:cover}
.copy{display:flex;flex-direction:column;justify-content:center;padding:9vw}
.copy p{line-height:1.8;color:#6c625a}
.text-link{margin-top:16px;font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.shop-section{padding:110px 4vw;background:white}
.section-heading{text-align:center;max-width:700px;margin:0 auto 54px}
.section-heading p:last-child{color:var(--muted)}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.product-card{border:1px solid var(--line);background:var(--paper)}
.product-image-wrap{aspect-ratio:1/1;overflow:hidden;background:#eee}
.product-image-wrap img{height:100%;object-fit:cover;transition:transform .45s ease}
.product-card:hover img{transform:scale(1.035)}
.product-info{padding:22px}
.product-kicker{font-size:10px;letter-spacing:.16em;color:var(--muted)}
.product-info h3{font-size:26px}
.price{font-size:14px}
.product-info .btn{width:100%;margin-top:10px}
.custom{padding:100px 6vw;background:#111 url("assets/pour-homme-dark.jpeg") center/cover fixed;position:relative}
.custom:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.72)}
.custom-card{position:relative;z-index:1;max-width:820px;margin:auto;padding:90px 60px;border:1px solid rgba(255,255,255,.24);text-align:center;color:white;background:rgba(0,0,0,.2);backdrop-filter:blur(8px)}
.custom-card p{line-height:1.8;color:#e2d7cc}
.story{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;background:#f0ebe4}
.story-text{padding:9vw}
.story-text p{line-height:1.8;color:var(--muted)}
.story-image img{height:100%;object-fit:cover}
.contact{padding:100px 7vw;text-align:center}
.contact>div{max-width:760px;margin:auto}
.contact p{color:var(--muted)}
.newsletter{max-width:600px;margin:32px auto 0;display:flex}
.newsletter input{flex:1;min-width:0;border:1px solid var(--line);padding:0 18px;font-size:14px;background:white}
.form-message{min-height:24px}
footer{background:#090909;color:#eee;padding:60px 7vw;text-align:center}
.footer-brand{display:flex;flex-direction:column;gap:5px;align-items:center;font-family:"Cormorant Garamond",serif;font-size:24px;letter-spacing:.12em}
.footer-brand span:last-child{font-family:Inter,sans-serif;font-size:8px;letter-spacing:.35em}
.footer-links{display:flex;justify-content:center;gap:22px;flex-wrap:wrap;margin:32px 0;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#c8c0b7}
footer>p{font-size:11px;color:#8f8982}
.cart-panel{position:fixed;z-index:60;right:0;top:0;width:min(430px,92vw);height:100vh;background:white;transform:translateX(100%);transition:.3s;display:flex;flex-direction:column;box-shadow:-16px 0 60px rgba(0,0,0,.16)}
.cart-panel.open{transform:translateX(0)}
.cart-head{display:flex;justify-content:space-between;align-items:center;padding:24px;border-bottom:1px solid var(--line)}
.cart-head h2{font-size:36px;margin:0}
.cart-head button{font-size:32px;border:0;background:none;cursor:pointer}
.cart-items{padding:20px;flex:1;overflow:auto}
.cart-item{display:grid;grid-template-columns:70px 1fr auto;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.cart-item img{width:70px;height:70px;object-fit:cover}
.cart-item h4{margin:0 0 6px;font-family:"Cormorant Garamond",serif;font-size:20px}
.cart-item small{color:var(--muted)}
.remove{border:0;background:none;cursor:pointer;font-size:11px;text-transform:uppercase;text-decoration:underline}
.cart-bottom{padding:24px;border-top:1px solid var(--line)}
.cart-total-row{display:flex;justify-content:space-between;margin-bottom:14px}
.cart-note,.checkout-note{font-size:11px;color:var(--muted);line-height:1.5}
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:50;opacity:0;pointer-events:none;transition:.3s}
.scrim.show{opacity:1;pointer-events:auto}
@media(max-width:1050px){
  .site-header{grid-template-columns:1fr auto auto}
  .menu-toggle{display:block}
  .nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);padding:24px;flex-direction:column;border-top:1px solid var(--line)}
  .nav.open{display:flex}
  .product-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .announcement{font-size:9px}
  .site-header{padding:14px 16px}
  .brand{align-items:flex-start}
  .brand-name{font-size:16px}
  .hero{min-height:72vh}
  .hero-content{padding:50px 24px}
  h1{font-size:58px}
  .intro{padding:80px 22px}
  .split,.split.reverse,.story{grid-template-columns:1fr}
  .split.reverse .media,.split.reverse .copy{order:initial}
  .split .media{min-height:420px}
  .copy,.story-text{padding:70px 24px}
  .product-grid{grid-template-columns:1fr}
  .shop-section{padding:80px 18px}
  .custom{padding:60px 18px;background-attachment:scroll}
  .custom-card{padding:60px 22px}
  .newsletter{flex-direction:column;gap:10px}
  .newsletter input{min-height:48px}
}
