/* ══════════════════════════════════════════════════════════
   Frostlight Group LLC — shared stylesheet
   Palette and type carried forward from the original page.
   ══════════════════════════════════════════════════════════ */

:root{
  --navy:      #01133B;
  --navy-lift: #04194A;
  --edge:      #142A5E;
  --edge-lit:  #24457F;
  --ice:       #5AC3EA;
  --ice-pale:  #CCEDF9;
  --silver:    #A6B2C2;
  --white:     #FFFFFF;

  --font: 'Jost', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --gutter: clamp(1.25rem, 5vw, 4rem);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0 }

html{ scroll-behavior:smooth }

body{
  background:var(--navy);
  color:var(--silver);
  font-family:var(--font);
  font-weight:300;
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

a{ color:var(--ice); text-decoration:none; transition:color .2s ease }
a:hover{ color:var(--ice-pale) }
a:focus-visible{ outline:2px solid var(--ice); outline-offset:3px; border-radius:2px }

.shell{
  width:100%;
  max-width:62rem;
  margin-inline:auto;
  padding-inline:var(--gutter);
}

/* skip link — keyboard users land here first */
.skip{
  position:absolute; left:-9999px;
  background:var(--navy-lift); color:var(--white);
  padding:.7rem 1.1rem; border:1px solid var(--edge-lit); border-radius:3px;
  font-size:.85rem; z-index:99;
}
.skip:focus{ left:var(--gutter); top:.75rem }

/* ─────────────  HERO  ───────────── */

.hero{
  position:relative;
  min-height:min(90vh, 44rem);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
  padding-block:clamp(4rem,11vh,7rem);
}

/* Signature: eight rays of light at the mark's own angles, so the page
   reads as lit by the logo rather than decorated with a gradient. */
.rays{
  position:absolute;
  top:40%; left:50%;
  width:min(190vw, 80rem);
  aspect-ratio:1;
  translate:-50% -50%;
  pointer-events:none;
  background:conic-gradient(from 0deg,
      rgba(90,195,234,.17) 0deg 1.3deg,       transparent 1.3deg   43.7deg,
      rgba(90,195,234,.17) 43.7deg 46.3deg,   transparent 46.3deg  88.7deg,
      rgba(90,195,234,.17) 88.7deg 91.3deg,   transparent 91.3deg  133.7deg,
      rgba(90,195,234,.17) 133.7deg 136.3deg, transparent 136.3deg 178.7deg,
      rgba(90,195,234,.17) 178.7deg 181.3deg, transparent 181.3deg 223.7deg,
      rgba(90,195,234,.17) 223.7deg 226.3deg, transparent 226.3deg 268.7deg,
      rgba(90,195,234,.17) 268.7deg 271.3deg, transparent 271.3deg 313.7deg,
      rgba(90,195,234,.17) 313.7deg 316.3deg, transparent 316.3deg 358.7deg,
      rgba(90,195,234,.17) 358.7deg 360deg);
  -webkit-mask-image:radial-gradient(closest-side, #000 4%, rgba(0,0,0,.32) 36%, transparent 70%);
          mask-image:radial-gradient(closest-side, #000 4%, rgba(0,0,0,.32) 36%, transparent 70%);
}

.glow{
  position:absolute;
  top:40%; left:50%;
  width:min(88vw, 32rem);
  aspect-ratio:1;
  translate:-50% -50%;
  pointer-events:none;
  background:radial-gradient(circle, rgba(90,195,234,.14), transparent 62%);
}

.hero-inner{ position:relative; z-index:1 }

.mark{
  width:clamp(5rem, 13vw, 7.5rem);
  height:auto;
  margin-inline:auto;
  display:block;
  filter:drop-shadow(0 0 32px rgba(90,195,234,.32));
}

/* Wordmark follows the logo's own lettering: geometric, lowercase,
   with "light" carrying the ice accent. */
.wordmark{
  font-weight:300;
  font-size:clamp(1.9rem, 6.4vw, 3.3rem);
  line-height:1.1;
  color:var(--white);
  letter-spacing:.005em;
  margin-top:clamp(1.4rem,4vh,2.2rem);
}
.wordmark i{ font-style:normal; color:var(--ice) }
.wordmark b{ font-style:normal; font-weight:300; color:var(--silver) }

.entity{
  font-size:.66rem;
  font-weight:400;
  letter-spacing:.4em;
  text-transform:uppercase;
  color:var(--silver);
  opacity:.7;
  margin-top:1.2rem;
}

.lede{
  font-size:clamp(1.02rem,2.1vw,1.22rem);
  font-weight:200;
  max-width:33rem;
  margin:1.8rem auto 0;
  color:var(--silver);
}

/* ─────────────  BANDS  ───────────── */

.band{ padding-block:clamp(3.5rem,8.5vh,5.5rem) }
.band + .band{ border-top:1px solid var(--edge) }

.eyebrow{
  font-size:.66rem;
  font-weight:400;
  letter-spacing:.34em;
  text-transform:uppercase;
  color:var(--ice);
  margin-bottom:2.1rem;
}

/* ─────────────  ABOUT  ───────────── */

.prose{ max-width:40rem }
.prose p{ font-size:1rem }
.prose p + p{ margin-top:1.15rem }
.prose strong{ color:var(--white); font-weight:400 }

.facts{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(11rem,1fr));
  gap:1.7rem;
  margin-top:2.8rem;
  padding-top:2.4rem;
  border-top:1px solid var(--edge);
}

/* ─────────────  PORTFOLIO  ───────────── */

.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(15rem,1fr));
  gap:1rem;
}

