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

:root {
  --black:  #06040a;
  --deep:   #0b0810;
  --card:   #12101e;
  --raise:  #1a1728;
  --rim:    rgba(201,169,110,0.12);
  --rim2:   rgba(201,169,110,0.25);
  --gold:        #c9a96e;
  --gold-mid:    #d9b87c;
  --gold-light:  #e8c98a;
  --gold-subtle: rgba(201,169,110,0.07);
  --gold-glow:   rgba(201,169,110,0.15);
  --white:  #f5f0e8;
  --muted:  rgba(245,240,232,0.55);
  --ghost:  rgba(245,240,232,0.14);
  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans:  'DM Sans', system-ui, sans-serif;
  --ease:  cubic-bezier(0.4,0,0.2,1);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
  background:var(--black); color:var(--white);
  font-family:var(--sans); font-weight:300;
  line-height:1.7; overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
button { font-family:var(--sans); }

/* noise */
body::after {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:9990;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");
  opacity:0.025; mix-blend-mode:overlay;
}

/* scrollbar */
::-webkit-scrollbar { width:3px; }
::-webkit-scrollbar-track { background:var(--black); }
::-webkit-scrollbar-thumb { background:var(--gold); border-radius:2px; }

/* cursor */
@media(pointer:fine) {
  body { cursor:none; }
  #cur { width:8px; height:8px; background:var(--gold); border-radius:50%; position:fixed; pointer-events:none; z-index:9999; transform:translate(-50%,-50%); mix-blend-mode:screen; transition:width .2s,height .2s; }
  #cur-ring { width:36px; height:36px; border:1px solid rgba(201,169,110,0.3); border-radius:50%; position:fixed; pointer-events:none; z-index:9998; transform:translate(-50%,-50%); }
  body.lh #cur { width:16px; height:16px; }
  body.lh #cur-ring { width:48px; height:48px; border-color:rgba(201,169,110,0.55); }
}

/* ── NAV ── */
#nav {
  position:fixed; top:0; left:0; right:0; z-index:800;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 60px; gap:24px;
  transition:padding .4s var(--ease), background .4s, border-color .4s;
  border-bottom:1px solid transparent;
}
#nav.stuck {
  background:rgba(6,4,10,0.93);
  backdrop-filter:blur(28px); -webkit-backdrop-filter:blur(28px);
  border-bottom-color:var(--rim);
  padding:12px 60px;
}
/* Logo SVG */
.logo-wrap { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.logo-mark {
  width:36px; height:36px; flex-shrink:0;
  transition:transform .3s var(--ease);
}
.logo-wrap:hover .logo-mark { transform:rotate(15deg); }
.logo-text-wrap { display:flex; flex-direction:column; line-height:1; }
.logo-name { font-family:var(--serif); font-size:20px; font-weight:400; letter-spacing:0.22em; color:var(--white); }
.logo-sub { font-size:7.5px; font-weight:500; letter-spacing:0.28em; text-transform:uppercase; color:var(--gold); margin-top:2px; }

.nav-links { display:flex; align-items:center; gap:28px; list-style:none; }
.nav-links a {
  font-size:11px; font-weight:400; letter-spacing:0.13em; text-transform:uppercase;
  color:var(--muted); position:relative; padding:4px 0;
  transition:color .25s;
}
.nav-links a::after {
  content:''; position:absolute; bottom:0; left:0; width:0; height:1px;
  background:var(--gold); transition:width .3s var(--ease);
}
.nav-links a:hover,.nav-links a.active { color:var(--white); }
.nav-links a:hover::after,.nav-links a.active::after { width:100%; }

.nav-cta {
  font-size:11px; font-weight:500; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--black); padding:10px 22px; flex-shrink:0;
  background:linear-gradient(135deg,var(--gold),var(--gold-light));
  border:none; display:inline-block; white-space:nowrap;
  clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);
  box-shadow:0 4px 20px rgba(201,169,110,0.28);
  transition:opacity .2s, transform .2s, box-shadow .2s;
}
.nav-cta:hover { opacity:.88; transform:translateY(-2px); box-shadow:0 8px 32px rgba(201,169,110,0.42); }

