/* ==============================================================
   EDITORIAL SLATE | FINAL 5 INK COLORS
   Only these five base colors are used. Tonal variants are produced
   with color-mix and transparency, never neon, glare or gradients.
   #000000  Black          | contrast reference
   #25292A  Graphite       | main ink / matte dark surfaces
   #4A5B5D  Slate          | supporting type / borders
   #B8C7C6  Mineral gray   | muted accent / panel
   #F8F9FA  Cool paper     | page / light text
   ============================================================== */
:root{
  --black:#000000;
  --midnight:#25292A;
  --navy:#4A5B5D;
  --blue:#B8C7C6;
  --paper:#F8F9FA;
  --line:color-mix(in srgb,var(--navy) 31%,transparent);
  --soft:color-mix(in srgb,var(--blue) 20%,transparent);
  --shadow:none;
  --font: "Pretendard Variable","Pretendard","SUIT Variable","Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;color:var(--midnight);background:var(--paper);font:400 15px/1.65 var(--font);-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-x:hidden}
button,a{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible,.experience-window:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
svg{display:block;max-width:100%}::selection{background:var(--blue);color:var(--midnight)}
.skip-link{position:fixed;z-index:1000;top:-100px;left:20px;padding:10px 20px;background:var(--paper);color:var(--midnight)}.skip-link:focus{top:12px}






.page-grid{max-width:1520px;margin:auto;padding:54px 46px 0;display:grid;grid-template-columns:288px minmax(0,1fr);align-items:start;gap:27px}
/* Keep the profile in a fixed viewport position on desktop / tablet.
   Its own content scrolls only if the viewport is shorter than the card. */
.profile-sidebar{position:fixed;top:54px;left:max(46px,calc((100vw - 1520px)/2 + 46px));width:288px;max-height:calc(100dvh - 72px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}.profile-sidebar::-webkit-scrollbar{display:none}.profile-card{overflow:hidden;background:var(--paper);border:1px solid var(--line);box-shadow:0 9px 40px color-mix(in srgb,var(--black) 6%,transparent);border-radius:12px;padding:21px 23px 22px}
.side-topline{display:flex;align-items:center;gap:7px;color:var(--navy);font-size:9px;font-weight:850;letter-spacing:.16em}.side-topline>span:last-child{margin-left:auto}
.portrait-frame{margin-top:22px;aspect-ratio:1.09;overflow:hidden;border-radius:7px;background:linear-gradient(140deg,color-mix(in srgb,var(--blue) 42%,var(--paper)),color-mix(in srgb,var(--navy) 23%,var(--paper)));border:1px solid color-mix(in srgb,var(--navy) 15%,transparent)}.portrait-art{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;color:var(--navy)}.portrait-art svg{width:81%;height:77%}.portrait-art>span{color:var(--navy);font-size:9px;font-weight:850;letter-spacing:.25em}.portrait-photo{display:block;width:100%;height:100%;object-fit:cover;object-position:center 35%}
.profile-identity{padding-top:21px}.profile-kicker{font-size:9px;letter-spacing:.24em;font-weight:850;color:var(--navy)}.profile-identity h1{margin:4px 0 1px;color:var(--midnight);font-size:30px;font-weight:850;letter-spacing:-.07em;line-height:1.38}.profile-identity>p{margin:3px 0 0;font-size:12px;font-weight:600;line-height:1.6;color:var(--navy)}
.profile-rule{height:1px;background:var(--line);margin:20px 0}.profile-meta{display:grid;gap:16px;margin:0;padding:4px 0 6px}.profile-meta div{display:grid;grid-template-columns:54px minmax(0,1fr);gap:10px;align-items:center;min-height:50px;padding:10px 0}.profile-meta dt{font-weight:900;font-size:10px;line-height:1.6;letter-spacing:.05em;color:var(--navy)}.profile-meta dd{min-width:0;font-size:12px;line-height:1.85;margin:0;word-break:keep-all;overflow-wrap:anywhere;font-weight:550}.side-block h2{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--navy);letter-spacing:.1em;margin:0 0 12px}.side-tags{display:flex;flex-wrap:wrap;gap:6px}.side-tags span{padding:5px 8px;background:var(--soft);font-size:10px;font-weight:700;border:1px solid var(--line);border-radius:4px}
.side-message{margin-top:22px;border-top:1px solid var(--line);padding-top:14px}.side-message .quote-mark{display:block;height:28px;color:var(--navy);font-weight:900;font-size:41px;line-height:1}.side-message p{margin:6px 0 0;font-size:11px;line-height:1.9}.side-message strong{font-weight:850}
.sidebar-contact{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--midnight);color:var(--paper);border-radius:5px;padding:12px 13px;margin-top:20px;font-size:11px;font-weight:800;transition:background .2s}.sidebar-contact:hover{background:var(--navy)}.sidebar-contact span{font-size:19px;line-height:1;color:var(--blue)}.side-caption{display:flex;justify-content:space-between;padding:16px 5px;color:var(--navy);font-weight:800;font-size:9px;letter-spacing:.09em}
.main-content{min-width:0;grid-column:2}.hero{position:relative;min-height:490px;display:grid;grid-template-columns:61% 39%;overflow:hidden;background:var(--midnight);border-radius:12px;color:var(--paper);box-shadow:var(--shadow)}
.hero-grid{position:absolute;inset:0;opacity:.14;pointer-events:none;background-image:linear-gradient(to right,var(--blue) 1px,transparent 1px),linear-gradient(to bottom,var(--blue) 1px,transparent 1px);background-size:66px 66px;mask-image:linear-gradient(to right,transparent 0%,var(--black) 100%)}
.hero-copy{padding:67px 18px 89px 50px;z-index:2}.section-overline{display:flex;align-items:center;gap:10px;font-size:10px;font-weight:900;letter-spacing:.13em;color:var(--navy)}.overline-dash{display:inline-block;width:19px;height:2px;background:var(--navy);flex-shrink:0}.hero-overline{color:var(--blue)}.hero-overline .overline-dash{background:var(--blue)}
.hero h2{margin:24px 0 16px;font-size:clamp(23.2px,2.48vw,36.8px);line-height:1.35;letter-spacing:-.06em;font-weight:850}.hero h2 em{font-style:normal;color:var(--blue)}.hero-copy>p{color:color-mix(in srgb,var(--paper) 85%,transparent);font-size:13px;line-height:1.85;max-width:490px;margin:0}
.hero-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:29px}.button-primary{display:inline-flex;align-items:center;justify-content:center;gap:20px;background:var(--blue);color:var(--midnight);padding:14px 18px;border:1px solid var(--blue);border-radius:5px;line-height:1.3;min-height:47px;font-size:12px;font-weight:850;transition:transform .2s,background .2s}.button-primary:hover{transform:translateY(-2px);background:var(--paper)}.button-primary span{font-size:19px;line-height:1}.button-text{display:inline-flex;align-items:center;gap:11px;color:var(--paper);background:transparent;border:0;padding:11px 0;font-size:12px;font-weight:800}.button-text:hover{color:var(--blue)}.button-text span{font-size:18px}
.hero-visual{z-index:1;position:relative;display:flex;flex-direction:column;justify-content:space-between;margin:33px 32px 64px 0;padding:20px 20px 24px;border:1px solid color-mix(in srgb,var(--blue) 42%,transparent);background:linear-gradient(152deg,color-mix(in srgb,var(--navy) 90%,transparent),color-mix(in srgb,var(--midnight) 90%,transparent));border-radius:8px;min-height:370px;overflow:hidden}
.hero-visual-top{display:flex;justify-content:space-between;align-items:center;font-size:9px;font-weight:850;letter-spacing:.14em;color:var(--blue)}.hero-visual-top span{font-size:8px}.orbit{display:grid;place-items:center;align-self:center;width:min(215px,90%);aspect-ratio:1;border:1px solid color-mix(in srgb,var(--blue) 70%,transparent);border-radius:50%;position:relative}.orbit::before{content:"";position:absolute;inset:22px;border:1px dashed color-mix(in srgb,var(--blue) 55%,transparent);border-radius:50%}.orbit::after{content:"";position:absolute;width:8px;height:8px;right:15%;top:13%;background:var(--blue);border-radius:50%;box-shadow:0 0 0 7px color-mix(in srgb,var(--blue) 14%,transparent)}.orbit-inner{font-size:clamp(22px,2.5vw,34px);letter-spacing:.1em;font-weight:900}.hero-visual-steps{display:flex;gap:6px;align-items:center;justify-content:center;font-size:8px;font-weight:850;letter-spacing:.08em;color:var(--blue)}.hero-visual-steps i{width:12px;height:1px;background:var(--blue);opacity:.7}.hero-visual-bottom{display:flex;gap:5px;justify-content:space-between;font-size:9px;font-weight:750;color:var(--paper)}
.hero-bottom{position:absolute;z-index:3;bottom:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;height:42px;padding:0 30px 0 50px;border-top:1px solid color-mix(in srgb,var(--blue) 21%,transparent);color:var(--blue);font-size:9px;letter-spacing:.13em;font-weight:850}.hero-bottom span span{font-size:15px;margin-left:7px}
.section-block{padding:60px 0 0;scroll-margin-top:88px}.section-head{display:flex;gap:30px;justify-content:space-between;align-items:end;margin-bottom:24px}.section-head h2,.ninety-title h2{font-size:clamp(24px,2.4vw,33px);line-height:1.4;letter-spacing:-.06em;margin:8px 0 0;font-weight:850}.section-head h2 span,.ninety-title h2 span{color:var(--navy)}.section-head>p{font-size:12px;color:var(--navy);line-height:1.8;max-width:275px;margin:0 0 4px}
.value-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.value-card{position:relative;padding:21px 22px 19px;border:1px solid var(--line);background:color-mix(in srgb,var(--paper) 95%,var(--blue));border-radius:9px;min-height:320px;display:flex;flex-direction:column;transition:none}.card-index{display:flex;align-items:center;justify-content:space-between;color:var(--navy);font-size:11px;font-weight:900}.card-index span{font-size:8px;letter-spacing:.12em}.value-icon{display:grid;place-items:center;width:50px;height:50px;margin-top:21px;background:color-mix(in srgb,var(--blue) 19%,transparent);color:var(--navy);border-radius:12px}.value-icon svg{width:29px;height:29px}.value-card h3{font-size:20px;line-height:1.5;letter-spacing:-.06em;margin:14px 0 7px;font-weight:850}.value-card p{font-size:12px;line-height:1.83;margin:0 0 19px;color:var(--navy)}.card-link{margin-top:auto;padding-top:13px;border-top:1px solid var(--line);font-size:10px;display:flex;justify-content:space-between;gap:8px;font-weight:800}.card-link span{font-size:16px}
.experience-section{padding-top:67px}.experience-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:8px 0 15px}.section-note{font-size:10px;color:var(--navy)}.slider-controls{display:flex;gap:10px;align-items:center;flex-shrink:0}.slider-arrow{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--navy);color:var(--navy);background:transparent;font-size:18px;transition:background .2s,color .2s}.slider-arrow:hover{background:var(--navy);color:var(--paper)}.slider-count{font-size:11px;font-weight:750;white-space:nowrap}.slider-count strong{font-size:15px}
.experience-window{container-type:inline-size;margin:0 -4px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-behavior:smooth;overscroll-behavior-x:contain}.experience-window::-webkit-scrollbar{display:none}.experience-track{display:flex;gap:16px;padding:0 max(4px,calc((100cqw - min(78cqw, 650px))/2)) 4px;align-items:stretch;width:max-content;min-width:100%}.experience-card{position:relative;scroll-snap-align:center;flex:0 0 min(650px, 78cqw);width:min(650px,78cqw);padding:25px 29px 23px;border-radius:11px;border:1px solid var(--line);background:color-mix(in srgb,var(--blue) 22%,var(--paper));opacity:.45;transform:scale(.97);transition:opacity .25s,transform .25s,background .25s}.experience-card.is-active{opacity:1;transform:scale(1);background:color-mix(in srgb,var(--blue) 30%,var(--paper));border-color:color-mix(in srgb,var(--navy) 29%,transparent)}.experience-card-top{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:9px;font-weight:850;color:var(--navy)}.experience-type{letter-spacing:.12em}.experience-date{border:1px solid var(--line);padding:3px 7px;border-radius:3px}.experience-card h3{font-size:24px;letter-spacing:-.05em;line-height:1.35;margin:18px 0 4px}.experience-sub{font-size:11px;color:var(--navy);margin:0}.experience-divider{height:1px;background:color-mix(in srgb,var(--navy) 25%,transparent);margin:21px 0 17px}.experience-detail{display:grid;grid-template-columns:1fr 1fr;gap:23px}.experience-detail span{display:block;margin-bottom:6px;font-size:11px;font-weight:850}.experience-detail p{font-size:12px;margin:0;line-height:1.8;color:var(--navy)}.experience-foot{display:flex;gap:7px;flex-wrap:wrap;margin-top:22px}.experience-foot span{font-size:8px;letter-spacing:.06em;font-weight:850;background:color-mix(in srgb,var(--paper) 57%,transparent);border:1px solid var(--line);border-radius:3px;padding:4px 7px}.slider-dots{display:flex;gap:6px;justify-content:center;align-items:center;margin-top:12px}.slider-dots button{width:7px;height:7px;padding:0;border:0;border-radius:9px;background:color-mix(in srgb,var(--navy) 25%,transparent);transition:width .25s,background .25s}.slider-dots button.is-active{width:26px;background:var(--navy)}
.approach-section{padding-top:66px}.process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.process-step{position:relative;padding:22px 23px 24px 0}.process-step+ .process-step{border-left:1px solid var(--line);padding-left:23px}.process-index{font-size:10px;letter-spacing:.09em;color:var(--navy);font-weight:850}.process-number{display:block;font-size:50px;font-weight:900;letter-spacing:-.1em;line-height:1.25;color:color-mix(in srgb,var(--navy) 38%,transparent);margin-top:8px}.process-step h3{font-size:16px;margin:7px 0;letter-spacing:-.05em}.process-step p{font-size:12px;line-height:1.8;margin:0;color:var(--navy)}
.ninety-section{margin-top:66px;padding:35px 38px 37px;background:var(--navy);color:var(--paper);border-radius:10px}.ninety-title .section-overline{color:var(--blue)}.ninety-title .overline-dash{background:var(--blue)}.ninety-title h2 span{color:var(--blue)}.ninety-title>p{margin:7px 0 0;color:color-mix(in srgb,var(--paper) 80%,transparent);font-size:12px}.ninety-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:29px}.ninety-grid>div{padding-top:15px;border-top:1px solid color-mix(in srgb,var(--blue) 50%,transparent)}.ninety-period{font-size:9px;font-weight:850;letter-spacing:.11em;color:var(--blue)}.ninety-grid h3{font-size:20px;margin:9px 0 5px}.ninety-grid p{font-size:12px;line-height:1.8;margin:0;color:color-mix(in srgb,var(--paper) 85%,transparent)}
.contact-section{scroll-margin-top:88px;position:relative;overflow:hidden;margin-top:67px;padding:45px 45px 33px;background:var(--midnight);color:var(--paper);border-radius:11px}.contact-section .section-overline{color:var(--blue)}.contact-section .overline-dash{background:var(--blue)}.contact-section h2{font-size:clamp(28px,3vw,40px);line-height:1.4;letter-spacing:-.06em;margin:19px 0 9px}.contact-section h2 em{font-style:normal;color:var(--blue)}.contact-section>p{font-size:12px;color:color-mix(in srgb,var(--paper) 83%,transparent);margin:0}.contact-actions{display:flex;gap:21px;align-items:center;flex-wrap:wrap;margin:24px 0 31px}.contact-meta{display:flex;align-items:center;gap:24px;flex-wrap:wrap;padding-top:17px;border-top:1px solid color-mix(in srgb,var(--blue) 25%,transparent);font-size:11px}.contact-meta>span:first-child{font-weight:850;font-size:9px;letter-spacing:.15em;color:var(--blue)}.contact-meta strong{font-weight:750}.contact-meta>span:last-child{color:var(--blue)}
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:26px 0 34px;color:var(--navy);font-size:9px;font-weight:800;letter-spacing:.07em}.site-footer a{text-decoration:underline;text-underline-offset:4px}
.toast{position:fixed;z-index:120;bottom:24px;left:50%;transform:translate(-50%,25px);padding:12px 19px;background:var(--navy);color:var(--paper);border:1px solid var(--blue);border-radius:6px;box-shadow:var(--shadow);font-size:12px;font-weight:750;opacity:0;pointer-events:none;transition:opacity .22s,transform .22s}.toast.is-visible{opacity:1;transform:translate(-50%,0)}
/* ==============================================================
   MATTE EDITORIAL FINISH — no layout, copy or interaction changed.
   Reduce generic tech-glow cues, restore opaque type and crisp rules.
   ============================================================== */

