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

:root{
  --bg:#02070a; --bg2:#050b0f; --gold:#d2aa5d; --gold-soft:#e2c487;
  --ivory:#efe5d4; --muted:#aaa297; --line:rgba(210,170,93,.38);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;color:var(--ivory);font-family:Montserrat,Arial,sans-serif;line-height:1.65;
  background:
    radial-gradient(circle at 18% 14%,rgba(43,67,89,.18),transparent 28%),
    radial-gradient(circle at 82% 17%,rgba(46,62,77,.14),transparent 27%),
    radial-gradient(circle at 60% 67%,rgba(32,45,57,.12),transparent 35%),
    linear-gradient(180deg,#020609 0%,#04090d 42%,#020608 100%);
  overflow-x:hidden;
}
body:before,body:after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;
}
body:before{
  background-image:
    radial-gradient(circle,rgba(255,255,255,.78) 0 1px,transparent 1.4px),
    radial-gradient(circle,rgba(210,170,93,.52) 0 1px,transparent 1.4px),
    radial-gradient(circle,rgba(255,255,255,.32) 0 .7px,transparent 1px);
  background-size:137px 137px,211px 211px,89px 89px;
  background-position:11px 17px,57px 33px,3px 61px;
  opacity:.45;
}
body:after{
  background:
    radial-gradient(ellipse at 13% 27%,rgba(62,91,119,.08),transparent 31%),
    radial-gradient(ellipse at 88% 32%,rgba(56,78,96,.07),transparent 34%);
  filter:blur(18px);
}
a{color:inherit;text-decoration:none}

.site-header{
  position:sticky;top:0;z-index:30;height:70px;display:flex;align-items:center;justify-content:space-between;
  padding:0 2.2vw;background:rgba(2,5,8,.94);border-bottom:1px solid rgba(210,170,93,.17);
  backdrop-filter:blur(13px);
}
.brand{
  font-family:"Cormorant Garamond",serif;color:var(--gold-soft);font-size:27px;letter-spacing:.075em;
}
.site-header nav{display:flex;align-items:center;gap:31px;text-transform:uppercase;font-size:10px;letter-spacing:.1em}
.site-header nav a{padding:25px 0 20px;border-bottom:1px solid transparent}
.site-header nav a:hover,.site-header nav a.active{color:var(--gold-soft);border-color:var(--gold)}
.menu-toggle{display:none;border:0;background:none;color:var(--ivory);font-size:25px}

