*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --bg:#0a0a0a;
  --bg2:#111316;
  --panel:#16181c;
  --text:#e4e4e4;
  --mid:#8b8f94;
  --faint:#52565b;
  --line:#26292e;
  --accent:#00ff9c;
  --accent-dim:rgba(0,255,156,.09);
  --accent-dim2:rgba(0,255,156,.16);
  --red-dot:#ff5f57;
  --yellow-dot:#febc2e;
  --green-dot:#28c840;
  --max:900px;
  --pad:2.5rem;
  --br-font:'JetBrains Mono',monospace;
  --mono:'JetBrains Mono',monospace;
}

html { scroll-behavior:smooth; }

body {
  font-family:var(--br-font);
  background:var(--bg);
  color:var(--text);
  overflow-x:hidden;
}

::selection{background:var(--accent);color:var(--bg);}

::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--line);border:2px solid var(--bg);}
::-webkit-scrollbar-thumb:hover{background:var(--faint);}

@keyframes cursorBlink{0%,49%{opacity:1;}50%,100%{opacity:0;}}

/* ── LAYOUT WRAPPER ── */
.wrap {
  max-width:var(--max);
  margin:0 auto;
  padding:0 var(--pad);
}

/* ── NAV ── */
.nav-outer {
  position:fixed;top:0;left:0;right:0;
  z-index:100;
  background:var(--bg);
  border-bottom:1px solid var(--line);
}
nav {
  max-width:var(--max);
  margin:0 auto;
  padding:1rem var(--pad);
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.nav-brand {
  display:flex;align-items:center;gap:.85rem;
  text-decoration:none;flex-shrink:0;
}
.term-dots{display:flex;gap:5px;flex-shrink:0;}
.term-dots span{width:9px;height:9px;border-radius:50%;display:block;}
.term-dots span:nth-child(1){background:var(--red-dot);}
.term-dots span:nth-child(2){background:var(--yellow-dot);}
.term-dots span:nth-child(3){background:var(--green-dot);}
.nav-logo-img {
  width:30px;height:30px;
  border-radius:0;display:block;
  border:1px solid var(--line);
  filter:grayscale(1) contrast(1.1);
}
.nav-brand-name {
  font-family:var(--mono);font-size:11px;
  letter-spacing:.1em;color:var(--mid);
}
.nav-links {
  display:flex;gap:1.75rem;list-style:none;
}
.nav-links a {
  font-family:var(--mono);font-size:11px;letter-spacing:.04em;
  color:var(--mid);text-decoration:none;
  transition:color .2s;
}
.nav-links a::before{content:'~/';color:var(--faint);}
.nav-links a:hover,.nav-links a.active { color:var(--accent); }
.nav-links a.active { text-shadow:0 0 12px var(--accent-dim2); }
.nav-right {
  display:flex;align-items:center;gap:1rem;flex-shrink:0;
}
.avail-pill {
  display:flex;align-items:center;gap:.4rem;
  font-family:var(--mono);font-size:10px;letter-spacing:.04em;
  padding:.3rem .7rem;
  background:var(--accent-dim);
  border:1px solid var(--accent);
  border-radius:0;color:var(--accent);
  white-space:nowrap;
  text-decoration:none;
}
.avail-pill::before{content:'[ ';color:var(--accent);}
.avail-pill::after{content:' ]';color:var(--accent);}
.avail-dot {
  width:5px;height:5px;border-radius:50%;
  background:var(--accent);
  animation:blink 2.2s infinite;flex-shrink:0;
}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
.local-time {
  font-family:var(--mono);font-size:10px;
  color:var(--faint);letter-spacing:.04em;white-space:nowrap;
}

/* ── PROMPT / TERMINAL UI ── */
.term-prompt{
  font-family:var(--mono);font-size:12px;letter-spacing:.02em;
  color:var(--faint);margin-bottom:.85rem;
  opacity:0;animation:up .5s ease forwards;
}
.term-prompt .u{color:var(--mid);}
.term-prompt .p{color:var(--accent);}

/* ── HERO (home) ── */
.hero {
  padding:calc(64px + 5rem) 0 4rem;
}
.hero-overline {
  font-family:var(--mono);font-size:11px;
  letter-spacing:.08em;
  color:var(--accent);margin-bottom:1.75rem;
  opacity:0;animation:up .6s .05s ease forwards;
}
.hero-overline::before{content:'$ ';color:var(--faint);}
.hero-name {
  font-size:clamp(3.2rem,8vw,7rem);
  font-weight:700;line-height:.95;
  letter-spacing:-.02em;
  margin-bottom:2.5rem;
  opacity:0;animation:up .7s .15s ease forwards;
}
.hero-name span {
  display:block;
  color:var(--text);
  -webkit-text-stroke:0px;
  text-shadow:0 0 0 transparent;
  transition:color .3s,text-shadow .3s;
}
.hero-name span:hover {
  color:var(--accent);text-shadow:0 0 28px var(--accent-dim2);
}
.hero-name::after{
  content:'_';color:var(--accent);
  animation:cursorBlink 1s steps(1) infinite;
  font-weight:400;
}
.hero-bottom {
  display:grid;
  grid-template-columns:1fr auto;
  gap:3rem;align-items:end;
  opacity:0;animation:up .7s .3s ease forwards;
}
.hero-desc {
  font-size:1rem;font-weight:300;
  line-height:1.75;color:var(--mid);
}
.hero-desc strong { color:var(--accent);font-weight:500; }
.hero-stats {
  display:flex;flex-direction:column;
  gap:.9rem;text-align:right;flex-shrink:0;
}
.stat-item { border-top:1px solid var(--line);padding-top:.65rem; }
.stat-num {
  font-size:2.1rem;font-weight:700;
  line-height:1;letter-spacing:-.02em;color:var(--accent);
  text-shadow:0 0 18px var(--accent-dim2);
}
.stat-label {
  font-family:var(--mono);font-size:9.5px;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--faint);margin-top:.2rem;
}