.hb { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; flex-shrink:0; }
.hb span { display:block; height:1px; background:var(--white); transition:all .3s var(--ease); }
.hb span:nth-child(1) { width:22px; }
.hb span:nth-child(2) { width:16px; }
.hb span:nth-child(3) { width:22px; }
.hb.open span:nth-child(1) { transform:rotate(45deg) translate(4px,4px); width:22px; }
.hb.open span:nth-child(2) { opacity:0; }
.hb.open span:nth-child(3) { transform:rotate(-45deg) translate(4px,-4px); width:22px; }

.mob-nav {
  position:fixed; inset:0; z-index:700;
  background:rgba(6,4,10,0.97); backdrop-filter:blur(32px);
  display:none; flex-direction:column; align-items:center; justify-content:center; gap:4px;
}
.mob-nav.open { display:flex; }
.mob-nav a { font-family:var(--serif); font-size:clamp(26px,5vw,42px); font-weight:300; color:var(--white); letter-spacing:0.06em; padding:10px 0; transition:color .2s; }
.mob-nav a:hover { color:var(--gold); }
.mob-cta { margin-top:20px !important; font-family:var(--sans) !important; font-size:11px !important; font-weight:500 !important; letter-spacing:0.12em !important; text-transform:uppercase; background:linear-gradient(135deg,var(--gold),var(--gold-light)); color:var(--black) !important; padding:14px 40px !important; clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%); }

/* ── SECTIONS ── */
section { padding:110px 60px; }

.eyebrow {
  display:inline-flex; align-items:center; gap:10px;
  font-size:10px; font-weight:500; letter-spacing:0.26em; text-transform:uppercase;
  color:var(--gold); margin-bottom:16px;
}
.eyebrow::before { content:''; display:inline-block; width:24px; height:1px; background:var(--gold); }
.eyebrow::after { content:'✦'; font-size:8px; }

h2.display {
  font-family:var(--serif);
  font-size:clamp(34px,5vw,68px);
  font-weight:300; line-height:1.05; letter-spacing:-0.01em;
}
h2.display em { font-style:italic; color:var(--gold); }

/* ── BUTTONS ── */
.btn { display:inline-flex; align-items:center; gap:9px; font-size:11px; font-weight:500; letter-spacing:0.12em; text-transform:uppercase; padding:15px 32px; border:none; cursor:pointer; transition:transform .2s,box-shadow .2s,opacity .2s; }
.btn svg { width:14px; height:14px; flex-shrink:0; }

.btn-gold { background:linear-gradient(135deg,var(--gold),var(--gold-light)); color:var(--black); box-shadow:0 6px 24px rgba(201,169,110,0.3); clip-path:polygon(10px 0%,100% 0%,calc(100% - 10px) 100%,0% 100%); }
.btn-gold:hover { transform:translateY(-3px); box-shadow:0 12px 36px rgba(201,169,110,0.42); }

.btn-rim { background:transparent; color:var(--gold); border:1px solid var(--rim2); clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%); }
.btn-rim:hover { background:var(--gold-subtle); color:var(--white); border-color:var(--gold); transform:translateY(-2px); }

.btn-wa { background:#22c55e; color:#fff; box-shadow:0 6px 20px rgba(34,197,94,0.28); clip-path:polygon(10px 0%,100% 0%,calc(100% - 10px) 100%,0% 100%); }
.btn-wa:hover { transform:translateY(-3px); box-shadow:0 12px 32px rgba(34,197,94,0.4); }

/* ── CARDS ── */
.card { background:var(--card); border:1px solid var(--rim); position:relative; overflow:hidden; transition:transform .3s var(--ease),border-color .3s,box-shadow .3s; }
.card::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,var(--gold-subtle),transparent 60%); opacity:0; transition:opacity .3s; }
.card:hover { transform:translateY(-5px); border-color:var(--rim2); box-shadow:0 20px 56px rgba(201,169,110,0.1); }
.card:hover::before { opacity:1; }

/* ── MARQUEE ── */
.marquee-belt { overflow:hidden; padding:13px 0; background:var(--deep); border-top:1px solid var(--rim); border-bottom:1px solid var(--rim); }
.marquee-track { display:flex; white-space:nowrap; animation:marquee 26s linear infinite; }
.marquee-track:hover { animation-play-state:paused; }
.mi { display:inline-flex; align-items:center; gap:12px; padding:0 30px; font-size:10px; font-weight:400; letter-spacing:0.2em; text-transform:uppercase; color:var(--muted); flex-shrink:0; }
.gem { width:4px; height:4px; background:var(--gold); transform:rotate(45deg); display:inline-block; flex-shrink:0; }

