@font-face {
  font-family: "Vazirmatn";
  src: url("/assets/vazirmatn-arabic.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF;
}

@font-face {
  font-family: "Vazirmatn";
  src: url("/assets/vazirmatn-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  unicode-range: U+0000-00FF;
}

:root {
  --bg: #f5f4f0;
  --surface: #fff;
  --ink: #171717;
  --muted: #66645f;
  --quiet: #8a8882;
  --line: #d9d7d0;
  --line-strong: #b9b6ad;
  --accent: #79553e;
  --max: 1180px;
  --gutter: clamp(1.25rem, 4vw, 3.5rem);
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; text-rendering: optimizeLegibility; }
body { min-width: 320px; margin: 0; overflow-x: hidden; background: var(--bg); color: var(--ink); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
html[dir="rtl"] body { font-family: "Vazirmatn", Tahoma, Arial, sans-serif; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
button { color: inherit; font: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }

.skip-link { position: fixed; z-index: 100; top: .75rem; left: .75rem; padding: .65rem .9rem; background: var(--ink); color: #fff; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.site-header { position: sticky; z-index: 30; top: 0; border-bottom: 1px solid rgba(23,23,23,.12); background: rgba(245,244,240,.94); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.site-header__inner { display: grid; grid-template-columns: auto 1fr auto; align-items: center; width: min(100%,var(--max)); min-height: 4.6rem; margin-inline: auto; padding-inline: var(--gutter); }
.brand { display: inline-flex; align-items: center; gap: .7rem; font-size: .84rem; font-weight: 720; letter-spacing: -.015em; }
.brand-mark { display: grid; width: 2rem; height: 2rem; place-items: center; border: 1px solid var(--ink); border-radius: 50%; font-size: .58rem; font-weight: 800; letter-spacing: 0; }
.site-nav { display: flex; justify-self: center; align-items: center; gap: clamp(1.2rem,3vw,2.5rem); }
.site-nav a, .header-tools a { position: relative; color: var(--muted); font-size: .76rem; font-weight: 620; }
.site-nav a:hover, .site-nav a[aria-current="page"], .header-tools a:hover { color: var(--ink); }
.site-nav a[aria-current="page"]::after { content: ""; position: absolute; right: 0; bottom: -.55rem; left: 0; height: 1px; background: var(--ink); }
.header-tools { display: flex; align-items: center; gap: 1rem; }
.language-link { display: grid; min-width: 2.15rem; height: 2.15rem; padding-inline: .45rem; place-items: center; border: 1px solid var(--line-strong); border-radius: 999px; color: var(--ink)!important; font-size: .68rem!important; }
.menu-button { display: none; width: 2.5rem; height: 2.5rem; padding: 0; border: 1px solid var(--line-strong); border-radius: 50%; background: transparent; }
.menu-button span, .menu-button::after { content: ""; display: block; width: .9rem; height: 1px; margin: .22rem auto; background: currentColor; }
.container { width: min(100%,var(--max)); margin-inline: auto; padding-inline: var(--gutter); }
.home-hero, .page-hero, .page-content, .home-hero > *, .section-heading > *, .project-row > *, .content-callout > * { min-width: 0; }

.eyebrow { margin: 0; color: var(--accent); font-size: .69rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
html[dir="rtl"] .eyebrow { letter-spacing: 0; }
.home-hero { display: grid; grid-template-columns: minmax(0,1.22fr) minmax(17rem,.58fr); gap: clamp(3rem,9vw,8rem); align-items: center; min-height: min(47rem,calc(100svh - 4.6rem)); padding-block: clamp(4rem,9vw,7.5rem); }
.home-hero h1 { max-width: 12ch; margin: 1.1rem 0 0; font-size: clamp(3.2rem,7vw,6.4rem); font-weight: 590; letter-spacing: -.072em; line-height: .95; }
html[dir="rtl"] .home-hero h1 { max-width: 14ch; font-size: clamp(3rem,6.5vw,5.7rem); font-weight: 720; letter-spacing: -.055em; line-height: 1.12; }
.home-hero__bio { max-width: 43rem; margin: 2rem 0 0; color: var(--muted); font-size: clamp(1.04rem,1.6vw,1.28rem); line-height: 1.72; }
.actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2.25rem; }
.button { display: inline-flex; min-height: 3rem; align-items: center; justify-content: center; gap: .65rem; padding: .8rem 1.05rem; border: 1px solid var(--ink); border-radius: .25rem; font-size: .76rem; font-weight: 680; transition: background 160ms ease,color 160ms ease,border-color 160ms ease; }
.button--primary { background: var(--ink); color: #fff; }
.button--primary:hover { background: var(--accent); border-color: var(--accent); }
.button--secondary:hover { background: var(--surface); }
.portrait { position: relative; margin: 0; }
.portrait img { width: 100%; aspect-ratio: .78; border-radius: .35rem; object-fit: cover; object-position: center 26%; filter: saturate(.82) contrast(1.02); }
.portrait figcaption { display: flex; justify-content: space-between; gap: 1rem; margin-top: .75rem; color: var(--quiet); font-size: .67rem; }
.current-role { display: grid; grid-template-columns: .34fr 1fr auto; gap: 2rem; align-items: baseline; padding-block: 1.45rem; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line); }
.current-role span { color: var(--quiet); font-size: .7rem; font-weight: 680; text-transform: uppercase; }
.current-role strong { font-size: 1rem; font-weight: 650; }
.current-role p { margin: 0; color: var(--muted); font-size: .78rem; }

.home-section { padding-block: clamp(5rem,9vw,8rem); }
.home-section + .home-section { border-top: 1px solid var(--line); }
.section-heading { display: grid; grid-template-columns: .34fr 1fr auto; gap: 2rem; align-items: start; margin-bottom: clamp(2.7rem,6vw,5rem); }
.section-heading > span { color: var(--quiet); font-size: .68rem; font-weight: 700; text-transform: uppercase; }
.section-heading h2, .page-hero h1 { margin: 0; font-size: clamp(2.25rem,4.4vw,4.2rem); font-weight: 590; letter-spacing: -.055em; line-height: 1; }
html[dir="rtl"] .section-heading h2, html[dir="rtl"] .page-hero h1 { font-weight: 720; letter-spacing: -.04em; line-height: 1.18; }
.section-link { padding-bottom: .25rem; border-bottom: 1px solid var(--line-strong); color: var(--muted); font-size: .72rem; font-weight: 660; }
.section-link:hover { color: var(--ink); border-color: var(--ink); }
.focus-grid { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line-strong); }
.focus-item { min-height: 15rem; padding: 1.5rem 1.5rem 2rem 0; border-bottom: 1px solid var(--line); }
html[dir="rtl"] .focus-item { padding-right: 0; padding-left: 1.5rem; }
.focus-item + .focus-item { padding-left: 1.5rem; border-left: 1px solid var(--line); }
html[dir="rtl"] .focus-item + .focus-item { padding-right: 1.5rem; padding-left: 1.5rem; border-right: 1px solid var(--line); border-left: 0; }
.focus-item span, .project-number { color: var(--quiet); font-size: .66rem; font-weight: 700; }
.focus-item h3 { margin: 4.7rem 0 .6rem; font-size: 1.15rem; font-weight: 650; }
.focus-item p { max-width: 21rem; margin: 0; color: var(--muted); font-size: .85rem; line-height: 1.65; }

.project-list { border-top: 1px solid var(--line-strong); }
.project-row { display: grid; grid-template-columns: .34fr 1fr .72fr auto; gap: 2rem; align-items: center; min-height: 10.5rem; padding-block: 1.6rem; border-bottom: 1px solid var(--line); transition: padding 180ms ease,background 180ms ease; }
.project-row:hover { padding-inline: 1rem; background: var(--surface); }
.project-row h3 { margin: 0; font-size: clamp(1.4rem,2.5vw,2.2rem); font-weight: 590; letter-spacing: -.04em; }
.project-row p { max-width: 33rem; margin: .45rem 0 0; color: var(--muted); font-size: .83rem; line-height: 1.6; }
.project-row__meta { color: var(--quiet); font-size: .7rem; line-height: 1.6; }
.arrow { font-size: 1rem; }
.career-preview { display: grid; grid-template-columns: .34fr 1fr; border-top: 1px solid var(--line-strong); }
.career-preview__intro { padding-top: 1.45rem; color: var(--muted); font-size: .78rem; line-height: 1.6; }
.career-preview__rows { border-left: 1px solid var(--line); }
html[dir="rtl"] .career-preview__rows { border-right: 1px solid var(--line); border-left: 0; }
.career-row { display: grid; grid-template-columns: .8fr 1fr auto; gap: 2rem; padding: 1.4rem 0 1.4rem 1.5rem; border-bottom: 1px solid var(--line); }
html[dir="rtl"] .career-row { padding-right: 1.5rem; padding-left: 0; }
.career-row strong { font-size: .93rem; }
.career-row span, .career-row time { color: var(--muted); font-size: .77rem; }

.content-callout { display: grid; grid-template-columns: minmax(0,.82fr) minmax(20rem,1.18fr); gap: clamp(2.5rem,7vw,6rem); align-items: center; }
.content-callout h2 { margin: 0; font-size: clamp(2.2rem,4vw,3.8rem); font-weight: 590; letter-spacing: -.055em; }
.content-callout p { margin: 1.2rem 0 0; color: var(--muted); line-height: 1.7; }
.channel-card { position: relative; overflow: hidden; min-height: 20rem; border: 1px solid var(--line); background: var(--ink); color: #fff; }
.channel-card img { width: 100%; height: 100%; min-height: 20rem; object-fit: cover; filter: grayscale(.85) contrast(.92); opacity: .58; transition: opacity 200ms ease,transform 300ms ease; }
.channel-card:hover img { opacity: .72; transform: scale(1.015); }
.channel-card__label { position: absolute; right: 1.5rem; bottom: 1.5rem; left: 1.5rem; display: flex; justify-content: space-between; align-items: end; gap: 1rem; }
.channel-card__label strong { display: block; font-size: 1.2rem; }
.channel-card__label span { display: block; margin-top: .25rem; color: rgba(255,255,255,.7); font-size: .72rem; }

.page-hero { display: grid; grid-template-columns: .34fr 1fr; gap: 2rem; padding-block: clamp(4rem,9vw,8rem); border-bottom: 1px solid var(--line-strong); }
.page-hero__label { color: var(--quiet); font-size: .68rem; font-weight: 700; text-transform: uppercase; }
.page-hero__content p { max-width: 48rem; margin: 1.5rem 0 0; color: var(--muted); font-size: clamp(1rem,1.5vw,1.18rem); line-height: 1.75; }
.page-content { padding-block: clamp(4rem,8vw,7rem); }
.resume-layout { display: grid; grid-template-columns: .34fr 1fr; gap: 2rem; }
.resume-aside { align-self: start; position: sticky; top: 7rem; }
.resume-aside h2, .detail-section h2 { margin: 0; color: var(--quiet); font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.resume-aside p { max-width: 15rem; margin: 1rem 0 0; color: var(--muted); font-size: .78rem; line-height: 1.65; }
.resume-main { border-top: 1px solid var(--line-strong); }
.role { display: grid; grid-template-columns: 9.5rem 1fr; gap: clamp(1.5rem,4vw,4rem); padding-block: 2.3rem; border-bottom: 1px solid var(--line); }
.role time { color: var(--quiet); font-size: .72rem; line-height: 1.55; }
.role h3 { margin: 0; font-size: clamp(1.35rem,2.3vw,2rem); font-weight: 620; letter-spacing: -.035em; }
.role__title { margin: .35rem 0 0; color: var(--accent); font-size: .79rem; font-weight: 680; }
.role__description { max-width: 45rem; margin: 1rem 0 0; color: var(--muted); font-size: .87rem; line-height: 1.7; }
.detail-section { display: grid; grid-template-columns: .34fr 1fr; gap: 2rem; margin-top: clamp(5rem,9vw,8rem); padding-top: 2rem; border-top: 1px solid var(--line-strong); }
.skill-columns { display: grid; grid-template-columns: repeat(2,1fr); gap: 2.5rem 4rem; }
.skill-columns h3 { margin: 0 0 .65rem; font-size: .88rem; }
.skill-columns p, .education-row p { margin: 0; color: var(--muted); font-size: .84rem; line-height: 1.7; }
.education-row { display: grid; grid-template-columns: 1fr auto; gap: 2rem; padding-bottom: 1.7rem; border-bottom: 1px solid var(--line); }
.education-row h3 { margin: 0; font-size: 1rem; }
.education-row time { color: var(--quiet); font-size: .75rem; }

.work-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.work-card { display: flex; min-height: 23rem; flex-direction: column; padding: clamp(1.5rem,3vw,2.2rem); border: 1px solid var(--line); background: var(--surface); transition: border-color 180ms ease,transform 180ms ease; }
.work-card:hover { border-color: var(--line-strong); transform: translateY(-3px); }
.work-card--featured { grid-column: 1/-1; min-height: 27rem; background: var(--ink); color: #fff; }
.work-card__top { display: flex; justify-content: space-between; gap: 1rem; color: var(--quiet); font-size: .68rem; font-weight: 680; text-transform: uppercase; }
.work-card--featured .work-card__top { color: rgba(255,255,255,.48); }
.work-card__body { margin-top: auto; }
.work-card h2 { max-width: 16ch; margin: 0; font-size: clamp(2rem,4vw,3.8rem); font-weight: 590; letter-spacing: -.055em; line-height: 1; }
.work-card p { max-width: 43rem; margin: 1rem 0 0; color: var(--muted); font-size: .86rem; line-height: 1.7; }
.work-card--featured p { color: rgba(255,255,255,.65); }
.work-card__link { display: inline-flex; gap: .5rem; margin-top: 1.5rem; padding-bottom: .2rem; border-bottom: 1px solid currentColor; font-size: .73rem; font-weight: 680; }

.content-grid { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(18rem,.75fr); gap: clamp(3rem,8vw,7rem); }
.content-feature img { width: 100%; aspect-ratio: 16/9; object-fit: cover; filter: grayscale(.72); }
.content-feature h2 { margin: 1.5rem 0 0; font-size: clamp(2rem,4vw,3.6rem); font-weight: 590; letter-spacing: -.055em; }
.content-feature p, .content-sidebar p { color: var(--muted); font-size: .88rem; line-height: 1.72; }
.content-sidebar { align-self: start; padding-top: 1.2rem; border-top: 1px solid var(--line-strong); }
.content-sidebar h2 { margin: 0; font-size: 1rem; }
.topic-list { margin: 2rem 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.topic-list li { padding-block: 1rem; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .8rem; }

.links-page { width: min(100%,42rem); margin-inline: auto; padding: clamp(3rem,8vw,6rem) var(--gutter); }
.links-profile { display: grid; grid-template-columns: 5.5rem 1fr; gap: 1.25rem; align-items: center; padding-bottom: 2rem; border-bottom: 1px solid var(--line-strong); }
.links-profile img { width: 5.5rem; height: 5.5rem; border-radius: 50%; object-fit: cover; object-position: center 24%; }
.links-profile h1 { margin: 0; font-size: 1.75rem; font-weight: 620; letter-spacing: -.04em; }
.links-profile p { margin: .35rem 0 0; color: var(--muted); font-size: .76rem; line-height: 1.5; }
.language-choice { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; margin-top: 1rem; }
.language-choice a { padding: .9rem 1rem; border: 1px solid var(--line); background: var(--surface); font-size: .75rem; font-weight: 650; }
.link-list { margin-top: 1rem; border-top: 1px solid var(--line-strong); }
.link-item { display: grid; grid-template-columns: 2.8rem 1fr auto; gap: 1rem; align-items: center; padding-block: 1rem; border-bottom: 1px solid var(--line); }
.link-item__mark { display: grid; width: 2.8rem; height: 2.8rem; place-items: center; border: 1px solid var(--line-strong); border-radius: .25rem; font-size: .62rem; font-weight: 750; }
.link-item strong { display: block; font-size: .83rem; }
.link-item small { display: block; margin-top: .15rem; color: var(--muted); font-size: .7rem; }

.site-footer { margin-top: clamp(3rem,7vw,6rem); border-top: 1px solid var(--line-strong); }
.site-footer__inner { display: grid; grid-template-columns: 1fr auto auto; gap: 2rem; align-items: center; min-height: 7rem; color: var(--quiet); font-size: .68rem; }
.footer-links { display: flex; gap: 1.2rem; }
.footer-links a:hover { color: var(--ink); }

@media (max-width: 820px) {
  .site-header__inner { grid-template-columns: 1fr auto auto; }
  .menu-button { display: block; justify-self: end; }
  .header-tools { margin-left: .75rem; }
  html[dir="rtl"] .header-tools { margin-right: .75rem; margin-left: 0; }
  .header-tools>a:not(.language-link) { display: none; }
  .site-nav { position: absolute; top: 100%; right: 0; left: 0; display: grid; visibility: hidden; gap: 0; padding: 1rem var(--gutter) 1.5rem; border-bottom: 1px solid var(--line-strong); background: var(--bg); opacity: 0; transform: translateY(-.5rem); transition: opacity 150ms ease,transform 150ms ease,visibility 150ms ease; }
  .site-nav.is-open { visibility: visible; opacity: 1; transform: translateY(0); }
  .site-nav a { padding-block: .85rem; border-bottom: 1px solid var(--line); font-size: .9rem; }
  .site-nav a[aria-current="page"]::after { display: none; }
  .home-hero { grid-template-columns: 1fr .55fr; gap: 2.5rem; }
  .current-role, .section-heading, .page-hero, .resume-layout, .detail-section { grid-template-columns: 1fr; }
  .current-role { gap: .6rem; }
  .section-heading { gap: 1rem; }
  .section-link { justify-self: start; }
  .project-row { grid-template-columns: 3rem 1fr auto; }
  .project-row__meta { display: none; }
  .resume-aside { position: static; }
  .content-callout, .content-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .brand span:last-child { display: none; }
  .home-hero { display: flex; min-height: auto; flex-direction: column; padding-block: 3.8rem; }
  .home-hero h1 { max-width: 10ch; font-size: clamp(2.75rem,12vw,3.65rem); overflow-wrap: break-word; }
  html[dir="rtl"] .home-hero h1 { max-width: 13ch; font-size: clamp(2.65rem,11vw,3.5rem); }
  .portrait { width: min(75%,18rem); align-self: flex-start; }
  html[dir="rtl"] .portrait { align-self: flex-end; }
  .focus-grid, .work-grid, .skill-columns { grid-template-columns: 1fr; }
  .focus-item, .focus-item+.focus-item, html[dir="rtl"] .focus-item, html[dir="rtl"] .focus-item+.focus-item { min-height: auto; padding: 1.3rem 0 2rem; border-right: 0; border-left: 0; }
  .focus-item h3 { margin-top: 2rem; }
  .project-row { grid-template-columns: 2.4rem 1fr auto; gap: .8rem; min-height: 9rem; }
  .career-preview { grid-template-columns: 1fr; }
  .career-preview__intro { padding-bottom: 1.5rem; }
  .career-preview__rows, html[dir="rtl"] .career-preview__rows { border-right: 0; border-left: 0; }
  .career-row, html[dir="rtl"] .career-row { grid-template-columns: 1fr auto; gap: .35rem 1rem; padding-inline: 0; }
  .career-row span { grid-column: 1/-1; }
  .role { grid-template-columns: 1fr; gap: .65rem; }
  .work-card--featured { grid-column: auto; }
  .work-card { min-height: 20rem; }
  .education-row, .site-footer__inner { grid-template-columns: 1fr; }
  .site-footer__inner { gap: .75rem; padding-block: 2rem; }
  .links-profile { grid-template-columns: 4.5rem 1fr; }
  .links-profile img { width: 4.5rem; height: 4.5rem; }
  .link-item small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto!important; transition: none!important; } }
@media print { .site-header,.site-footer,.actions,.skip-link { display: none!important; } body { background: #fff; } .page-hero,.page-content { padding-block: 2rem; } .resume-aside { position: static; } }