.profile-card{
  box-shadow:none;
  background:var(--paper);
  border-color:var(--line);
}
.portrait-frame{
  background:color-mix(in srgb,var(--blue) 44%,var(--paper));
  border-color:var(--line);
}
.hero{
  box-shadow:none;
  background:var(--midnight);
}
/* The blueprint grid added technology-themed gloss without meaning. */
.hero-grid{display:none}
.hero-visual{
  background:color-mix(in srgb,var(--midnight) 87%,var(--navy));
  border-color:color-mix(in srgb,var(--blue) 34%,transparent);
}
.orbit{border-color:color-mix(in srgb,var(--blue) 40%,transparent)}
.orbit::before{border-color:color-mix(in srgb,var(--blue) 26%,transparent)}
.orbit::after{
  box-shadow:none;
  background:color-mix(in srgb,var(--blue) 78%,var(--midnight));
}

.value-card{
  background:var(--paper);
  box-shadow:none;
  transition:none;
}

.value-icon{
  background:color-mix(in srgb,var(--blue) 44%,var(--paper));
  border-radius:4px;
}
.experience-card{
  opacity:1;
  transform:none;
  background:color-mix(in srgb,var(--blue) 12%,var(--paper));
  transition:border-color .18s ease,background .18s ease;
}
.experience-card.is-active{
  opacity:1;
  transform:none;
  background:color-mix(in srgb,var(--blue) 24%,var(--paper));
  border-color:var(--navy);
}
.process-number{
  color:color-mix(in srgb,var(--navy) 70%,var(--paper));
}
/* A calm, paper-like middle section separates the dark hero/footer. */
.ninety-section{
  background:var(--blue);
  color:var(--midnight);
}
.ninety-title .section-overline,
.ninety-title h2 span,
.ninety-period{color:var(--midnight)}
.ninety-title .overline-dash{background:var(--midnight)}
.ninety-title>p,
.ninety-grid p{color:var(--midnight)}
.ninety-grid>div{
  border-top-color:color-mix(in srgb,var(--midnight) 35%,transparent);
}

