/* About page — deliberately not shaped like the legal pages.
   Wide editorial rhythm, big statement type, no numbered clauses. */

.about-page{background:#04080b;color:var(--paper)}
.about-page header#nav{
  position:sticky;top:0;
  background:rgba(4,8,11,.92);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
.about-main{max-width:1180px;margin:0 auto;padding:0 6% 100px}

/* --- opening statement --- */
.ab-hero{padding:150px 0 70px;position:relative}
.ab-hero::after{
  content:'';position:absolute;left:0;bottom:0;width:120px;height:2px;
  background:linear-gradient(90deg,var(--radar),transparent);
}
.ab-eyebrow{
  display:block;margin-bottom:26px;
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  font-size:10px;letter-spacing:.34em;text-transform:uppercase;color:var(--radar);
}
.ab-hero h1{
  font-family:'Italiana',Georgia,serif;
  font-size:clamp(46px,8.5vw,110px);
  line-height:.98;margin:0 0 34px;letter-spacing:-.015em;
}
.ab-hero h1 em{font-style:normal;color:var(--aqua)}
.ab-lede{
  font-size:clamp(17px,1.9vw,23px);line-height:1.65;
  color:rgba(245,240,231,.72);max-width:62ch;margin:0;
}

/* --- narrative --- */
.ab-story{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:32px;padding:64px 0;
}
.ab-story p{font-size:16px;line-height:1.85;color:rgba(245,240,231,.72);margin:0}
.ab-story strong{color:var(--paper);font-weight:600}
.ab-story em{font-style:italic;color:rgba(245,240,231,.9)}

/* --- pull quote --- */
.ab-pull{padding:26px 0 70px}
.ab-pull blockquote{
  margin:0;padding:34px 0 34px 34px;
  border-left:2px solid var(--aqua);
  font-family:'Italiana',Georgia,serif;
  font-size:clamp(24px,3.4vw,42px);line-height:1.28;
  color:var(--paper);max-width:24ch;
}

/* --- principles --- */
.ab-label{
  display:block;margin-bottom:26px;
  font-family:ui-monospace,Menlo,Consolas,monospace;
  font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--radar);
}
.ab-principles{padding:20px 0 70px}
.ab-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px}
.ab-grid article{
  padding:28px 26px;
  border:1px solid rgba(245,240,231,.09);
  background:rgba(245,240,231,.02);
  transition:border-color .3s var(--ease);
}
.ab-grid article:hover{border-color:rgba(255,90,46,.4)}
.ab-grid h3{
  margin:0 0 12px;font-size:17px;font-weight:600;letter-spacing:-.01em;color:var(--paper);
}
.ab-grid p{margin:0;font-size:14px;line-height:1.75;color:rgba(245,240,231,.62)}

/* --- who / contact --- */
.ab-who{
  padding:60px 0;border-top:1px solid rgba(245,240,231,.1);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:30px;
}
.ab-who .ab-label{grid-column:1/-1}
.ab-who p{font-size:16px;line-height:1.85;color:rgba(245,240,231,.72);margin:0}

.ab-contact{
  padding:44px 0 0;border-top:1px solid rgba(255,90,46,.24);
}
.ab-contact p{
  font-size:16px;line-height:1.8;color:rgba(245,240,231,.72);
  max-width:56ch;margin:0 0 26px;
}
.ab-mail{
  display:inline-block;
  font-family:ui-monospace,Menlo,Consolas,monospace;
  font-size:clamp(14px,2vw,21px);letter-spacing:.04em;
  color:var(--aqua);text-decoration:none;
  padding-bottom:6px;border-bottom:1px solid rgba(255,90,46,.45);
}
.ab-mail:hover{color:var(--paper);border-bottom-color:var(--paper)}

@media (max-width:700px){
  .about-main{padding:0 7% 70px}
  .ab-hero{padding:120px 0 50px}
  .ab-pull blockquote{padding-left:20px;max-width:none}
}
