.home-observatory .site-head{
  background:rgba(4,12,15,.88);
  border-bottom-color:rgba(210,168,97,.18);
  backdrop-filter:blur(18px);
}
.home-observatory .site-head nav a:hover,
.home-observatory .site-head nav a.active{
  background:rgba(191,221,213,.14);
  color:#f6e8cc;
}

.observatory-hero{
  --obs-gold:#d7a967;
  --obs-gold-light:#f3dfb7;
  --obs-green:#163033;
  --obs-green-deep:#071719;
  position:relative;
  min-height:720px;
  overflow:hidden;
  color:#f7efe1;
  background:
    radial-gradient(circle at 69% 47%,rgba(43,98,98,.28),transparent 31%),
    radial-gradient(circle at 88% 36%,rgba(196,137,68,.12),transparent 23%),
    linear-gradient(112deg,#03090c 0%,#071216 47%,#040a0d 100%);
}
.observatory-hero::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(3,9,12,.88) 0%,rgba(3,9,12,.4) 43%,transparent 67%),
    radial-gradient(ellipse at 50% 110%,rgba(2,8,10,.05),rgba(2,8,10,.78) 75%);
}
.observatory-stars{
  position:absolute;
  inset:0;
  opacity:.55;
  background-image:
    radial-gradient(circle at 12% 19%,rgba(245,218,166,.9) 0 1px,transparent 1.5px),
    radial-gradient(circle at 24% 73%,rgba(157,218,218,.7) 0 1px,transparent 1.4px),
    radial-gradient(circle at 38% 31%,rgba(245,218,166,.75) 0 1px,transparent 1.4px),
    radial-gradient(circle at 52% 14%,rgba(157,218,218,.65) 0 1px,transparent 1.5px),
    radial-gradient(circle at 61% 82%,rgba(245,218,166,.8) 0 1px,transparent 1.4px),
    radial-gradient(circle at 76% 18%,rgba(245,218,166,.75) 0 1px,transparent 1.4px),
    radial-gradient(circle at 91% 66%,rgba(157,218,218,.65) 0 1px,transparent 1.5px);
  background-size:337px 281px,421px 337px,263px 319px,389px 271px,307px 373px,359px 293px,443px 347px;
}
.observatory-grid{
  position:relative;
  z-index:1;
  min-height:720px;
  display:grid;
  grid-template-columns:minmax(420px,.88fr) minmax(540px,1.12fr);
  align-items:center;
  gap:26px;
}
.observatory-copy{
  position:relative;
  z-index:3;
  padding:82px 0 86px;
}
.observatory-eyebrow{
  margin-bottom:22px;
  color:#a8c4bd;
  font:500 11px/1.4 var(--sans);
  letter-spacing:.24em;
}
.observatory-copy h1{
  margin:0;
  color:#f7efe2;
  font-family:var(--serif);
  font-size:clamp(52px,6.3vw,88px);
  font-weight:700;
  line-height:1.25;
  letter-spacing:-.045em;
  text-shadow:0 10px 34px rgba(0,0,0,.28);
}
.observatory-copy>p{
  max-width:610px;
  margin:20px 0 30px;
  color:#d2cabd;
  font-family:var(--serif);
  font-size:clamp(15px,1.35vw,19px);
  line-height:2;
  letter-spacing:.08em;
}
.observatory-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:16px;
}
.observatory-button{
  min-width:224px;
  height:56px;
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  padding:0 22px 0 26px;
  color:#f9ead1;
  text-decoration:none;
  font-family:var(--serif);
  font-size:14px;
  letter-spacing:.08em;
  transition:transform .25s ease,border-color .25s ease,background .25s ease;
}
.observatory-button:hover{transform:translateY(-2px)}
.observatory-button.primary{
  border:1px solid rgba(215,231,221,.78);
  border-radius:999px;
  background:linear-gradient(120deg,rgba(106,153,143,.56),rgba(54,101,97,.43));
  box-shadow:inset 0 0 18px rgba(216,245,231,.12),0 12px 34px rgba(0,0,0,.24);
}
.observatory-button.primary:hover{
  border-color:#f2dfb9;
  background:linear-gradient(120deg,rgba(116,165,154,.68),rgba(62,112,107,.56));
}
.observatory-button.secondary{
  min-width:198px;
  height:46px;
  border-bottom:1px solid rgba(215,169,103,.85);
  padding:0 3px 0 2px;
}
.observatory-button.secondary:hover{border-color:#f2dfb9}
.observatory-button b{font-size:23px;font-weight:400}
.observatory-coordinates{
  display:flex;
  flex-wrap:wrap;
  gap:10px 26px;
  margin-top:35px;
  color:#77968f;
  font:500 9px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.22em;
}

.observatory-visual{
  position:relative;
  display:grid;
  place-items:center;
  width:min(58vw,720px);
  aspect-ratio:1;
  margin-left:-36px;
}
.astro-halo{
  position:absolute;
  inset:6%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(52,108,105,.22),rgba(14,33,35,.08) 52%,transparent 72%);
  filter:blur(20px);
  box-shadow:0 0 100px rgba(52,116,111,.14);
}
.astro-device{
  position:relative;
  width:92%;
  aspect-ratio:1;
  border-radius:50%;
  isolation:isolate;
  background:
    radial-gradient(circle at 43% 38%,rgba(178,222,205,.1),transparent 23%),
    radial-gradient(circle,
      transparent 0 27.5%,
      rgba(137,104,59,.75) 27.7% 28%,
      #0b1c1f 28.2% 34.2%,
      rgba(205,154,81,.72) 34.4% 34.7%,
      #102629 35% 43.8%,
      rgba(221,174,99,.92) 44% 44.35%,
      #081719 44.6% 47.3%,
      rgba(148,109,57,.8) 47.5% 47.85%,
      #071013 48.1% 49.2%,
      rgba(236,195,126,.88) 49.4% 49.7%,
      transparent 50%);
  box-shadow:
    inset 0 0 30px rgba(230,184,104,.08),
    inset 0 0 0 1px rgba(246,221,176,.24),
    0 35px 90px rgba(0,0,0,.48),
    0 0 60px rgba(72,138,130,.12);
  transform:rotate(-2.5deg);
}
.astro-device::before,
.astro-device::after{
  content:"";
  position:absolute;
  border-radius:50%;
  pointer-events:none;
}
.astro-device::before{
  inset:2.2%;
  border:1px solid rgba(229,190,125,.38);
  box-shadow:inset 0 0 0 4px rgba(26,49,49,.66),0 0 0 4px rgba(7,14,16,.7);
}
.astro-device::after{
  inset:22%;
  border:1px solid rgba(231,191,126,.46);
  box-shadow:0 0 0 5px rgba(5,15,17,.76),inset 0 0 20px rgba(0,0,0,.45);
}
.astro-ticks{
  position:absolute;
  inset:1%;
  z-index:1;
  border-radius:50%;
  opacity:.72;
  background:repeating-conic-gradient(from -1deg,rgba(231,190,122,.82) 0 .35deg,transparent .35deg 5deg);
  -webkit-mask:radial-gradient(circle,transparent 0 46.3%,#000 46.5% 47.2%,transparent 47.4%);
  mask:radial-gradient(circle,transparent 0 46.3%,#000 46.5% 47.2%,transparent 47.4%);
}
.astro-mantra-band{
  position:absolute;
  inset:6%;
  z-index:0;
  border-radius:50%;
  border:1px solid rgba(223,178,103,.36);
  box-shadow:
    inset 0 0 0 1px rgba(3,10,12,.75),
    inset 0 0 28px rgba(0,0,0,.55),
    0 0 0 1px rgba(8,24,25,.9);
}
.astro-globe{
  position:absolute;
  inset:24%;
  z-index:1;
  overflow:hidden;
  border-radius:50%;
  border:1px solid rgba(210,169,101,.52);
  background:
    radial-gradient(circle at 50% 45%,transparent 48%,rgba(2,8,10,.2) 72%,rgba(2,8,10,.58) 100%),
    url("/assets/observatory-globe.png") center/cover no-repeat;
  box-shadow:
    inset -24px -28px 40px rgba(1,8,12,.7),
    inset 12px 12px 25px rgba(167,213,196,.14),
    0 0 28px rgba(69,139,129,.2);
}
.astro-grid-lines{
  position:absolute;
  inset:-2%;
  border-radius:50%;
  opacity:.4;
  background:
    repeating-radial-gradient(ellipse at center,transparent 0 9%,rgba(206,184,130,.4) 9.2% 9.5%,transparent 9.8% 18%),
    repeating-conic-gradient(from 0deg,rgba(206,184,130,.42) 0 .35deg,transparent .35deg 15deg);
}
.astro-land{
  position:absolute;
  background:rgba(158,173,133,.24);
  border:1px solid rgba(212,192,137,.34);
  filter:drop-shadow(0 0 6px rgba(174,198,155,.12));
}
.land-one{
  width:35%;
  height:47%;
  left:18%;
  top:27%;
  border-radius:52% 42% 48% 38%;
  transform:rotate(-18deg);
}
.land-two{
  width:24%;
  height:30%;
  right:16%;
  top:22%;
  border-radius:38% 55% 42% 50%;
  transform:rotate(23deg);
}
.astro-axis{
  position:absolute;
  z-index:3;
  left:8%;
  right:8%;
  top:50%;
  height:1px;
  transform-origin:center;
  background:linear-gradient(90deg,transparent,rgba(214,166,92,.85) 12%,rgba(245,217,166,.72) 50%,rgba(214,166,92,.85) 88%,transparent);
  box-shadow:0 0 5px rgba(221,170,92,.35);
}
.axis-one{transform:rotate(9deg)}
.axis-two{transform:rotate(101deg)}
.astro-core{
  position:absolute;
  z-index:6;
  left:50%;
  top:50%;
  width:14%;
  aspect-ratio:1;
  transform:translate(-50%,-50%);
  border:1px solid rgba(236,199,137,.72);
  border-radius:50%;
  background:radial-gradient(circle,#071215 0 27%,#26373a 29% 42%,#090f11 44% 63%,#8b6537 65% 68%,#081013 70%);
  box-shadow:0 0 0 6px rgba(5,12,13,.68),0 0 26px rgba(216,169,93,.28);
}
.astro-core i{
  position:absolute;
  inset:31%;
  border-radius:50%;
  background:radial-gradient(circle at 38% 30%,#fff 0 5%,#e6e4d7 12%,#8d9e9b 45%,#29383b 68%,#d4a35f 72% 77%,#071013 80%);
  box-shadow:0 0 16px rgba(237,213,172,.55);
}
.astro-grid-lines,
.astro-land,
.astro-axis,
.astro-core{
  display:none;
}
.komyo-ring{
  position:absolute;
  inset:0;
  z-index:5;
}
.komyo-glyph{
  position:absolute;
  width:clamp(21px,2.25vw,35px);
  height:clamp(25px,2.75vw,42px);
  transform:translate(-50%,-50%);
  background:linear-gradient(135deg,#f4ddb2 0%,#d8a55d 45%,#9a6a34 100%);
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.5)) drop-shadow(0 0 5px rgba(222,172,92,.14));
  -webkit-mask-position:center;
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-size:contain;
  mask-position:center;
  mask-repeat:no-repeat;
  mask-size:contain;
}
.observatory-index{
  position:absolute;
  right:1%;
  bottom:13%;
  display:grid;
  gap:4px;
  color:#7e9994;
  font:500 9px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.2em;
}

@media(max-width:1060px){
  .observatory-grid{
    grid-template-columns:minmax(350px,.9fr) minmax(450px,1.1fr);
  }
  .observatory-visual{width:min(59vw,620px);margin-left:-54px}
}
@media(max-width:860px){
  .observatory-hero{min-height:auto}
  .observatory-hero::before{
    background:linear-gradient(180deg,rgba(3,9,12,.38),rgba(3,9,12,.7));
  }
  .observatory-grid{
    min-height:auto;
    grid-template-columns:1fr;
    gap:0;
    padding-top:12px;
    padding-bottom:42px;
  }
  .observatory-copy{
    padding:52px 0 10px;
    text-align:center;
  }
  .observatory-copy>p{margin-left:auto;margin-right:auto}
  .observatory-actions,.observatory-coordinates{justify-content:center}
  .observatory-visual{
    width:min(94vw,610px);
    margin:-4px auto 0;
  }
  .observatory-index{right:8%;bottom:10%}
}
@media(max-width:520px){
  .observatory-copy{padding-top:42px}
  .observatory-copy h1{font-size:clamp(43px,14vw,62px)}
  .observatory-copy>p{font-size:14px;line-height:1.9}
  .observatory-actions{display:grid}
  .observatory-button{width:min(88vw,290px)}
  .observatory-button.secondary{justify-self:center}
  .observatory-coordinates{display:none}
  .observatory-visual{width:104vw;margin-left:-7vw}
  .observatory-index{display:none}
  .komyo-glyph{width:20px;height:25px}
}

@media(prefers-reduced-motion:no-preference){
  .astro-ticks{animation:observatory-drift 90s linear infinite}
  .astro-globe{animation:observatory-breathe 9s ease-in-out infinite}
}
@keyframes observatory-drift{to{transform:rotate(360deg)}}
@keyframes observatory-breathe{50%{filter:brightness(1.08)}}