:root { --ink:#090909; --paper:#f4f4f4; --muted:#69696d; --accent:#090909; --line:rgba(9,9,9,.22); --pad:clamp(1.25rem,5vw,6rem); }
* { box-sizing:border-box; }
html { background:var(--paper); }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; line-height:1.5; }
a { color:inherit; text-decoration:none; }
button { color:inherit; font:inherit; }
::selection { color:white; background:var(--accent); }
.skip-link { position:fixed; z-index:20; top:.75rem; left:.75rem; padding:.7rem 1rem; color:white; background:var(--ink); font-size:.65rem; letter-spacing:.14em; text-transform:uppercase; transform:translateY(-180%); transition:transform .2s; }
.skip-link:focus { transform:none; }
:focus-visible { outline:2px solid currentColor; outline-offset:5px; }
.cv-header { display:grid; grid-template-columns:repeat(3,1fr); align-items:center; gap:2rem; padding:1.4rem var(--pad); border-bottom:1px solid var(--line); }
.cv-header p,.cv-download,.back-link { margin:0; font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; }
.back-link { display:inline-flex; align-items:center; gap:.75rem; }
.back-arrow { font-size:1.15rem; line-height:1; transition:transform .25s ease; }
.back-link:hover .back-arrow,.back-link:focus-visible .back-arrow { transform:translateX(-.2rem); }
.back-link span,.cv-download span { color:var(--accent); }
.cv-header p { text-align:center; color:var(--muted); }
.cv-download { display:inline-flex; align-items:center; gap:.4rem; justify-self:end; padding:.6rem 0; border-bottom:1px solid var(--line); cursor:pointer; }
.external-link-icon { display:block; flex:0 0 auto; width:.9rem; height:.9rem; overflow:visible; color:var(--accent); }
.external-link-icon path { fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
main { padding:0 var(--pad); }
.cv-intro { position:relative; min-height:44rem; display:grid; grid-template-columns:.75fr 1.65fr .75fr; align-items:center; gap:clamp(2rem,5vw,6rem); border-bottom:1px solid var(--line); overflow:hidden; }
.cv-portrait {
  position:relative; width:100%; max-width:21rem; margin:0;
  overflow:hidden; align-self:center; background:transparent;
  contain:layout paint; isolation:isolate; touch-action:none;
}
.cv-portrait::after {
  position:absolute; z-index:2; inset:0; content:""; pointer-events:none;
}
.cv-portrait img {
  display:block; width:100%; height:auto;
  filter:contrast(1.08) drop-shadow(0 0 .3px rgba(0,0,0,.28));
  mix-blend-mode:normal;
}
.portrait-print { display:none !important; }
.portrait-mobile { display:none; }
.portrait-intro-poster {
  display:block; width:100%; height:auto; aspect-ratio:480 / 599;
  opacity:1;
}
.portrait-intro {
  position:absolute; inset:0; display:block;
  width:100%; height:100%; aspect-ratio:480 / 599;
  opacity:0;
  filter:contrast(1.08) drop-shadow(0 0 .3px rgba(0,0,0,.28));
  mix-blend-mode:normal;
  transform-origin:center;
  will-change:transform,opacity;
  transition:opacity .64s cubic-bezier(.22,.61,.36,1);
}
.cv-portrait.is-intro-ready:not(.is-idle) .portrait-intro {
  opacity:1;
  animation:portrait-sequence-polish 1.65s cubic-bezier(.22,.61,.36,1) both;
}
.cv-portrait.is-intro-ready .portrait-intro-poster,
.cv-portrait.is-idle .portrait-intro-poster {
  opacity:0;
}
.cv-portrait.is-intro-ready:not(.is-settling):not(.is-idle) .portrait-intro {
  transition:none;
}
.portrait-idle {
  position:absolute; inset:0; display:block; pointer-events:none;
  opacity:0; transition:opacity .9s ease-in-out;
}
.portrait-mobile,
.portrait-intro-poster,
.portrait-intro,
.portrait-idle {
  -webkit-mask-image:linear-gradient(
    to bottom,
    #000 0%,
    #000 80%,
    rgba(0,0,0,.92) 86%,
    rgba(0,0,0,.55) 93%,
    transparent 100%
  );
  mask-image:linear-gradient(
    to bottom,
    #000 0%,
    #000 80%,
    rgba(0,0,0,.92) 86%,
    rgba(0,0,0,.55) 93%,
    transparent 100%
  );
}
.portrait-interaction {
  position:absolute; z-index:1; inset:0; display:block;
  width:100%; height:100%; opacity:0; visibility:hidden;
  pointer-events:none;
  transition:opacity .64s cubic-bezier(.22,.61,.36,1);
}
.cv-portrait.is-idle.has-interactive-canvas .portrait-idle {
  opacity:0;
  visibility:visible;
}
.cv-portrait.has-interactive-canvas .portrait-interaction { visibility:visible; }
.cv-portrait.is-settling:not(.has-interactive-canvas) .portrait-intro { opacity:0; }
.cv-portrait.is-settling:not(.has-interactive-canvas) .portrait-idle { opacity:1; }
.cv-portrait.is-settling.has-interactive-canvas .portrait-intro { opacity:0; }
.cv-portrait.is-settling.has-interactive-canvas .portrait-interaction {
  opacity:1; visibility:visible;
}
.cv-portrait.is-idle.has-interactive-canvas .portrait-interaction {
  opacity:1; visibility:visible;
}
.portrait-idle img { position:absolute; inset:0; }
.portrait-mask {
  filter:
    brightness(0)
    drop-shadow(.3px .1px 0 rgba(0,0,0,.28))
    drop-shadow(-.22px .3px 0 rgba(0,0,0,.18));
}
.portrait-dots {
  will-change:transform,opacity; backface-visibility:hidden;
  transform:translate3d(0,0,0);
  transform-origin:center;
}
.portrait-dots-one { animation:portrait-drift-one 2.7s ease-in-out infinite alternate; }
.portrait-dots-two { animation:portrait-drift-two 3.2s ease-in-out infinite alternate; }
.portrait-dots-three { animation:portrait-drift-three 3.5s ease-in-out infinite alternate; }
.portrait-dots-four { animation:portrait-drift-four 2.9s ease-in-out infinite alternate; }
.portrait-dots-five { animation:portrait-drift-five 3.7s ease-in-out infinite alternate; }
.portrait-dots-six { animation:portrait-drift-six 3.3s ease-in-out infinite alternate; }
.cv-portrait.has-interactive-canvas .portrait-dots { animation-play-state:paused; }
.cv-portrait.is-idle .portrait-intro { opacity:0; }
.cv-portrait.is-idle .portrait-idle { opacity:1; }
html[data-theme="dark"] .portrait-intro {
  filter:brightness(0) invert(1) contrast(1.08) drop-shadow(0 0 .3px rgba(255,255,255,.38));
  mix-blend-mode:normal;
}
html[data-theme="dark"] .portrait-intro-poster {
  filter:brightness(0) invert(1) contrast(1.08) drop-shadow(0 0 .3px rgba(255,255,255,.38));
}
.portrait-mobile {
  filter:
    brightness(0)
    drop-shadow(.3px .1px 0 rgba(0,0,0,.28))
    drop-shadow(-.22px .3px 0 rgba(0,0,0,.18));
}
.portrait-mobile-light { filter:none; }
html[data-theme="light"] .portrait-mobile-dark,
html:not([data-theme="light"]) .portrait-mobile-light {
  display:none !important;
}
html[data-theme="dark"] .portrait-mobile {
  filter:drop-shadow(0 0 .4px rgba(255,255,255,.32));
}
html[data-theme="dark"] .portrait-mask {
  filter:drop-shadow(0 0 .4px rgba(255,255,255,.32));
}
.label { margin:0 0 1.3rem; color:var(--muted); font-size:.58rem; letter-spacing:.22em; text-transform:uppercase; }
.print-identity { display:none; }
.cv-title h1 { margin:0 0 2.75rem; font-size:clamp(3rem,5.15vw,6.5rem); font-weight:300; line-height:.98; letter-spacing:-.065em; }
.cv-title h1 span { display:inline-block; white-space:nowrap; }
.summary { max-width:43rem; margin:0; color:var(--muted); font-size:clamp(.95rem,1.2vw,1.15rem); line-height:1.75; }
.cv-contact { align-self:end; padding-bottom:4rem; }
.cv-contact dl { margin:0; }
.cv-contact dl div { padding:.75rem 0; border-bottom:1px solid var(--line); }
.cv-contact dt { margin-bottom:.2rem; color:var(--muted); font-size:.54rem; letter-spacing:.16em; text-transform:uppercase; }
.cv-contact dd { margin:0; overflow-wrap:anywhere; font-size:.78rem; }
.cv-contact a { text-decoration-color:var(--line); text-decoration-line:underline; text-underline-offset:.2em; }
.cv-section { display:grid; grid-template-columns:.7fr 2fr; gap:clamp(2rem,8vw,10rem); padding:clamp(5rem,9vw,9rem) 0; border-bottom:1px solid var(--line); }
.section-label h2 { margin:0; font-size:clamp(2.8rem,5vw,5.5rem); font-weight:300; line-height:.9; letter-spacing:-.055em; }
.timeline article { display:grid; grid-template-columns:.75fr 1.3fr 1.8fr; gap:2rem; padding:1.7rem 0; border-top:1px solid var(--line); }
.timeline article > div { display:flex; flex-direction:column; gap:.35rem; color:var(--muted); font-size:.56rem; letter-spacing:.15em; text-transform:uppercase; }
.timeline h3 { margin:0; font-size:clamp(1.15rem,1.6vw,1.5rem); font-weight:400; line-height:1.2; }
.timeline p { max-width:34rem; margin:0; color:var(--muted); font-size:.87rem; line-height:1.65; }
.skills-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.5rem,4vw,4rem); }
.skills-grid article { padding-top:1.5rem; border-top:1px solid var(--line); }
.skills-grid h3 { margin:0 0 2.5rem; font-size:1.5rem; font-weight:400; }
.skills-grid p { margin:0 0 .55rem; color:var(--muted); font-size:.86rem; }
.cv-footer { display:flex; justify-content:space-between; padding:2.5rem 0; color:var(--muted); font-size:.57rem; letter-spacing:.18em; text-transform:uppercase; }
.cv-footer p { margin:0; }
.cv-footer a span { color:var(--accent); }
@keyframes dash { to { stroke-dashoffset:400; } }
@keyframes portrait-sequence-polish {
  0%,24% { transform:translate3d(0,0,0) scale(1); }
  56% { transform:translate3d(0,-.35%,0) scale(1.032); }
  78% { transform:translate3d(0,.15%,0) scale(.994); }
  100% { transform:translate3d(0,0,0) scale(1); }
}
@keyframes portrait-drift-one {
  0% { transform:translate3d(-.65px,.4px,0) rotate(-.018deg); }
  100% { transform:translate3d(.78px,-.5px,0) rotate(.018deg); }
}
@keyframes portrait-drift-two {
  0% { transform:translate3d(.62px,-.48px,0) rotate(.016deg); }
  100% { transform:translate3d(-.72px,.56px,0) rotate(-.02deg); }
}
@keyframes portrait-drift-three {
  0% { transform:translate3d(-.42px,-.66px,0) scale(.9993); }
  100% { transform:translate3d(.58px,.7px,0) scale(1.0007); }
}
@keyframes portrait-drift-four {
  0% { transform:translate3d(.72px,.34px,0); }
  100% { transform:translate3d(-.62px,-.58px,0); }
}
@keyframes portrait-drift-five {
  0% { transform:translate3d(-.74px,-.24px,0) rotate(.018deg); }
  100% { transform:translate3d(.68px,.56px,0) rotate(-.016deg); }
}
@keyframes portrait-drift-six {
  0% { transform:translate3d(.38px,.7px,0) scale(1.0005); }
  100% { transform:translate3d(-.68px,-.36px,0) scale(.9995); }
}
@media (max-width:900px) {
  .cv-intro { grid-template-columns:.55fr 1.45fr; padding:5rem 0; }
  .cv-contact { grid-column:2; align-self:auto; padding:0; }
  .cv-section { grid-template-columns:1fr; }
  .timeline article { grid-template-columns:.7fr 1.2fr 1.6fr; }
}
@media (max-width:650px) {
  .cv-header {
    min-height:4.8rem; grid-template-columns:1fr;
    justify-items:start; row-gap:.35rem; padding-top:.8rem; padding-bottom:.8rem;
  }
  .cv-header p { display:none; }
  .back-link { min-height:2.75rem; }
  .cv-download {
    min-height:2.75rem;
    justify-self:start; white-space:nowrap;
  }
  .cv-intro {
    min-height:auto; grid-template-columns:1fr; justify-items:center;
    padding:4.25rem 0; text-align:center;
  }
  .cv-portrait {
    width:min(72vw,18rem); margin:0 auto 2.75rem;
    grid-column:1; opacity:.94;
  }
  .cv-title,.cv-contact { position:relative; z-index:1; grid-column:1; }
  .cv-title { display:grid; justify-items:center; }
  .cv-title h1 {
    margin-bottom:2.25rem; font-size:clamp(1.85rem,8.6vw,4.75rem);
    line-height:1;
  }
  .summary { max-width:31rem; }
  .cv-contact { width:min(100%,31rem); margin-top:2.75rem; }
  .cv-contact dl div { padding:.8rem .25rem; }
  .cv-section {
    justify-items:center; padding:clamp(4rem,16vw,6rem) 0;
    text-align:center;
  }
  .section-label h2 { font-size:clamp(2.7rem,13vw,4rem); }
  .timeline { width:min(100%,34rem); }
  .timeline article { grid-template-columns:1fr; justify-items:center; gap:1rem; }
  .timeline article > div { align-items:center; }
  .timeline p { max-width:31rem; }
  .skills-grid { width:min(100%,34rem); grid-template-columns:1fr; }
  .skills-grid h3 { margin-bottom:1.2rem; }
  .skills-grid article { display:grid; justify-items:center; }
  .cv-footer { align-items:center; flex-direction:column; gap:1rem; text-align:center; }
}
@media (hover:none) and (pointer:coarse), (max-width:650px) {
  .cv-portrait {
    aspect-ratio:480 / 599;
  }
  .portrait-mobile {
    position:absolute;
    inset:0;
    display:block !important;
    width:100%;
    height:100%;
    opacity:1;
    transition:opacity .42s ease;
  }
  .cv-portrait.has-interactive-canvas .portrait-mobile {
    opacity:1;
  }
  .cv-portrait.has-interactive-canvas.is-interaction-active .portrait-mobile {
    opacity:0;
  }
  .portrait-intro-poster,
  .portrait-intro,
  .portrait-idle {
    display:none !important;
  }
  .portrait-interaction {
    transition:opacity .42s ease;
  }
  .cv-portrait.is-idle.has-interactive-canvas .portrait-interaction {
    opacity:0;
  }
  .cv-portrait.is-idle.has-interactive-canvas.is-interaction-active .portrait-interaction {
    opacity:1;
  }
  .portrait-dots-one {
    animation:none !important;
  }
}
@media print {
  @page { size:A4 portrait; margin:0; background:#ffffff; }
  :root,
  html[data-page="cv"][data-theme] {
    --ink:#111111; --paper:#ffffff; --muted:#54545a;
    --accent:#111111; --line:rgba(17,17,17,.14);
    color-scheme:light;
  }
  html {
    width:210mm;
    height:297mm;
    background:#ffffff !important;
  }
  body {
    width:210mm;
    height:297mm;
    min-height:0;
    padding:11mm 0 10mm;
    overflow:hidden;
    color:var(--ink);
    background:#ffffff !important;
    font-size:8.5pt;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  .cv-header,.skip-link { display:none !important; }
  main {
    display:grid;
    height:272mm;
    grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);
    grid-template-areas:
      "intro intro"
      "experience experience"
      "skills skills"
      "education education";
    grid-template-rows:auto 88mm 53mm 1fr;
    column-gap:9mm;
    row-gap:0;
    padding:0 10mm;
  }
  .cv-intro {
    grid-area:intro;
    min-height:0;
    grid-template-columns:34mm minmax(0,1fr) 48mm;
    align-items:center;
    gap:6mm;
    padding:0 0 7mm;
    border-bottom:0;
    overflow:visible;
  }
  .cv-portrait {
    width:34mm; max-width:none; margin:0;
    align-self:center; overflow:visible;
    contain:none; isolation:auto; touch-action:auto;
  }
  .portrait-mobile,.portrait-intro-poster,.portrait-intro,.portrait-idle,.portrait-interaction { display:none !important; }
  .portrait-print {
    position:static !important;
    display:block !important;
    width:100%; height:auto;
    filter:none !important;
    mix-blend-mode:normal !important;
    -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 88%,rgba(0,0,0,.8) 94%,transparent 100%);
    mask-image:linear-gradient(to bottom,#000 0%,#000 88%,rgba(0,0,0,.8) 94%,transparent 100%);
  }
  .cv-title .label,.cv-title h1 { display:none; }
  .print-identity {
    display:block;
    margin:0 0 3mm;
  }
  .print-name {
    margin:0 0 1.2mm;
    font-size:27pt;
    font-weight:600;
    line-height:.92;
    letter-spacing:-.045em;
  }
  .print-role {
    margin:0;
    color:var(--muted);
    font-size:6.3pt;
    font-weight:600;
    line-height:1.35;
    letter-spacing:.13em;
    text-transform:uppercase;
  }
  .summary {
    max-width:106mm;
    font-size:8.1pt;
    line-height:1.45;
  }
  .cv-contact {
    grid-column:auto;
    grid-row:auto;
    align-self:center;
    padding:0;
  }
  .cv-contact .label {
    margin:0 0 1mm;
    font-size:5.4pt;
    font-weight:700;
    letter-spacing:.18em;
  }
  .cv-contact dl div {
    padding:1.65mm 0;
    border-bottom:0;
  }
  .cv-contact dt {
    margin-bottom:.35mm;
    font-size:4.8pt;
    font-weight:700;
    letter-spacing:.14em;
  }
  .cv-contact dd {
    font-size:6.9pt;
    line-height:1.25;
  }
  .cv-contact a {
    white-space:nowrap;
    font-size:6pt;
    letter-spacing:-.025em;
  }
  main > .cv-section:not(.split) {
    grid-area:experience;
  }
  main > .cv-section.split:not(.education) { grid-area:skills; }
  main > .cv-section.education { grid-area:education; }
  .cv-section {
    display:grid;
    grid-template-rows:auto 1fr;
    padding:7mm 0 0;
    border:0;
    break-inside:avoid;
  }
  .section-label h2 {
    margin:0 0 3mm;
    padding-bottom:2mm;
    border-bottom:.6pt solid var(--line);
    font-size:10.5pt;
    font-weight:700;
    line-height:1;
    letter-spacing:.04em;
    text-transform:uppercase;
  }
  .timeline article {
    display:block;
    padding:4.4mm 0 4.6mm;
    border-top:.65pt solid var(--line);
    break-inside:avoid;
  }
  .timeline article:first-child { border-top:0; padding-top:1.2mm; }
  .timeline article > div {
    flex-direction:row;
    justify-content:space-between;
    gap:3mm;
    margin:0 0 1.4mm;
    font-size:5.1pt;
    font-weight:700;
    letter-spacing:.12em;
  }
  .timeline h3 {
    margin:0 0 1.6mm;
    font-size:9.4pt;
    font-weight:600;
    line-height:1.2;
  }
  .timeline p {
    max-width:none;
    padding-right:3mm;
    font-size:7.55pt;
    line-height:1.48;
  }
  main > .cv-section:not(.split) .timeline article {
    display:grid;
    grid-template-columns:29mm 57mm minmax(0,1fr);
    gap:5mm;
    align-items:center;
    padding:3.5mm 0;
  }
  main > .cv-section:not(.split) .timeline {
    display:grid;
    grid-template-rows:repeat(3,1fr);
  }
  main > .cv-section:not(.split) .timeline article > div {
    align-items:flex-start;
    flex-direction:column;
    gap:.65mm;
    margin:0;
  }
  main > .cv-section:not(.split) .timeline h3 { margin:0; }
  main > .cv-section:not(.split) .timeline p { padding:0; }
  .skills-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    grid-template-rows:1fr;
    column-gap:6mm;
  }
  .skills-grid article {
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:2mm 4mm 2mm 0;
    border-top:0;
    break-inside:avoid;
  }
  .skills-grid article + article {
    padding-left:6mm;
    border-left:.65pt solid var(--line);
  }
  .skills-grid article:first-child { border-top:0; padding-top:2mm; }
  .skills-grid h3 {
    margin:0 0 1.6mm;
    font-size:8.7pt;
    font-weight:600;
    line-height:1.2;
  }
  .skills-grid p {
    margin:0 0 .9mm;
    font-size:7.1pt;
    line-height:1.38;
  }
  main > .cv-section.split:not(.education) {
    padding-right:0;
  }
  .education {
    padding-top:7mm;
    padding-bottom:7mm;
  }
  .education .timeline {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    grid-template-rows:1fr;
    column-gap:7mm;
  }
  .education .timeline article {
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:2mm 6mm 2mm 0;
    border-top:0;
  }
  .education .timeline article + article {
    padding-left:7mm;
    border-left:.65pt solid var(--line);
  }
  .education .timeline article:first-child { padding-top:2mm; }
  .education .timeline p { padding-right:0; font-size:7.1pt; }
  .education .timeline h3 { font-size:8.6pt; }
  .cv-footer {
    position:fixed;
    right:10mm;
    bottom:5mm;
    left:10mm;
    display:block;
    padding:2mm 0 0;
    border-top:0;
    color:var(--muted);
    font-size:5pt;
    font-weight:600;
    letter-spacing:.15em;
    text-transform:uppercase;
  }
  .cv-footer a { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  *:not(.portrait-dots) { animation:none !important; }
}
