/* AUM I AM – shared styles (v2 with full-width wave) */
:root{
  --midnight:#0D1B2A; --golden:#F5E6CC; --ocean:#007F7F;
  --ink:#0b1320; --text:#101418; --dim:#637085; --paper:#faf9f7; --white:#fff;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0; font-family:'Crimson Pro', ui-serif, Georgia, 'Times New Roman', serif; color:var(--text); background:var(--white); line-height:1.6; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility}
a{color:var(--ocean); text-decoration:none}
a:hover{text-decoration:underline}
.nowrap{white-space:nowrap}

.site-header{position:sticky; top:0; z-index:40; background:rgba(13,27,42,.9); border-bottom:1px solid rgba(255,255,255,.08)}
.site-header .wrap{display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.8rem 1rem; max-width:1100px; margin:0 auto}
.brand{color:var(--golden); font-family:'Cormorant Garamond', ui-serif, Georgia, serif; letter-spacing:.04em; font-weight:700}
nav a{color:var(--golden); margin-left:1rem; text-decoration:none}
nav a:hover{opacity:.85}
.mobile{display:none}
@media (max-width:900px){
  .desktop{display:none} .mobile{display:block}
  #nav{display:none; position:fixed; inset:56px 0 auto 0; background:rgba(13,27,42,.98); padding:1rem}
  #nav.open{display:block}
  #nav a{display:block; padding:.6rem 0}
}
.nav-toggle{background:none; border:0; cursor:pointer}
.nav-toggle .bar{display:block; width:22px; height:2px; background:var(--golden); margin:4px 0; border-radius:2px}

.hero{position:relative; min-height:54vh; display:grid; place-items:center; text-align:center; color:#fff;
  background:radial-gradient(1000px 400px at 20% 10%, rgba(0,127,127,.25), rgba(0,0,0,0)),
             radial-gradient(900px 380px at 80% 20%, rgba(245,230,204,.20), rgba(0,0,0,0)),
             linear-gradient(180deg, var(--midnight) 0%, #0b223a 70%, #0b223a 100%);}
.hero .glow{position:absolute; inset:0; background:radial-gradient(600px 300px at 50% 65%, rgba(245,230,204,.12), transparent 60%)}
.hero .inner{padding:5rem 1rem 1.5rem 1rem; max-width:1000px; margin:0 auto}
.hero h1{font-family:'Cormorant Garamond', ui-serif, Georgia, serif; font-weight:700; font-size:clamp(1.9rem,5vw,3rem); letter-spacing:.04em; margin:.2rem 0}
.hero p.sub{color:var(--golden); margin:.4rem 0 .9rem 0}
.hero .cta{display:flex; gap:.65rem; justify-content:center; flex-wrap:wrap}
.btn{display:inline-block; padding:.7rem 1.2rem; border-radius:999px; font-weight:600; letter-spacing:.02em; text-decoration:none; box-shadow:0 6px 16px rgba(0,0,0,0.15)}
.btn-primary{background:var(--ocean); color:#fff} .btn-primary:hover{background:#066d6d}
.btn-ghost{background:rgba(255,255,255,.08); color:var(--golden); border:1px solid rgba(255,255,255,.22)}

/* Full-width wave with no line beneath */
.wave{position:relative; margin-bottom:-1px} /* nudge to hide hairline between sections */
.wave svg{display:block; width:100vw; height:120px; max-width:none}
.wave path{fill:#fff; stroke:none}

.section{padding:3.2rem 1rem}
.section.alt{background:var(--paper)}
.container{max-width:1100px; margin:0 auto}
.container.narrow{max-width:760px}

h2,h3{font-family:'Cormorant Garamond', ui-serif, Georgia, serif; color:var(--ink); margin:0 0 .6rem 0}
h2{font-size:clamp(1.6rem,3.6vw,2.2rem)}
h3{font-size:clamp(1.2rem,3vw,1.5rem)}
.lead{font-size:1.06rem}
.card{background:#fff; border:1px solid #eef0f2; border-radius:16px; padding:1.1rem 1.1rem; box-shadow:0 12px 30px rgba(13,27,42,.08)}
.grid.two{display:grid; gap:1.2rem; grid-template-columns:1.3fr 1fr}
@media (max-width:900px){.grid.two{grid-template-columns:1fr}}
.center{text-align:center}
.small{font-size:.95rem; color:var(--dim)}
footer{background:#0b223a; color:#e6eef9; text-align:center; padding:1.4rem 1rem}
/* Site Navigation */
.site-nav {
  display: flex;
  flex-wrap: wrap;        /* wrap if screen is narrow */
  justify-content: center; /* center the links */
  gap: 1.5rem;             /* space between links */
  margin: 1.5rem 0;        /* top & bottom spacing */
  font-family: 'Cormorant Garamond', serif; /* mystic serif font */
  font-size: 1.1rem;
}

.site-nav a {
  text-decoration: none;
  color: #004d4d;          /* deep teal text */
  opacity: 0.9;            /* slightly softened */
  transition: opacity 0.3s ease, color 0.3s ease;
}

.site-nav a:hover {
  opacity: 1;
  color: #009999;          /* luminous teal on hover */
}

/* Optional: underline glow effect on hover */
.site-nav a::after {
  content: '';
  display: block;
  height: 2px;
  background: #009999;
  transform: scaleX(0);
  transition: transform 0.3s ease;
  margin-top: 4px;
}

.site-nav a:hover::after {
  transform: scaleX(1);
}

