/* Enthos — shared styles (Nocturne, step 6 spec).
   Tokens mirror design-system/enthos-tokens.css; font URLs resolve relative to this file. */

/* ---------- Fonts (self-hosted, latin + latin-ext) ---------- */
@font-face { font-family:'Cormorant Garamond'; font-style:normal; font-weight:300; font-display:swap; src:url("fonts/cormorant-garamond-latin.woff2") format('woff2'); }
@font-face { font-family:'Cormorant Garamond'; font-style:normal; font-weight:400; font-display:swap; src:url("fonts/cormorant-garamond-latin.woff2") format('woff2'); }
@font-face { font-family:'Cormorant Garamond'; font-style:normal; font-weight:500; font-display:swap; src:url("fonts/cormorant-garamond-latin.woff2") format('woff2'); }
@font-face { font-family:'Cormorant Garamond'; font-style:normal; font-weight:600; font-display:swap; src:url("fonts/cormorant-garamond-latin.woff2") format('woff2'); }
@font-face { font-family:'Cormorant Garamond'; font-style:italic; font-weight:400; font-display:swap; src:url("fonts/cormorant-garamond-italic-latin.woff2") format('woff2'); }
@font-face { font-family:'Cormorant Garamond'; font-style:italic; font-weight:500; font-display:swap; src:url("fonts/cormorant-garamond-italic-latin.woff2") format('woff2'); }
@font-face { font-family:'Karla'; font-style:normal; font-weight:400; font-display:swap; src:url("fonts/karla-latin.woff2") format('woff2'); }
@font-face { font-family:'Karla'; font-style:normal; font-weight:600; font-display:swap; src:url("fonts/karla-latin.woff2") format('woff2'); }
@font-face { font-family:'Karla'; font-style:normal; font-weight:700; font-display:swap; src:url("fonts/karla-latin.woff2") format('woff2'); }

:root {
  --e-base: #16130F; --e-raised: #221D17; --e-deepest: #100E0B; --e-vitrine: #0D0B09;
  --e-bone: #F2ECDF; --e-palest: #F7F2E7; --e-clay: #E5D2C4;
  --e-cream: #EDE6D6; --e-body-dark: #C9BFA9; --e-soft-dark: #A79C86; --e-muted-dark: #8F856F;
  --e-ink: #2B241B; --e-body-light: #4A4438; --e-soft-light: #544B3C; --e-muted-light: #6B5F4D;
  --e-gold: #C9A45E; --e-gold-bright: #E0BE7C; --e-gold-deep: #7A5E22;
  --e-burnt: #9C4F1C; --e-clay-ink: #3A2418; --e-clay-body: #54402F;
  --e-rule-dark: rgba(201,164,94,0.30); --e-rule-light: rgba(122,94,34,0.40); --e-rule-clay: rgba(156,79,28,0.50);
  --e-glow-dark: radial-gradient(circle, rgba(201,164,94,0.11) 0%, rgba(201,164,94,0) 60%);
  --e-glow-light: radial-gradient(circle, rgba(201,164,94,0.22) 0%, rgba(201,164,94,0) 62%);
  --e-hero: clamp(2.6rem, 5.2vw, 3.4rem);
  --e-hero-sub: clamp(1.15rem, 2vw, 1.45rem);
  --e-statement: clamp(2rem, 4.2vw, 2.75rem);
  --e-h2: clamp(1.9rem, 3.6vw, 2.4rem);
  --e-cs-title: clamp(2rem, 4vw, 2.6rem);
  --e-cs-name: clamp(1.4rem, 2.4vw, 1.7rem);
  --e-lede: clamp(1.25rem, 2vw, 1.5rem);
  --e-body: 1rem;
  --e-eyebrow: 0.69rem;
  --e-label: 0.81rem;
  --e-radius: 2px;
  --e-section-pad: clamp(3.5rem, 6vw, 4.5rem) clamp(1.5rem, 6vw, 5.25rem);
}

/* ---------- Base ---------- */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--e-base); font-family:'Karla',sans-serif; overflow-x:hidden;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
a { color:var(--e-gold); text-decoration:none; transition:color .25s ease; }
a:hover { color:var(--e-gold-bright); }
::selection { background:var(--e-gold); color:var(--e-base); }
img { max-width:100%; height:auto; }
.serif { font-family:'Cormorant Garamond',serif; }

/* ---------- Shared components ---------- */
.eyebrow { font-family:'Karla',sans-serif; font-size:var(--e-eyebrow); font-weight:600;
  letter-spacing:0.30em; text-transform:uppercase; }
.sec { position:relative; min-height:100vh; display:flex; align-items:center;
  justify-content:center; overflow:hidden; padding:var(--e-section-pad); }
.sec-inner { position:relative; z-index:2; width:100%; max-width:960px; }
.enso { position:absolute; pointer-events:none; user-select:none; will-change:transform; }
.glow { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  pointer-events:none; border-radius:50%; }
.btn-gold { display:inline-flex; align-items:center; gap:.6rem; background:var(--e-gold);
  color:var(--e-base); font-weight:600; font-size:.95rem; letter-spacing:.02em;
  padding:.95rem 2.4rem; border-radius:var(--e-radius); min-height:44px; }
.btn-gold:hover { background:var(--e-gold-bright); color:var(--e-base); }

/* ---------- Top bar ---------- */
.topbar { position:fixed; top:0; left:0; right:0; z-index:10; display:flex;
  justify-content:space-between; align-items:center; gap:.8rem; padding:.9rem 1.6rem;
  background:rgba(22,19,15,0.72); backdrop-filter:blur(8px); }
.topbar .brand { display:inline-flex; align-items:center; gap:.55rem; color:var(--e-gold); }
.topbar .brand img { width:30px; height:auto; }
.topbar nav { display:flex; flex-wrap:wrap; gap:1.4rem; }
.topbar nav a { color:var(--e-muted-dark); font-size:var(--e-eyebrow); font-weight:600;
  letter-spacing:0.30em; text-transform:uppercase; }
.topbar nav a:hover { color:var(--e-gold); }

/* ---------- The door (Start the Conversation) ---------- */
.door { background:var(--e-palest); text-align:center; }
.door h2 { font-family:'Cormorant Garamond',serif; font-weight:500;
  font-size:clamp(2rem,4vw,2.875rem); color:var(--e-ink); margin-bottom:.9rem; }
.door .line { font-size:var(--e-body); line-height:1.7; color:var(--e-soft-light);
  max-width:44ch; margin:0 auto 2.2rem; }
.door .phone { display:inline-block; font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.7rem,3vw,2.25rem); color:var(--e-gold-deep); margin-bottom:.5rem; }
.door .phone:hover { color:var(--e-gold); }
.door .mail { display:block; font-size:1rem; color:var(--e-gold-deep); }
.door .foot { margin-top:2.8rem; display:flex; flex-direction:column; align-items:center; gap:.8rem; }
.door .foot img { width:40px; opacity:.85; }
.door .foot p { font-size:var(--e-label); color:var(--e-muted-light); }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  [data-parallax] { transform:none !important; }
  [data-reveal] { opacity:1 !important; transform:none !important; transition:none !important; }
}

/* ---------- Mobile ---------- */
@media (max-width:760px) {
  .sec { min-height:auto; padding:4.2rem 1.4rem; }
  .topbar { padding:.6rem 1.1rem; }
  .topbar nav { gap:.95rem; }
  .topbar nav a { font-size:.6rem; letter-spacing:.14em; padding:.5rem 0; }
  .g { grid-template-columns:1fr !important; }
  .enso { max-width:88vw; }
}