.venture{
  position:relative;
  display:flex;
  flex-direction:column;
  background:var(--navy-lift);
  border:1px solid var(--edge);
  border-radius:3px;
  padding:1.55rem 1.45rem 1.4rem;
  overflow:hidden;
  transition:border-color .25s ease, transform .25s ease;
}
/* frost catching the light along the top edge */
.venture::before{
  content:'';
  position:absolute;
  inset:0 0 auto 0;
  height:1px;
  background:linear-gradient(90deg, transparent, var(--ice), transparent);
  opacity:0;
  transition:opacity .3s ease;
}
.venture:hover{ border-color:var(--edge-lit); transform:translateY(-2px) }
.venture:hover::before{ opacity:.9 }

.venture h3{
  font-size:1.22rem;
  font-weight:400;
  color:var(--white);
  letter-spacing:.012em;
  margin-bottom:.55rem;
}

.venture p{ font-size:.94rem; flex:1 }

.venture .site{
  display:inline-block;
  margin-top:.9rem;
  font-size:.86rem;
  letter-spacing:.015em;
}

.status{
  align-self:flex-start;
  margin-top:1rem;
  font-size:.6rem;
  font-weight:400;
  letter-spacing:.19em;
  text-transform:uppercase;
  padding:.28rem .58rem;
  border-radius:2px;
  border:1px solid var(--edge-lit);
  color:var(--silver);
}

/* ─────────────  CONTACT / FIELDS  ───────────── */

.contact-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(12.5rem,1fr));
  gap:1.9rem;
}

.field-label{
  font-size:.62rem;
  font-weight:400;
  letter-spacing:.23em;
  text-transform:uppercase;
  color:var(--silver);
  opacity:.68;
  margin-bottom:.45rem;
}
.field-value{ font-size:1rem; color:var(--white) }
.field-note{ font-size:.84rem; margin-top:.2rem; opacity:.75 }

/* ─────────────  FOOTER  ───────────── */

footer{
  border-top:1px solid var(--edge);
  padding-block:2.1rem;
  font-size:.79rem;
  color:var(--silver);
  display:flex;
  flex-wrap:wrap;
  gap:.55rem 1.5rem;
  justify-content:space-between;
  align-items:center;
}
footer .legal-links{ display:flex; gap:1.25rem; flex-wrap:wrap }
footer span{ opacity:.7 }

/* ─────────────  LEGAL PAGES  ───────────── */

.doc-head{
  border-bottom:1px solid var(--edge);
  padding-block:1.4rem;
}
.doc-head .shell{
  display:flex;
  align-items:center;
  gap:.8rem;
}
.doc-head img{ width:2rem; height:2rem }
.doc-head .name{
  font-size:1.02rem;
  color:var(--white);
  letter-spacing:.01em;
}
.doc-head .name i{ font-style:normal; color:var(--ice) }
.doc-head .name b{ font-style:normal; font-weight:300; color:var(--silver) }

.doc{ padding-block:clamp(2.8rem,7vh,4.5rem) }
.doc .shell{ max-width:46rem }

.doc h1{
  font-size:clamp(1.75rem,4.6vw,2.5rem);
  font-weight:300;
  color:var(--white);
  line-height:1.2;
  letter-spacing:.005em;
}

.doc .updated{
  font-size:.68rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  opacity:.65;
  margin-top:.9rem;
}

.doc .intro{
  font-size:1.03rem;
  font-weight:200;
  margin-top:1.8rem;
  padding-bottom:2.2rem;
  border-bottom:1px solid var(--edge);
}

.doc h2{
  font-size:1.1rem;
  font-weight:400;
  color:var(--white);
  letter-spacing:.012em;
  margin-top:2.6rem;
  margin-bottom:.7rem;
}

.doc h3{
  font-size:.95rem;
  font-weight:400;
  color:var(--ice-pale);
  margin-top:1.5rem;
  margin-bottom:.4rem;
}

.doc p{ font-size:.96rem }
.doc p + p{ margin-top:.9rem }

.doc ul{ margin:.7rem 0 0 1.1rem }
.doc li{ font-size:.96rem; margin-bottom:.5rem }
.doc li::marker{ color:var(--ice); }

.doc strong{ color:var(--white); font-weight:400 }

.doc .back{
  display:inline-block;
  margin-top:3.2rem;
  padding-top:2rem;
  border-top:1px solid var(--edge);
  width:100%;
  font-size:.88rem;
}

/* ─────────────  MOTION  ───────────── */

.rise{
  opacity:0;
  transform:translateY(13px);
  animation:rise .8s cubic-bezier(.22,.68,.34,1) forwards;
}
.d1{ animation-delay:.05s } .d2{ animation-delay:.17s }
.d3{ animation-delay:.29s } .d4{ animation-delay:.41s }

@keyframes rise{ to{ opacity:1; transform:none } }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto }
  .rise{ animation:none; opacity:1; transform:none }
  .venture, .venture:hover{ transition:none; transform:none }
}