/* ── PAGE HERO (inner pages) ── */
.page-hero {
  padding:calc(64px + 3.5rem) 0 3rem;
}
.page-hero-overline {
  font-family:var(--mono);font-size:11px;
  letter-spacing:.08em;
  color:var(--accent);margin-bottom:1.25rem;
}
.page-hero-overline::before{content:'$ ';color:var(--faint);}
.page-hero-title {
  font-size:clamp(2.4rem,5.5vw,4rem);
  font-weight:700;line-height:1;
  letter-spacing:-.02em;
  margin-bottom:1.5rem;
}
.page-hero-title::after{
  content:'_';color:var(--accent);
  animation:cursorBlink 1s steps(1) infinite;
}
.page-hero-title em{font-style:normal;font-weight:400;color:var(--mid);}
.page-hero-desc {
  font-size:1rem;font-weight:300;
  line-height:1.75;color:var(--mid);
  max-width:640px;
}
.page-hero-desc strong{color:var(--accent);font-weight:500;}

/* ── BREADCRUMB ── */
.crumb {
  padding:calc(64px + 1.75rem) 0 0;
  font-family:var(--mono);font-size:10.5px;
  letter-spacing:.04em;
  color:var(--faint);
}
.crumb a{color:var(--mid);text-decoration:none;transition:color .2s;}
.crumb a:hover{color:var(--accent);}
.crumb span{color:var(--faint);padding:0 .4rem;}

/* ── MARQUEE ── */
.marquee-wrap {
  overflow:hidden;padding:.8rem 0;
  background:var(--bg2);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  margin-top:3.5rem;
}
.marquee-track {
  display:flex;width:max-content;
  animation:scroll 32s linear infinite;
}
.marquee-track:hover{ animation-play-state:paused; }
.marquee-item {
  font-family:var(--mono);font-size:11px;
  letter-spacing:.08em;
  color:var(--mid);padding:0 1.75rem;
  white-space:nowrap;opacity:.7;
}
.marquee-sep{color:var(--accent);opacity:1;padding:0;}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── SECTIONS ── */
.section {
  padding:5.5rem 0;
  border-top:1px solid var(--line);
}
.section.no-border{border-top:none;}
.section-header {
  display:flex;align-items:baseline;gap:1rem;
  margin-bottom:3.5rem;
}
.section-header.with-link{justify-content:space-between;}
.section-idx {
  font-family:var(--mono);font-size:10px;
  letter-spacing:.06em;color:var(--faint);
}
.section-idx::before{content:'// ';}
.section-title {
  font-size:clamp(1.7rem,3.2vw,2.5rem);
  font-weight:700;letter-spacing:-.02em;
  color:var(--text);line-height:1;
}
.section-title em {
  font-style:normal;font-weight:400;color:var(--accent);
}
.section-link{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;
  color:var(--accent);text-decoration:none;
  border-bottom:1px solid rgba(0,255,156,.35);padding-bottom:2px;white-space:nowrap;
  transition:border-color .2s;
}
.section-link:hover{border-color:var(--accent);}

