/* ============================================================
   sections.css — Section-specific styles
   Order: NAV → HERO → ABOUT → ROADMAP → SKILLS →
          PROJECTS → RESEARCH → CERTIFICATES → CONTACT → FOOTER
   ============================================================ */

/* ============================================================
   [۱] NAV
   ============================================================ */
.nav{
  position:fixed;
  inset:0 0 auto 0;
  z-index:50;
  border-bottom:1px solid transparent;
  transition:background .3s,border-color .3s;
}
.nav.solid{
  background:color-mix(in srgb, var(--bg) 78%, transparent);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  backdrop-filter:blur(16px) saturate(140%);
  border-color:var(--line);
}

.nav-in{display:flex;align-items:center;gap:1.25rem;height:68px}

.brand{display:flex;align-items:center;gap:.65rem;text-decoration:none;font-family:var(--display);font-weight:700;color:var(--ice)}
.brand svg{width:30px;height:30px}

.links{display:flex;gap:.2rem;margin-inline:auto}
.links a{padding:.45rem .8rem;border-radius:999px;color:var(--muted);text-decoration:none;font-size:.92rem;transition:color .2s,background .2s;touch-action:manipulation}
.links a:hover{color:var(--text)}
.links a.act{color:var(--ice);background:var(--surface2)}

.actions{display:flex;align-items:center;gap:.6rem}

.toggle-btn{
  border:1px solid var(--line2);background:transparent;color:var(--text);
  border-radius:999px;padding:.38rem .8rem;font:600 .85rem var(--body);
  cursor:pointer;transition:background .2s,border-color .2s;touch-action:manipulation;
  display:grid;place-items:center;height:34px;min-width:44px;
}
.toggle-btn:hover{background:var(--surface2);border-color:var(--blue)}
.toggle-btn .ic{width:16px;height:16px}

.theme-btn{width:34px;padding:0}
.theme-btn .icon-sun{display:block}
.theme-btn .icon-moon{display:none}
[data-theme="light"] .theme-btn .icon-sun{display:none}
[data-theme="light"] .theme-btn .icon-moon{display:block}

.burger{display:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--line2);background:transparent;color:var(--text);cursor:pointer;place-items:center;touch-action:manipulation}
.burger .x{display:none}
.nav.open .burger .m{display:none}
.nav.open .burger .x{display:block}

/* ============================================================
   [۱] HERO
   ============================================================ */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding:110px 0 80px;overflow:hidden}
#net{position:absolute;inset:0;z-index:0}
.hero-in{position:relative;z-index:1}
.hero-in .status,.hero-in .hero-name,.hero-in .hero-tag-row,.hero-in .role,.hero-in .sub,.hero-in .lede,.hero-in .cta,.hero-in .socials{max-width:640px}

.status{display:inline-flex;align-items:center;gap:.65rem;padding:.4rem 1rem;border:1px solid var(--line2);border-radius:999px;background:color-mix(in srgb,var(--bg) 60%,transparent);color:var(--muted);font-size:.88rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--sky);animation:ping 2.6s ease-out infinite}
@keyframes ping{
  0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--sky) 55%,transparent)}
  70%,100%{box-shadow:0 0 0 10px transparent}
}

