/* Sephorizon: a bright personal universe, with local motion and native portraits. */
.portfolio-site { --paper: #f7f8fc; --white: #fff; --ink: #17253c; --muted: #596779; --line: #dce3ee; --green: #285de6; --soft: #edf2fc; --sun: #e4ebff; --portfolio-dark: #17253c; --portfolio-light: #f7f8fc; --portfolio-accent: #285de6; --portfolio-coral: #f49b88; background: var(--paper); color: var(--ink); }
.portfolio-site h1, .portfolio-site h2, .portfolio-site h3 { font-family: var(--sans); font-weight: 650; }
.portfolio-site ::selection { background: #c7d8ff; color: var(--ink); }
.portfolio-site :focus-visible { outline: 3px solid #285de6; outline-offset: 5px; }
.portfolio-site .skip-link { background: var(--ink); color: #fff; z-index: 30; }
.portfolio-container { width: min(1300px, calc(100% - 96px)); margin-inline: auto; }
.portfolio-header { position: relative; z-index: 10; background: #ffffffeb; border-block-end: 1px solid #dce3ee; }
.portfolio-header-inner { display: flex; align-items: center; gap: 28px; min-height: 90px; }
.portfolio-brand { display: inline-flex; align-items: center; gap: 9px; font-size: 24px; font-weight: 750; letter-spacing: -.055em; line-height: 1; white-space: nowrap; }
.portfolio-brand:hover { color: #285de6; }
.portfolio-brand-dot { color: #285de6; }
.portfolio-brand-symbol { display: inline-flex; color: #285de6; }
.portfolio-brand-symbol svg { fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }
.portfolio-navigation { display: flex; align-items: center; gap: 24px; margin-inline-start: auto; }
.portfolio-navigation > a { display: inline-flex; align-items: center; min-height: 44px; color: #42536d; font-size: 13px; font-weight: 550; white-space: nowrap; }
.portfolio-navigation > a:hover { color: #285de6; text-decoration: underline; text-underline-offset: 6px; }
.portfolio-header-tools { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.portfolio-header .language-switcher { border-color: #d5ddea; border-radius: 999px; font-size: 12px; color: #283c5b; background: #fff; padding-inline: 10px; }
.portfolio-account-link { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 8px 16px; border: 1px solid #285de6; border-radius: 999px; background: #285de6; color: #fff; font-size: 12px; font-weight: 600; white-space: nowrap; }
.portfolio-account-link:hover { background: #164bcc; border-color: #164bcc; color: #fff; }
.portfolio-signout { margin: 0; }
.portfolio-menu-toggle { display: none; align-items: center; justify-content: center; width: 44px; height: 44px; background: #fff; border: 1px solid #d5ddea; border-radius: 50%; color: var(--ink); font-size: 22px; }
.portfolio-eyebrow { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; line-height: 1.7; color: #4c5d75; margin-block-end: 24px; }
.portfolio-spark { width: 10px; height: 10px; background: #f18e78; border-radius: 50%; box-shadow: 0 0 0 6px #f7cab947; flex: 0 0 auto; }
.personal-page { overflow: clip; }
.personal-page [id] { scroll-margin-block-start: 30px; }
.personal-hero-world { position: relative; isolation: isolate; background: radial-gradient(ellipse at 85% 6%, #c3ddff91 0, transparent 50%), radial-gradient(ellipse at 12% 85%, #ffe6dd8c 0, transparent 52%), #f7f8fc; }
.personal-hero-world::before { content: ''; position: absolute; z-index: -1; inset: 8% 3% 0 45%; background-image: radial-gradient(#7294c940 .8px, transparent .8px); background-size: 21px 21px; mask-image: radial-gradient(ellipse, #000 15%, transparent 70%); pointer-events: none; }
.personal-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: clamp(40px, 5.8vw, 90px); align-items: center; padding-block: 84px 95px; }
.personal-introduction { min-width: 0; position: relative; z-index: 2; }
.personal-hero h1 { font-size: clamp(3.85rem, 5.85vw, 6rem); font-weight: 750; line-height: 1.025; letter-spacing: -.065em; margin-block: 0 25px; overflow-wrap: anywhere; color: #17253c; }
.personal-headline { font-size: clamp(1.18rem, 1.72vw, 1.5rem); font-weight: 550; line-height: 1.5; color: #285de6; max-width: 34ch; margin-block-end: 20px; overflow-wrap: anywhere; }
.personal-intro { max-width: 46ch; font-size: 15px; line-height: 1.9; color: #5b6a7f; white-space: pre-line; overflow-wrap: anywhere; margin-block-end: 28px; }
.personal-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 13px 24px; }
.portfolio-button { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; min-height: 54px; padding: 13px 24px; background: #285de6; border: 1px solid #285de6; border-radius: 999px; color: #fff; font-size: 14px; font-weight: 600; box-shadow: 0 8px 22px #285de61c; transition: background .2s, box-shadow .2s, transform .2s; }
.portfolio-button > span { font-size: 23px; font-weight: 400; transition: transform .2s; }
.portfolio-button:hover { background: #174dcc; border-color: #174dcc; color: #fff; box-shadow: 0 10px 28px #285de638; transform: translateY(-2px); }
.portfolio-button:hover > span { transform: translate(2px, -2px); }
.portfolio-text-link { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 14px; font-weight: 600; color: #294363; text-decoration: underline; text-decoration-color: #c2cddd; text-underline-offset: 6px; }
.portfolio-text-link:hover { color: #285de6; }
.portfolio-text-link > span { font-size: 21px; }
.personal-hero-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; border-block-start: 1px solid #d2ddeb; padding-block-start: 22px; margin-block-start: 30px; }
.personal-location { display: flex; align-items: center; gap: 9px; font-size: 13px; color: #53637b; margin: 0; overflow-wrap: anywhere; }
.personal-location-dot { width: 7px; height: 7px; border-radius: 50%; background: #285de6; flex: 0 0 auto; }
.personal-socials { display: flex; flex-wrap: wrap; gap: 18px; }
.personal-socials a { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; font-size: 13px; font-weight: 550; color: #425672; }
.personal-socials a:hover { color: #285de6; }
.profile-link-icon { display: block; width: 20px; height: 20px; flex: 0 0 auto; }
.personal-socials a { padding: 7px 11px; border: 1px solid #dce4f1; border-radius: 999px; background: #ffffffb5; gap: 8px; }
.personal-socials { gap: 9px; }
.personal-socials a:hover { border-color: #a8bee8; background: #fff; }
.personal-contact { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.5fr); gap: clamp(30px, 5vw, 70px); padding-block: 82px; border-block-end: 1px solid #dce3ee; }
.personal-contact-heading { min-width: 0; }
.personal-contact-heading .portfolio-eyebrow { margin-block-end: 15px; }
.personal-contact-heading h2 { font-size: clamp(2.6rem, 4vw, 4rem); line-height: 1.12; letter-spacing: -.05em; margin-block-end: 20px; overflow-wrap: anywhere; }
.personal-contact-heading > p { font-size: 15px; line-height: 1.85; max-width: 35ch; color: #596b85; }
.personal-contact-grid { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.personal-contact-card { min-width: 0; display: flex; align-items: center; gap: 13px; padding: 20px 17px; border: 1px solid #dce4f1; border-radius: 18px; background: #fff; transition: border-color .2s, box-shadow .2s; }
.personal-contact-card:hover { color: inherit; border-color: #a8bee8; box-shadow: 0 8px 22px #1730520b; }
.personal-contact-mark { display: grid; place-items: center; flex: 0 0 46px; width: 46px; height: 46px; border-radius: 14px; background: #edf2fc; color: #425672; }
.personal-contact-mark img { width: 24px; height: 24px; }
.personal-contact-mark svg { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.personal-contact-copy { min-width: 0; flex: 1; }
.personal-contact-copy strong { display: block; color: #253954; font-size: 14px; font-weight: 650; line-height: 1.5; overflow-wrap: anywhere; }
.personal-contact-copy > span { display: block; color: #65768e; font-size: 12px; line-height: 1.65; margin-block-start: 3px; overflow-wrap: anywhere; }
.personal-contact-arrow { flex: 0 0 auto; color: #285de6; font-size: 20px; }
.personal-portrait { width: min(100%, 455px); min-width: 0; position: relative; align-self: center; justify-self: center; padding: 21px 14px 0; isolation: isolate; }
.personal-orbit-art { position: absolute; z-index: -1; width: 145%; inset-inline-start: -22.5%; inset-block-start: -17%; pointer-events: none; }
.personal-orbit-svg { display: block; width: 100%; height: auto; overflow: visible; }
.personal-orbit-paths { stroke-width: 1.15; opacity: .68; transform-origin: 300px 350px; animation: portfolio-orbit-drift 22s ease-in-out infinite alternate; }
.personal-orbit-node--blue { fill: #285de6; animation: portfolio-node-drift 9s ease-in-out infinite; }
.personal-orbit-node--coral { fill: #ef927e; animation: portfolio-node-drift 11s ease-in-out infinite reverse; }
.personal-orbit-star { fill: none; stroke: #ef927e; stroke-width: 2.7; stroke-linecap: round; transform-origin: 482px 103px; animation: portfolio-star-turn 35s linear infinite; }
.personal-photo-frame { position: relative; background: #e1e9f6; border-radius: 180px 180px 32px 32px; box-shadow: 0 30px 64px #1b33541c, 0 0 0 10px #ffffffa6; overflow: hidden; }
.personal-photo-frame img { width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; }
.personal-photo-orbit { position: absolute; display: grid; place-items: center; width: 83px; height: 83px; border: 1px solid #fff; border-radius: 50%; background: #e7efff; color: #285de6; box-shadow: 0 10px 30px #203c6112; inset-block-end: 98px; inset-inline-start: -21px; }
.personal-photo-orbit svg { width: 49px; height: 49px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; animation: portfolio-star-turn 35s linear infinite; }
.personal-photo-label { display: flex; align-items: center; justify-content: center; gap: 9px; padding-block: 26px 0; font-size: 13px; font-weight: 550; color: #566b88; }
.portfolio-photo-tick { width: 20px; height: 1px; background: #829dc6; }
.personal-portrait--monogram .personal-photo-frame { display: grid; place-items: center; aspect-ratio: 3 / 4; background: #e5edff; }
.personal-monogram { font-size: 130px; font-weight: 650; color: #285de6; }
.personal-owner-note { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding-block: 22px; font-size: 14px; color: #52627a; }
.personal-content { background: #fff; color: var(--ink); border-block-start: 1px solid #e5ebf2; }
.personal-section-nav { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 20px; padding-block: 26px; border-block-end: 1px solid #e0e7f0; }
.personal-index-label { display: inline-flex; align-items: center; gap: 10px; margin-inline-end: auto; color: #697990; font-size: 13px; font-weight: 500; }
.personal-index-label > span { font-size: 19px; }
.personal-section-nav > a { display: inline-flex; align-items: center; min-height: 44px; padding-inline: 6px; font-size: 13px; font-weight: 550; color: #314665; }
.personal-section-nav > a:hover { color: #285de6; }
.personal-section { padding-block: 84px; border-block-end: 1px solid #e0e7f0; }
.personal-section-heading { min-width: 0; }
.personal-section-heading h2 { font-size: clamp(2.5rem, 3.7vw, 3.8rem); letter-spacing: -.05em; line-height: 1.08; margin-block-end: 17px; overflow-wrap: anywhere; }
.personal-section-note { max-width: 47ch; font-size: 15px; line-height: 1.85; color: #69768a; }
.personal-work-section .personal-section-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px 25px; margin-block-end: 29px; }
.personal-work-section .personal-section-heading h2 { flex-basis: 100%; margin-block-end: 0; }
.personal-work-section .personal-section-note { margin: 0; }
.personal-work-section .personal-section-heading > .portfolio-text-link { margin-inline-start: auto; }
.personal-projects { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 23px; min-width: 0; }
.personal-project { position: relative; min-width: 0; padding: 34px; border: 1px solid #dfe6f0; border-radius: 24px; background: linear-gradient(145deg, #f6f9ff, #fff 75%); transition: transform .25s, box-shadow .25s, border-color .25s; }
.personal-project:hover { transform: translateY(-5px); border-color: #b7c9ef; box-shadow: 0 15px 40px #1730520d; }
.personal-project-symbol { width: 63px; height: 63px; margin-block-end: 26px; display: grid; place-items: center; border-radius: 18px; color: #285de6; background: #e6edff; }
.personal-project:nth-child(2n) .personal-project-symbol { background: #ffece5; color: #b45b43; }
.personal-project:nth-child(3n) .personal-project-symbol { background: #eeebff; color: #7a58c3; }
.personal-project-symbol svg { width: 36px; height: 36px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.personal-project-copy { min-width: 0; }
.personal-project .timeline-meta { color: #65768e; font-size: 13px; font-weight: 550; }
.project-stage { display: inline-block; padding: 2px 8px; margin-inline-start: 8px; border: 1px solid currentColor; border-radius: 999px; font-size: 11px; font-weight: 550; line-height: 1.5; vertical-align: middle; }
.project-stage:first-child { margin-inline-start: 0; }
.personal-project h3 { font-size: clamp(1.5rem, 2.1vw, 2.1rem); line-height: 1.25; letter-spacing: -.035em; margin-block: 10px 18px; overflow-wrap: anywhere; }
.personal-project-copy > p { font-size: 14px; line-height: 1.85; white-space: pre-line; overflow-wrap: anywhere; color: #617086; margin-block-end: 15px; }
.personal-project .project-detail { margin-block-start: 6px; }
.personal-project .project-detail summary { color: #285de6; display: list-item; padding-block: 10px; font-size: 14px; min-height: 44px; }
.personal-project .project-detail .personal-prose { margin-block-start: 15px; font-size: 14px; }
.personal-project .project-links { flex-wrap: wrap; gap: 8px 23px; margin-block-start: 10px; }
.personal-project .tag { border-radius: 999px; background: #e4edff; color: #285de6; }
.personal-owner-empty p { font-size: 15px; }
.personal-about-section { display: grid; grid-template-columns: minmax(0, .55fr) minmax(0, 1.45fr); gap: 80px; align-items: start; }
.personal-prose { font-size: 15px; line-height: 1.95; color: #596b83; overflow-wrap: anywhere; max-width: 76ch; }
.personal-biography { font-size: clamp(1.15rem, 1.75vw, 1.55rem); line-height: 1.85; color: #2e4463; }
.personal-background { padding-block: 84px; }
.personal-background-heading { margin-block-end: 35px; max-width: 740px; }
.personal-background-content { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; min-width: 0; align-items: start; }
.personal-background-section { min-width: 0; border-radius: 24px; background: #f4f7fc; padding: 34px; }
.personal-background-section h3 { font-size: 27px; font-weight: 650; letter-spacing: -.035em; margin-block-end: 24px; color: #285de6; }
.personal-skills-section { grid-column: 1 / -1; background: #fff; border: 1px solid #e0e7f0; }
.personal-skills { display: flex; align-content: start; flex-wrap: wrap; gap: 10px; padding: 0; margin: 0; list-style: none; }
.personal-skills li { max-width: 100%; overflow-wrap: anywhere; padding: 9px 16px; border: 1px solid #d8e3f5; border-radius: 999px; background: #eef3fd; color: #33517f; font-size: 13px; line-height: 1.7; }
.portfolio-site .portfolio-skill-link { display: inline-block; padding-block: 7px; margin-block: -7px; color: inherit; text-decoration: underline; text-underline-offset: .22em; text-decoration-thickness: 1px; text-decoration-color: currentColor; transition: text-decoration-thickness .2s ease; }
.portfolio-site .portfolio-skill-link:is(:hover, :focus-visible) { color: inherit; text-decoration-thickness: 2px; }
.personal-perspective { position: relative; background: radial-gradient(ellipse at 80% 25%, #ffe2cf 0, transparent 65%), #fff4ee; }
.personal-perspective-inner { display: grid; grid-template-columns: minmax(0, .87fr) minmax(0, 1.13fr); align-items: center; gap: clamp(45px, 9vw, 135px); padding-block: 90px; }
.personal-feature-photo { position: relative; margin: 0; width: min(100%, 370px); justify-self: center; }
.personal-feature-photo img { position: relative; width: 100%; height: auto; border-radius: 26px; box-shadow: 0 25px 60px #743e251c; }
.personal-feature-photo figcaption { position: relative; padding-block-start: 20px; font-size: 13px; line-height: 1.8; color: #8e6958; white-space: pre-line; overflow-wrap: anywhere; }
.personal-perspective-copy { min-width: 0; position: relative; }
.personal-perspective-copy h2 { font-size: clamp(3rem, 5.8vw, 5.8rem); font-weight: 650; letter-spacing: -.065em; line-height: 1.05; margin-block-end: 24px; overflow-wrap: anywhere; color: #543b36; }
.personal-perspective-spark { display: block; color: #dc957a; line-height: 1; margin-block: 8px 30px; }
.personal-perspective-spark svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.personal-world { padding-block: 86px 95px; }
.personal-world-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 10px 24px; margin-block-end: 33px; }
.personal-world-heading .portfolio-eyebrow { flex-basis: 100%; color: #617795; margin-block-end: 0; }
.personal-world-heading h2 { font-size: clamp(2.6rem, 3.9vw, 4rem); line-height: 1.1; letter-spacing: -.05em; margin: 0; overflow-wrap: anywhere; }
.personal-world-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 23px; }
.personal-world-links a { min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 13px; min-height: 230px; padding: 30px; border: 1px solid #dbe4f2; border-radius: 24px; background: #eaf0fd; font-size: 23px; font-weight: 650; line-height: 1.3; transition: transform .25s, box-shadow .25s; }
.personal-world-links a:nth-child(2) { background: #ffede5; border-color: #f1d8cb; }
.personal-world-links a:hover { color: var(--ink); transform: translateY(-5px); box-shadow: 0 15px 40px #17305212; }
.personal-world-icon { flex-basis: 100%; display: block; color: #436cce; margin-block-end: 20px; }
.personal-world-icon--visuals { color: #c77556; }
.personal-world-icon svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.personal-world-links a > span:nth-child(2) { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.personal-world-links a > span:last-child { margin-inline-start: auto; font-size: 30px; font-weight: 400; }
.portfolio-footer { border-block-start: 1px solid #dce3ee; padding-block: 46px 30px; background: #fff; }
.portfolio-footer-top { display: flex; justify-content: space-between; align-items: center; gap: 25px; margin-block-end: 35px; }
.portfolio-footer-top > p { font-size: clamp(1.4rem, 2.4vw, 2.2rem); font-weight: 550; letter-spacing: -.03em; color: #334b6d; max-width: 28ch; line-height: 1.4; margin: 0; }
.portfolio-return { display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid #d5dfea; border-radius: 50%; font-size: 22px; color: #285de6; flex: 0 0 auto; }
.portfolio-return:hover { background: #285de6; color: #fff; }
.portfolio-footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; }
.portfolio-footer-bottom > span { font-size: 12px; color: #697991; }
.portfolio-footer-bottom > nav { display: flex; flex-wrap: wrap; gap: 21px; font-size: 13px; }
.portfolio-footer-bottom nav > a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; }
.portfolio-footer-bottom > .portfolio-footer-profiles { width: 100%; padding-block-start: 14px; border-block-start: 1px solid #e6ebf3; gap: 8px 24px; }
.portfolio-footer-bottom nav > a:hover { color: #285de6; }
.portfolio-footer-owner { display: flex; justify-content: flex-end; margin-block-start: 12px; font-size: 13px; color: var(--film-page-muted, #697991); }
.portfolio-footer-owner a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: inherit; text-decoration: underline; text-underline-offset: 4px; }
.portfolio-footer-owner a:hover { color: var(--film-page-accent, #285de6); }
.portfolio-site .privacy-controls { background: #fff; color: #5e708b; }
.portfolio-site .privacy-controls a, .portfolio-site .privacy-controls button { color: inherit; }
.portfolio-site .alert { color: var(--ink); }
.portfolio-site [data-reveal] { transition: opacity .65s ease, translate .65s cubic-bezier(.22, 1, .36, 1); }
.portfolio-site .is-reveal-pending { opacity: 0; translate: 0 24px; }
@keyframes portfolio-orbit-drift { from { transform: rotate(-7deg); } to { transform: rotate(7deg); } }
@keyframes portfolio-node-drift { 0%, 100% { translate: 0 -8px; } 50% { translate: 7px 10px; } }
@keyframes portfolio-star-turn { to { rotate: 360deg; } }
[lang="fa"] .portfolio-brand { letter-spacing: 0; }
[lang="fa"] .personal-hero h1 { font-family: Tahoma, Arial, sans-serif; font-size: clamp(3.5rem, 5.3vw, 5.7rem); letter-spacing: 0; line-height: 1.45; }
[lang="fa"] .personal-section-heading h2, [lang="fa"] .personal-perspective-copy h2, [lang="fa"] .personal-world-heading h2 { letter-spacing: 0; line-height: 1.5; }
[lang="fa"] .personal-project h3, [lang="fa"] .personal-background-section h3, [lang="fa"] .portfolio-footer-top > p { letter-spacing: 0; line-height: 1.65; }
[lang="fa"] .personal-world-links a { font-size: 21px; }
[lang="fa"] .personal-contact-heading h2 { letter-spacing: 0; line-height: 1.5; }
@media (max-width: 1200px) {
  .portfolio-container { width: calc(100% - 72px); }
  .portfolio-header-inner { gap: 20px; }
  .portfolio-navigation { gap: 17px; }
  .portfolio-brand { font-size: 23px; }
  .portfolio-header-tools { gap: 8px; }
  .portfolio-account-link { padding-inline: 13px; }
  .personal-hero { gap: 45px; padding-block: 70px 76px; }
  .personal-hero h1 { font-size: clamp(3.5rem, 5.8vw, 5rem); }
  .personal-world-links a { padding: 27px; }
}
@media (max-width: 1050px) {
  .portfolio-header-inner { flex-wrap: wrap; padding-block: 18px; min-height: 96px; }
  .portfolio-navigation { order: 3; width: 100%; margin-inline-start: 0; justify-content: space-between; border-block-start: 1px solid #dce3ee; padding-block-start: 10px; }
  .portfolio-header-tools { margin-inline-start: auto; }
  .personal-hero { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 40px; }
  .personal-hero h1 { font-size: clamp(3rem, 5.6vw, 4.2rem); }
  .personal-photo-orbit { width: 65px; height: 65px; inset-inline-start: -10px; }
  .personal-photo-orbit svg { width: 37px; height: 37px; }
  .personal-section-nav { gap: 5px 16px; }
  .personal-index-label { width: 100%; margin-block-end: 3px; }
  .personal-section, .personal-background { padding-block: 64px; }
  .personal-contact { grid-template-columns: minmax(0, 1fr); gap: 22px; padding-block: 64px; }
  .personal-contact-heading > p { max-width: 60ch; }
  .personal-about-section { gap: 42px; }
  .personal-project, .personal-background-section { padding: 29px; }
  .personal-world-links { gap: 17px; }
  .personal-world-links a { padding: 26px; font-size: 21px; }
}
@media (max-width: 760px) {
  .portfolio-container { width: calc(100% - 40px); }
  .portfolio-header-inner { gap: 12px; padding-block: 16px; min-height: 82px; }
  .portfolio-brand { font-size: 23px; }
  .portfolio-brand-symbol svg { width: 33px; height: 33px; }
  .portfolio-menu-toggle { display: inline-flex; margin-inline-start: auto; }
  .portfolio-header-tools { margin-inline-start: 0; width: 100%; justify-content: space-between; gap: 8px; }
  .portfolio-header-tools .language-switcher { margin-inline-end: auto; }
  .portfolio-navigation { display: none; order: 4; }
  .portfolio-navigation.is-open { display: flex; flex-direction: column; flex-wrap: nowrap; align-items: stretch; justify-content: flex-start; gap: 6px; padding: 12px; border-radius: 16px; }
  .portfolio-navigation > a { width: 100%; min-height: 48px; padding-inline: 14px; font-size: 14px; white-space: normal; }
  .portfolio-account-link { min-height: 42px; padding-inline: 14px; }
  .personal-hero { grid-template-columns: minmax(0, 1fr); gap: 48px; padding-block: 42px 53px; }
  .personal-hero .portfolio-eyebrow { margin-block-end: 23px; font-size: 13px; }
  .personal-hero h1 { font-size: clamp(2.8rem, 9.9vw, 4.8rem); line-height: 1.07; letter-spacing: -.055em; margin-block-end: 22px; }
  .personal-headline { font-size: 19px; max-width: 36ch; }
  .personal-intro { font-size: 14px; max-width: 52ch; }
  .personal-hero-bottom { margin-block-start: 24px; padding-block-start: 16px; }
  .personal-portrait { width: min(86%, 400px); padding-inline: 10px; }
  .personal-photo-frame { border-radius: 160px 160px 25px 25px; }
  .personal-photo-orbit { width: 64px; height: 64px; inset-inline-start: -16px; inset-block-end: 90px; }
  .personal-photo-label { font-size: 12px; }
  .personal-owner-note { font-size: 13px; }
  .personal-section-nav { padding-block: 22px; gap: 4px 14px; }
  .personal-section-nav > a { font-size: 13px; }
  .personal-section, .personal-background { padding-block: 49px; }
  .personal-contact { padding-block: 49px; }
  .personal-contact-heading h2 { font-size: clamp(2.4rem, 8vw, 3.7rem); }
  .personal-contact-grid { grid-template-columns: minmax(0, 1fr); }
  .personal-contact-card { padding: 17px 18px; }
  .personal-about-section { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .personal-section-heading h2 { font-size: clamp(2.4rem, 8vw, 3.7rem); margin-block-end: 15px; }
  .personal-work-section .personal-section-heading { display: block; }
  .personal-work-section .personal-section-heading h2 { margin-block-end: 15px; }
  .personal-work-section .personal-section-heading > .portfolio-text-link { margin-block-start: 10px; }
  .personal-section-note { max-width: 38ch; }
  .personal-projects { grid-template-columns: minmax(0, 1fr); gap: 17px; }
  .personal-project { padding: 27px; }
  .personal-project h3 { font-size: 27px; margin-block-end: 16px; }
  .personal-project-symbol { width: 57px; height: 57px; margin-block-end: 20px; }
  .personal-project-copy > p { font-size: 14px; }
  .personal-biography { font-size: 20px; line-height: 1.8; }
  .personal-prose { font-size: 14px; }
  .personal-background-content { grid-template-columns: minmax(0, 1fr); gap: 17px; }
  .personal-background-heading { margin-block-end: 25px; }
  .personal-background-section { padding: 28px; }
  .personal-background-section h3 { font-size: 25px; }
  .personal-skills-section { grid-column: auto; }
  .personal-perspective-inner { grid-template-columns: minmax(0, 1fr); gap: 36px; padding-block: 50px; }
  .personal-feature-photo { width: min(88%, 370px); }
  .personal-perspective-copy h2 { font-size: clamp(2.8rem, 10vw, 4.5rem); max-width: 13ch; }
  .personal-perspective-spark { margin-block-end: 25px; }
  .personal-perspective-spark svg { width: 130px; height: 65px; }
  .personal-world { padding-block: 50px; }
  .personal-world-heading { margin-block-end: 28px; }
  .personal-world-heading h2 { font-size: 38px; }
  .personal-world-links { grid-template-columns: minmax(0, 1fr); gap: 15px; }
  .personal-world-links a { min-height: 135px; padding: 26px; gap: 15px; font-size: 25px; }
  .personal-world-icon { flex-basis: auto; margin: 0; width: 70px; flex-shrink: 0; }
  .personal-world-icon svg { width: 65px; height: 55px; }
  .portfolio-footer { padding-block: 33px 24px; }
  .portfolio-footer-top { margin-block-end: 27px; }
  .portfolio-footer-bottom { justify-content: flex-start; gap: 12px 25px; }
  .portfolio-footer-owner { justify-content: flex-start; }
  .portfolio-footer-bottom > .portfolio-brand { width: 100%; }
  .portfolio-footer-bottom > nav { gap: 17px; }
  [lang="fa"] .personal-hero h1 { font-size: clamp(2.65rem, 9vw, 4rem); }
  [lang="fa"] .personal-perspective-copy h2 { font-size: 37px; }
}
@media (max-width: 400px) {
  .portfolio-container { width: calc(100% - 36px); }
  .personal-hero h1 { font-size: 2.9rem; }
  .personal-actions { gap: 12px 18px; }
  .portfolio-button { padding-inline: 21px; gap: 23px; }
  .personal-socials { gap: 13px; }
  .personal-project h3 { font-size: 25px; }
  .personal-project, .personal-background-section { padding: 24px; }
  .personal-world-links a { font-size: 22px; padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .portfolio-site [data-reveal], .portfolio-site .is-reveal-pending { opacity: 1; translate: none; }
  .personal-orbit-paths, .personal-orbit-node, .personal-orbit-star, .personal-photo-orbit svg { animation: none; }
  .personal-project:hover, .personal-world-links a:hover, .portfolio-button:hover { transform: none; }
}

/* Preserve the private profile editor and studio layouts. */
.profile-editor { max-width: 920px; padding-block: 52px 74px; }
.profile-editor-header { max-width: 760px; margin-block-end: 32px; }
.profile-editor-header h1 { font-size: clamp(2.5rem, 4.5vw, 4.25rem); line-height: 1.15; margin-block-end: 22px; overflow-wrap: anywhere; }
.profile-editor-header > p { font-size: 16px; line-height: 1.85; max-width: 62ch; }
.profile-editor-navigation { display: flex; flex-wrap: wrap; gap: 12px 26px; }
.profile-editor .text-link { min-height: 44px; font-size: 13px; }
.profile-editor-form { min-width: 0; }
.profile-editor .content-language-control select { min-height: 44px; }
.profile-editor .content-language-links a { min-height: 44px; display: inline-flex; align-items: center; padding-inline: 12px; }
.profile-editor-group { min-inline-size: 0; margin: 0 0 31px; padding: 21px 31px 9px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
.profile-editor-group legend { padding-inline: 10px; margin-inline-start: -10px; font-size: 22px; font-weight: 600; color: var(--ink); }
.profile-group-description { font-size: 14px; line-height: 1.85; margin-block-end: 25px; }
.profile-editor-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 25px; }
.profile-editor-field { min-width: 0; margin-block-end: 26px; }
.profile-editor-field--wide { grid-column: 1 / -1; }
.profile-editor-field label { font-size: 14px; }
.profile-editor-field input, .profile-editor-field textarea { font-size: 15px; }
.profile-editor-field textarea { min-height: 150px; }
.profile-editor-field .helptext { display: block; font-size: 12px; line-height: 1.8; margin-block-start: 8px; }
.profile-editor-field input[type="file"] { max-width: 100%; min-height: 44px; }
.profile-editor-field a { overflow-wrap: anywhere; }
.profile-editor-preview { max-width: 240px; width: 100%; height: 150px; object-fit: contain; background: var(--soft); border-radius: 8px; margin-block-end: 14px; }
.profile-editor-preview--portrait { width: 120px; object-fit: cover; }
.profile-editor-save { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 24px; }
.profile-editor-save .button { font-size: 14px; }
.profile-editor-save p { margin: 0; font-size: 13px; max-width: 42ch; }
.portfolio-studio-profile { display: flex; align-items: center; justify-content: space-between; gap: 28px; background: var(--soft); border: 1px solid var(--line); border-radius: 12px; padding: 30px; }
.portfolio-studio-profile > div { min-width: 0; }
.portfolio-studio-profile h2 { overflow-wrap: anywhere; }
.portfolio-studio-profile img { width: 120px; height: 150px; object-fit: cover; border-radius: 60px 60px 8px 8px; }
.portfolio-studio .text-link { min-height: 44px; font-size: 13px; }
.portfolio-studio .toolbar { gap: 14px 27px; }
[lang="fa"] .profile-editor-header h1 { line-height: 1.5; }
@media (max-width: 760px) {
  .profile-editor { padding-block: 38px 47px; }
  .profile-editor-group { padding: 19px 22px 1px; }
  .profile-editor-group legend { font-size: 20px; }
  .profile-editor-fields { grid-template-columns: minmax(0, 1fr); }
  .profile-editor-field--wide { grid-column: auto; }
  .profile-editor-save { align-items: flex-start; flex-direction: column; }
  .portfolio-studio-profile { padding: 25px; align-items: flex-start; flex-direction: column; }
  .portfolio-studio-profile .dashboard-actions { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 400px) { .profile-editor-group { padding-inline: 17px; } }