:root{
    --ink:#0A0706;--ink-2:#140F0D;--surface:#191310;
    --line:rgba(255,255,255,.09);--line-strong:rgba(255,255,255,.16);
    --fg:#F5F0EC;--fg-dim:#A39A93;--fg-faint:#5F564F;
    --accent:#FF4D1A;--accent-bright:#FF4400;--accent-deep:#A41F00;
    --accent-soft:rgba(255,77,26,.14);--accent-line:rgba(255,77,26,.42);--glow:rgba(255,68,0,.5);
    --display:"Space Grotesk",system-ui,sans-serif;
    --body:"Inter",system-ui,sans-serif;
    --mono:"JetBrains Mono",ui-monospace,monospace;
    --maxw:1180px;--ease:cubic-bezier(.22,.61,.36,1);
  }
  [data-theme="light"]{
    --ink:#F4EEE9;--ink-2:#ECE4DD;--surface:#FBF6F1;
    --line:rgba(26,15,10,.12);--line-strong:rgba(26,15,10,.22);
    --fg:#1A0F0A;--fg-dim:#5A4E46;--fg-faint:#9A8E84;
    --accent:#D93800;--accent-bright:#D93800;--accent-deep:#8A2400;
    --accent-soft:rgba(217,56,0,.1);--accent-line:rgba(217,56,0,.4);--glow:rgba(217,56,0,.22);
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
  body{margin:0;background:var(--ink);color:var(--fg);font-family:var(--body);font-weight:400;line-height:1.6;-webkit-font-smoothing:antialiased;transition:background .5s var(--ease),color .5s var(--ease);overflow-x:hidden}
  a{color:inherit;text-decoration:none}
  ::selection{background:var(--accent);color:#140705}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,56px)}

  /* nav */
  header.nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(14px);background:color-mix(in srgb,var(--ink) 80%,transparent);border-bottom:1px solid var(--line);transition:background .5s var(--ease),border-color .5s var(--ease)}
  .nav-inner{display:flex;align-items:center;justify-content:space-between;height:70px}
  .brand{font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-.02em}
  .brand b{color:var(--accent);font-weight:700}
  .nav-links{display:flex;gap:24px;align-items:center}
  .nav-links a{font-size:13px;color:var(--fg-dim);position:relative;padding:4px 0;transition:color .3s var(--ease);font-weight:500}
  .nav-links a::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--accent);transition:width .35s var(--ease)}
  .nav-links a:hover,.nav-links a:focus-visible{color:var(--fg)}
  .nav-links a:hover::after,.nav-links a:focus-visible::after{width:100%}
  .toggle{display:flex;align-items:center;gap:8px;cursor:pointer;border:1px solid var(--line-strong);border-radius:100px;padding:6px 12px;background:transparent;color:var(--fg-dim);font-family:var(--mono);font-size:11px;letter-spacing:.1em;transition:border-color .3s var(--ease),color .3s var(--ease)}
  .toggle:hover{border-color:var(--accent-line);color:var(--fg)}
  .toggle svg{width:14px;height:14px}
  .menu-btn{display:none;background:none;border:0;color:var(--fg);cursor:pointer}

  /* hero */
  .hero{padding:clamp(48px,9vw,104px) 0 clamp(60px,9vw,120px);position:relative;overflow:hidden}
  .hero::before{content:"";position:absolute;z-index:0;left:-8%;bottom:-30%;width:70%;height:120%;background:radial-gradient(closest-side,var(--glow),transparent 72%);filter:blur(30px);opacity:.9;pointer-events:none}
  .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(30px,5vw,64px);align-items:center}
  .hero-tag{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-dim);border:1px solid var(--line);border-radius:100px;padding:7px 14px;margin-bottom:26px}
  .hero-tag .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pulse 2.6s infinite}
  @keyframes pulse{0%{box-shadow:0 0 0 0 var(--glow)}70%{box-shadow:0 0 0 8px rgba(255,68,0,0)}100%{box-shadow:0 0 0 0 rgba(255,68,0,0)}}
  @media (prefers-reduced-motion:reduce){.hero-tag .dot{animation:none}}
  h1.name{font-family:var(--display);font-weight:700;font-size:clamp(46px,8.4vw,104px);line-height:.96;letter-spacing:-.035em;margin:0 0 26px}
  h1.name em{font-style:normal;color:var(--accent);font-weight:700}
  .hero-lead{font-size:clamp(16px,1.7vw,20px);color:var(--fg-dim);max-width:44ch;margin:0 0 14px;line-height:1.5}
  .hero-lead .hl{color:var(--fg)}
  .hero-role{font-family:var(--mono);font-size:12.5px;color:var(--fg-faint);letter-spacing:.04em;margin-bottom:34px}
  .hero-role b{color:var(--fg-dim);font-weight:500}
  .cta-row{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
  .btn{font-family:var(--body);font-size:14px;font-weight:600;letter-spacing:.01em;padding:13px 22px;border-radius:100px;cursor:pointer;display:inline-flex;align-items:center;gap:9px;transition:transform .3s var(--ease),background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);border:1px solid transparent}
  .btn-primary{background:var(--accent);color:#160604}
  .btn-primary:hover,.btn-primary:focus-visible{transform:translateY(-2px);background:var(--fg);color:var(--ink)}
  .btn-ghost{border-color:var(--line-strong);color:var(--fg)}
  .btn-ghost:hover,.btn-ghost:focus-visible{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}
  .btn .arr{transition:transform .3s var(--ease)}
  .btn:hover .arr{transform:translate(3px,-3px)}
  .socials{display:flex;gap:8px;margin-top:30px}
  .socials a{width:40px;height:40px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;color:var(--fg-dim);transition:transform .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease)}
  .socials a:hover,.socials a:focus-visible{color:var(--accent);border-color:var(--accent-line);transform:translateY(-3px);background:var(--accent-soft)}
  .socials svg{width:16px;height:16px}

  /* hero 3-photo cluster */
  .photo-cluster{position:relative;width:100%;aspect-ratio:1/1.04;max-width:440px;margin-left:auto}
  .polaroid{position:absolute;background:#fbfbf9;padding:8px 8px 26px;border-radius:2px;box-shadow:0 22px 46px rgba(0,0,0,.5);transition:transform .55s var(--ease),box-shadow .55s var(--ease)}
  [data-theme="light"] .polaroid{box-shadow:0 18px 40px rgba(60,20,0,.22)}
  .polaroid .ph{width:100%;aspect-ratio:4/5;overflow:hidden;background:#241c18;border-radius:1px}
  .polaroid .ph img{width:100%;height:100%;object-fit:cover;display:block}
  .polaroid.p1{width:57%;top:1%;right:3%;transform:rotate(3deg);z-index:3}
  .polaroid.p2{width:50%;bottom:0;left:0;transform:rotate(-6deg);z-index:4}
  .polaroid.p3{width:45%;bottom:9%;right:1%;transform:rotate(7deg);z-index:2}
  .photo-cluster:hover .polaroid.p1{transform:rotate(1.5deg) translateY(-5px)}
  .photo-cluster:hover .polaroid.p2{transform:rotate(-3.5deg) translateY(-5px)}
  .photo-cluster:hover .polaroid.p3{transform:rotate(4.5deg) translateY(-5px)}
  .polaroid:hover{box-shadow:0 30px 60px rgba(0,0,0,.6);z-index:9!important}

  /* sections */
  section{padding:clamp(64px,10vw,120px) 0;border-top:1px solid var(--line)}
  .sec-head{display:flex;align-items:baseline;gap:20px;margin-bottom:clamp(32px,5vw,56px);flex-wrap:wrap}
  .sec-num{font-family:var(--mono);font-size:12px;color:var(--accent);letter-spacing:.1em}
  .sec-title{font-family:var(--display);font-weight:700;font-size:clamp(30px,4.8vw,54px);line-height:1.02;letter-spacing:-.03em;margin:0}
  .sec-title em{font-style:normal;color:var(--accent)}
  .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
  .reveal.in{opacity:1;transform:none}
  @media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

  /* about */
  .about-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(28px,5vw,64px)}
  .about-lead{font-family:var(--display);font-weight:500;font-size:clamp(23px,2.9vw,34px);line-height:1.24;letter-spacing:-.02em;margin:0}
  .about-lead em{font-style:normal;color:var(--accent)}
  .about-body p{color:var(--fg-dim);font-size:16px;margin:0 0 18px;max-width:56ch}
  .about-body p:last-child{margin-bottom:0}
  .about-body strong{color:var(--fg);font-weight:600}
  .lang-row{display:flex;gap:26px;margin-top:28px;flex-wrap:wrap}
  .lang-row .l{font-family:var(--mono);font-size:12px;color:var(--fg-faint);letter-spacing:.04em}
  .lang-row .l b{color:var(--fg-dim);font-weight:600;display:block;font-size:14px;margin-bottom:2px;font-family:var(--body)}

  /* experience */
  .xp-row{display:grid;grid-template-columns:150px 1fr 30px;gap:24px;align-items:start;padding:26px 22px;border-radius:10px;position:relative;border:1px solid transparent;transition:background .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease)}
  .xp-row + .xp-row{margin-top:2px}
  .xp-row::before{content:"";position:absolute;left:0;top:14%;bottom:14%;width:2px;border-radius:2px;background:var(--accent);transform:scaleY(0);transform-origin:top;transition:transform .4s var(--ease)}
  .xp-row:hover{background:var(--surface);border-color:var(--line);transform:translateX(4px)}
  .xp-row:hover::before{transform:scaleY(1)}
  .xp-year{font-family:var(--mono);font-size:12.5px;color:var(--fg-faint);letter-spacing:.03em;padding-top:3px;transition:color .35s var(--ease)}
  .xp-row:hover .xp-year{color:var(--accent)}
  .xp-role{font-family:var(--display);font-size:clamp(20px,2.3vw,25px);font-weight:600;line-height:1.15;margin:0 0 3px;letter-spacing:-.01em}
  .xp-co{font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:var(--fg-dim);margin-bottom:11px;text-transform:uppercase}
  .xp-co b{color:var(--accent);font-weight:500}
  .xp-desc{color:var(--fg-dim);font-size:15px;max-width:60ch;margin:0}
  .xp-arrow{color:var(--fg-faint);opacity:0;transform:translateX(-6px);transition:opacity .35s var(--ease),transform .35s var(--ease),color .35s var(--ease);padding-top:6px}
  .xp-row:hover .xp-arrow{opacity:1;transform:none;color:var(--accent)}

  /* skills */
  .skill-lead{color:var(--fg-dim);font-size:16px;max-width:52ch;margin:0 0 34px}
  .chips{display:flex;flex-wrap:wrap;gap:10px}
  .chip{font-family:var(--body);font-size:14px;font-weight:500;color:var(--fg-dim);border:1px solid var(--line);border-radius:100px;padding:10px 18px;transition:color .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease),transform .3s var(--ease);cursor:default}
  .chip.key{color:var(--fg);border-color:var(--accent-line)}
  .chip:hover{color:#160604;background:var(--accent);border-color:var(--accent);transform:translateY(-3px)}

  /* results */
  .results-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(30px,5vw,60px);align-items:center}
  .chart-wrap{position:relative;border:1px solid var(--line);border-radius:12px;padding:26px 24px 18px;background:linear-gradient(180deg,var(--surface),transparent 70%)}
  .chart-cap{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
  .chart-cap .lbl{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-faint)}
  .chart-cap .big{font-family:var(--display);font-weight:700;font-size:clamp(30px,4vw,46px);color:var(--accent);line-height:1;letter-spacing:-.02em}
  svg.spark{width:100%;height:auto;display:block;overflow:visible}
  .spark-path{fill:none;stroke:var(--accent);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:900;stroke-dashoffset:900;transition:stroke-dashoffset 1.8s var(--ease)}
  .in .spark-path{stroke-dashoffset:0}
  @media (prefers-reduced-motion:reduce){.spark-path{stroke-dashoffset:0;transition:none}}
  .spark-area{fill:var(--accent);opacity:.1}
  .spark-dot{fill:var(--accent);opacity:0;transition:opacity .5s var(--ease) 1.4s}
  .in .spark-dot{opacity:1}
  .spark-axis{stroke:var(--line)}
  .spark-tick{font-family:var(--mono);font-size:10px;fill:var(--fg-faint)}
  .metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .metric{border:1px solid var(--line);border-radius:10px;padding:22px 20px;transition:border-color .35s var(--ease),transform .35s var(--ease),background .35s var(--ease)}
  .metric:hover{border-color:var(--accent-line);transform:translateY(-4px);background:var(--accent-soft)}
  .metric .n{font-family:var(--display);font-weight:700;font-size:clamp(30px,3.6vw,42px);line-height:1;color:var(--fg);letter-spacing:-.02em}
  .metric .n .u{font-family:var(--mono);font-size:15px;color:var(--accent);vertical-align:top;margin-left:2px;font-weight:500}
  .metric .k{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-dim);margin-top:9px}
  .results-note{color:var(--fg-dim);font-size:15px;max-width:64ch;margin:34px 0 0;grid-column:1/-1}
  .results-note b{color:var(--fg);font-weight:600}

  /* recognition */
  .rec-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:44px}
  .rec-card{border:1px solid var(--line);border-radius:12px;padding:28px 26px;background:var(--surface);transition:border-color .35s var(--ease),transform .35s var(--ease)}
  .rec-card:hover{border-color:var(--accent-line);transform:translateY(-4px)}
  .rec-quote{font-family:var(--display);font-size:17px;line-height:1.5;font-weight:500;margin:0 0 20px;color:var(--fg);letter-spacing:-.01em}
  .rec-quote::before{content:"\201C";color:var(--accent);margin-right:2px}
  .rec-who{display:flex;align-items:center;gap:12px}
  .rec-av{width:38px;height:38px;border-radius:50%;background:var(--accent-soft);border:1px solid var(--accent-line);display:grid;place-items:center;font-family:var(--mono);font-size:13px;color:var(--accent);flex:0 0 auto}
  .rec-name{font-size:14px;font-weight:600;color:var(--fg)}
  .rec-meta{font-family:var(--mono);font-size:11px;color:var(--fg-faint);letter-spacing:.03em}
  .cert-head{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-faint);margin-bottom:18px}
  .certs{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:2px 32px}
  .cert{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:16px 4px;border-bottom:1px solid var(--line);transition:padding .3s var(--ease),border-color .3s var(--ease)}
  .cert:hover{padding-left:12px;border-color:var(--accent-line)}
  .cert .cn{font-size:14px;color:var(--fg-dim);transition:color .3s var(--ease)}
  .cert:hover .cn{color:var(--fg)}
  .cert .ci{font-family:var(--mono);font-size:11px;color:var(--fg-faint);white-space:nowrap}

  /* mentoring */
  .mentor-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,5vw,56px);align-items:center}
  .mentor-lead{font-family:var(--display);font-weight:600;font-size:clamp(22px,2.7vw,32px);line-height:1.22;letter-spacing:-.02em;margin:0 0 18px}
  .mentor-lead em{font-style:normal;color:var(--accent)}
  .mentor-body{color:var(--fg-dim);font-size:16px;max-width:46ch;margin:0}
  .mentor-badge{display:inline-flex;align-items:center;gap:9px;margin-top:22px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-dim);border:1px solid var(--line);border-radius:100px;padding:7px 14px}
  .mentor-badge .d{width:6px;height:6px;border-radius:50%;background:var(--accent)}
  .mentor-photos{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .mframe{position:relative;aspect-ratio:4/3;border-radius:10px;overflow:hidden;border:1px solid var(--line);transition:transform .4s var(--ease),border-color .4s var(--ease)}
  .mframe:hover{transform:translateY(-4px);border-color:var(--accent-line)}
  .mframe img{width:100%;height:100%;object-fit:cover;display:block}

  /* contact */
  .contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(28px,5vw,60px);align-items:end}
  .contact-title{font-family:var(--display);font-weight:700;font-size:clamp(40px,7vw,80px);line-height:.98;letter-spacing:-.035em;margin:14px 0 0}
  .contact-title em{font-style:normal;color:var(--accent)}
  .contact-sub{color:var(--fg-dim);font-size:16px;max-width:40ch;margin:24px 0 30px}
  .contact-links{display:flex;flex-direction:column;gap:2px}
  .clink{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:16px 4px;border-top:1px solid var(--line);transition:padding .3s var(--ease)}
  .clink:last-child{border-bottom:1px solid var(--line)}
  .clink:hover{padding-left:10px}
  .clink .ck{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-faint)}
  .clink .cv{font-size:15px;color:var(--fg-dim);transition:color .3s var(--ease);display:flex;align-items:center;gap:8px}
  .clink:hover .cv{color:var(--accent)}
  .clink .cv .arr{opacity:0;transform:translateX(-6px);transition:opacity .3s var(--ease),transform .3s var(--ease)}
  .clink:hover .cv .arr{opacity:1;transform:none}

  /* footer */
  footer{border-top:1px solid var(--line);padding:clamp(40px,6vw,64px) 0 34px;position:relative;overflow:hidden}
  footer::before{content:"";position:absolute;z-index:0;left:50%;bottom:-60%;width:80%;height:120%;transform:translateX(-50%);background:radial-gradient(closest-side,var(--glow),transparent 70%);filter:blur(40px);opacity:.5;pointer-events:none}
  .foot-top{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:38px}
  .foot-word{font-family:var(--display);font-weight:700;font-size:clamp(28px,4vw,44px);letter-spacing:-.03em;line-height:1;margin:0}
  .foot-word b{color:var(--accent);font-weight:700}
  .foot-socials{display:flex;gap:10px;flex-wrap:wrap}
  .foot-socials a{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:100px;padding:10px 16px;color:var(--fg-dim);font-family:var(--mono);font-size:12px;letter-spacing:.04em;transition:color .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease),transform .3s var(--ease)}
  .foot-socials a:hover,.foot-socials a:focus-visible{color:var(--accent);border-color:var(--accent-line);background:var(--accent-soft);transform:translateY(-3px)}
  .foot-socials svg{width:15px;height:15px}
  .foot-socials .lbl{display:inline}
  .foot-bar{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;border-top:1px solid var(--line);padding-top:24px}
  .foot-bar span,.foot-bar a{font-family:var(--mono);font-size:11.5px;color:var(--fg-faint);letter-spacing:.06em}
  .foot-bar a:hover{color:var(--accent)}

  @media (max-width:900px){
    .hero-grid{grid-template-columns:1fr}
    .photo-cluster{max-width:360px;margin:8px auto 0}
    .about-grid,.results-grid,.rec-grid,.contact-grid,.mentor-grid{grid-template-columns:1fr}
    .nav-links{display:none}
    .menu-btn{display:block}
    .nav-links.open{display:flex;position:absolute;top:70px;left:0;right:0;flex-direction:column;gap:0;background:var(--ink);border-bottom:1px solid var(--line);padding:8px 0}
    .nav-links.open a{padding:14px clamp(20px,5vw,56px)}
    .metrics{grid-template-columns:1fr 1fr}
    .foot-socials .lbl{display:none}
    .foot-socials a{padding:12px}
  }
  @media (max-width:560px){
    .xp-row{grid-template-columns:1fr;gap:8px}
    .xp-arrow{display:none}
    .certs{grid-template-columns:1fr}
  }