/* Generated by scripts/build-styles.cjs. Edit the source stylesheets. */
@property --hero-ring-angle{syntax:'<angle>';inherits:false;initial-value:360deg}
.hero-copy .hero-enter{animation:none}
.hero-copy.is-copy-animating .hero-follow{animation:hero-copy-enter .4s ease-out var(--follow-delay) both}
.hero-copy.is-copy-preparing .hero-follow{animation-play-state:paused}
.hero-copy.is-copy-animating a.hero-follow:focus-visible{animation:none;opacity:1;transform:none}
@keyframes hero-copy-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.hero-writing{position:relative;animation:none!important}
.hero-writing-solid{--letter-color:var(--white)}
.hero-writing-solid.accent{--letter-color:var(--coral)}
.hero-writing.has-lettering .hero-writing-label{color:transparent;-webkit-text-stroke:0}
.hero-writing-svg{position:absolute;left:0;top:50%;transform:translateY(-50%);max-width:100%;overflow:visible;fill:none;stroke:var(--letter-color,var(--soft));stroke-width:1px}
.hero-writing-svg .hero-letter{vector-effect:non-scaling-stroke}
.hero-letter-fill{fill:var(--letter-color);stroke:none}
.hero-writing.is-writing .hero-letter{animation:hero-letter-draw var(--letter-duration,.3s) cubic-bezier(.4,0,.25,1) calc(var(--line-delay) + var(--letter-index)*var(--letter-stagger,.05s)) both}
.hero-writing.is-writing .hero-letter-fill{animation:hero-layer-fade var(--letter-fill-duration,.09s) ease-out var(--line-end) both}
.hero-writing.is-writing-preparing :is(.hero-letter,.hero-letter-fill){animation-play-state:paused}
@keyframes hero-letter-draw{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
.hero-sequence{aspect-ratio:597/653;isolation:isolate;--portrait-time:1s;--circle-time:1.3s;--light-delay:var(--portrait-time);--light-time:.8s}
.hero-sequence::before{content:'';position:absolute;z-index:-2;left:50%;top:1.84%;margin-top:38.44%;width:145%;aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(circle closest-side,#841c061a 0%,#841c0629 28%,#a735084d 39%,#ed60005c 50%,#ac290640 63%,#4c0d2426 78%,transparent 100%);pointer-events:none}
.hero-art .hero-light{position:absolute;z-index:-1;left:50%;top:1.84%;margin-top:38.44%;width:140%;height:auto;transform:translate(-50%,-50%);filter:hue-rotate(18deg) saturate(.85);mix-blend-mode:screen;pointer-events:none}
/* Extra SVG padding lets the glow spread without changing the rim geometry. */
.hero-circle{position:absolute;z-index:0;left:4.77%;top:1.84%;margin-top:-6.7%;width:90.45%;aspect-ratio:540/539;--hero-ring-angle:360deg;mask-image:conic-gradient(from 180deg,transparent 0deg calc(360deg - var(--hero-ring-angle)),#000 calc(360deg - var(--hero-ring-angle)) 360deg)}
.hero-portrait{position:absolute;z-index:1;left:6.53%;top:9%;width:86.94%;aspect-ratio:1}
.hero-portrait-main{position:relative;mask-image:linear-gradient(to bottom,#000 0%,#000 74%,#000b 86%,transparent 100%)}
.hero-portrait-soft{position:absolute;inset:0;filter:blur(12px);mask-image:linear-gradient(to bottom,transparent 0%,transparent 68%,#0009 84%,transparent 100%)}
.hero-skills{position:absolute;z-index:2;isolation:isolate;left:19%;top:65%;width:62%;color:white}
.hero-skills::before{content:'';position:absolute;z-index:-1;inset:-20px -28px -12px;background:linear-gradient(to bottom,transparent,#101114c9 35%,#101114ed 78%,transparent);filter:blur(12px);pointer-events:none}
.hero-skills-intro{font-family:'IBM Plex Mono',monospace;font-size:10px;line-height:16px;color:#dedfe2;margin:0 0 12px}
.hero-skills-list{list-style:none;padding:0;margin:0}
.hero-skills-list li{position:relative;min-height:44px;display:flex;align-items:center}
.hero-skill-divider{position:absolute;top:0;left:0;width:100%;height:1px;background:#ffffff1a;transform-origin:left}
.hero-skills-list li:first-child .hero-skill-divider{background:#ffffff2e}
.hero-skill-text{display:flex;align-items:center;gap:24px;width:100%;font-size:12px;line-height:18px}
.hero-skill-number{font-family:'IBM Plex Mono',monospace;color:#777b84;font-size:8px;line-height:12px;flex:0 0 16px}
.hero-sequence.is-preparing :is(.hero-light,.hero-circle,.hero-portrait,.hero-skills-intro,.hero-skill-text,.hero-skill-divider){opacity:0}
.hero-sequence.is-preparing::before{opacity:0}
.hero-sequence.is-animating .hero-portrait{animation:hero-layer-fade var(--portrait-time) ease-in-out both}
.hero-sequence.is-animating .hero-light{animation:hero-layer-fade var(--light-time) ease-in-out var(--light-delay) both}
.hero-sequence.is-animating::before{animation:hero-layer-fade var(--light-time) ease-in-out var(--light-delay) both}
.hero-sequence.is-animating .hero-circle{animation:hero-ring-draw var(--circle-time) cubic-bezier(.2,.6,.25,1) var(--portrait-time) both}
.hero-sequence.is-animating .hero-skills-intro{animation:hero-layer-fade .35s ease-out calc(var(--portrait-time) + var(--circle-time)) both}
.hero-sequence.is-animating .hero-skill-divider{animation:hero-divider-grow .22s ease-in-out calc(var(--portrait-time) + var(--circle-time) + .42s + var(--skill-index)*.48s) both}
.hero-sequence.is-animating .hero-skill-text{animation:hero-layer-fade .35s ease-out calc(var(--portrait-time) + var(--circle-time) + .64s + var(--skill-index)*.48s) both}
@keyframes hero-layer-fade{from{opacity:0}to{opacity:1}}
@keyframes hero-ring-draw{from{--hero-ring-angle:0deg}to{--hero-ring-angle:360deg}}
@keyframes hero-divider-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:1023px){.hero-sequence{aspect-ratio:597/760}.hero-portrait{top:8.5%}.hero-skills{top:57%;left:8%;width:84%}.hero-skills-list li{min-height:40px}.hero-skills-intro{font-size:10px}.hero-skill-text{font-size:12px;gap:16px}}
@media(max-width:767px){.hero-skills{left:5%;width:90%}.hero-skills-list li{min-height:38px}.hero-skill-text{font-size:11px;gap:12px}.hero-skills-intro{font-size:9px;line-height:15px}}
@media(prefers-reduced-motion:reduce){.hero-writing.is-writing .hero-letter{animation:none;stroke-dashoffset:0}.hero-writing .hero-letter-fill{opacity:1}.hero-sequence.is-preparing :is(.hero-light,.hero-circle,.hero-portrait,.hero-skills-intro,.hero-skill-text,.hero-skill-divider){opacity:1}.hero-circle{--hero-ring-angle:360deg}.hero-skill-divider{transform:none}}

.hero-glitch-svg{position:absolute;left:0;top:50%;max-width:100%;overflow:visible;pointer-events:none;fill:none;stroke:var(--glitch-color);stroke-width:1px;opacity:0;transform:translateY(-50%)}
.hero-glitch-svg .hero-glitch-glyph{vector-effect:non-scaling-stroke;stroke-dasharray:none;stroke-dashoffset:0}
.hero-glitch-svg .hero-glitch-fill{fill:var(--glitch-color);stroke:none}
.hero-title.is-glitching .hero-glitch-svg{animation:hero-hologram-slice var(--glitch-duration) steps(1,end) both;filter:drop-shadow(0 0 5px var(--glitch-color))}
.hero-title.is-glitching .hero-writing-svg{animation:hero-hologram-jolt var(--glitch-duration) steps(1,end) both}
.hero-glitch-svg:nth-of-type(3){animation-direction:reverse!important}
.hero-glitch-svg:nth-of-type(4){animation-delay:35ms!important;filter:none!important}
@keyframes hero-hologram-slice{
  0%,100%{opacity:0;clip-path:inset(50% 0 50% 0);transform:translate(0,-50%)}
  9%{opacity:1;clip-path:polygon(0 10%,100% 10%,100% 24%,0 24%,0 37%,100% 37%,100% 51%,0 51%,0 69%,100% 69%,100% 84%,0 84%);transform:translate(var(--glitch-shift),calc(-50% - 2px))}
  26%{opacity:1;clip-path:polygon(0 20%,100% 20%,100% 31%,0 31%,0 48%,100% 48%,100% 64%,0 64%,0 85%,100% 85%,100% 95%,0 95%);transform:translate(calc(var(--glitch-shift)*-.8),calc(-50% + 2px))}
  42%{opacity:.5;clip-path:inset(32% 0 55% 0);transform:translate(calc(var(--glitch-shift)*.5),-50%)}
  56%{opacity:1;clip-path:polygon(0 5%,100% 5%,100% 16%,0 16%,0 30%,100% 30%,100% 46%,0 46%,0 61%,100% 61%,100% 73%,0 73%,0 80%,100% 80%,100% 92%,0 92%);transform:translate(calc(var(--glitch-shift)*1.2),-50%)}
  74%{opacity:.95;clip-path:inset(40% 0 43% 0);transform:translate(calc(var(--glitch-shift)*-.6),calc(-50% - 2px))}
  87%{opacity:0;transform:translate(0,-50%)}
}
@keyframes hero-hologram-jolt{
  0%,42%,87%,100%{transform:translateY(-50%);clip-path:none}
  9%{transform:translate(var(--glitch-jolt),-50%);clip-path:polygon(0 0,100% 0,100% 31%,0 31%,0 38%,100% 38%,100% 67%,0 67%,0 73%,100% 73%,100% 100%,0 100%)}
  26%{transform:translate(calc(var(--glitch-jolt)*-1),calc(-50% + 1px));clip-path:polygon(0 0,100% 0,100% 18%,0 18%,0 24%,100% 24%,100% 51%,0 51%,0 59%,100% 59%,100% 100%,0 100%)}
  56%{transform:translate(var(--glitch-jolt),calc(-50% - 1px));clip-path:polygon(0 0,100% 0,100% 40%,0 40%,0 49%,100% 49%,100% 83%,0 83%,0 90%,100% 90%,100% 100%,0 100%)}
  74%{transform:translate(calc(var(--glitch-jolt)*-1),-50%);clip-path:none}
}
@media(prefers-reduced-motion:reduce){.hero-glitch-svg{display:none!important;animation:none!important}.hero-title.is-glitching .hero-writing-svg{animation:none!important}}

.hero-particles{position:absolute;z-index:1;left:-18%;top:-24%;width:136%;height:124%;pointer-events:none;opacity:0;transition:opacity .5s ease-out}
.hero-particles[data-state="running"]{opacity:1}
@media(prefers-reduced-motion:reduce){.hero-particles{display:none!important;transition:none}}

/* Decorative annotations sit behind the existing hero content and light. */
.hero-inner{isolation:isolate}
.hero-blueprint{position:absolute;inset:0;z-index:-1;pointer-events:none;user-select:none}
.hero-blueprint>svg{display:block;position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.blueprint-line{stroke:#c6c1cd;stroke-opacity:.2;stroke-width:1}
.blueprint-label{fill:#bdb3bf;fill-opacity:.5;font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:1.4px}
.blueprint-accent{stroke:var(--coral);stroke-opacity:.5;stroke-width:1.5}
.hero-blueprint .hero-blueprint-mobile{display:none}
.blueprint-field-heading{position:absolute;left:0;top:-28px;display:flex;align-items:center;gap:20px;font-family:'IBM Plex Mono',monospace;font-size:8px;line-height:12px;letter-spacing:1.5px;color:#bdb3bf70}
.blueprint-field-heading i{position:relative;width:140px;height:1px}
.blueprint-field-heading i::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#c6c1cd29,transparent);transform-origin:left}
.blueprint-field-footer{position:absolute;left:0;bottom:-32px;height:16px;display:flex;align-items:center;gap:20px;font-family:'IBM Plex Mono',monospace;font-size:8px;line-height:12px;letter-spacing:1.5px;color:#bdb3bf70}
.blueprint-field-footer i{position:relative;width:200px;height:1px}
.blueprint-field-footer i::before{content:'';position:absolute;inset:0;background:#c6c1cd1a;transform-origin:left}
.blueprint-field-footer i::after{content:'';position:absolute;right:0;top:-2px;width:5px;height:5px;border:1px solid #ff66334d}
.blueprint-field-right{position:absolute;right:-20px;bottom:-32px;width:28px;height:270px}
.blueprint-field-right>span{position:absolute;right:-2px;bottom:114px;writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap;font-family:'IBM Plex Mono',monospace;font-size:9px;line-height:12px;letter-spacing:1.4px;color:#bdb3bf80}
.blueprint-field-right svg{position:absolute}
.blueprint-right-bracket{right:0;bottom:40px;width:28px;height:60px}
.blueprint-right-cross{right:6px;bottom:0;width:16px;height:16px}
@media(min-width:1024px) and (max-width:1190px){.hero-blueprint-desktop{opacity:.65}}
@media(max-width:1023px){
 .hero-blueprint .hero-blueprint-desktop{display:none}
 .hero-blueprint .hero-blueprint-mobile{display:block;top:auto;bottom:0;left:50%;width:min(100%,440px);height:auto;aspect-ratio:342/436;transform:translateX(-50%)}
 .blueprint-field-heading{top:-16px;font-size:7px;gap:12px}
 .blueprint-field-heading i{width:72px}
 .blueprint-field-footer{bottom:-16px;font-size:7px;gap:12px}
 .blueprint-field-footer i{width:100px}
 .blueprint-field-right{bottom:-16px}
 .blueprint-field-right>span{font-size:7px;letter-spacing:1.2px}
}
@media(max-width:767px){.blueprint-field-footer,.blueprint-field-right{bottom:-40px}.blueprint-field-footer i{width:100px}}
.hero-blueprint[data-motion-state=preparing]{visibility:hidden}
.blueprint-character{white-space:pre}
.hero-blueprint.is-blueprint-running .blueprint-accent,.hero-blueprint.is-blueprint-running .blueprint-field-footer i::after{animation:blueprint-fade .18s ease-out both}
.hero-blueprint.is-blueprint-running .blueprint-growth{stroke-dasharray:1;animation:blueprint-line-grow .9s cubic-bezier(.3,0,.2,1) .2s both}
.hero-blueprint.is-blueprint-running :is(.blueprint-field-heading,.blueprint-field-footer) i::before{animation:blueprint-rule-grow .9s cubic-bezier(.3,0,.2,1) .2s both}
.hero-blueprint.is-blueprint-running .blueprint-shape{animation:blueprint-fade .2s ease-out 1.12s both}
.hero-blueprint.is-blueprint-running .blueprint-character{animation:blueprint-type-in .001s steps(1,end) calc(1.12s + var(--text-delay) + var(--character-index)*.035s) both}
.hero-blueprint.is-blueprint-running *,.hero-blueprint.is-blueprint-running *::before,.hero-blueprint.is-blueprint-running *::after{animation-play-state:var(--blueprint-play-state,running)}
@keyframes blueprint-fade{from{opacity:0}to{opacity:1}}
@keyframes blueprint-line-grow{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes blueprint-rule-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes blueprint-type-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.hero-blueprint[data-motion-state=preparing]{visibility:visible}}

@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/ibm-plex-mono-bold.woff2') format('woff2')}
.skills-marquee{height:136px;padding:48px 0 48px 24px;background:#d7ff49;color:var(--ink);overflow:hidden;display:flex;align-items:center}
.skills-marquee-track{display:flex;flex:none;width:max-content;animation:skills-marquee-slide 75s linear infinite;animation-play-state:paused}
.skills-marquee-group{flex:none;margin:0;font-family:'IBM Plex Mono',monospace;font-size:48.80851px;font-weight:700;line-height:1;letter-spacing:0;color:var(--ink);white-space:pre}
.skills-marquee.is-running .skills-marquee-track{animation-play-state:running;will-change:transform}
.skills-marquee:hover .skills-marquee-track,.skills-marquee:focus-within .skills-marquee-track{animation-play-state:paused}
.skills-marquee:focus-visible{outline-offset:-4px}
@keyframes skills-marquee-slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:767px){.skills-marquee{height:96px;padding-block:32px}.skills-marquee-group{font-size:28px}}
@media(prefers-reduced-motion:reduce){.skills-marquee{height:auto;min-height:96px;padding:24px}.skills-marquee-track{display:block;width:100%;animation:none;will-change:auto}.skills-marquee-group{white-space:normal;font-size:clamp(18px,3vw,28px);line-height:1.5}.skills-marquee-group[aria-hidden=true]{display:none}}

.sandfit-home-cover{height:auto;aspect-ratio:624/320;background:#121a15}
.sandfit-home-cover .native-art{display:block;position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;height:auto;aspect-ratio:16/9;border:0;pointer-events:none}
.sandfit-home-cover .native-art{transition:scale .7s var(--ease)}
.sandfit-home-cover:is(:hover,:focus-visible) .native-art{scale:1.035}
@media(prefers-reduced-motion:reduce){.sandfit-home-cover .native-art{transition:none}.sandfit-home-cover:is(:hover,:focus-visible) .native-art{scale:1}}
@media(max-width:767px){.sandfit-home-cover{aspect-ratio:16/9}}
.workbench-visual-delivery{padding:0;overflow:hidden}
.workbench-visual-delivery>.mono{padding:16px 16px 0}
.workbench-visual-delivery .workbench-delivery{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain}

/* Product journey and booking channel illustrations. */
.workbench-journey{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:4px 0 8px}
.workbench-journey figure{min-width:0;margin:0;display:flex;flex-direction:column;align-items:center;gap:6px}
.workbench-journey img{width:100%;max-width:152px;height:auto;aspect-ratio:1;object-fit:contain}
.workbench-journey figcaption{color:var(--paper);font-size:14px;line-height:20px;font-weight:600;text-align:center}
@media(max-width:767px){.workbench-journey{gap:8px;margin-block:0 4px}.workbench-journey figure{gap:4px}.workbench-journey figcaption{font-size:12px;line-height:18px}}
@media(max-width:767px){
 .home-page .section{padding-block:48px}
 .home-page .stack-lg{gap:24px}
 .home-page .hero{padding-top:16px;padding-bottom:32px}
 .home-page .hero-inner{gap:24px}
 .home-page .hero-art{max-width:300px}
 .home-page .featured-project{gap:24px}
 .home-page .featured-copy{gap:16px}
 .home-page .featured-copy h2{font-size:30px;line-height:34px}
 .home-page .featured-role{display:none}
 .home-page .workbench{min-height:0}
 .home-page .workbench-panel{gap:24px}
 .home-page .experience-summary{margin-top:0;padding-top:16px;gap:16px}
}

.certifications-section{overflow:hidden;background:var(--surface);border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);padding-block:80px}
.certifications-grid{display:grid;grid-template-columns:minmax(0,418fr) minmax(0,766fr);gap:64px;align-items:center}
.certifications-copy{gap:24px;align-items:flex-start}
.certifications-copy>p:not(.eyebrow){max-width:420px}
.certifications-copy .certification-topics{color:var(--coral);margin-top:8px}
.certifications-total{color:var(--soft)}
.certifications-stage{min-width:0}
.certifications-viewport{overflow-x:auto;padding:18px 12px;scrollbar-width:none}
.certifications-viewport::-webkit-scrollbar{display:none}
.certifications-viewport.is-carousel-ready{overflow-x:hidden;touch-action:pan-y}
.certifications-track{display:flex;gap:24px;width:100%}
.certification-card{flex:0 0 min(300px,calc(100% - 64px));min-height:380px;padding:24px;border:1px solid var(--line-dark);border-radius:16px;background:var(--ink);display:flex;flex-direction:column;gap:20px;transition:scale .35s var(--ease),border-color .35s;position:relative;transform-origin:center}
.certification-card-brand{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:36px}
.certification-card-brand img{width:88px;height:32px;object-fit:contain;object-position:left center}
.certification-card-brand>svg{width:32px;height:32px;stroke:var(--coral);stroke-width:1;stroke-linecap:round;stroke-linejoin:round}
.certification-card-body{display:flex;flex-direction:column;gap:12px;flex:1;margin-top:8px}
.certification-category{color:var(--soft);font-size:10px;line-height:16px}
.certification-card h3{font-size:24px;line-height:28px;letter-spacing:-.48px;overflow-wrap:anywhere}
.certification-card-meta{display:flex;justify-content:space-between;gap:16px;margin-top:8px}
.certification-card-meta>div{display:flex;flex-direction:column;gap:6px}
.certification-card-meta .mono{font-size:10px;line-height:16px;color:var(--soft)}
.certification-card-meta p{font-size:16px;line-height:22px;color:var(--white)}
.certification-card-link{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:16px;border-top:1px solid var(--line-dark);font-size:14px;line-height:20px;font-weight:600}
.certification-card-link>span{color:var(--coral);font-size:22px}
.certification-card:focus-visible{scale:1.025;border-color:var(--coral);outline-offset:3px}
@media(hover:hover){.certification-card:hover{scale:1.025;border-color:var(--coral);z-index:1}}
.certifications-controls{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:8px;padding-right:4px}
.certifications-buttons{display:flex;gap:12px}
.certification-arrow{display:grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid var(--soft);border-radius:50%;background:transparent;color:var(--white);transition:color .2s,border-color .2s,background .2s}
.certification-arrow:hover{border-color:var(--coral);color:var(--coral);background:#ff6b3d0a}
.certifications-position{color:var(--soft);font-variant-numeric:tabular-nums}
@media(min-width:1024px) and (max-width:1190px){.certifications-grid{gap:40px}}
@media(min-width:768px) and (max-width:1023px){.certifications-grid{grid-template-columns:1fr;gap:24px}.certifications-copy>p:not(.eyebrow){max-width:600px}}
@media(max-width:767px){.certifications-grid{grid-template-columns:1fr;gap:24px}.certifications-copy{gap:24px}.certifications-copy h2{font-size:38px;line-height:41px;letter-spacing:-1.14px}.certifications-copy>p:not(.mono):not(.eyebrow){font-size:16px;line-height:25px}.certification-card{flex-basis:min(260px,calc(100% - 36px));min-height:360px;padding:20px;gap:18px}.certification-card h3{font-size:22px;line-height:26px}.certifications-controls{margin-top:4px}}
@media(prefers-reduced-motion:reduce){.certification-card:is(:hover,:focus-visible){scale:1}.certifications-viewport{touch-action:auto}}