.about-hero { min-height:620px; display:grid; grid-template-columns:1.2fr .8fr; align-items:center; gap:50px; padding:55px; border-radius:30px; border:1px solid rgba(255,255,255,.06); background:linear-gradient(145deg,#171513,#11100f); overflow:hidden; }
.about-copy { min-width:0; display:flex; flex-direction:column; justify-content:center; align-self:stretch; }
.about-copy > h1 { max-width:780px; }
.about-story { width:min(100%,760px); margin-top:24px; padding:24px 26px; border-radius:22px; border:1px solid rgba(255,255,255,.07); background:linear-gradient(145deg,rgba(25,22,20,.94),rgba(17,16,15,.9)); box-shadow:inset 0 1px 0 rgba(255,255,255,.025); }
.about-story h2 { margin:0 0 14px; font-family:Georgia,"Times New Roman",serif; font-size:clamp(24px,2.1vw,34px); line-height:1.12; font-weight:500; color:#f4efe8; }
.about-story p { margin:0 0 13px; color:var(--muted); line-height:1.7; font-size:15px; }
.about-story p:last-child { margin-bottom:0; }
.about-orbit { width:min(370px,32vw); aspect-ratio:1; justify-self:center; position:relative; display:grid; place-items:center; }
.about-orbit div { position:absolute; inset:8%; border-radius:50%; padding:2px; background:var(--silver); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; animation:spin 16s linear infinite; }
.about-orbit img { width:72%; height:72%; object-fit:contain; }
.about-grid { margin-top:16px; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.about-grid article { padding:28px; min-height:210px; border-radius:22px; border:1px solid rgba(255,255,255,.06); background:rgba(22,20,19,.84); }
.about-grid h2 { margin:0 0 18px; font-family:Georgia,"Times New Roman",serif; font-weight:500; }
.about-grid p { margin:0; color:var(--muted); line-height:1.7; }

@media (max-width: 1100px) {
  .about-hero { min-height:0; grid-template-columns:1fr; gap:34px; }
  .about-copy > h1,.about-story { max-width:none; width:100%; }
  .about-orbit { margin-top:4px; }
}

@media (max-width: 768px) {
  .about-hero { padding:34px 25px; }
  .about-story { padding:22px; margin-top:20px; }
  .about-story p { font-size:14px; }
}