.toast{box-shadow:none}
/* Modest radii instead of pill-like product-dashboard surfaces. */
.profile-card,.hero,.value-card,.experience-card,.ninety-section,.contact-section{border-radius:4px}
.hero-visual,.portrait-frame,.sidebar-contact,.button-primary{border-radius:3px}

/* motion remains optional; content is visible even if JavaScript is disabled */
@media (max-width:1280px){.page-grid{padding:44px 28px 0;grid-template-columns:260px minmax(0,1fr);gap:22px}.profile-sidebar{top:44px;left:28px;width:260px;max-height:calc(100dvh - 62px)}.profile-card{padding:19px}.hero-copy{padding-left:35px}.hero-bottom{padding-left:35px}.hero h2{font-size:clamp(20.8px,2.4vw,31.2px)}.hero-visual{margin-right:20px}.value-card{padding:19px 17px}.section-head>p{max-width:240px}}
@media (max-width:1030px){.page-grid{grid-template-columns:225px minmax(0,1fr);gap:17px;padding:36px 21px 0}.profile-sidebar{top:36px;left:21px;width:225px;max-height:calc(100dvh - 54px)}.profile-card{padding:17px}.profile-identity h1{font-size:25px}.hero{grid-template-columns:1fr;min-height:0}.hero-copy{padding:46px 39px 69px}.hero-visual{display:none}.hero h2{font-size:clamp(24px,3.2vw,34.4px)}.value-cards{gap:9px}.value-card{min-height:358px;padding:17px 14px}.value-card h3{font-size:18px}.section-head{display:block}.section-head>p{max-width:100%;margin-top:9px}.experience-track{padding-left:12cqw;padding-right:12cqw}.experience-card{flex-basis:76cqw;width:76cqw}.site-footer>span:nth-child(2){display:none}}
@media (max-width:760px){html{scroll-padding-top:18px}.page-grid{display:block;padding:28px 16px 0}.profile-sidebar{position:static;width:auto;max-height:none;overflow:visible;margin-bottom:17px}.profile-card{display:grid;grid-template-columns:102px 1fr;column-gap:16px;row-gap:0;padding:16px}.side-topline{grid-column:1/-1}.portrait-frame{margin-top:12px;aspect-ratio:1/1}.portrait-art svg{width:93%;height:72%}.portrait-art>span{font-size:7px}.profile-identity{padding-top:12px;align-self:center}.profile-identity h1{font-size:24px}.profile-identity>p{font-size:11px}.profile-card>.profile-rule,.profile-meta,.profile-card>.side-block,.profile-card>.sidebar-contact{display:none}.side-caption{display:none}.hero-copy{padding:37px 24px 68px}.hero h2{font-size:clamp(22.4px,5.12vw,32px)}.hero-copy>p{font-size:12px}.hero-actions{gap:14px}.hero-bottom{padding:0 20px;height:36px;font-size:8px}.section-block{padding-top:43px}.section-head{margin-bottom:20px}.value-cards{grid-template-columns:1fr;gap:12px}.value-card{min-height:0;padding:19px 21px}.value-icon{margin-top:12px;width:42px;height:42px}.value-icon svg{width:25px;height:25px}.value-card h3{font-size:20px;margin-top:11px}.value-card h3 br{display:none}.value-card p{margin-bottom:10px}.experience-section,.approach-section{padding-top:46px}.experience-toolbar{margin-top:0}.experience-window{margin:0 -16px}.experience-track{gap:12px;padding:0 11cqw 4px}.experience-card{flex-basis:78cqw;width:78cqw;padding:20px 20px 19px;min-height:312px}.experience-card h3{font-size:21px}.experience-detail{grid-template-columns:1fr;gap:10px}.experience-divider{margin:13px 0}.experience-detail p{font-size:11px}.experience-foot{margin-top:13px}.section-note{font-size:9px}.process-grid{grid-template-columns:1fr}.process-step,.process-step+.process-step{padding:17px 0;border-left:0}.process-step+.process-step{border-top:1px solid var(--line)}.process-number{font-size:35px;margin-top:0}.process-step h3{margin:2px 0}.ninety-section{margin-top:44px;padding:28px 23px}.ninety-grid{grid-template-columns:1fr;gap:18px}.ninety-grid>div{padding-top:11px}.ninety-grid h3{font-size:17px;margin:4px 0}.contact-section{margin-top:44px;padding:34px 24px 25px}.contact-section h2{font-size:clamp(26px,6vw,35px)}.contact-actions{gap:13px}.contact-meta{gap:9px 16px}.site-footer{flex-wrap:wrap;padding-bottom:28px}}
@media (max-width:390px){.section-overline{font-size:9px}.hero h2{font-size:21.6px}.hero-copy{padding-left:20px;padding-right:20px}.button-primary{padding:12px 13px;font-size:11px;gap:11px}.hero-bottom span:last-child{font-size:7px}.experience-card{flex-basis:84cqw;width:84cqw}.experience-track{padding-left:8cqw;padding-right:8cqw}}
@media (prefers-reduced-motion:reduce){html,.experience-window{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
@page{size:A4;margin:13mm}
@media print{
  html{scroll-behavior:auto}body{background:var(--paper);font-size:10pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .side-caption,.sidebar-contact,.hero-actions,.slider-controls,.slider-dots,.section-note,.contact-actions,.site-footer>a,.toast{display:none!important}
  .page-grid{max-width:none;display:grid;grid-template-columns:52mm minmax(0,1fr);gap:8mm;padding:0}
  .profile-sidebar{position:static;width:auto;max-height:none;overflow:visible}.profile-card{padding:3mm;box-shadow:none;border:1px solid var(--line)}.portrait-frame{max-height:48mm}.profile-identity h1{font-size:18pt}.side-block.side-message{margin-top:12px}.profile-meta div{grid-template-columns:16mm 1fr}.profile-meta dd{font-size:8pt}
  .hero{display:block;min-height:0;box-shadow:none;border-radius:4mm}.hero-grid,.hero-visual{display:none}.hero-copy{padding:10mm 9mm 12mm}.hero h2{font-size:15.2pt}.hero-copy>p{font-size:8.5pt}.hero-bottom{height:7mm;padding:0 9mm}
  .section-block{padding-top:8mm;break-inside:avoid}.section-head{margin-bottom:4mm;display:block}.section-head h2,.ninety-title h2{font-size:16pt}.section-head>p{max-width:none;margin-top:2mm}.value-cards{gap:2mm}.value-card{min-height:0;padding:4mm;break-inside:avoid}.value-icon{margin-top:3mm;width:8mm;height:8mm}.value-icon svg{width:6mm;height:6mm}.value-card h3{font-size:11pt}.value-card p{font-size:8pt}.card-link{font-size:7pt}
  .experience-window{overflow:visible}.experience-track{display:grid;grid-template-columns:1fr;gap:2mm;width:100%;padding:0}.experience-card,.experience-card.is-active{width:100%;min-height:0;opacity:1;transform:none;padding:5mm;break-inside:avoid}.experience-card h3{font-size:12pt;margin:2mm 0}.experience-divider{margin:2mm 0}.experience-detail{gap:4mm}.experience-detail p{font-size:8pt}.experience-foot{margin-top:3mm}
  .process-grid{gap:3mm}.process-step,.process-step+.process-step{padding:2mm}.process-number{font-size:20pt}.process-step p{font-size:8pt}
  .ninety-section{margin-top:8mm;padding:6mm;break-inside:avoid}.ninety-grid{margin-top:4mm;gap:4mm}.ninety-grid p{font-size:8pt}
  .contact-section{margin-top:8mm;padding:7mm;break-inside:avoid}.contact-section h2{font-size:18pt}.contact-meta{margin-top:5mm}.site-footer{display:block!important;padding:5mm 0}
}

/* Career history: year on the left, details on the right of one vertical line. */
.history-timeline{--year-width:104px;--history-gap:27px;position:relative;list-style:none;margin:0;padding:0}
.history-timeline::before{content:"";position:absolute;top:0;bottom:0;left:var(--year-width);width:1px;background:var(--line)}
.history-item{display:grid;grid-template-columns:var(--year-width) minmax(0,1fr);gap:0;padding:0 0 30px;break-inside:avoid}
.history-item:last-child{padding-bottom:0}
.history-year{padding:2px 20px 0 0;text-align:right;color:var(--navy);font-size:14px;font-weight:850;line-height:1.5;overflow-wrap:anywhere}
.history-detail{min-width:0;padding-left:var(--history-gap)}
.history-detail h3{margin:0;font-size:18px;line-height:1.5;letter-spacing:-.04em;font-weight:850;overflow-wrap:anywhere}
.history-detail p{margin:7px 0 0;font-size:12px;line-height:1.8;color:var(--navy);overflow-wrap:anywhere}
@media (max-width:760px){.history-timeline{--year-width:78px;--history-gap:18px}.history-year{font-size:12px;padding-right:14px}.history-detail h3{font-size:16px}.history-item{padding-bottom:25px}}
@media print{.history-timeline{--year-width:19mm;--history-gap:4mm}.history-item{padding-bottom:4mm}.history-year{font-size:8pt;padding-right:3mm}.history-detail h3{font-size:10pt}.history-detail p{font-size:8pt;margin-top:1mm}}

/* Resume content imported from the verified webtest portfolio. */
.portrait-photo{object-position:50% 24%}
.history-timeline{--year-width:134px}.history-year{font-size:12px}
.resume-career-body h4{font-size:12px;margin:18px 0 7px;color:var(--navy)}
.resume-career-body p{font-size:12px;line-height:1.85;margin:0;color:var(--navy)}
.resume-results{padding:0;list-style:none;margin:0}.resume-results li{padding:11px 0;border-top:1px solid var(--line)}
.resume-results .result-title{display:block;font-size:12px;line-height:1.7;margin-bottom:4px}
.resume-results .career-recognition{margin-top:7px;font-weight:750}
.experience-date{white-space:nowrap}
.resume-credentials-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.resume-credentials-grid>div>h3{font-size:18px;margin:0 0 12px}
.resume-credentials-grid article{padding:18px 0;border-top:1px solid var(--line);break-inside:avoid}
.resume-credentials-grid h4{font-size:16px;margin:5px 0;line-height:1.6}.resume-credentials-grid h4 span{font-size:12px;font-weight:500}
.resume-credentials-grid p{font-size:12px;color:var(--navy);line-height:1.8;margin:7px 0}.resume-credentials-grid .credential-date{font-size:11px;margin:0}
.credential-meta{display:flex;align-items:center;gap:12px}.credential-badge{font-size:10px;color:var(--navy)}
@media(max-width:760px){.history-timeline{--year-width:90px}.history-year{font-size:10px}.resume-credentials-grid{grid-template-columns:1fr;gap:25px}.experience-card-top{flex-wrap:wrap}.resume-career-body p{font-size:11px}}
@media print{.history-timeline{--year-width:24mm}.history-year{font-size:8pt}.resume-credentials-grid{gap:5mm}.resume-credentials-grid p,.resume-career-body p{font-size:8pt}.resume-credentials-grid h4{font-size:10pt}}

.profile-meta dd[data-profile="emailLabel"]{font-size:11px;letter-spacing:-.02em;white-space:nowrap;overflow-wrap:normal;word-break:normal}

.hero-landscape{display:block;align-self:center;width:100%;height:auto;aspect-ratio:1/1;max-height:none;object-fit:contain;object-position:center;padding:0;background:transparent;border-radius:3px;margin-bottom:18px}

.hero-visual-steps{width:100%;justify-content:space-evenly;gap:6px;font-size:clamp(16px,1.4vw,21px);font-weight:900;line-height:1.5;letter-spacing:0;white-space:nowrap;color:var(--paper)}

/* Skills and selected work: static portfolio overview. */
.capability-board{border-top:1px solid var(--line)}
.capability-row{display:grid;grid-template-columns:155px minmax(0,1fr);gap:28px;padding:27px 0;border-bottom:1px solid var(--line)}
.capability-label>span{font-size:9px;font-weight:800;letter-spacing:.09em;color:var(--navy)}
.capability-label h3{margin:8px 0 0;font-size:19px;font-weight:850;letter-spacing:-.04em;line-height:1.5}
.capability-content{min-width:0}.capability-content>p{font-size:13px;line-height:1.8;margin:0 0 15px;color:var(--navy)}
.capability-tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.capability-tags li{font-size:11px;font-weight:700;padding:6px 11px;background:color-mix(in srgb,var(--blue) 24%,var(--paper));border:1px solid var(--line);border-radius:3px}
.capability-services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;list-style:none;padding:0;margin:0}
.capability-services strong{font-size:13px;font-weight:850}.capability-services p{font-size:12px;line-height:1.85;color:var(--navy);margin:8px 0 0}
.capability-work-row{grid-template-columns:1fr;gap:20px}.work-showcase{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.work-sample{min-width:0;padding:22px 20px;border:1px solid var(--line);border-radius:4px;background:color-mix(in srgb,var(--blue) 12%,var(--paper));display:flex;flex-direction:column;break-inside:avoid}
.work-sample-type{font-size:9px;font-weight:800;letter-spacing:.06em;color:var(--navy)}
.work-sample h4{font-size:20px;line-height:1.5;font-weight:850;letter-spacing:-.04em;margin:18px 0 12px}
.work-sample>p{font-size:12px;line-height:1.85;color:var(--navy);margin:0 0 20px}
.work-sample dl{margin:auto 0 0;padding-top:13px;border-top:1px solid var(--line);display:grid;gap:8px}
.work-sample dl>div{display:grid;grid-template-columns:26px minmax(0,1fr);gap:8px;font-size:10px;line-height:1.8}.work-sample dt{font-weight:850;color:var(--navy)}.work-sample dd{margin:0;overflow-wrap:anywhere}
@media(max-width:1100px){.capability-row{grid-template-columns:125px minmax(0,1fr);gap:20px}.capability-services{grid-template-columns:1fr;gap:15px}.capability-work-row{grid-template-columns:1fr}.work-showcase{grid-template-columns:1fr}.work-sample h4 br{display:none}.work-sample h4{margin-top:12px}.work-sample dl{margin-top:0}}
@media(max-width:760px){.capability-row{grid-template-columns:1fr;gap:18px;padding:22px 0}.capability-label h3{font-size:18px;margin-top:4px}.work-sample{padding:20px}.work-sample h4{font-size:20px}}
@media print{.capability-row{grid-template-columns:1fr;gap:3mm;padding:4mm 0}.capability-label h3{font-size:11pt}.capability-tags li,.capability-services p,.work-sample>p{font-size:8pt}.capability-services{grid-template-columns:1fr;gap:3mm}.work-showcase{grid-template-columns:1fr;gap:3mm}.work-sample{padding:4mm}.work-sample h4{font-size:12pt;margin:2mm 0}.work-sample h4 br{display:none}.work-sample dl{margin-top:0}}

/* Tools and personal creations. */
.tool-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;list-style:none;margin:0;padding:0}
.tool-list li{padding:12px 0}.tool-list strong{display:block;font-size:15px;font-weight:850;line-height:1.5}.tool-list span{display:block;font-size:11px;line-height:1.8;margin-top:6px;color:var(--navy)}
.creative-showcase{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.creation-card{min-width:0;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--paper);break-inside:avoid}
.creation-featured{grid-column:1/-1;display:grid;grid-template-columns:1.3fr 1fr;align-items:center;background:color-mix(in srgb,var(--blue) 12%,var(--paper))}
.creation-image{min-width:0;padding:18px;background:color-mix(in srgb,var(--blue) 28%,var(--paper))}.creation-image img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:3px}
.creation-copy{padding:25px}.creation-copy h4{font-size:22px;line-height:1.45;letter-spacing:-.04em;margin:12px 0;font-weight:850}.creation-copy>p{font-size:12px;line-height:1.85;color:var(--navy);margin:0 0 20px}
.creation-copy .capability-tags li{font-size:10px;padding:4px 8px}
@media(max-width:1100px){.tool-list{grid-template-columns:1fr;gap:5px}.tool-list li{padding:5px 0}.creation-featured{grid-template-columns:1fr}}
@media(max-width:760px){.creative-showcase{grid-template-columns:1fr}.creation-copy{padding:20px}.creation-image{padding:12px}.creation-copy h4{font-size:20px}}
@media print{.tool-list{grid-template-columns:1fr;gap:2mm}.tool-list strong{font-size:10pt}.creative-showcase,.creation-featured{grid-template-columns:1fr}.creation-copy{padding:4mm}.creation-copy>p{font-size:8pt}.creation-image{padding:3mm}}

/* Compact service rows: title and description share one row. */
.capability-services{grid-template-columns:1fr;gap:10px}
.capability-services li{display:grid;grid-template-columns:135px minmax(0,1fr);gap:14px;align-items:baseline}
.capability-services strong{font-size:12px;line-height:1.8;white-space:nowrap}
.capability-services p{margin:0;font-size:12px;line-height:1.8}
@media(max-width:760px){.capability-services li{grid-template-columns:112px minmax(0,1fr);gap:10px}.capability-services strong,.capability-services p{font-size:11px}}
@media print{.capability-services li{grid-template-columns:29mm minmax(0,1fr);gap:3mm}.capability-services strong,.capability-services p{font-size:8pt}}

/* Compact tools: two columns, with the third tool on the next row. */
.tool-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 20px}
.tool-list li{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding:0;min-width:0}
.tool-list strong{display:inline;font-size:12px;line-height:1.8;white-space:nowrap}
.tool-list span{display:inline;margin:0;font-size:11px;line-height:1.8}
@media(max-width:760px){.tool-list{grid-template-columns:1fr;gap:8px}.tool-list li{gap:10px}}
@media print{.tool-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:2mm 4mm}.tool-list strong,.tool-list span{font-size:8pt}}