/* ── ABOUT ── */
.about-grid {
  display:grid;
  grid-template-columns:minmax(240px,320px) 1fr;
  gap:4rem;align-items:start;
}
.about-photo-col {
  display:flex;flex-direction:column;
  align-items:center;gap:1.25rem;
}
.about-logo-seal {
  width:56px;height:56px;
  border-radius:0;display:block;
  border:1px solid var(--line);
}
.about-photo {
  width:100%;aspect-ratio:4/5;
  background:var(--bg2);
  border:1px solid var(--line);
  border-radius:0;overflow:hidden;
  position:relative;
}
.about-photo img {
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:50% 5%;
  display:block;
  filter:grayscale(1) contrast(1.05) brightness(.95);
}
#ph-color{filter:none;}
.about-photo-badge {
  position:absolute;bottom:.75rem;left:.75rem;
  font-family:var(--mono);font-size:9px;
  letter-spacing:.06em;
  padding:.25rem .6rem;
  background:var(--accent);color:var(--bg);
  border-radius:0;font-weight:600;z-index:2;
}
.about-text {
  font-size:.95rem;font-weight:300;
  line-height:1.85;color:var(--mid);
}
.about-text strong{color:var(--accent);font-weight:500;}
.about-text p+p{margin-top:1.1rem;}
.about-tags {
  margin-top:1.75rem;
  display:flex;flex-wrap:wrap;gap:.4rem;
}
.atag {
  font-family:var(--mono);font-size:9.5px;
  letter-spacing:.04em;
  padding:.3rem .65rem;
  border:1px solid var(--line);color:var(--mid);
  border-radius:0;
  transition:border-color .2s,color .2s;
}
.atag::before{content:'#';color:var(--faint);}
.atag:hover{border-color:var(--accent);color:var(--accent);}
.atag:hover::before{color:var(--accent);}

/* ── ACHIEVEMENT CARDS ── */
.achieve-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--line);
  border:1px solid var(--line);
  margin-bottom:3.5rem;
}
.achieve-card {
  background:var(--bg2);
  padding:1.75rem;
}
.achieve-num {
  font-size:2.4rem;font-weight:700;
  letter-spacing:-.02em;color:var(--accent);
  line-height:1;margin-bottom:.4rem;
  text-shadow:0 0 20px var(--accent-dim2);
}
.achieve-label {
  font-family:var(--mono);font-size:9.5px;
  letter-spacing:.06em;
  color:var(--mid);line-height:1.5;
}

