:root{
  --ink:#0b1820;
  --ink-2:#102630;
  --paper:#eee9df;
  --paper-2:#d9d0c2;
  --mist:#aebbc0;
  --blue:#6f8f9d;
  --copper:#a56f4d;
  --white:#f7f4ee;
  --line:rgba(247,244,238,.22);
  --pad:clamp(22px,4.4vw,74px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--white);font-family:"DM Sans",sans-serif;font-weight:300;line-height:1.45}
a{color:inherit;text-decoration:none}
button{font:inherit}
::selection{background:var(--copper);color:var(--white)}
.skip-link{position:fixed;top:12px;left:12px;z-index:1000;transform:translateY(-160%);background:var(--paper);color:var(--ink);padding:10px 14px}
.skip-link:focus{transform:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.site-header{
  position:fixed;inset:0 0 auto 0;z-index:50;height:92px;padding:0 var(--pad);
  display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid rgba(247,244,238,.15);
  transition:background .35s,backdrop-filter .35s,height .35s;
}
.site-header.scrolled{height:74px;background:rgba(11,24,32,.84);backdrop-filter:blur(16px)}
.brand{display:inline-flex;align-items:center;gap:16px}
.brand-mark{display:grid;grid-template-columns:repeat(2,12px);grid-template-rows:repeat(2,12px);gap:1px;transform:rotate(45deg)}
.brand-mark span{font-size:7px;display:grid;place-items:center;border:1px solid currentColor;color:var(--copper);transform:rotate(-45deg)}
.brand-name{font-size:13px;letter-spacing:.27em;white-space:nowrap}
.brand-name em{font-family:"Instrument Serif",serif;font-weight:400;letter-spacing:.12em;margin-left:5px}
.site-nav{display:flex;gap:34px;font-size:13px;letter-spacing:.08em}
.site-nav a{opacity:.72;transition:opacity .25s}
.site-nav a:hover,.site-nav a:focus{opacity:1}
.menu-toggle{display:none;background:none;border:0;color:inherit;width:44px;height:44px;position:relative}
.menu-toggle span:not(.sr-only){position:absolute;left:9px;width:26px;height:1px;background:currentColor;transition:.3s}
.menu-toggle span:first-child{top:18px}.menu-toggle span:nth-child(2){top:25px}

.hero{min-height:100svh;position:relative;display:grid;align-items:end;padding:145px var(--pad) 80px;overflow:hidden}
.hero-field{position:absolute;inset:0;background:
  radial-gradient(circle at 75% 35%,rgba(111,143,157,.20),transparent 34%),
  linear-gradient(120deg,#08151c 0%,#0c2029 56%,#102f3a 100%)}
.hero-field:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to right,transparent,black 48%,black)}
#field-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.7}
.orbit{position:absolute;border:1px solid rgba(247,244,238,.13);border-radius:50%;right:-8vw;top:50%;transform:translateY(-50%);animation:drift 14s ease-in-out infinite alternate}
.orbit-one{width:54vw;height:54vw}.orbit-two{width:38vw;height:38vw;animation-delay:-4s}.orbit-three{width:20vw;height:20vw;animation-delay:-8s}
@keyframes drift{to{transform:translate(-2vw,-53%) rotate(9deg)}}
.hero-content{position:relative;z-index:2;max-width:1040px}
.eyebrow{text-transform:uppercase;letter-spacing:.22em;font-size:11px;font-weight:500;margin:0 0 28px;color:var(--mist)}
.eyebrow.dark{color:#5e6b6e}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(54px,7.5vw,120px);line-height:.92;letter-spacing:-.055em;font-weight:300;margin:0 0 42px;max-width:1100px}
.serif{font-family:"Instrument Serif",serif;font-weight:400;font-style:italic;letter-spacing:-.02em}
.hero-copy{max-width:650px;font-size:clamp(17px,1.45vw,22px);color:rgba(247,244,238,.72);margin-bottom:38px}
.text-link{display:inline-flex;align-items:center;gap:18px;text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:500}
.text-link svg{width:42px;fill:none;stroke:currentColor;stroke-width:1;transition:transform .3s}.text-link:hover svg{transform:translateX(8px)}
.hero-index{position:absolute;z-index:2;right:var(--pad);bottom:80px;display:flex;gap:16px;writing-mode:vertical-rl;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(247,244,238,.38)}

section{position:relative}
.section-number{position:absolute;top:var(--pad);left:var(--pad);font-size:11px;letter-spacing:.18em;opacity:.45}
.panel-light{background:var(--paper);color:var(--ink)}
.statement{padding:clamp(115px,14vw,220px) var(--pad) 70px}
.statement-grid{display:grid;grid-template-columns:.75fr 1.5fr 1fr;gap:5vw;align-items:start}
.statement h2,.section-head h2,.engagement h2,.contact h2{font-size:clamp(43px,5vw,78px);line-height:1.02;letter-spacing:-.04em;font-weight:300}
.statement-copy{font-size:clamp(16px,1.25vw,20px);color:#3c4b50}
.statement-copy p+p{margin-top:25px}
.signal-line{margin-top:110px;display:flex;align-items:center;gap:18px;text-transform:uppercase;font-size:9px;letter-spacing:.2em;color:#667276}
.signal-line i{height:1px;flex:1;background:rgba(11,24,32,.22)}

.work{padding:150px var(--pad) 120px;background:#102630}
.section-head{display:grid;grid-template-columns:.6fr 1fr 2.2fr;gap:5vw;margin-bottom:90px}
.section-head .section-number{position:static}
.section-head h2{margin:0;max-width:750px}
.work-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.work-card{min-height:430px;padding:25px 28px;display:flex;flex-direction:column;border-right:1px solid var(--line);border-bottom:1px solid var(--line);position:relative;overflow:hidden;outline:none;transition:background .35s,color .35s}
.work-card:before{content:"";position:absolute;inset:auto 0 0;height:0;background:var(--paper);transition:height .45s cubic-bezier(.2,.8,.2,1);z-index:0}
.work-card:hover:before,.work-card:focus:before{height:100%}
.work-card>*{position:relative;z-index:1}
.work-card:hover,.work-card:focus{color:var(--ink)}
.card-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.14em;color:var(--mist)}
.card-symbol{font-size:22px}
.work-card h3{font-family:"Instrument Serif",serif;font-style:italic;font-size:45px;font-weight:400;margin:auto 0 22px}
.work-card p{font-size:15px;color:rgba(247,244,238,.66);min-height:95px}
.work-card:hover p,.work-card:focus p{color:#46565b}
.card-line{height:1px;background:currentColor;transform-origin:left;transform:scaleX(.22);transition:transform .4s}
.work-card:hover .card-line,.work-card:focus .card-line{transform:scaleX(1)}

.perspective{min-height:850px;display:grid;grid-template-columns:1.1fr 1fr;background:#0b1820}
.perspective-visual{position:relative;overflow:hidden;background:linear-gradient(145deg,#9caeb2,#5f7d89 62%,#17303a)}
.layer{position:absolute;border:1px solid rgba(247,244,238,.45);width:74%;aspect-ratio:1;left:13%;top:14%;transform:rotate(45deg);animation:layerfloat 8s ease-in-out infinite alternate}
.layer-a{background:rgba(238,233,223,.08)}
.layer-b{width:56%;left:22%;top:23%;animation-delay:-3s}
.layer-c{width:34%;left:33%;top:34%;background:rgba(165,111,77,.17);animation-delay:-6s}
.axis{position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.9%,rgba(247,244,238,.18) 50%,transparent 50.1%)}
@keyframes layerfloat{to{transform:rotate(51deg) translate(10px,-10px)}}
.perspective-copy{padding:150px var(--pad);display:flex;flex-direction:column;justify-content:center}
.perspective-copy .section-number{position:static;margin-bottom:50px}
blockquote{font-family:"Instrument Serif",serif;font-style:italic;font-size:clamp(39px,4vw,66px);line-height:1.06;margin:0 0 55px;color:var(--paper)}
.perspective-copy>p:not(.eyebrow){max-width:630px;color:rgba(247,244,238,.64);font-size:17px}
.perspective-copy>p+p{margin-top:18px}

.engagement{padding:150px var(--pad)}
.engagement-inner{max-width:1200px;margin:0 auto}
.engagement h2{max-width:920px;margin-bottom:80px}
.engagement-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:50px}
.engagement-steps>div{border-top:1px solid rgba(11,24,32,.3);padding-top:20px}
.engagement-steps span{font-size:10px;letter-spacing:.17em;color:#68777b}
.engagement-steps h3{font-family:"Instrument Serif",serif;font-size:35px;font-style:italic;font-weight:400;margin:32px 0 15px}
.engagement-steps p{color:#526267;max-width:300px}

.contact{min-height:760px;padding:150px var(--pad);display:grid;place-items:center;overflow:hidden;background:#102630}
.contact-copy{position:relative;z-index:2;text-align:center;max-width:900px}
.contact h2{font-size:clamp(51px,6.2vw,96px)}
.contact-copy>p:not(.eyebrow,.location){max-width:620px;margin:0 auto 34px;color:rgba(247,244,238,.65);font-size:18px}
.contact-email{font-family:"Instrument Serif",serif;font-style:italic;font-size:clamp(27px,3.5vw,50px);border-bottom:1px solid rgba(247,244,238,.45)}
.location{margin-top:25px;text-transform:uppercase;letter-spacing:.2em;font-size:9px;color:var(--mist)}
.contact-orbit{position:absolute;width:min(70vw,820px);aspect-ratio:1;border:1px solid rgba(247,244,238,.09);border-radius:50%}
.contact-orbit:before,.contact-orbit:after{content:"";position:absolute;border:1px solid rgba(247,244,238,.09);border-radius:50%}
.contact-orbit:before{inset:12%}.contact-orbit:after{inset:28%}

footer{background:#081219;padding:60px var(--pad);display:flex;justify-content:space-between;align-items:flex-end;border-top:1px solid rgba(247,244,238,.12)}
.footer-right{text-align:right;font-size:10px;color:rgba(247,244,238,.45);max-width:620px}
.footer-links{display:flex;justify-content:flex-end;gap:24px;margin-bottom:18px;text-transform:uppercase;letter-spacing:.14em;color:rgba(247,244,238,.75)}
.disclaimer{margin-bottom:0}

.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.in-view{opacity:1;transform:none}

.legal-page{background:var(--paper);color:var(--ink);min-height:100vh}
.legal-page .site-header{position:static;color:var(--ink);border-color:rgba(11,24,32,.15)}
.legal-wrap{max-width:900px;margin:auto;padding:100px var(--pad) 140px}
.legal-wrap h1{font-size:clamp(50px,7vw,95px);margin-bottom:60px}
.legal-wrap h2{font-family:"Instrument Serif",serif;font-size:31px;font-weight:400;font-style:italic;margin-top:50px}
.legal-wrap p,.legal-wrap li{color:#46555a;max-width:760px}

@media(max-width:900px){
  .site-header{height:76px}
  .menu-toggle{display:block;z-index:2}
  .site-nav{position:fixed;inset:0;background:rgba(8,18,25,.98);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:28px;font-size:24px;transform:translateY(-100%);transition:transform .45s}
  .site-nav.open{transform:none}
  .menu-toggle.open span:first-child{transform:rotate(45deg);top:22px}
  .menu-toggle.open span:nth-child(2){transform:rotate(-45deg);top:22px}
  .statement-grid,.section-head{grid-template-columns:1fr}
  .statement-grid{gap:28px}.statement h2{margin-bottom:14px}
  .signal-line{overflow:hidden;gap:12px}.signal-line span{white-space:nowrap}
  .work-grid{grid-template-columns:repeat(2,1fr)}
  .perspective{grid-template-columns:1fr}.perspective-visual{min-height:560px}
  .engagement-steps{gap:24px}
}
@media(max-width:620px){
  .brand-name{font-size:10px;letter-spacing:.18em}.brand{gap:11px}
  .hero{padding-top:125px;padding-bottom:60px;align-items:center}
  h1{font-size:clamp(49px,15vw,72px);margin-bottom:30px}
  .hero-index{display:none}.hero-copy{font-size:16px}
  .orbit-one{width:120vw;height:120vw}.orbit-two{width:85vw;height:85vw}.orbit-three{width:50vw;height:50vw}
  .statement{padding-top:120px}.statement h2,.section-head h2,.engagement h2,.contact h2{font-size:44px}
  .signal-line{margin-top:70px}
  .work{padding-top:120px}.work-grid{grid-template-columns:1fr}.work-card{min-height:330px}
  .work-card p{min-height:auto}.section-head{margin-bottom:55px}
  .perspective-visual{min-height:420px}.perspective-copy{padding:110px var(--pad)}
  blockquote{font-size:42px}
  .engagement{padding-top:120px}.engagement-steps{grid-template-columns:1fr}
  .contact{min-height:680px}
  footer{align-items:flex-start;gap:50px;flex-direction:column}.footer-right{text-align:left}.footer-links{justify-content:flex-start}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}


/* Official Alma Endeavors logo */
.brand-logo{display:inline-flex;align-items:center;line-height:0}
.brand-logo img{
  display:block;
  width:clamp(185px,16vw,255px);
  height:auto;
  max-height:58px;
  object-fit:contain;
  object-position:left center;
}
.site-header.scrolled .brand-logo img{max-height:48px}
.footer-brand img{width:clamp(210px,20vw,310px);max-height:none}
.legal-page .brand-logo img{filter:none}
@media(max-width:620px){
  .brand-logo img{width:178px;max-height:48px}
  .footer-brand img{width:220px;max-height:none}
}


/* v0.3 approved logo treatment */
.brand-logo img{
  width:clamp(215px,18vw,290px);
  max-height:66px;
}
.site-header.scrolled .brand-logo img{max-height:54px}
.footer-brand img{width:clamp(235px,21vw,330px)}
@media(max-width:620px){
  .brand-logo img{width:195px;max-height:50px}
  .footer-brand img{width:235px}
}

/* Subtle expandable content */
.disclosure-toggle{
  appearance:none;
  border:0;
  background:transparent;
  color:inherit;
  width:100%;
  padding:0;
  text-align:left;
  font:inherit;
  cursor:pointer;
}
.work-card .disclosure-toggle{display:flex;flex-direction:column;flex:1}
.toggle-mark{
  display:inline-grid;
  place-items:center;
  width:22px;
  height:22px;
  border:1px solid currentColor;
  border-radius:50%;
  font-size:15px;
  font-weight:300;
  line-height:1;
  opacity:.65;
  transition:transform .3s ease,opacity .3s ease;
}
.disclosure-toggle:hover .toggle-mark,
.disclosure-toggle:focus-visible .toggle-mark{opacity:1}
.disclosure-toggle[aria-expanded="true"] .toggle-mark{transform:rotate(45deg)}
.disclosure-panel{
  max-height:0;
  overflow:hidden;
  opacity:0;
  transition:max-height .55s cubic-bezier(.2,.8,.2,1),opacity .35s ease,margin .35s ease;
}
.disclosure-panel.open{
  max-height:420px;
  opacity:1;
  margin-top:18px;
}
.disclosure-panel p{margin:0;color:rgba(247,244,238,.72);font-size:14px;line-height:1.6}
.work-card:hover .disclosure-panel p,
.work-card:focus-within .disclosure-panel p{color:#46565b}
.work-card.expanded:before{height:100%}
.work-card.expanded{color:var(--ink)}
.work-card.expanded .disclosure-panel p{color:#46565b}
.work-card.expanded .card-line{transform:scaleX(1)}

.engagement-step{border-top:1px solid rgba(11,24,32,.3);padding-top:20px}
.engagement-step .disclosure-toggle{position:relative}
.engagement-step .toggle-mark{
  position:absolute;
  right:0;
  top:-3px;
  width:20px;
  height:20px;
  color:#5f6f73;
}
.engagement-step .disclosure-panel p{color:#526267}
.engagement-step .disclosure-panel.open{max-height:300px;margin-top:12px}


/* v0.4 refinements */
.nowrap{white-space:nowrap}
.legal-page .brand-logo img{
  filter:none;
  width:clamp(215px,18vw,290px);
}
@media(max-width:620px){
  .nowrap{white-space:normal}
}