.history-detail-inline{display:flex;align-items:baseline;gap:6px 14px;flex-wrap:wrap}.history-detail-inline p{margin:0}

/* One line per history entry; horizontal scrolling preserves type size on narrow screens. */
.history-section{min-width:0}
.history-timeline{--year-width:168px;overflow-x:auto}
.history-item{width:max-content;min-width:100%;grid-template-columns:var(--year-width) max-content;padding-bottom:20px}
.history-year{white-space:nowrap}
.history-detail-inline{flex-wrap:nowrap;white-space:nowrap;padding-right:12px}
.history-detail-inline h3,.history-detail-inline p{white-space:nowrap;overflow-wrap:normal;flex-shrink:0}
@media print{.history-timeline{--year-width:36mm;overflow:visible}.history-item{padding-bottom:3mm}}
/* Compact career cards without clipping their content. */
@media screen{.experience-card{padding:20px 24px 18px;min-height:0}.experience-card h3{margin:12px 0 4px}.experience-divider{margin:12px 0 10px}.resume-career-body h4{margin:10px 0 5px}.resume-career-body p{line-height:1.48}.resume-results li{padding:7px 0}.resume-results .result-title{line-height:1.4;margin-bottom:3px}.resume-results .career-recognition{margin-top:5px}}

/* Personal creations: description left, actual screenshot right. */
.creative-showcase{grid-template-columns:minmax(0,1fr)}
.creation-with-image{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);align-items:center;background:color-mix(in srgb,var(--blue) 12%,var(--paper))}
.creation-with-image .creation-copy{min-width:0}
.creation-with-image .creation-image{height:100%;display:flex;align-items:center;padding:18px}
.creation-with-image .creation-image img{width:100%;height:auto;object-fit:contain}
@media(max-width:760px){.creation-with-image{grid-template-columns:minmax(0,1fr)}.creation-with-image .creation-image{padding:12px}}
@media print{.creation-with-image{grid-template-columns:minmax(0,1fr)}.creation-with-image .creation-image{padding:3mm}}


