/* Company story: one light surface, technical blue linework and restrained motion. */
.about-page .about-hero { padding-bottom: 70px; }
.about-diagram { max-width: 630px; }
.about-diagram .diagram-equipment { stroke-width: 1.25; }
.about-diagram .diagram-labels { font-size: 9px; letter-spacing: 1px; }
.about-wrap { width: min(1320px,calc(100% - 14vw)); margin: 0 auto; }
.about-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4vw; margin: 44px 0 0; padding: 44px 0; border-block: 1px solid var(--border); }
.about-facts > div { min-width: 0; }
.about-facts > div + div { padding-inline-start: 4vw; border-inline-start: 1px solid var(--border); }
.about-facts dt { margin-bottom: 12px; color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }
.about-facts dd { margin: 0; color: var(--navy); font-size: clamp(36px,4vw,56px); line-height: 1.05; letter-spacing: -.05em; }
.about-facts dd small { font-size: .48em; letter-spacing: 0; }
.about-facts > div > span { display: block; margin-top: 12px; color: var(--copy); font-size: 12px; line-height: 1.6; }
.about-section { padding-top: 136px; }
.about-section h2, .about-principles h2, .about-next h2 { margin: 0; color: var(--ink); font-size: clamp(32px,3.6vw,54px); line-height: 1.08; letter-spacing: -.05em; font-weight: 400; text-wrap: balance; }
.about-section h2 em, .about-next h2 em { color: var(--navy); font-style: normal; }
.about-story { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 9vw; align-items:start; }
.about-story-copy { max-width: 620px; }
.about-story-copy p { margin: 0 0 20px; color: var(--copy); font-size: 17px; line-height: 1.85; }
.about-story-copy p:last-child { margin-bottom: 0; }
.about-section-head { max-width: 780px; margin-bottom: 56px; }
.about-units { display: grid; }
.about-unit { display: grid; grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); gap: clamp(32px,6vw,88px); align-items: start; padding: 44px 0; border-top: 1px solid var(--border); scroll-margin-top: 120px; }
.about-unit:last-child { padding-bottom: 0; }
.about-unit-heading { display: grid; grid-template-columns: 64px minmax(0,1fr); gap: 24px; align-items: start; }
.about-unit-heading h3 { margin: 3px 0 0; color: var(--ink); font-size: clamp(23px,2.15vw,31px); line-height: 1.25; letter-spacing: -.035em; font-weight: 400; text-wrap: balance; }
.about-unit-copy { min-width: 0; }
.about-unit-copy p { max-width: 620px; margin: 0; color: var(--copy); font-size: 16px; line-height: 1.85; }
.about-unit-link { display: inline-flex; gap: 16px; align-items: center; min-height: 44px; margin-top: 14px; color: var(--navy); font-size: 13px; font-weight: 500; text-decoration: none; border-radius: 3px; }
.about-unit-link span { transition: transform .25s var(--ease); }
.about-unit-link:focus-visible { outline: 2px solid var(--navy); outline-offset: 5px; }
html[lang="fa"] .about-unit-heading h3 { line-height: 1.65; letter-spacing: 0; }
html[lang="fa"] .about-unit-copy p { line-height: 2; }
html[lang="fa"] .about-unit-link span { transform: scaleX(-1); }
.capability-symbol { display: block; width: 64px; height: 64px; stroke: var(--navy); stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; }
.about-site h3 { margin: 0; color: var(--ink); font-size: clamp(23px,2.2vw,30px); line-height: 1.15; letter-spacing: -.035em; font-weight: 400; }
.about-sites { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px; }
.about-site { position: relative; display:flex; flex-direction:column; align-items:flex-start; min-height:300px; padding: 42px; border: 1px solid var(--border); border-radius: 28px; background: linear-gradient(145deg,#fff,#f5f8fc); }
.about-site::before { content: ''; position: absolute; left: 42px; top: 42px; width: 4px; height: 13px; border-radius: 2px; background: var(--accent-ink); }
.site-coordinate { display: block; margin-bottom: 22px; padding-left: 14px; color: var(--muted); font-size: 10px; line-height: 1.5; letter-spacing: .08em; }
.site-disciplines { display: flex; gap: 8px; flex-wrap: wrap; margin-top:auto; }
.site-disciplines span { padding: 7px 11px; border-radius: 999px; color: var(--navy); background: #edf3fb; border: 1px solid #cfdded; font-size: 11px; }
.about-timeline { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 54px; list-style: none; margin: 52px 0 0; padding: 0; position: relative; }
.about-timeline::before { content: ''; position: absolute; top: 9px; left: 9px; right: 9px; height: 1px; background: linear-gradient(90deg,#003a8f70,#003a8f18); }
.about-timeline::after { content: ''; position: absolute; top: 8px; left: 0; width: 18%; height: 3px; border-radius: 99px; background: linear-gradient(90deg,transparent,#003a8f80,transparent); animation: historyFlow 5s linear infinite; pointer-events: none; }
.about-timeline:not(.is-in-view)::after { animation-play-state: paused; }
@keyframes historyFlow { from { transform: translateX(0); opacity: 0; } 15%,85% { opacity: 1; } to { transform: translateX(450%); opacity: 0; } }
.about-timeline li { position: relative; min-width: 0; }
.history-mark { display: block; position: relative; z-index: 1; width: 19px; height: 19px; margin-bottom: 25px; border: 1px solid #003a8f60; border-radius: 50%; background: #fff; }
.history-mark::after { content: ''; position: absolute; inset: 5px; border-radius: 50%; background: var(--navy); }
.about-timeline time { display: block; color: var(--navy); font-size: clamp(34px,3.5vw,48px); letter-spacing: -.04em; }
.about-timeline h3 { margin: 18px 0 0; color: var(--ink); font-size: 22px; line-height: 1.2; letter-spacing: -.03em; font-weight: 400; }
.about-principles { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: .85fr 1.15fr; gap: 7vw; align-items:end; padding: 64px; margin: 136px 0 140px; background: #071b2e; border-radius: 30px; }
.about-principles::before { content: ''; position: absolute; z-index: -1; width: 530px; aspect-ratio: 1; top: -220px; right: -170px; border: 1px solid #ffffff0d; border-radius: 50%; box-shadow: 0 0 0 36px #ffffff03,0 0 0 72px #ffffff03; }
.about-principles h2 { color: #fff; }
.about-principles h2 em { color: #ff8b43; font-style: normal; }
.principles-list { display: grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap: 30px; align-content: end; }
.principles-list article { padding-top: 24px; position: relative; border-top:1px solid rgba(255,255,255,.18); }
.principles-list article::before { content: ''; width: 5px; height: 5px; border-radius: 50%; position: absolute; left: 0; top: -3px; background: #ff8b43; box-shadow:0 0 10px rgba(255,139,67,.45); }
.principles-list h3 { margin: 0; color: #fff; font-size: 17px; font-weight: 400; line-height: 1.35; letter-spacing: -.015em; }
@media (hover:hover) and (pointer:fine) { .about-unit-link:hover span { transform: translate(3px,-3px); } }
@media (max-width:1080px) { .about-unit-heading { grid-template-columns: 52px minmax(0,1fr); gap: 18px; } .capability-symbol { width: 52px; height: 52px; } }
@media (max-width:980px) { .about-section { padding-top: 104px; } .about-facts { gap: 24px; } .about-facts > div + div { padding-inline-start:24px; } .about-principles { padding: 44px; gap: 44px; margin:104px 0 110px; } .about-story { gap: 48px; } .about-timeline { gap: 28px; } }
@media (max-width:720px) {
  .about-story { grid-template-columns: 1fr; gap: 34px; }
  .about-sites { grid-template-columns: 1fr; }
  .about-unit { grid-template-columns: 1fr; gap: 22px; padding: 34px 0; }
  .about-unit-heading { grid-template-columns: 54px minmax(0,1fr); gap: 20px; align-items: center; }
  .about-unit-heading h3 { margin: 0; font-size: 26px; }
  .capability-symbol { width: 54px; height: 54px; }
  .about-principles { grid-template-columns: 1fr; gap: 46px; }
}
@media (max-width:620px) {
  .about-wrap { width: calc(100% - 40px); }
  .about-page .about-hero { padding-bottom: 24px; }
  .about-facts { grid-template-columns: 1fr; padding: 28px 0; gap: 0; margin-top: 34px; }
  .about-facts > div { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 8px 12px; padding:18px 0; }
  .about-facts > div + div { padding-inline-start:0; border-inline-start:0; border-top:1px solid var(--border); }
  .about-facts dt { margin: 0; font-size: 10px; }
  .about-facts dd { grid-column: 2; grid-row: 1 / span 2; font-size: 33px; white-space: nowrap; }
  .about-facts > div > span { grid-column: 1; margin: 0; font-size: 11px; }
  .about-section { padding-top: 82px; }
  .about-section h2, .about-principles h2 { font-size: 33px; }
  .about-story-copy p { font-size: 15px; line-height: 1.8; }
  .about-section-head { margin-bottom: 36px; }
  .about-unit-copy p { font-size: 15px; line-height: 1.85; }
  .about-site h3 { font-size: 26px; }
  .about-site { min-height:250px; padding: 30px 26px; border-radius: 22px; }
  .about-site::before { top: 30px; left: 26px; }
  .site-coordinate { font-size: 9px; }
  .about-timeline { grid-template-columns: 1fr; gap: 32px; margin-top: 30px; }
  .about-timeline::before { top: 10px; bottom: 10px; left: 9px; right: auto; height: auto; width: 1px; background: linear-gradient(#003a8f70,#003a8f18); }
  .about-timeline::after { display: none; }
  .about-timeline li { padding-left: 40px; }
  .history-mark { position: absolute; left: 0; top: 9px; margin: 0; }
  .about-timeline time { font-size: 36px; }
  .about-timeline h3 { font-size: 23px; margin-top: 12px; }
  .about-principles { margin:82px 0 88px; padding:36px 26px; border-radius:22px; }
  .principles-list { grid-template-columns:1fr; gap:28px; }
}
@media (prefers-reduced-motion:reduce) { .about-timeline::after { animation: none; display: none; } .about-unit-link span { transition: none; } }
