:root {
  --background: #faf8f5;
  --surface: rgba(255,255,255,.74);
  --text: #303542;
  --text-soft: #747985;
  --blue: #536590;
  --gold: #bd8e62;
  --line: rgba(83,101,144,.14);
  --glow-gold: rgba(189,142,98,.18);
  --glow-blue: rgba(83,101,144,.12);
  --ease: cubic-bezier(.2,.7,.2,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
html{color-scheme:light}
body{min-height:100vh;min-height:100dvh;overflow-x:hidden;color:var(--text);font-family:"DM Sans",sans-serif;background:var(--background);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{color:var(--blue);background:rgba(189,142,98,.2)}

.page{min-height:100vh;min-height:100dvh;display:grid;grid-template-rows:1fr auto;padding:40px 24px 26px;position:relative;isolation:isolate}
.backdrop{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(circle at 50% 30%,rgba(189,142,98,.10),transparent 34%),radial-gradient(circle at 78% 82%,rgba(83,101,144,.08),transparent 34%),var(--background)}
.grid{position:absolute;inset:0;opacity:.24;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:58px 58px;-webkit-mask-image:radial-gradient(circle at center,#000,transparent 74%);mask-image:radial-gradient(circle at center,#000,transparent 74%)}
.glow{position:absolute;width:420px;height:420px;border-radius:50%;filter:blur(80px);opacity:.38}
.glow--one{top:-180px;left:-120px;background:var(--glow-gold)}
.glow--two{right:-160px;bottom:-180px;background:var(--glow-blue)}

.hero{align-self:center;justify-self:center;width:min(100%,680px);display:flex;flex-direction:column;align-items:center;text-align:center}
.logo-wrap{position:relative;width:clamp(210px,35vw,330px);aspect-ratio:1;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line);background:var(--surface);box-shadow:0 28px 80px rgba(47,52,65,.08),0 0 68px var(--glow-gold);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:float 6s ease-in-out 1.1s infinite}
.orbit{position:absolute;border-radius:50%;border:1px solid var(--line);pointer-events:none}
.orbit--one{inset:-15px;animation:orbitSpin 18s linear infinite}
.orbit--two{inset:-31px;opacity:.45;animation:orbitSpinReverse 24s linear infinite}
.orbit--one::after,.orbit--two::after{content:"";position:absolute;top:50%;left:-3px;width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 14px rgba(189,142,98,.7)}
.orbit--two::after{left:auto;right:-3px;background:var(--blue);box-shadow:0 0 14px rgba(83,101,144,.55)}
.logo{width:82%;height:82%;display:block;object-fit:contain;border-radius:50%}

.content{margin-top:50px}
.eyebrow{color:var(--gold);font-size:.72rem;font-weight:500;letter-spacing:.30em;text-transform:uppercase}
h1{margin-top:14px;color:var(--blue);font-family:"Playfair Display",serif;font-size:clamp(2.5rem,7vw,4.5rem);font-weight:500;line-height:1}
.status{margin-top:18px;color:var(--text-soft);font-family:"Playfair Display",serif;font-size:clamp(1.28rem,3vw,1.85rem);font-style:italic}
.description{max-width:470px;margin:20px auto 0;color:var(--text-soft);font-size:.96rem;line-height:1.72}
.contact{display:inline-flex;align-items:center;gap:10px;margin-top:29px;padding:12px 21px;border:1px solid var(--line);border-radius:999px;color:var(--blue);background:rgba(255,255,255,.54);text-decoration:none;transition:transform .35s var(--ease),color .35s ease,border-color .35s ease,box-shadow .35s ease,background .35s ease}
.contact:hover{transform:translateY(-2px);color:var(--gold);border-color:rgba(189,142,98,.46);background:rgba(255,255,255,.82);box-shadow:0 12px 34px rgba(189,142,98,.14)}
.contact:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.contact svg{width:17px;height:17px;flex:0 0 auto}
.footer{justify-self:center;padding-top:28px;color:var(--text-soft);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase}

[data-reveal]{opacity:0;transform:translateY(16px) scale(.985);transition:opacity 1s var(--ease),transform 1s var(--ease)}
[data-reveal].is-visible{opacity:1;transform:translateY(0) scale(1)}

@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes orbitSpin{to{transform:rotate(360deg)}}
@keyframes orbitSpinReverse{to{transform:rotate(-360deg)}}

@media (max-width:520px){.page{padding:30px 18px 22px}.content{margin-top:42px}.description{max-width:360px;font-size:.91rem}.contact{padding:11px 17px;font-size:.88rem}}
@media (prefers-reduced-motion:reduce){.logo-wrap,.orbit,[data-reveal]{opacity:1;transform:none;animation:none;transition:none}}