/* ── EXPERIENCE ── */
.exp-list{display:flex;flex-direction:column;}
.exp-item{border-top:1px solid var(--line);}
.exp-item:last-child{border-bottom:1px solid var(--line);}
.exp-head {
  display:grid;
  grid-template-columns:2.5rem 1fr auto 1.75rem;
  align-items:center;gap:1.25rem;
  padding:1.35rem 0;
  transition:opacity .2s;cursor:pointer;
}
.exp-head:hover{opacity:.75;}
.exp-num {
  font-family:var(--mono);font-size:10px;
  letter-spacing:.04em;color:var(--faint);
}
.exp-num::before{content:'[';color:var(--faint);}
.exp-num::after{content:']';color:var(--faint);}
.exp-head-main {
  display:flex;align-items:center;gap:1rem;min-width:0;
}
.exp-logo {
  width:34px;height:34px;border-radius:0;
  background:#fff;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;flex-shrink:0;
}
.exp-logo img {width:22px;height:22px;object-fit:contain;display:block;}
.exp-company {
  font-size:1.02rem;font-weight:600;
  letter-spacing:-.01em;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.exp-role {
  font-size:.8rem;font-weight:300;
  color:var(--mid);margin-top:.08rem;
}
.exp-period {
  font-family:var(--mono);font-size:9.5px;
  letter-spacing:.02em;color:var(--mid);
  text-align:right;white-space:nowrap;
}
.exp-arrow {
  font-size:1rem;color:var(--faint);
  transition:transform .35s cubic-bezier(.77,0,.18,1),color .2s;
  user-select:none;text-align:center;
}
.exp-item.open .exp-arrow {
  transform:rotate(45deg);color:var(--accent);
  text-shadow:0 0 10px var(--accent-dim2);
}
.exp-body {
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .4s cubic-bezier(.77,0,.18,1);
}
.exp-item.open .exp-body{grid-template-rows:1fr;}
.exp-body-inner {
  overflow:hidden;
  padding-left:calc(2.5rem + 1.25rem + 34px + 1rem);
}
.exp-body-content{padding-bottom:1.75rem;}
.exp-desc {
  font-size:.9rem;font-weight:300;
  line-height:1.8;color:var(--mid);
  margin-bottom:1rem;
}
.exp-bullets {
  list-style:none;margin-bottom:1rem;
}
.exp-bullets li {
  font-size:.85rem;font-weight:300;
  line-height:1.7;color:var(--mid);
  padding-left:1.1rem;position:relative;
  margin-bottom:.3rem;
}
.exp-bullets li::before {
  content:'>';position:absolute;left:0;color:var(--accent);
}
.exp-meta {
  display:flex;align-items:center;
  gap:1.25rem;flex-wrap:wrap;margin-bottom:.85rem;
}
.exp-loc-badge {
  font-family:var(--mono);font-size:9px;
  letter-spacing:.04em;color:var(--mid);
}
.exp-site {
  font-family:var(--mono);font-size:9px;
  letter-spacing:.04em;
  color:var(--accent);text-decoration:none;
  border-bottom:1px dotted rgba(0,255,156,.5);padding-bottom:1px;
  transition:border-color .2s;
}
.exp-site:hover{border-color:var(--accent);}
.exp-case-link{
  font-family:var(--mono);font-size:9px;
  letter-spacing:.04em;
  color:var(--accent);text-decoration:none;
  padding:.2rem .55rem;background:var(--accent-dim);
  border:1px solid rgba(0,255,156,.35);
  border-radius:0;transition:background .2s,border-color .2s;
}
.exp-case-link:hover{background:var(--accent-dim2);border-color:var(--accent);}
.exp-chips {display:flex;flex-wrap:wrap;gap:.35rem;}
.chip {
  font-family:var(--mono);font-size:8.5px;
  letter-spacing:.04em;
  padding:.25rem .55rem;
  background:var(--bg2);
  border:1px solid var(--line);
  color:var(--mid);border-radius:0;
}
.chip::before{content:'#';color:var(--faint);}

/* ── STACK ── */
.stack-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
}
.stack-col {
  padding:1.75rem;
  border-left:1px solid var(--line);
}
.stack-col:first-child{border-left:none;padding-left:0;}
.stack-cat {
  font-family:var(--mono);font-size:9px;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--accent);margin-bottom:1.1rem;
}
.stack-cat::before{content:'// ';color:var(--faint);}
.sk-row {
  display:flex;align-items:center;
  gap:.55rem;margin-bottom:.7rem;
}
.sk-bullet {
  width:3px;height:3px;border-radius:50%;
  background:var(--line);flex-shrink:0;
  transition:background .2s;
}
.sk-row:hover .sk-bullet{background:var(--accent);box-shadow:0 0 6px var(--accent);}
.sk-text {
  font-size:.82rem;font-weight:300;
  color:var(--mid);transition:color .2s;
}
.sk-row:hover .sk-text{color:var(--text);}

/* ── TEASER CARDS (home) ── */
.teaser-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--line);border:1px solid var(--line);
}
.teaser-card{
  background:var(--bg2);padding:2.25rem;
  text-decoration:none;color:inherit;
  display:flex;flex-direction:column;gap:.85rem;
  transition:background .25s;
}
.teaser-card:hover{background:var(--panel);}
.teaser-idx{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;
  color:var(--faint);
}
.teaser-idx::before{content:'[';}
.teaser-idx::after{content:']';}
.teaser-title{
  font-size:1.35rem;font-weight:700;letter-spacing:-.01em;
  color:var(--text);
}
.teaser-desc{
  font-size:.85rem;font-weight:300;line-height:1.65;color:var(--mid);
  flex:1;
}
.teaser-cta{
  font-family:var(--mono);font-size:10px;letter-spacing:.04em;
  color:var(--accent);
}

