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

:root {
  --ink: #0d0a05;
  --ink2: #1f1a10;
  --ink3: #3a3020;
  --cream: #f5f0e8;
  --gold: #b8974a;
  --gold2: #d4b06a;
  --white: #fffdf8;
  --line: rgba(184,151,74,0.2);
  --fd: 'Cormorant Garamond', serif;
  --fb: 'Jost', sans-serif;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--fb); background:var(--ink); color:var(--white); -webkit-font-smoothing:antialiased; overflow-x:hidden; }

/* CURSOR */
.cursor { width:8px; height:8px; background:var(--gold); border-radius:50%; position:fixed; pointer-events:none; z-index:9999; }
.cursor-ring { width:36px; height:36px; border:1px solid var(--gold); border-radius:50%; position:fixed; pointer-events:none; z-index:9998; opacity:0.5; }

/* NAV */
nav {
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:28px 56px;
  display:flex; align-items:center; justify-content:space-between;
  transition:all 0.4s;
}
nav.scrolled, nav.solid {
  background:rgba(13,10,5,0.96);
  backdrop-filter:blur(16px);
  padding:18px 56px;
  border-bottom:1px solid var(--line);
}
.nav-logo { font-family:var(--fd); font-size:22px; font-weight:600; color:var(--white); letter-spacing:1px; text-decoration:none; }
.nav-logo span { color:var(--gold); font-style:italic; }
.nav-links { display:flex; gap:40px; }
.nav-links a { font-size:11px; font-weight:500; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,0.5); text-decoration:none; transition:color 0.2s; }
.nav-links a:hover, .nav-links a.active { color:var(--gold); }
.nav-btn { border:1px solid var(--gold); color:var(--gold); font-family:var(--fb); font-size:11px; font-weight:500; letter-spacing:2px; text-transform:uppercase; padding:11px 24px; background:transparent; cursor:pointer; text-decoration:none; transition:all 0.25s; }
.nav-btn:hover { background:var(--gold); color:var(--ink); }

/* PAGE HEADER (pour pages internes) */
.page-header {
  padding:160px 56px 80px;
  border-bottom:1px solid var(--line);
  position:relative; overflow:hidden;
}
.page-header::before {
  content:''; position:absolute; inset:0;
  background-image: linear-gradient(rgba(184,151,74,0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(184,151,74,0.05) 1px, transparent 1px);
  background-size:60px 60px;
  mask-image:radial-gradient(ellipse at 30% 50%, black 20%, transparent 70%);
}
.page-header-tag { font-size:10px; font-weight:500; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:16px; }
.page-header h1 { font-family:var(--fd); font-size:clamp(48px,8vw,88px); font-weight:300; line-height:0.95; letter-spacing:-2px; }
.page-header h1 em { font-style:italic; color:var(--gold2); }
.page-header p { font-size:16px; font-weight:300; color:rgba(255,255,255,0.4); margin-top:20px; max-width:480px; line-height:1.7; letter-spacing:0.3px; }

/* COMMUN */
.section-tag { font-size:10px; font-weight:500; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:14px; }
.section-title { font-family:var(--fd); font-size:clamp(36px,5vw,60px); font-weight:300; line-height:1.08; letter-spacing:-1px; margin-bottom:20px; }
.section-title em { font-style:italic; color:var(--gold2); }

.reveal { opacity:0; transform:translateY(28px); transition:all 0.9s cubic-bezier(0.16,1,0.3,1); }
.reveal.visible { opacity:1; transform:none; }

.btn-primary { display:inline-flex; align-items:center; gap:12px; background:var(--gold); color:var(--ink); font-family:var(--fb); font-size:11px; font-weight:600; letter-spacing:2px; text-transform:uppercase; padding:18px 40px; text-decoration:none; transition:all 0.25s; }
.btn-primary:hover { background:var(--gold2); gap:18px; }
.btn-secondary { font-size:11px; font-weight:500; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,0.5); text-decoration:none; border-bottom:1px solid rgba(255,255,255,0.2); padding-bottom:2px; transition:all 0.2s; }
.btn-secondary:hover { color:var(--white); border-color:var(--white); }

.ornament { display:flex; align-items:center; justify-content:center; gap:16px; padding:24px 0; color:var(--gold); opacity:0.4; }
.ornament::before, .ornament::after { content:''; flex:1; height:1px; max-width:180px; }
.ornament::before { background:linear-gradient(90deg, transparent, var(--gold)); }
.ornament::after { background:linear-gradient(90deg, var(--gold), transparent); }

/* FOOTER */
footer { background:#080603; padding:48px 56px; display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--line); }
.footer-logo { font-family:var(--fd); font-size:24px; font-weight:600; letter-spacing:1px; text-decoration:none; color:var(--white); }
.footer-logo span { color:var(--gold); font-style:italic; }
.footer-copy { font-size:11px; font-weight:300; color:rgba(255,255,255,0.2); letter-spacing:1px; }
.footer-links { display:flex; gap:24px; }
.footer-links a { font-size:11px; letter-spacing:1px; text-transform:uppercase; color:rgba(255,255,255,0.3); text-decoration:none; transition:color 0.2s; }
.footer-links a:hover { color:var(--gold); }

/* MODAL */
.ty-modal { display:none; position:fixed; inset:0; background:rgba(13,10,5,0.95); z-index:1000; align-items:center; justify-content:center; padding:24px; backdrop-filter:blur(8px); }
.ty-modal.active { display:flex; }
.ty-box { border:1px solid var(--line); padding:56px 48px; text-align:center; max-width:440px; width:100%; background:var(--ink2); }
.ty-icon { font-size:48px; margin-bottom:16px; }
.ty-title { font-family:var(--fd); font-size:38px; font-weight:300; font-style:italic; color:var(--gold2); margin-bottom:12px; }
.ty-sub { font-size:14px; font-weight:300; color:rgba(255,255,255,0.5); line-height:1.7; margin-bottom:28px; }
.ty-btn { background:var(--gold); color:var(--ink); border:none; font-family:var(--fb); font-size:11px; font-weight:600; letter-spacing:2px; text-transform:uppercase; padding:16px 36px; cursor:pointer; }
.ty-btn:hover { background:var(--gold2); }

/* RESPONSIVE */
@media(max-width:640px) {
  nav, nav.scrolled, nav.solid { padding:18px 24px; }
  .nav-links { display:none; }
  .page-header { padding:120px 24px 60px; }
  footer { flex-direction:column; gap:16px; text-align:center; padding:36px 24px; }
  .footer-links { flex-wrap:wrap; justify-content:center; }
}