.hero-name{margin-top:1.5rem;font-family:var(--display);font-weight:800;font-size:clamp(1.8rem,3.8vw,3.4rem);line-height:1.08;letter-spacing:-.03em;color:var(--ice);display:flex;flex-direction:column;gap:.04em;min-height:2.16em}
.hn-line{display:block;min-height:1.08em;white-space:nowrap}
.type-text{display:inline-block;white-space:nowrap;letter-spacing:-.03em;background:linear-gradient(120deg,var(--ice) 0%,var(--blue) 70%,var(--peri) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.hn-line-2 .type-text{background:linear-gradient(120deg,var(--blue) 0%,var(--peri) 60%,var(--sky) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.cursor{display:inline-block;width:.08em;min-width:3px;height:1em;margin-inline-start:.06em;background:var(--blue);border-radius:2px;transform:translateY(.08em);box-shadow:0 0 14px var(--glow);animation:blink 1s steps(2, start) infinite;vertical-align:baseline}
@keyframes blink{0%, 50%{opacity:1} 50.01%, 100%{opacity:0}}

.hero-tag-row{margin-top:1rem;display:flex;align-items:center;gap:1rem;opacity:0;animation:fadeUp .8s cubic-bezier(.2,.7,.2,1) 2.4s forwards}
.hero-tag{font-family:var(--body);font-size:.75rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);padding:.38rem .95rem;border:1px solid var(--line2);border-radius:999px;white-space:nowrap;position:relative;padding-inline-start:1.55rem}
.hero-tag::before{content:"";position:absolute;inset-inline-start:.7rem;top:50%;transform:translateY(-50%);width:6px;height:6px;border-radius:50%;background:var(--blue);box-shadow:0 0 10px var(--glow)}

.role{margin-top:1.4rem;font-family:var(--display);font-weight:600;font-size:clamp(1.05rem,1.7vw,1.3rem);color:var(--blue)}
.sub{margin-top:.55rem;color:var(--muted);font-size:1rem;line-height:1.6}
.lede{margin-top:1rem;color:var(--text);font-size:1.02rem;opacity:.9;line-height:1.7}

.up{opacity:0;transform:translateY(14px);animation:fadeUp .8s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(.55s + var(--i,0) * .1s)}
@keyframes fadeUp{to{opacity:1;transform:none}}

.cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.8rem}
.socials{display:flex;gap:.7rem;margin-top:1.5rem;flex-wrap:wrap}

/* ============================================================
   [۲] ABOUT
   ============================================================ */
.about{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.portrait{position:sticky;top:100px;border:1px solid var(--line2);border-radius:28px;overflow:hidden;aspect-ratio:4/5;background:#080C15;position:relative}
.portrait img{display:block;width:100%;height:100%;object-fit:cover;position:absolute;inset:0;z-index:1}
.portrait svg{display:block;width:100%;height:100%;object-fit:cover}
.portrait-fallback{position:absolute;inset:0;z-index:0}
.portrait.no-img img{display:none}
.portrait.no-img .portrait-fallback{z-index:1}
.spin{animation:spin 90s linear infinite;transform-origin:200px 210px}
@keyframes spin{to{transform:rotate(360deg)}}

.about p{color:var(--muted);margin-top:1.1rem;max-width:62ch}
.about h2+p{margin-top:1.5rem}

.facts{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin-top:2rem}
.fact{padding:1.1rem 1.25rem;border-radius:18px}
.fact small{display:block;color:var(--dim);font-size:.82rem}
.fact strong{display:block;margin-top:.15rem;font-family:var(--display);font-size:1.1rem;color:var(--ice);font-weight:600}

/* ============================================================
   [۳] ROADMAP
   ============================================================ */
.roadmap{position:relative;list-style:none;padding:0;margin:0 auto;max-width:920px}
.roadmap::before{content:"";position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);width:2px;background:linear-gradient(to bottom,transparent 0%,var(--blue) 6%,var(--peri) 50%,var(--sky) 94%,transparent 100%);opacity:.7}

.rm-item{position:relative;display:grid;grid-template-columns:1fr 60px 1fr;align-items:center;padding:1.5rem 0;gap:0}
.rm-marker{grid-column:2;display:grid;place-items:center;position:relative;z-index:2}
.rm-dot{width:16px;height:16px;border-radius:50%;background:var(--bg);border:2px solid var(--blue);box-shadow:0 0 0 4px color-mix(in srgb,var(--bg) 90%,transparent),0 0 16px var(--glow);position:relative;transition:transform .3s,box-shadow .3s}
.rm-dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--blue)}
.rm-item:hover .rm-dot{transform:scale(1.25);box-shadow:0 0 0 4px color-mix(in srgb,var(--bg) 90%,transparent),0 0 24px var(--glow)}
.rm-dot-start{border-color:var(--ice);background:var(--ice);width:20px;height:20px}
.rm-dot-start::after{background:var(--ice)}
.rm-dot-final{width:22px;height:22px;border-color:var(--peri);box-shadow:0 0 0 4px color-mix(in srgb,var(--bg) 90%,transparent),0 0 28px var(--peri)}
.rm-dot-final::after{background:var(--peri)}

.rm-content{grid-column:1;padding-inline-end:2rem;position:relative}
.rm-content-right{grid-column:3;padding-inline-end:0;padding-inline-start:2rem}
.rm-content-center{grid-column:1 / -1;display:flex;justify-content:center;padding:0}

.rm-card{position:relative;padding:1.3rem 1.5rem;border:1px solid var(--line);border-radius:18px;background:var(--surface);transition:transform .3s cubic-bezier(.2,.7,.2,1),border-color .3s,background .3s,box-shadow .3s}
.rm-card:hover{transform:translateY(-3px);border-color:var(--blue);background:var(--surface2);box-shadow:0 20px 40px -22px var(--glow)}

.rm-num{display:inline-block;font-family:var(--display);font-size:.78rem;font-weight:700;letter-spacing:.08em;color:var(--blue);padding:.2rem .55rem;border:1px solid var(--line2);border-radius:6px;background:color-mix(in srgb,var(--bg) 60%,transparent);margin-bottom:.55rem}
.rm-card h3{font-size:1.1rem;line-height:1.3;margin-bottom:.5rem;color:var(--ice)}
.rm-card p{color:var(--muted);font-size:.9rem;margin:0}

.rm-list{list-style:none;padding:0;margin:.5rem 0 0;display:grid;gap:.35rem}
.rm-list li{color:var(--muted);font-size:.92rem;padding-inline-start:1.1rem;position:relative;line-height:1.5}
.rm-list li::before{content:"";position:absolute;inset-inline-start:0;top:.55em;width:5px;height:5px;border-radius:50%;background:var(--blue);opacity:.7}

.rm-content::after{content:"";position:absolute;top:50%;width:2rem;height:1px;background:linear-gradient(to right,var(--line2),var(--blue));opacity:.6}
.rm-content-left::after{right:0;background:linear-gradient(to right,var(--line2),var(--blue))}
.rm-content-right::after{left:0;background:linear-gradient(to left,var(--line2),var(--blue))}

.rm-card-start{text-align:center;padding:1.1rem 1.6rem;border:1px dashed var(--line2);background:color-mix(in srgb,var(--bg) 40%,transparent)}
.rm-card-start h3{margin:0;font-size:1.05rem}
.rm-card-start p{margin-top:.2rem;font-size:.82rem;color:var(--dim)}

.rm-card-final{text-align:center;padding:1.4rem 2rem;border:1px solid var(--peri);background:linear-gradient(135deg,color-mix(in srgb,var(--peri) 14%,transparent),color-mix(in srgb,var(--blue) 14%,transparent));box-shadow:0 0 40px -12px var(--glow)}
.rm-card-final h3{margin:.3rem 0 0;font-size:1.25rem;letter-spacing:.04em;background:linear-gradient(120deg,var(--blue),var(--peri),var(--sky));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.rm-flame{font-size:1.8rem;display:block;line-height:1;filter:drop-shadow(0 0 14px var(--glow));animation:flame 1.6s ease-in-out infinite}
@keyframes flame{0%,100%{transform:scale(1) translateY(0)}50%{transform:scale(1.12) translateY(-3px)}}

/* ============================================================
   [۳] SKILLS
   ============================================================ */
.skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1rem;list-style:none;padding:0;margin:0}
.skill-card{display:flex;align-items:center;gap:1.15rem;padding:1.15rem 1.3rem;border:1px solid var(--line);border-radius:16px;background:transparent;transition:transform .25s cubic-bezier(.2,.7,.2,1),border-color .25s,background .25s}
.skill-card:hover{transform:translateY(-3px);border-color:var(--line2);background:var(--surface)}

.skill-ring{position:relative;width:70px;height:70px;flex:none;display:grid;place-items:center}
.skill-ring svg{width:100%;height:100%;transform:rotate(-90deg)}

.sr-track{fill:none;stroke:var(--line2);stroke-width:3}
.sr-fill{fill:none;stroke:url(#scGradient);stroke-width:3;stroke-linecap:round;stroke-dasharray:0 214;transition:stroke-dasharray 1.2s cubic-bezier(.4,0,.2,1)}
.skill-card.in .sr-fill{stroke-dasharray: var(--dash) 214}
.skill-card--next .sr-track{stroke:var(--dim);stroke-dasharray:2 4;opacity:.6}
.skill-card--next .sr-fill{stroke:var(--dim);opacity:.35}

.sr-value{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--display);line-height:1;color:var(--ice);text-align:center}
.sr-num{font-size:1.15rem;font-weight:800;letter-spacing:-.03em;color:var(--ice)}
.sr-pct{font-size:.62rem;font-weight:600;color:var(--muted);margin-top:.15rem;letter-spacing:.05em}
.skill-card--next .sr-num{color:var(--dim)}
.skill-card--next .sr-pct{color:var(--dim)}

.skill-text{flex:1;min-width:0}
.skill-text h4{font-family:var(--display);font-size:1rem;font-weight:600;color:var(--ice);margin:0 0 .2rem;line-height:1.25;letter-spacing:-.01em}
.skill-text p{margin:0;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.skill-card--next .skill-text h4{color:var(--muted)}
.skill-card--next .skill-text p{color:var(--dim)}

/* ============================================================
   [۴] PROJECTS
   ============================================================ */
.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.25rem}
.project-card{display:flex;flex-direction:column;gap:1rem;padding:1.6rem;border:1px solid var(--line);border-radius:20px;background:var(--surface);cursor:pointer;transition:transform .3s cubic-bezier(.2,.7,.2,1),border-color .3s,background .3s,box-shadow .3s;position:relative;overflow:hidden;touch-action:manipulation}
.project-card::before{content:"";position:absolute;inset:0;background:radial-gradient(320px circle at var(--x,50%) var(--y,0%),var(--surface2),transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.project-card:hover::before{opacity:1}
.project-card:hover{transform:translateY(-4px);border-color:var(--line2);box-shadow:0 24px 48px -22px var(--glow)}
.project-card:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

.project-icon{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:1.6rem;background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 18%,transparent),color-mix(in srgb,var(--peri) 18%,transparent));border:1px solid var(--line2);flex:none}

.project-body{display:flex;flex-direction:column;gap:.55rem;flex:1;position:relative;z-index:1}
.project-body h3{font-size:1.2rem;color:var(--ice);margin:0;line-height:1.3}
.project-body p{color:var(--muted);font-size:.92rem;line-height:1.6;margin:0}

.project-cta{display:inline-flex;align-items:center;gap:.5rem;color:var(--blue);font-weight:600;font-size:.9rem;position:relative;z-index:1}
.project-cta .ic{transition:transform .25s;width:16px;height:16px}
.project-card:hover .project-cta .ic{transform:translateX(4px)}
[dir="rtl"] .project-card:hover .project-cta .ic{transform:translateX(-4px) scaleX(-1)}

/* Project modal */
.project-modal{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:1.5rem;opacity:0;transition:opacity .25s ease}
.project-modal[hidden]{display:none}
.project-modal.on{opacity:1}
.pm-backdrop{position:absolute;inset:0;background:color-mix(in srgb, var(--bg) 82%, black);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.pm-dialog{position:relative;width:min(880px, 100%);max-height:min(88vh, 820px);display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--line2);border-radius:20px;overflow:hidden;transform:translateY(12px) scale(.98);transition:transform .3s cubic-bezier(.2,.7,.2,1);box-shadow:0 30px 80px -20px rgba(0,0,0,.6)}
.project-modal.on .pm-dialog{transform:none}
.pm-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 1.4rem;border-bottom:1px solid var(--line);background:var(--surface);flex:none}
.pm-title-wrap{display:flex;align-items:center;gap:.85rem;min-width:0}
.pm-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:1.35rem;background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 18%,transparent),color-mix(in srgb,var(--peri) 18%,transparent));border:1px solid var(--line2);flex:none}
.pm-title-wrap h3{font-size:1.05rem;color:var(--ice);margin:0;line-height:1.2}
.pm-lang{font-size:.75rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.pm-close{width:36px;height:36px;border-radius:50%;border:1px solid var(--line2);background:transparent;color:var(--muted);cursor:pointer;display:grid;place-items:center;flex:none;transition:background .2s,border-color .2s,color .2s;touch-action:manipulation}
.pm-close:hover{color:var(--ice);border-color:var(--blue);background:var(--surface2)}
.pm-close .ic{width:16px;height:16px}
.pm-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem 1.4rem;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 60%,transparent);flex:none}
.pm-file{font-family:var(--display);font-size:.85rem;font-weight:600;color:var(--muted);letter-spacing:.02em}
.pm-file::before{content:"●";color:var(--sky);margin-inline-end:.5rem;font-size:.7rem;vertical-align:middle}
.pm-actions{display:flex;gap:.5rem}
.pm-code-wrap{flex:1;overflow:auto;background:#080C15;color:#EAF0FF;font-family:'JetBrains Mono', 'Fira Code', 'Consolas', ui-monospace, SFMono-Regular, Menlo, monospace;font-size:.84rem;line-height:1.65;padding:1.1rem 0;scrollbar-width:thin;scrollbar-color:var(--line2) transparent}
.pm-code{margin:0;padding:0;counter-reset:line;display:block}
.pm-line{display:block;padding-inline:1.4rem;white-space:pre;position:relative;min-height:1.65em;counter-increment:line}
.pm-line::before{content:counter(line);display:inline-block;width:2.4rem;margin-inline-end:1rem;text-align:end;color:rgba(170,195,255,.30);user-select:none;font-variant-numeric:tabular-nums}
.pm-line:hover{background:rgba(169,198,255,.05)}
.pm-line .kw{color:#C4A7FF}
.pm-line .str{color:#A9E5C2}
.pm-line .num{color:#FFC48A}
.pm-line .com{color:#7D89A8;font-style:italic}
.pm-line .fn{color:#B9E3FF}
.pm-code-wrap::-webkit-scrollbar{width:10px;height:10px}
.pm-code-wrap::-webkit-scrollbar-track{background:transparent}
.pm-code-wrap::-webkit-scrollbar-thumb{background:var(--line2);border-radius:6px}
.pm-code-wrap::-webkit-scrollbar-thumb:hover{background:var(--blue)}

/* ============================================================
   [۵] RESEARCH
   ============================================================ */
.research-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:1.25rem}
.research-card{display:flex;flex-direction:column;gap:1rem;padding:1.6rem;border:1px solid var(--line);border-radius:20px;background:var(--surface);cursor:pointer;position:relative;overflow:hidden;transition:transform .3s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .3s;touch-action:manipulation}
.research-card::before{content:"";position:absolute;inset:0;background:radial-gradient(320px circle at var(--x,50%) var(--y,0%),var(--surface2),transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.research-card:hover::before{opacity:1}
.research-card:hover{transform:translateY(-4px);border-color:var(--line2);box-shadow:0 24px 48px -22px var(--glow)}
.research-card:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

.research-icon{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:1.5rem;background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 18%,transparent),color-mix(in srgb,var(--peri) 18%,transparent));border:1px solid var(--line2);flex:none}
.research-body{display:flex;flex-direction:column;gap:.65rem;flex:1;position:relative;z-index:1}
.research-meta{display:flex;flex-wrap:wrap;gap:.4rem}
.research-body h3{font-size:1.1rem;line-height:1.35;color:var(--ice);margin:0}
.research-body p{color:var(--muted);font-size:.92rem;line-height:1.6;margin:0}
.research-cta{display:inline-flex;align-items:center;gap:.5rem;color:var(--blue);font-weight:600;font-size:.9rem;position:relative;z-index:1}
.research-cta .ic{width:16px;height:16px;transition:transform .25s}
.research-card:hover .research-cta .ic{transform:translateX(4px)}
[dir="rtl"] .research-card:hover .research-cta .ic{transform:translateX(-4px) scaleX(-1)}

/* Article modal */
.article-modal{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:1.5rem;opacity:0;transition:opacity .25s ease}
.article-modal[hidden]{display:none}
.article-modal.on{opacity:1}
.am-backdrop{position:absolute;inset:0;background:color-mix(in srgb, var(--bg) 82%, black);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.am-dialog{position:relative;width:min(920px, 100%);max-height:min(90vh, 900px);display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--line2);border-radius:20px;overflow:hidden;transform:translateY(12px) scale(.98);transition:transform .3s cubic-bezier(.2,.7,.2,1);box-shadow:0 30px 80px -20px rgba(0,0,0,.6)}
.article-modal.on .am-dialog{transform:none}
.am-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 1.4rem;border-bottom:1px solid var(--line);background:var(--surface);flex:none}
.am-title-wrap{display:flex;align-items:center;gap:.85rem;min-width:0}
.am-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:1.35rem;background:linear-gradient(135deg,color-mix(in srgb,var(--blue) 18%,transparent),color-mix(in srgb,var(--peri) 18%,transparent));border:1px solid var(--line2);flex:none}
.am-kicker{display:block;font-size:.72rem;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;font-weight:600;margin-bottom:.15rem}
.am-title-wrap h3{font-size:1rem;color:var(--ice);margin:0;line-height:1.3}
.am-close{width:36px;height:36px;border-radius:50%;border:1px solid var(--line2);background:transparent;color:var(--muted);cursor:pointer;display:grid;place-items:center;flex:none;transition:background .2s,border-color .2s,color .2s;touch-action:manipulation}
.am-close:hover{color:var(--ice);border-color:var(--blue);background:var(--surface2)}
.am-close .ic{width:16px;height:16px}
.am-body{flex:1;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line2) transparent}
.am-body::-webkit-scrollbar{width:10px}
.am-body::-webkit-scrollbar-track{background:transparent}
.am-body::-webkit-scrollbar-thumb{background:var(--line2);border-radius:6px}
.am-body::-webkit-scrollbar-thumb:hover{background:var(--blue)}
.am-content{padding:1.8rem clamp(1.2rem, 4vw, 2.5rem) 2.4rem;max-width:760px;margin-inline:auto;color:var(--text);font-size:1rem;line-height:1.8}
.am-lead{font-size:1.08rem;color:var(--text);margin-bottom:1.2rem}
.am-content h4{font-family:var(--display);font-size:1.15rem;font-weight:700;color:var(--ice);margin:2rem 0 .8rem;line-height:1.3}
.am-content p{color:var(--muted);margin-bottom:1rem}
.am-content ul{padding-inline-start:1.4rem;margin:.6rem 0 1.2rem;display:grid;gap:.5rem}
.am-content li{color:var(--muted);line-height:1.7}
.am-content strong{color:var(--ice);font-weight:600}
.am-content em{color:var(--ice);font-style:italic}
.am-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 1.4rem}
.am-note{padding:1rem 1.2rem;border-radius:14px;border:1px solid var(--line2);background:var(--surface);color:var(--muted);font-size:.95rem;line-height:1.7;margin:1.2rem 0;position:relative;padding-inline-start:1.6rem}
.am-note::before{content:"";position:absolute;inset-inline-start:0;top:1rem;bottom:1rem;width:3px;border-radius:3px;background:var(--blue)}
.am-note strong{color:var(--ice)}
.am-note--warn::before{background:#FFC48A}
.am-note--warn strong{color:#FFC48A}
.am-table-wrap{overflow-x:auto;margin:1rem 0 1.4rem;border-radius:14px;border:1px solid var(--line);background:var(--surface);scrollbar-width:thin}
.am-table-wrap::-webkit-scrollbar{height:8px}
.am-table-wrap::-webkit-scrollbar-thumb{background:var(--line2);border-radius:4px}
.am-table{width:100%;border-collapse:collapse;font-size:.9rem;min-width:560px}
.am-table th,.am-table td{padding:.7rem 1rem;text-align:center;border-bottom:1px solid var(--line);white-space:nowrap}
.am-table th{font-family:var(--display);font-weight:600;color:var(--muted);font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;background:color-mix(in srgb,var(--bg) 40%,transparent)}
.am-table td{color:var(--text);font-variant-numeric:tabular-nums}
.am-table th:first-child,.am-table td:first-child{text-align:start}
.am-table tbody tr:last-child td{border-bottom:none}
.am-table tbody tr:hover{background:color-mix(in srgb,var(--surface2) 50%,transparent)}
.am-row-best td{color:var(--ice);font-weight:600}
.am-row-best td:first-child::after{content:"★";color:var(--blue);margin-inline-start:.5rem;font-size:.85em}
.am-chart{margin:1.4rem 0 1.8rem;padding:1rem;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.am-svg{width:100%;height:auto;display:block}
.am-caption{text-align:center;font-size:.85rem;color:var(--dim);margin:.6rem 0 0 !important}
.am-divider{border:none;height:1px;background:var(--line);margin:2rem 0 1.5rem}
.am-refs{list-style:none;padding:0;margin:0;display:grid;gap:.75rem}
.am-refs li{padding-inline-start:1.2rem;position:relative;font-size:.9rem;line-height:1.65;color:var(--muted)}
.am-refs li::before{content:"";position:absolute;inset-inline-start:0;top:.6em;width:5px;height:5px;border-radius:50%;background:var(--blue);opacity:.7}
.am-refs em{color:var(--text);font-style:italic}

/* ============================================================
   [۶] CERTIFICATES
   ============================================================ */
.certs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem;list-style:none;padding:0;margin:0}
.cert-card{display:block}
.cert-button{display:flex;flex-direction:column;width:100%;padding:0;border:1px solid var(--line);border-radius:20px;background:var(--surface);cursor:pointer;overflow:hidden;font-family:inherit;color:inherit;text-align:inherit;transition:transform .3s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .3s;touch-action:manipulation}
.cert-button:hover{transform:translateY(-4px);border-color:var(--line2);box-shadow:0 24px 48px -22px var(--glow)}
.cert-button:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

.cert-thumb{position:relative;aspect-ratio:4/3;background:#080C15;overflow:hidden;display:grid;place-items:center}
.cert-thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.cert-button:hover .cert-thumb img{transform:scale(1.04)}

.cert-fallback{position:absolute;inset:0;display:none;place-items:center;background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--blue) 15%,transparent),transparent 70%);color:var(--dim)}
.cert-fallback .ic{width:48px;height:48px;stroke-width:1.4}
.cert-thumb.cert-noimg img{display:none}
.cert-thumb.cert-noimg .cert-fallback{display:grid}

.cert-zoom{position:absolute;top:.75rem;inset-inline-end:.75rem;width:36px;height:36px;border-radius:50%;background:rgba(6,8,14,.72);border:1px solid var(--line2);color:var(--blue);display:grid;place-items:center;opacity:0;transform:translateY(-4px);transition:opacity .3s,transform .3s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.cert-button:hover .cert-zoom,.cert-button:focus-visible .cert-zoom{opacity:1;transform:none}
.cert-zoom .ic{width:16px;height:16px}

.cert-info{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem 1.25rem;border-top:1px solid var(--line)}
.cert-info h3{font-size:1rem;font-weight:600;color:var(--ice);margin:0;line-height:1.3;letter-spacing:-.01em}
.cert-hint{font-size:.78rem;color:var(--blue);font-weight:600;letter-spacing:.06em;text-transform:uppercase;flex:none;opacity:.85;transition:opacity .2s}
.cert-button:hover .cert-hint{opacity:1}

/* Certificate lightbox */
.cert-lightbox{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:1.5rem;opacity:0;transition:opacity .3s ease}
.cert-lightbox[hidden]{display:none}
.cert-lightbox.on{opacity:1}
.cl-backdrop{position:absolute;inset:0;background:color-mix(in srgb,var(--bg) 88%, black);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:zoom-out}
.cl-dialog{position:relative;max-width:min(1200px,100%);max-height:92vh;display:flex;flex-direction:column;border-radius:18px;overflow:hidden;border:1px solid var(--line2);background:var(--bg);transform:scale(.95);transition:transform .35s cubic-bezier(.2,.7,.2,1);box-shadow:0 40px 100px -30px rgba(0,0,0,.7)}
.cert-lightbox.on .cl-dialog{transform:scale(1)}
.cl-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1.2rem;border-bottom:1px solid var(--line);background:var(--surface);flex:none}
.cl-header h3{font-size:1rem;color:var(--ice);margin:0;line-height:1.3}
.cl-actions{display:flex;gap:.5rem}
.cl-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--line2);background:transparent;color:var(--muted);cursor:pointer;display:grid;place-items:center;text-decoration:none;transition:color .2s,background .2s,border-color .2s;touch-action:manipulation}
.cl-btn:hover{color:var(--ice);border-color:var(--blue);background:var(--surface2)}
.cl-btn .ic{width:16px;height:16px}
.cl-image-wrap{flex:1;overflow:auto;display:grid;place-items:center;padding:1rem;background:#080C15;min-height:0}
.cl-image-wrap img{display:block;max-width:100%;max-height:calc(92vh - 8rem);border-radius:10px;box-shadow:0 20px 40px -20px rgba(0,0,0,.5)}

/* ============================================================
   [۷] CONTACT
   ============================================================ */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.contact-info h2{font-size:clamp(2.2rem,4.8vw,3.6rem);line-height:1.08;letter-spacing:-.03em}
.contact-info .lead{margin-top:1rem;max-width:52ch}

.clinks{display:grid;gap:.7rem;margin-top:2rem}
.cl-row{display:flex;align-items:center;gap:1rem;padding:.9rem 1.1rem;border:1px solid var(--line);border-radius:16px;text-decoration:none;color:inherit;transition:transform .25s cubic-bezier(.2,.7,.2,1),border-color .25s,background .25s;touch-action:manipulation}
.cl-row:hover{transform:translateY(-2px);border-color:var(--blue);background:var(--surface2)}
.cl-row .ib{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--blue) 12%,transparent);color:var(--blue);flex:none;transition:background .25s,color .25s}
.cl-row:hover .ib{background:color-mix(in srgb,var(--blue) 22%,transparent)}
.cl-row .cl-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}
.cl-row small{display:block;color:var(--dim);font-size:.78rem;line-height:1.3;letter-spacing:.06em;text-transform:uppercase;font-weight:600}
.cl-row .v{display:block;color:var(--text);font-size:.95rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cl-row .cl-arrow{width:16px;height:16px;color:var(--dim);flex:none;opacity:0;transform:translateX(-6px);transition:opacity .25s,transform .25s,color .25s}
.cl-row:hover .cl-arrow{opacity:1;transform:translateX(0);color:var(--blue)}
[dir="rtl"] .cl-row .cl-arrow.flip{transform:scaleX(-1) translateX(6px)}
[dir="rtl"] .cl-row:hover .cl-arrow{transform:scaleX(-1) translateX(0)}

.contact-form{padding:1.6rem;display:grid;gap:1.1rem}
.cf-head{display:flex;align-items:center;gap:.5rem;font-family:var(--display);font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:.4rem}
.cf-dot{width:7px;height:7px;border-radius:50%;background:var(--sky);box-shadow:0 0 8px var(--sky);animation:ping 2.6s ease-out infinite}
.cf-field{display:grid;gap:.4rem;font-size:.88rem;color:var(--muted)}
.cf-field > span{font-weight:600;letter-spacing:.02em}
.cf-field input,.cf-field textarea{width:100%;padding:.85rem 1rem;border:1px solid var(--line2);border-radius:12px;background:color-mix(in srgb,var(--bg) 70%,transparent);color:var(--text);font:inherit;font-size:.98rem;font-family:var(--body);transition:border-color .2s,box-shadow .2s,background .2s}
.cf-field input:focus,.cf-field textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px color-mix(in srgb,var(--blue) 18%,transparent);background:var(--bg)}
.cf-field input::placeholder,.cf-field textarea::placeholder{color:var(--dim);opacity:.8}
.cf-field textarea{resize:vertical;min-height:120px;line-height:1.6}
.cf-submit{justify-self:start;margin-top:.3rem}
.cf-note{margin:0;font-size:.8rem;color:var(--dim);line-height:1.5}
.cf-field input:user-invalid,.cf-field textarea:user-invalid{border-color:#ff8a8a;box-shadow:0 0 0 4px rgba(255,138,138,.15)}

/* ============================================================
   [۸] FOOTER
   ============================================================ */
footer{border-top:1px solid var(--line);padding:3rem 0 2.5rem;margin-top:2rem}
.foot{display:flex;flex-wrap:wrap;gap:1.5rem 3rem;justify-content:space-between;align-items:flex-end}
.foot p{color:var(--muted);font-size:.92rem}
.foot .n{font-family:var(--display);font-weight:700;color:var(--ice);font-size:1.25rem}
.foot .socials{margin-top:0}
.tagl{margin-top:2rem;color:var(--dim);font-family:var(--display);font-size:1.05rem}