:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: #e8dcc5; background: #080806; font-synthesis: none; --gold: #b58a4a; --cream: #e8dcc5; --muted: #9a8c79; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; background: radial-gradient(circle at 78% 12%, rgba(102,61,26,.2), transparent 30%), #080806; line-height: 1.5; }
body::before { position: fixed; inset: 0; z-index: -1; content: ''; opacity: .22; background-image: repeating-linear-gradient(110deg, transparent 0 35px, rgba(255,255,255,.018) 36px); pointer-events: none; }
a { color: inherit; text-decoration: none; }
.site-header { position: fixed; top: 0; right: 0; left: 0; z-index: 20; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 78px; padding: 14px clamp(20px,5vw,82px); border-bottom: 1px solid transparent; transition: background .25s,border-color .25s; }
.site-header[data-scrolled] { border-color: rgba(181,138,74,.22); background: rgba(8,8,6,.82); backdrop-filter: blur(18px); }
.sigil { display: grid; width: 48px; aspect-ratio: 1; place-items: center; border: 1px solid #806432; transform: rotate(45deg); font-family: Georgia,serif; color: #d2b172; }
.sigil span { color: #7c2420; }
.sigil > *,.sigil { line-height: 1; }
.site-header .sigil { justify-self: start; }
.site-header nav { display: flex; gap: clamp(20px,3vw,46px); color: #a89d8c; font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; }
.site-header nav a:hover { color: #e8dcc5; }
.nav-cta { justify-self: end; padding: 11px 18px; border: 1px solid #745d36; color: #dbc394; font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; }
.hero { display: grid; grid-template-columns: .82fr 1.18fr; align-items: center; width: min(100%,1800px); min-height: 100svh; margin: auto; padding: 112px clamp(24px,6vw,110px) 54px; }
.eyebrow { margin: 0 0 18px; color: #a4814d; font-size: .68rem; font-weight: 700; letter-spacing: .3em; text-transform: uppercase; }
h1,h2,h3,blockquote { margin: 0; font-family: Georgia,'Times New Roman',serif; font-weight: 400; }
h1 { font-size: clamp(4.2rem,8.4vw,9.8rem); line-height: .78; letter-spacing: -.052em; text-transform: uppercase; }
.hero-lead { max-width: 610px; margin: 42px 0 0; color: #afa18d; font-family: Georgia,serif; font-size: clamp(1.1rem,1.6vw,1.55rem); line-height: 1.65; }
.hero-actions { display: flex; flex-wrap: wrap; margin-top: 34px; gap: 12px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 25px; border: 1px solid #6b5431; font-size: .72rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; transition: transform .2s,background .2s; }
.button:hover { transform: translateY(-2px); }
.button.primary { color: #120d08; background: linear-gradient(135deg,#e1c897,#a5783e); }
.button.ghost { color: #c9b58e; background: rgba(255,255,255,.018); }
.keeper { margin-top: 36px; color: #6f6659; font-size: .7rem; letter-spacing: .1em; }
.hero-art { position: relative; display: grid; place-items: center; }
.hero-art::after { position: absolute; right: 10%; bottom: 2%; left: 10%; height: 15%; border-radius: 50%; background: #000; content: ''; filter: blur(45px); }
.hero-art img { position: relative; z-index: 2; display: block; width: min(100%,850px); max-height: 84svh; object-fit: contain; filter: drop-shadow(0 30px 45px #000); animation: breathe 8s ease-in-out infinite; }
.orbit { position: absolute; width: 58%; aspect-ratio: 1; border: 1px solid rgba(181,138,74,.18); border-radius: 50%; }
.orbit.two { width: 76%; border-style: dashed; animation: spin 44s linear infinite; }
.introduction { display: grid; grid-template-columns: 1fr 1fr; width: min(100% - 48px,1450px); margin: 8rem auto 11rem; gap: clamp(42px,8vw,130px); }
.introduction-heading { display: grid; grid-template-columns: auto 1fr; gap: clamp(20px,3vw,52px); }
.introduction h2,.manifesto h2,.section-heading h2,.circle h2,.legacy h2 { font-size: clamp(2.55rem,4.6vw,5rem); line-height: 1.02; }
.introduction h2 em,.legacy h2 em { color: #b38c50; font-weight: 400; }
.introduction-copy { align-self: end; max-width: 670px; color: #978a78; font-size: 1rem; line-height: 1.8; }
.introduction-copy .lead { margin-top: 0; color: #c2b39c; font-family: Georgia,serif; font-size: clamp(1.2rem,1.8vw,1.6rem); line-height: 1.65; }
.introduction-copy blockquote { margin: 34px 0 0; padding: 22px 0 0 24px; border-top: 1px solid #3b3023; border-left: 2px solid #876638; color: #c5a870; font-size: clamp(1.35rem,2vw,2rem); line-height: 1.35; }
.manifesto { display: grid; grid-template-columns: auto 1.1fr .9fr; width: min(100% - 48px,1450px); margin: 9rem auto; padding: 6rem 0; gap: clamp(24px,5vw,80px); border-top: 1px solid #2d271e; border-bottom: 1px solid #2d271e; }
.section-mark { color: #5d4b31; font-family: Georgia,serif; font-size: 3rem; }
.manifesto h2 em { color: #b38c50; font-weight: 400; }
.manifesto-copy { align-self: end; color: #a59784; font-family: Georgia,serif; font-size: 1.12rem; line-height: 1.8; }
.principles { width: min(100% - 48px,1450px); margin: 9rem auto; }
.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 4rem; }
.principle-grid { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid #332a20; border-left: 1px solid #332a20; }
.principle-grid article { min-height: 250px; padding: 34px; border-right: 1px solid #332a20; border-bottom: 1px solid #332a20; background: linear-gradient(145deg,rgba(255,255,255,.018),transparent); }
.principle-grid article:nth-child(7) { grid-column: span 2; }
.principle-grid span { color: #866638; font-size: .65rem; letter-spacing: .2em; }
.principle-grid h3 { margin-top: 70px; font-size: 1.55rem; }
.principle-grid p { color: #8f8270; line-height: 1.6; }
.journey { width: min(100% - 48px,1450px); margin: 11rem auto; }
.section-heading .section-intro { max-width: 520px; margin: 0 0 7px 48px; color: #918472; line-height: 1.75; }
.journey-steps { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 4rem; border-top: 1px solid #332a20; }
.journey-steps article { position: relative; min-height: 310px; padding: 42px 32px 34px; border-right: 1px solid #332a20; background: linear-gradient(180deg,rgba(132,93,43,.055),transparent 65%); }
.journey-steps article:last-child { border-right: 0; }
.journey-steps span { color: #866638; font-family: Georgia,serif; font-size: 1.5rem; }
.journey-steps h3 { margin-top: 78px; font-size: 1.8rem; }
.journey-steps p { color: #8f8270; line-height: 1.65; }
.circle { display: grid; grid-template-columns: .9fr 1.1fr; width: min(100% - 48px,1450px); margin: 11rem auto; gap: clamp(42px,8vw,130px); }
.circle-copy { align-self: center; }
.circle h2 em { color: #b38c50; font-weight: 400; }
.circle-copy > p:last-child { max-width: 660px; margin: 38px 0 0; color: #a59784; font-family: Georgia,serif; font-size: 1.12rem; line-height: 1.8; }
.circle-tenets { border-top: 1px solid #332a20; }
.circle-tenets article { padding: 38px 0; border-bottom: 1px solid #332a20; }
.circle-tenets span { color: #8f6d3c; font-size: .66rem; font-weight: 700; letter-spacing: .25em; text-transform: uppercase; }
.circle-tenets h3 { max-width: 710px; margin: 22px 0 16px; font-size: clamp(1.7rem,2.7vw,2.7rem); line-height: 1.18; }
.circle-tenets p { max-width: 620px; margin: 0; color: #8f8270; line-height: 1.7; }
.legacy { display: grid; grid-template-columns: 1fr 1fr; width: min(100% - 48px,1450px); margin: 11rem auto; gap: clamp(46px,8vw,130px); }
.legacy-statement { align-self: center; }
.legacy-statement > p:last-child { max-width: 610px; margin: 36px 0 0; color: #a19380; font-family: Georgia,serif; font-size: 1.16rem; line-height: 1.8; }
.legacy-values { border-top: 1px solid #332a20; }
.legacy-values article { display: grid; grid-template-columns: 80px 1fr; padding: 32px 0; border-bottom: 1px solid #332a20; column-gap: 24px; }
.legacy-values span { grid-row: span 2; color: #8f6d3c; font-size: .64rem; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; }
.legacy-values h3 { font-size: clamp(1.45rem,2.2vw,2.25rem); }
.legacy-values p { margin: 12px 0 0; color: #8f8270; line-height: 1.65; }
.oath { display: grid; width: min(100% - 48px,1000px); min-height: 78svh; margin: 10rem auto 6rem; place-items: center; align-content: center; padding: 7rem 3rem; border: 1px solid #34291d; text-align: center; background: radial-gradient(circle,rgba(131,88,34,.13),transparent 55%); }
.oath-sigil { display: grid; width: 92px; aspect-ratio: 1; margin-bottom: 38px; place-items: center; border: 1px solid #795f33; border-radius: 50%; color: #bb9556; font-size: 2.5rem; }
.oath blockquote { max-width: 860px; font-size: clamp(2.3rem,5vw,5.2rem); line-height: 1.15; }
.oath > p:not(.eyebrow) { max-width: 690px; margin: 35px 0; color: #9f927f; font-family: Georgia,serif; font-size: 1.15rem; line-height: 1.75; }
footer { display: flex; align-items: center; justify-content: space-between; padding: 44px clamp(24px,6vw,100px); border-top: 1px solid #2b241c; color: #776b5a; font-size: .65rem; letter-spacing: .2em; }
section,.principle-grid article,.journey-steps article,.circle-tenets article,.legacy-values article { opacity: 0; transform: translateY(24px); transition: opacity .8s,transform .8s; }
section[data-visible],.principle-grid article[data-visible],.journey-steps article[data-visible],.circle-tenets article[data-visible],.legacy-values article[data-visible] { opacity: 1; transform: none; }
@keyframes breathe { 50% { transform: translateY(-8px); } }
@keyframes spin { to { transform: rotate(360deg); } }
@media (max-width: 1050px) { .site-header { grid-template-columns: 1fr auto; }.site-header nav { display:none; }.hero { grid-template-columns:1fr; padding-top:130px; }.hero-copy { position:relative; z-index:3; }.hero-art { margin-top:1rem; }.introduction,.legacy { grid-template-columns:1fr; }.manifesto { grid-template-columns:auto 1fr; }.manifesto-copy { grid-column:2; }.principle-grid { grid-template-columns:repeat(2,1fr); }.principle-grid article:nth-child(7) { grid-column:span 2; }.journey-steps { grid-template-columns:repeat(2,1fr); }.journey-steps article:nth-child(2) { border-right:0; }.journey-steps article:nth-child(-n+2) { border-bottom:1px solid #332a20; }.circle { grid-template-columns:1fr; } }
@media (max-width: 560px) { .site-header { min-height:66px; padding-inline:18px; }.sigil { width:38px; }.nav-cta { padding:9px 11px;font-size:.58rem; }.hero { padding-inline:20px; }.hero h1 { font-size:clamp(3.25rem,16vw,4rem); line-height:.82; }.hero-lead { margin-top:30px; font-size:1.08rem; }.hero-art { margin-inline:-28px; }.keeper { color:#8b7e6c; line-height:1.6; }.introduction,.manifesto,.principles,.journey,.circle,.legacy,.oath { width:min(100% - 32px,1450px); }.introduction { margin-block:6rem 8rem; }.introduction-heading { grid-template-columns:1fr; }.introduction h2,.manifesto h2,.section-heading h2,.circle h2,.legacy h2 { font-size:clamp(2.25rem,11vw,3.25rem); }.manifesto { grid-template-columns:1fr; padding-block:4rem; }.section-mark { display:none; }.manifesto-copy { grid-column:1; }.section-heading { display:block; }.section-heading .section-intro { margin:26px 0 0; }.principle-grid,.journey-steps { grid-template-columns:1fr; }.principle-grid article:nth-child(7) { grid-column:auto; }.journey-steps article { min-height:250px; border-right:0; border-bottom:1px solid #332a20; }.journey-steps h3 { margin-top:48px; }.circle,.legacy { margin-block:8rem; }.circle-tenets article { padding-block:32px; }.legacy-values article { grid-template-columns:62px 1fr; }.oath { min-height:auto; padding:5rem 20px; }.oath blockquote { font-size:clamp(2rem,10vw,2.75rem); } footer { flex-direction:column; gap:24px; text-align:center; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important;transition:none!important; } }