/* Match each preview image to its frame without extra background margins. */
.creation-with-image .creation-image{display:block;height:auto;align-self:center;padding:0;background:transparent}
.creation-with-image .creation-image img{display:block;width:100%;height:auto;max-width:100%;border:0;border-radius:0;margin:0;object-fit:contain}
/* Uniform 4:3 portfolio previews; keep each complete image visible. */
.creation-with-image .creation-image{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:4/3;height:auto;overflow:hidden;background:color-mix(in srgb,var(--blue) 28%,var(--paper));padding:0}
.creation-with-image .creation-image img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;margin:0;border:0}

/* Trim the portrait lower edge and fill portfolio frames without letterboxing. */
.hero-photo-frame{width:100%;aspect-ratio:1/1;align-self:center;overflow:hidden;border-radius:3px;margin-bottom:18px}
.hero-photo-frame .hero-landscape{width:100%;height:100%;margin:0;object-fit:cover;transform:scale(1.07);transform-origin:center top;border-radius:0}
.creation-with-image .creation-image img{object-fit:cover;object-position:center}
.creation-with-image .creation-image .product-detail-preview{object-position:center top}
/* Match the three supplied 1120 x 800 portfolio images. */
.creation-with-image .creation-image{aspect-ratio:7/5}
.creation-with-image .creation-image img{object-fit:cover;object-position:center}