/* ── DIVIDER ── */
.divider { height:1px; margin:0 60px; background:linear-gradient(90deg,transparent,var(--rim2),var(--gold),var(--rim2),transparent); }

/* ── WA FLOAT ── */
.wa-float { position:fixed; bottom:24px; right:24px; z-index:600; width:54px; height:54px; background:#22c55e; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 20px rgba(34,197,94,0.4); animation:pulse-wa 3s ease-in-out infinite; transition:transform .2s; }
.wa-float:hover { transform:scale(1.1); animation-play-state:paused; }
.wa-float svg { width:25px; height:25px; fill:white; }

/* ── FOOTER ── */
footer { background:var(--deep); border-top:1px solid var(--rim); }
.foot-top { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:44px; padding:64px 60px 44px; }
.foot-brand { font-family:var(--serif); font-size:28px; font-weight:300; letter-spacing:0.2em; margin-bottom:12px; }
.foot-brand span { color:var(--gold); }
.foot-desc { font-size:13px; color:var(--muted); line-height:1.85; max-width:270px; }
.foot-social { display:flex; gap:10px; margin-top:18px; }
.foot-social a { width:32px; height:32px; border:1px solid var(--rim); display:flex; align-items:center; justify-content:center; transition:border-color .2s,background .2s; }
.foot-social a:hover { border-color:var(--gold); background:var(--gold-subtle); }
.foot-social svg { width:13px; height:13px; stroke:var(--muted); fill:none; stroke-width:1.5; transition:stroke .2s; }
.foot-social a:hover svg { stroke:var(--gold); }
.foot-col-h { font-size:10px; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:16px; }
.foot-links { list-style:none; display:flex; flex-direction:column; gap:9px; }
.foot-links a { font-size:13px; color:var(--muted); transition:color .2s; }
.foot-links a:hover { color:var(--white); }
.foot-bot { padding:18px 60px; border-top:1px solid var(--rim); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; }
.foot-copy,.foot-made { font-size:12px; color:var(--ghost); }
.foot-made span { color:var(--gold); }

/* ── PAGE HERO ── */
.page-hero { min-height:52vh; padding:140px 60px 72px; position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; }
.ph-bg { position:absolute; inset:0; background:radial-gradient(ellipse 80% 60% at 65% 35%,rgba(201,169,110,0.1),transparent 70%),radial-gradient(ellipse 40% 50% at 15% 80%,rgba(201,169,110,0.05),transparent 60%); }
.ph-grid { position:absolute; inset:0; background-image:linear-gradient(var(--rim) 1px,transparent 1px),linear-gradient(90deg,var(--rim) 1px,transparent 1px); background-size:68px 68px; mask-image:radial-gradient(ellipse at 50% 100%,black 20%,transparent 80%); }

/* ── REVEAL ── */
.reveal { opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease),transform .7s var(--ease); }
.reveal.in { opacity:1; transform:translateY(0); }
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.d4{transition-delay:.4s}

/* ── KEYFRAMES ── */
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes fadeUp { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
@keyframes pulse-wa { 0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,0.5)} 50%{box-shadow:0 0 0 12px rgba(34,197,94,0)} }
@keyframes spin-slow { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes twinkle { 0%,100%{opacity:.3;transform:scale(.8)} 50%{opacity:1;transform:scale(1.2)} }

/* ── RESPONSIVE ── */
@media(max-width:1100px) {
  #nav,#nav.stuck { padding-left:32px; padding-right:32px; }
  section { padding:80px 32px; }
  .foot-top { grid-template-columns:1fr 1fr; gap:32px; padding:48px 32px 36px; }
  .foot-bot { padding:16px 32px; }
  .page-hero { padding:120px 32px 60px; }
  .divider { margin:0 32px; }
}
@media(max-width:768px) {
  #nav { padding:14px 20px; }
  #nav.stuck { padding:10px 20px; }
  .nav-links,.nav-cta { display:none; }
  .hb { display:flex; }
  section { padding:60px 20px; }
  h2.display { font-size:clamp(28px,7vw,44px); }
  .foot-top { grid-template-columns:1fr; gap:26px; padding:36px 20px 22px; }
  .foot-bot { padding:14px 20px; flex-direction:column; text-align:center; }
  .page-hero { min-height:40vh; padding:100px 20px 44px; }
  .divider { margin:0 20px; }
  .wa-float { bottom:18px; right:18px; width:48px; height:48px; }
  .btn { padding:13px 26px; }
}