/* ── BROWSER-FRAME CHROME (shared by work cards + case study snapshots) ── */
.browser-bar{
  display:flex;align-items:center;gap:8px;
  padding:.55rem .75rem;border-bottom:1px solid var(--line);
  background:var(--panel);
}
.browser-bar .term-dots span{width:7px;height:7px;}
.browser-bar-url{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.02em;
  color:var(--faint);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* ── WORK GRID ── */
.work-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;
}
.work-card{
  grid-column:1 / -1;
  display:flex;flex-direction:column;
  border:1px solid var(--line);border-radius:0;
  text-decoration:none;color:inherit;background:var(--bg2);
  overflow:hidden;
  transition:border-color .2s,background .2s;
}
.work-card:hover{border-color:var(--accent);background:var(--panel);}
.work-card.featured{
  border-color:var(--accent);background:var(--accent-dim);
}
.work-card.featured:hover{background:var(--accent-dim2);}
.work-card.featured .work-card-shot{aspect-ratio:16/6;}
.work-card-shot{
  width:100%;aspect-ratio:16/9;object-fit:cover;object-position:top;
  display:block;filter:saturate(.85) contrast(1.03);
  background:var(--bg2);
}
.work-card-lower{
  display:flex;align-items:center;gap:1.25rem;
  padding:1.5rem 1.75rem;
}
.work-card-logo{
  width:52px;height:52px;border-radius:0;
  &:not(.dark){background:#fff;border:1px solid var(--line);} 
  &.dark{
    background:var(--bg2);border-color:var(--line);
  }
  display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;
}
.work-card-logo img{width:34px;height:34px;object-fit:contain;display:block;}
.work-card-body{min-width:0;flex:1;}
.work-card-tag{
  font-family:var(--mono);font-size:9px;letter-spacing:.06em;
  color:var(--accent);margin-bottom:.4rem;
}
.work-card-name{
  font-size:1.2rem;font-weight:700;letter-spacing:-.01em;
  color:var(--text);margin-bottom:.3rem;
}
.work-card-pitch{
  font-size:.83rem;font-weight:300;line-height:1.6;color:var(--mid);
}
.work-card-meta{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.02em;
  color:var(--mid);text-align:right;white-space:nowrap;flex-shrink:0;
}
.work-card-arrow{font-size:1.4rem;color:var(--faint);margin-left:.5rem;flex-shrink:0;}
.work-card:hover .work-card-arrow{color:var(--accent);}
@media(max-width:820px){
  .work-grid{grid-template-columns:1fr;}
  .work-card.featured{grid-column:auto;}
  .work-card.featured .work-card-shot{aspect-ratio:16/9;}
}

/* ── CASE STUDY PAGE ── */
.cs-hero{
  padding:2.5rem 0 3.5rem;display:flex;align-items:center;gap:1.75rem;
  flex-wrap:wrap;
}
.cs-logo{
  width:84px;height:84px;border-radius:0;
  background:#fff;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;
}
.cs-logo img{width:56px;height:56px;object-fit:contain;display:block;}
.cs-heading-col{flex:1;min-width:260px;}
.cs-tagline{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;
  color:var(--accent);margin-bottom:.5rem;
}
.cs-tagline::before{content:'// ';color:var(--faint);}
.cs-name{
  font-size:clamp(2rem,4.5vw,3.1rem);font-weight:700;
  letter-spacing:-.02em;line-height:1;color:var(--text);
}
.cs-meta-row{
  display:flex;flex-wrap:wrap;gap:1.5rem;margin:2rem 0 3rem;
  padding:1.5rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.cs-meta-item{}
.cs-meta-label{
  font-family:var(--mono);font-size:9px;letter-spacing:.06em;
  color:var(--faint);margin-bottom:.35rem;
}
.cs-meta-value{font-size:.9rem;font-weight:500;color:var(--text);}
.cs-shot-frame{
  border:1px solid var(--line);background:var(--bg2);
  margin-bottom:3rem;
}
.cs-shot-frame img{width:100%;height:auto;display:block;}
.cs-narrative{
  font-size:.98rem;font-weight:300;line-height:1.85;color:var(--mid);
  max-width:680px;margin-bottom:2.5rem;
}
.cs-narrative p+p{margin-top:1.15rem;}
.cs-narrative strong{color:var(--accent);font-weight:500;}
.cs-sub{
  font-family:var(--mono);font-size:10px;letter-spacing:.08em;
  color:var(--accent);margin-bottom:1.1rem;
}
.cs-sub::before{content:'$ ';color:var(--faint);}
.cs-chips{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:2.5rem;}
.cs-more{
  display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.5rem;
}
.cs-more a{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.04em;
  color:var(--mid);text-decoration:none;
  padding:.5rem 1rem;border:1px solid var(--line);border-radius:0;
  transition:border-color .2s,color .2s;
}
.cs-more a:hover{border-color:var(--accent);color:var(--accent);}

/* ── CONTACT ── */
.contact-big {
  font-size:clamp(1.7rem,4.2vw,3.6rem);
  font-weight:700;letter-spacing:-.02em;
  line-height:1.1;
  color:var(--text);margin-bottom:2.5rem;
}
.contact-big a {
  text-decoration:none;color:var(--accent);
  border-bottom:3px solid var(--accent);
  padding-bottom:2px;transition:opacity .2s;
  text-shadow:0 0 24px var(--accent-dim2);
}
.contact-big a:hover{opacity:.75;}
.contact-row{display:flex;flex-wrap:wrap;gap:1rem;}
.c-link {
  display:inline-flex;align-items:center;gap:.5rem;
  text-decoration:none;
  font-family:var(--mono);font-size:10.5px;
  letter-spacing:.04em;
  padding:.6rem 1.25rem;
  border:1px solid var(--line);color:var(--mid);
  border-radius:0;background:var(--bg2);
  transition:background .2s,border-color .2s,color .2s;
}
.c-link svg{filter:none;}
.c-link:hover{border-color:var(--accent);color:var(--accent);}
.c-link.primary {
  background:var(--accent);border-color:var(--accent);color:var(--bg);font-weight:600;
}
.c-link.primary svg{fill:var(--bg) !important;}
.c-link.primary:hover {
  opacity:.85;color:var(--bg);
}
.contact-group{margin-bottom:2.5rem;}
.contact-group-label{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;
  color:var(--faint);margin-bottom:1rem;
}
.contact-group-label::before{content:'// ';}

/* ── FOOTER ── */
footer {
  border-top:1px solid var(--line);
  padding:1.5rem 0;
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:1rem;
}
.f-left,.f-right {
  font-family:var(--mono);font-size:9.5px;
  letter-spacing:.04em;color:var(--faint);
}
.footer-socials{
  display:flex;gap:1.1rem;flex-wrap:wrap;
}
.footer-socials a{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.04em;
  color:var(--mid);text-decoration:none;
  transition:color .2s;
}
.footer-socials a::before{content:'/';color:var(--faint);margin-right:2px;}
.footer-socials a:hover{color:var(--accent);}

/* ── ANIMATIONS ── */
@keyframes up{
  from{opacity:0;transform:translateY(16px);}
  to{opacity:1;transform:none;}
}

/* ── RESPONSIVE ── */
@media(max-width:820px){
  :root{--pad:1.5rem;}
  .about-grid{grid-template-columns:1fr;}
  .about-photo{aspect-ratio:3/2;max-height:300px;}
  .about-photo img{object-position:50% 12%;}
  .achieve-grid{grid-template-columns:1fr 1fr;}
  .stack-grid{grid-template-columns:1fr 1fr;}
  .exp-body-inner{padding-left:0;}
  .exp-head{grid-template-columns:2rem 1fr 1.5rem;}
  .exp-period{display:none;}
  .teaser-grid{grid-template-columns:1fr;}
  .work-card-meta{display:none;}
  .work-card-arrow{display:none;}
}
@media(max-width:600px){
  :root{--pad:1.25rem;}
  .nav-links,.local-time{display:none;}
  .hero{padding:calc(60px + 3.5rem) 0 3rem;}
  .hero-bottom{grid-template-columns:1fr;}
  .hero-stats{flex-direction:row;text-align:left;gap:1.5rem;}
  .stat-item{border-top:none;border-left:1px solid var(--line);padding:0 0 0 1rem;}
  .achieve-grid{grid-template-columns:1fr;}
  .stack-grid{grid-template-columns:1fr 1fr;}
  footer{flex-direction:column;gap:.4rem;align-items:flex-start;}
  .avail-pill span:last-child{display:none;}
  .cs-hero{flex-direction:column;align-items:flex-start;}
}