.hero{
  min-height:710px;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;position:relative;overflow:hidden;
  padding:42px 6vw 32px;border-bottom:1px solid rgba(210,170,93,.17);
}
.cosmic-geometry{
  position:absolute;left:2.5vw;top:4%;width:min(49vw,700px);opacity:.55;filter:drop-shadow(0 0 10px rgba(210,170,93,.11));
}
.cosmic-geometry svg{display:block;width:100%;height:auto}
.tree-wrap{position:relative;display:flex;justify-content:center;align-items:center;min-height:610px;z-index:2}
.tree-halo{
  position:absolute;width:63%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(224,192,118,.29) 0%,rgba(210,170,93,.10) 36%,transparent 69%);
  filter:blur(10px);
}
.tree-wrap img{
  position:relative;z-index:2;width:min(75%,600px);height:auto;
  filter:drop-shadow(0 0 9px rgba(237,207,147,.45)) drop-shadow(0 0 28px rgba(210,170,93,.23));
}
.hero-copy{text-align:center;max-width:620px;margin:auto;z-index:3}
h1,h2,h3,blockquote p,.brand{font-family:"Cormorant Garamond",serif}
h1{font-size:clamp(70px,7vw,108px);font-weight:500;line-height:.84;margin:0;color:#f2e5cf;letter-spacing:.01em}
.kicker{text-transform:uppercase;letter-spacing:.17em;color:var(--gold);font-size:15px;line-height:1.75;margin:22px 0}
.hero-text{font-family:"Cormorant Garamond",serif;color:#d8d0c3;font-size:21px;line-height:1.55}
.ornament{display:flex;justify-content:center;align-items:center;gap:10px;margin:24px auto}
.ornament i{display:block;width:80px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.ornament i:last-child{background:linear-gradient(90deg,var(--gold),transparent)}
.ornament b{color:var(--gold);font-weight:400}.ornament.small{margin:8px auto 18px}.ornament.small i{width:43px}
.button{
  display:inline-block;margin-top:13px;padding:12px 29px;border:1px solid var(--gold);color:var(--gold-soft);
  text-transform:uppercase;font-size:10px;letter-spacing:.14em;transition:.22s;
}
.button:hover{background:rgba(210,170,93,.08);box-shadow:0 0 20px rgba(210,170,93,.10)}

.section{padding:56px 5vw}
.paths{background:linear-gradient(180deg,rgba(3,8,11,.86),rgba(4,9,12,.96));text-align:center}
.section-title{
  margin:0;font-family:"Cormorant Garamond",serif;font-weight:500;text-transform:uppercase;
  letter-spacing:.12em;color:var(--gold-soft);font-size:35px;
}
.section-title.left{text-align:left}
.path-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:1390px;margin:15px auto 0}
.path-grid article{
  min-height:340px;padding:27px 22px 24px;border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(5,11,14,.70),rgba(4,9,12,.88));
  display:flex;flex-direction:column;align-items:center;
}
.path-icon{display:block;width:92px;height:92px;object-fit:contain;margin-bottom:10px}
.tarot-icon{width:80px}
.path-grid h3{font-size:33px;font-weight:500;line-height:1.0;margin:8px 0 14px;color:#eadcc5}
.path-grid p{font-family:"Cormorant Garamond",serif;font-size:18px;color:#bbb2a6;margin:0}
.path-grid a{margin-top:auto;padding-top:23px;color:var(--gold);font-size:10px;text-transform:uppercase;letter-spacing:.13em}

.system{
  display:grid;grid-template-columns:.95fr 1.2fr;gap:8vw;align-items:center;
  background:linear-gradient(180deg,rgba(3,8,11,.95),rgba(2,7,10,.96));
}
.system-copy p{max-width:620px;color:#beb6ab}.gold-rule{width:220px;height:1px;background:linear-gradient(90deg,var(--gold),transparent);margin:10px 0 22px}
blockquote{
  margin:0;padding:48px 42px;position:relative;text-align:center;border:1px solid rgba(210,170,93,.30);
  background:rgba(4,9,12,.54);
}
blockquote p{font-size:35px;line-height:1.45;color:var(--gold-soft);letter-spacing:.03em;margin:0}
.quote-mark{position:absolute;top:-19px;left:50%;transform:translateX(-50%);font:74px Georgia,serif;color:rgba(210,170,93,.22)}
blockquote cite{font-style:normal;font-family:"Cormorant Garamond",serif;text-transform:uppercase;letter-spacing:.12em;color:var(--gold)}

.journey{text-align:center;background:linear-gradient(180deg,rgba(5,11,14,.95),rgba(3,8,11,.97));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.journey p{font-family:"Cormorant Garamond",serif;font-size:19px;color:#b9b1a6;margin:6px 0 3px}

footer{
  display:grid;grid-template-columns:1.5fr repeat(3,1fr) .6fr;gap:42px;padding:38px 4vw 22px;
  background:#020608;color:#8e8a84;font-size:10px;
}
footer strong{display:block;font-family:"Cormorant Garamond",serif;color:var(--gold-soft);font-size:22px;letter-spacing:.08em;text-transform:uppercase}
footer span{display:block;color:var(--gold-soft);text-transform:uppercase;letter-spacing:.12em;margin-bottom:10px}
footer a{display:block;margin:3px 0}.footer-symbol{width:82px;align-self:center;justify-self:center}.footer-symbol svg{width:100%}
footer small{grid-column:1/-1;text-align:center;margin-top:9px;color:#666}

@media(max-width:1000px){
  .site-header nav{display:none;position:absolute;top:70px;left:0;right:0;padding:18px 4vw;background:#03080b;flex-direction:column;align-items:flex-start}
  .site-header nav.open{display:flex}.menu-toggle{display:block}
  .hero{grid-template-columns:1fr;padding-top:25px}.tree-wrap{min-height:470px}.cosmic-geometry{width:80vw;left:10vw}
  .tree-wrap img{width:min(66vw,520px)}
  .path-grid{grid-template-columns:1fr 1fr}.system{grid-template-columns:1fr}.system-copy{text-align:center}.section-title.left{text-align:center}.gold-rule{margin-left:auto;margin-right:auto}
  footer{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .brand{font-size:20px}.hero{padding-left:5vw;padding-right:5vw}.tree-wrap{min-height:350px}.tree-wrap img{width:min(80vw,440px)}
  h1{font-size:62px}.section{padding:48px 5vw}.section-title{font-size:27px}.path-grid{grid-template-columns:1fr}
  .path-grid article{min-height:300px}.path-grid p{font-size:17px}blockquote{padding:38px 20px}blockquote p{font-size:28px}
  footer{grid-template-columns:1fr}.footer-symbol{justify-self:start}
}
