/* Main portfolio: clear identity, strong contrast, and a calm reading surface. */
body.clarity-theme{--bg:#0b1220;--surface:#142238;--surface-2:#20334d;--text:#f7f9fc;--muted:#b9c5d6;--line:#ffffff24;--accent:#5eead4;--accent-dark:#082f2a;--neon-coral:#5eead4;--neon-mint:#5eead4;background:radial-gradient(ellipse at 90% 4%,#5eead40c,transparent 30%),#0b1220;font-weight:400}
.clarity-theme::after{display:none}
.clarity-theme :is(h1,h2,h3,h4,.story-title){font-family:inherit}
.clarity-theme :is(.eyebrow,.project-number,.project-content a,.contact-label){color:var(--accent);text-shadow:none}
.clarity-theme .site-header{background:#0b1220f5;border-color:var(--line)}
.clarity-theme .brand{font-weight:750;font-size:17px}
.clarity-theme .brand-mark{border-color:var(--line);box-shadow:none;border-radius:10px}
.clarity-theme .brand-role{font-size:10px;letter-spacing:.08em}
.clarity-theme .theme-nav a{font-weight:600}
.clarity-theme .theme-nav .nav-contact,.clarity-theme .button.primary{background:var(--accent);color:#082f2a;border-color:var(--accent);box-shadow:none;text-shadow:none}
.clarity-theme .hero.parallax-story{max-width:1230px;min-height:0;padding:64px 24px 52px}
.clarity-theme .hero .story-panels{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:center;gap:64px}
.clarity-theme .hero .story-panel:first-child{max-width:none;gap:0;min-height:0;justify-content:flex-start;transform:none!important}
.clarity-theme .hero .availability-pill{font-size:12px;font-weight:600;margin:0 0 28px;color:var(--muted)}
.clarity-theme .availability-pill span{background:var(--accent)}
.clarity-theme .hero-intro{color:var(--text);font-family:inherit;font-size:13px;font-weight:700;line-height:1.5;letter-spacing:.12em;margin:0 0 14px!important}
.clarity-theme .hero #hero-title{font-size:clamp(40px,4.8vw,66px);font-weight:800;line-height:1.04;letter-spacing:-.055em;text-shadow:none;transform:none;margin:0}
.clarity-theme #hero-title .outline-word{color:var(--accent);font-size:inherit;text-shadow:none;line-height:inherit}
.clarity-theme .hero-tagline{font-size:clamp(23px,2.4vw,32px);font-weight:650;line-height:1.25;letter-spacing:-.025em;margin:24px 0 16px}
.clarity-theme .hero .story-panel .hero-text{font-size:16px;line-height:1.7;max-width:550px;margin:0}
.clarity-theme .hero-specialties{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:20px 0 0}
.clarity-theme .hero-specialties li{border:1px solid var(--line);border-radius:6px;padding:5px 10px;font-size:12px;color:var(--muted);background:#ffffff04}
.clarity-theme .hero .hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 0;width:auto}
.clarity-theme .hero .hero-actions .button{flex:0 1 auto;font-size:14px;font-weight:700;min-height:48px;padding:12px 18px;border-radius:7px}
.clarity-theme .button.secondary{background:transparent;color:var(--text);border-color:var(--line)}
.clarity-theme .hero .hero-actions .resume-link{font-size:13px;padding:10px 0;min-height:44px}
.clarity-theme .hero .journey-cue{font-size:10px;letter-spacing:.1em;margin:24px 0 0;color:var(--muted)}
.clarity-theme .hero-service-card{background:linear-gradient(145deg,#20334d,#142238);border:1px solid #ffffff25;border-radius:18px;padding:32px;box-shadow:0 24px 70px #0002;position:relative}
.clarity-theme .hero-service-card::before{content:'';position:absolute;top:-1px;left:32px;width:70px;height:3px;background:var(--accent);border-radius:3px}
.clarity-theme .service-card-label{font:600 10px/1.5 var(--font-tech);letter-spacing:.1em;color:var(--accent)}
.clarity-theme .hero-service-card h2{font-size:29px;line-height:1.2;font-weight:700;letter-spacing:-.035em;margin:20px 0 28px}
.clarity-theme .hero-service-card ol{padding:0;margin:0;list-style:none}
.clarity-theme .hero-service-card li{display:flex;gap:16px;padding:20px 0;border-top:1px solid var(--line)}
.clarity-theme .hero-service-card li>span{color:var(--accent);font:12px var(--font-tech);padding-top:4px}
.clarity-theme .hero-service-card strong{font-size:15px;font-weight:650}
.clarity-theme .hero-service-card p{color:var(--muted);font-size:13px;line-height:1.6;margin:6px 0 0}
.clarity-theme .hero-service-card>a{display:flex;justify-content:space-between;align-items:center;color:var(--accent);font-size:13px;font-weight:650;text-decoration:none;border-top:1px solid var(--line);padding-top:20px;margin-top:4px;min-height:44px}
.clarity-theme .proof{max-width:1182px;background:#142238;border:1px solid var(--line);border-radius:10px}
.clarity-theme .proof div{padding:20px 24px}
.clarity-theme .proof strong{font-size:24px;font-weight:750;color:var(--text)}
.clarity-theme .proof span{font-size:13px;color:var(--muted)}
.clarity-theme .scroll-ticker{background:transparent;margin-top:24px;opacity:.9}
.clarity-theme :is(.project-card,.project-card.featured,.capability-grid>div,.contact-grid>a,.cta,.ai-diagram,.stack-explorer){background:var(--surface);border-color:var(--line);box-shadow:none;backdrop-filter:none}
.clarity-theme :is(.section-heading h2,.story-title){font-weight:750;text-shadow:none}
.clarity-theme .section-heading>p:last-child{font-size:16px}
.clarity-theme .capability-grid>div{border-top:2px solid var(--accent)}
.clarity-theme footer{background:#0b1220;border-color:var(--line)}
.clarity-theme .button:is(:hover,:focus-visible){box-shadow:none;border-color:var(--accent)}
@media(max-width:1000px){.clarity-theme .hero .story-panels{gap:28px}.clarity-theme .hero-service-card{padding:24px}.clarity-theme .hero-service-card h2{font-size:25px}}
@media(max-width:760px){.clarity-theme .hero.parallax-story{padding:32px 20px}.clarity-theme .hero .story-panels{grid-template-columns:1fr;gap:32px}.clarity-theme .hero #hero-title{font-size:clamp(36px,8.6vw,56px)}.clarity-theme .hero .availability-pill{margin-bottom:22px}.clarity-theme .hero-tagline{font-size:25px;margin-top:20px}.clarity-theme .hero-service-card{padding:24px}.clarity-theme .hero-service-card h2 br{display:none}.clarity-theme .proof{margin-inline:20px;grid-template-columns:repeat(2,1fr)}.clarity-theme .proof div{padding:16px}.clarity-theme .proof div:nth-child(2){border-right:0}.clarity-theme .proof div:nth-child(-n+2){border-bottom:1px solid var(--line)}.clarity-theme .proof strong{font-size:21px}.clarity-theme .hero .hero-actions .button{flex:1 1 140px}.clarity-theme .hero .hero-actions .resume-link{flex-basis:100%}.clarity-theme .site-header .brand{font-size:16px}}
/* The animated infrastructure sits behind solid, readable content surfaces. */
.clarity-theme{--secondary:#93c5fd}
.clarity-theme .parallax-world{opacity:.8;background:radial-gradient(ellipse at 55% 48%,#93c5fd14,transparent 62%)}
.clarity-theme .parallax-scrim{background:linear-gradient(90deg,#0b1220fa 0%,#0b1220eb 30%,#0b122099 52%,#0b122026 85%),linear-gradient(0deg,#0b1220 0%,transparent 22%,transparent 85%,#0b122099)}
.clarity-theme .hero-service-card{background:linear-gradient(145deg,#20334dd9,#142238cc);backdrop-filter:blur(8px)}
.clarity-theme .background-controls button{background:#142238f5;border-color:#5eead466;color:var(--text);font-size:11px;min-height:44px;border-radius:6px}
.clarity-theme .fallback-nodes i{border-color:var(--accent);background:var(--surface)}
.clarity-theme .brand-mark{border:0;background:none}
.clarity-theme .brand-mark img{border-radius:10px}
.clarity-theme :is(.ai-connection,.ai-network-node>rect){stroke:var(--secondary)}
.clarity-theme .ai-request-dot{fill:var(--accent)}
.clarity-theme .ai-network-node:is(:hover,:focus-visible)>rect,.clarity-theme .ai-network-node[aria-pressed="true"]>rect{stroke:var(--accent);fill:var(--surface-2)}
.clarity-theme .ai-node-kubernetes .ai-pod{fill:var(--surface);stroke:var(--secondary)}
.clarity-theme :is(.ai-status,.ai-motion-toggle,.ai-services article>span){color:var(--accent);background:#5eead412}
@media(max-width:760px){.clarity-theme .parallax-world{opacity:.35}.clarity-theme .parallax-scrim{background:linear-gradient(90deg,#0b1220f5,#0b1220c9)}.clarity-theme .hero-service-card{background:var(--surface);backdrop-filter:none}}
/* Tint the entire sprite layer so every directional frame and reaction agrees. */
.clarity-theme .fox-companion:not(.is-ai) :is(.fox-directions,.fox-reactions){filter:}
.clarity-theme .fox-companion.is-ai .fox-directions{filter:}
.clarity-theme .fox-boop{filter:drop-shadow(0 5px 10px #0005) drop-shadow(0 0 8px #5eead426)}
.clarity-theme .fox-message{background:var(--surface);border-color:#5eead466;box-shadow:0 12px 32px #0005;color:var(--text)}
.clarity-theme .fox-message::after{background:var(--surface);border-color:#5eead466}
.clarity-theme :is(.fox-message-contact,.fox-restore){color:var(--accent)}
.clarity-theme .fox-thought-cloud{filter: drop-shadow(0 5px 7px #0003)}
.clarity-theme .fox-hint:hover .fox-thought-cloud{filter: drop-shadow(0 5px 9px #5eead433)}
/* Midnight navy, teal, and soft blue; original mascot sprite colors stay intact. */
.clarity-theme #portfolio-loader{background:var(--bg)}
.clarity-theme .loader-mark,.clarity-theme .loader-meta b{color:var(--accent)}
.clarity-theme .loader-mark>span{border-color:#5eead440;border-top-color:var(--accent)}
.clarity-theme .loader-track i{background:var(--accent)}
.clarity-theme .loader-inner>p,.clarity-theme .loader-meta{color:var(--muted)}
.clarity-theme .hero-service-card::before{transform-origin:left}
.clarity-theme .hero-service-card.service-opening::before{animation:service-rule-open .7s ease-out both}
@keyframes service-rule-open{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.clarity-theme .send-slider-fill{background:#5eead433}
.clarity-theme .send-slider-track input::-webkit-slider-thumb{background-color:var(--accent)}
.clarity-theme .send-slider-track input::-moz-range-thumb{background-color:var(--accent)}
.clarity-theme :is(.stack-progress i,.scroll-progress span){background:var(--accent);box-shadow:none}
.clarity-theme :is(.project-card,.project-card.featured,.capability-grid>div,.contact-grid>a):hover{border-color:var(--accent);box-shadow:0 12px 30px #0003}
.clarity-theme :is(.capability-grid>div,.contact-grid>a)::before{background:linear-gradient(90deg,#5eead420,transparent)}
.clarity-theme :is(.button,.project-content a,.theme-nav a):is(:hover,:focus-visible){text-shadow:none}
.clarity-theme .theme-nav .nav-contact:is(:hover,:focus-visible){background:#99f6e4;color:var(--accent-dark);box-shadow:0 0 18px #5eead426}
.clarity-theme .stack-tabs{scrollbar-color:#5eead470 transparent}
.clarity-theme .stack-tab[aria-selected="true"]{background:#5eead40d}
.clarity-theme .stack-evidence{background:#5eead408;border-color:#5eead440}
.clarity-theme .stack-tools li:hover{border-color:var(--accent)}
.clarity-theme :focus-visible{outline-color:var(--accent)!important}
@media(prefers-reduced-motion:reduce){.clarity-theme .hero-service-card.service-opening::before{animation:none}}
.clarity-theme .hero-service-card h2>span{display:block}
.clarity-theme .fox-companion :is(.fox-directions,.fox-reactions){filter:none}
/* OneView grows with its text; a solid surface contains both copy and handset. */
.clarity-theme #oneview{height:auto;max-height:none;min-width:0;overflow:hidden!important;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.clarity-theme #oneview .product-story{min-width:0;height:auto;max-height:none;background:var(--surface)}
.clarity-theme #oneview .project-content{min-width:0;overflow-wrap:anywhere}
.clarity-theme #oneview .product-actions{flex-wrap:wrap}
.clarity-theme #oneview .product-actions>span{white-space:normal}
.clarity-theme #oneview .product-visual{background:var(--surface)}
@media(max-width:820px){
 .clarity-theme #oneview{display:flex;flex-direction:column;align-items:stretch;gap:0;transform:none}
 .clarity-theme #oneview .product-story{display:block;flex:0 0 auto;width:100%;padding:24px 20px}
 .clarity-theme #oneview .case-study,.clarity-theme #oneview .project-content ul{width:100%;max-width:100%;box-sizing:border-box}
 .clarity-theme #oneview .product-visual{flex:0 0 420px;width:100%;height:420px;min-height:420px;border-top:1px solid var(--line)}
}
/* Platform buttons retain their own brand colors, including hover and focus. */
.clarity-theme .contact-platforms .button{gap:12px}
.clarity-theme .platform-button-label{display:flex;align-items:center;gap:12px;text-align:left}
.clarity-theme .platform-button-logo{display:block;flex:0 0 24px;width:24px;height:24px;object-fit:contain;filter:brightness(0) invert(1)}
.clarity-theme .button[href*="upwork.com"] .platform-button-logo{filter:brightness(0)}
.clarity-theme .button[href*="upwork.com"]:is(:hover,:focus-visible) .platform-button-logo{filter:brightness(0) invert(1)}
.clarity-theme .button[href*="upwork.com"]{background:#14a800;border-color:#14a800;color:#052b00;font-weight:700;text-shadow:none;box-shadow:none}
.clarity-theme .button[href*="upwork.com"]:is(:hover,:focus-visible){background:#108a00;border-color:#108a00;color:#fff;text-shadow:none;box-shadow:0 4px 16px #14a80033}
.clarity-theme .button[href*="linkedin.com"]{background:#0a66c2;border-color:#0a66c2;color:#fff;font-weight:700;text-shadow:none;box-shadow:none}
.clarity-theme .button[href*="linkedin.com"]:is(:hover,:focus-visible){background:#004182;border-color:#004182;color:#fff;text-shadow:none;box-shadow:0 4px 16px #0a66c233}
.clarity-theme .button[href*="upwork.com"]:focus-visible{outline-color:#14a800!important}
.clarity-theme .button[href*="linkedin.com"]:focus-visible{outline-color:#93c5fd!important}
.clarity-theme .button[href*="hubstafftalent.net"]{background:#294dff;border-color:#294dff;color:#fff;font-weight:700;text-shadow:none;box-shadow:none}
.clarity-theme .button[href*="hubstafftalent.net"]:is(:hover,:focus-visible){background:#203cc7;border-color:#203cc7;color:#fff;text-shadow:none;box-shadow:0 4px 16px #294dff33}
.clarity-theme .button[href*="hubstafftalent.net"]:focus-visible{outline-color:#a5b4ff!important}
.clarity-theme .button[href*="arc.dev"]{background:#000;border-color:#666;border-radius:4px;color:#fff;font-weight:700;text-shadow:none;box-shadow:none}
.clarity-theme .button[href*="arc.dev"] .platform-button-logo{flex-basis:64px;width:64px}
.clarity-theme .button[href*="arc.dev"]:is(:hover,:focus-visible){background:#191919;border-color:#fff;color:#fff;text-shadow:none;box-shadow:none}
.clarity-theme .button[href*="arc.dev"]:active{background:#292929;border-color:#fff}
.clarity-theme .button[href*="arc.dev"]:focus-visible{outline-color:#fff!important}

/* Only the opening Upwork button uses portfolio colors until interaction. */
.clarity-theme .hero .button[href*="upwork.com"]{background:transparent;border-color:var(--line);color:var(--text);box-shadow:none}
.clarity-theme .hero .button[href*="upwork.com"]:is(:hover,:focus-visible){background:#108a00;border-color:#108a00;color:#fff;box-shadow:0 4px 16px #14a80033}
/* Locally served variable fonts: expressive headings and readable body copy. */
@font-face{font-family:Inter Portfolio;src:url('assets/fonts/inter-latin-variable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:Space Grotesk Portfolio;src:url('assets/fonts/space-grotesk-latin-variable.woff2') format('woff2');font-style:normal;font-weight:300 700;font-display:swap}
body.clarity-theme{--font-body:"Inter Portfolio",Inter,ui-sans-serif,system-ui,sans-serif;--font-heading:"Space Grotesk Portfolio",var(--font-body);font-family:var(--font-body);font-optical-sizing:auto}
.clarity-theme :is(h1,h2,h3,h4,.story-title,.stack-layer h3,.brand){font-family:var(--font-heading)}
.clarity-theme .hero #hero-title{font-weight:700}
.clarity-theme :is(.section-heading h2,.story-title){font-weight:700}
.clarity-theme .hero-intro,.clarity-theme .project-contact-form :is(input,select,textarea,button){font-family:var(--font-body)}
/* A quiet recurring sheen with stronger light on deliberate interaction. */
.clarity-theme .button.button-shine{position:relative;isolation:isolate;overflow:hidden;border:1px solid #5eead499;border-radius:8px;background:linear-gradient(135deg,#5eead426,#93c5fd12);color:var(--text);font-weight:650;min-height:48px;padding:13px 22px;box-shadow:inset 0 1px 0 #ffffff26,0 0 18px #5eead41a;transition:background .2s,border-color .2s,box-shadow .2s,transform .2s}
.clarity-theme .button.button-shine::before{content:"";position:absolute;inset:-50% auto -50% -70%;width:45%;pointer-events:none;background:linear-gradient(90deg,transparent,#ffffff26,transparent);transform:skewX(-20deg);animation:discussion-button-sheen 7s ease-in-out infinite}
.clarity-theme .button.button-shine:is(:hover,:focus-visible){background:linear-gradient(135deg,#5eead440,#93c5fd26);border-color:var(--accent);color:var(--text);box-shadow:inset 0 1px 0 #ffffff40,0 0 24px #5eead440}
@keyframes discussion-button-sheen{0%,65%{left:-70%}85%,100%{left:130%}}
@media(prefers-reduced-motion:reduce){.clarity-theme .button.button-shine::before{animation:none;display:none}.clarity-theme .button.button-shine{transition:none}}

/* Brighter commands retain the terminal ribbon’s understated hierarchy. */
.clarity-theme .command-ticker .ticker-track{color:#d3deee}
/* The opening state exists before scripts run, preventing a completed-card flash. */
@media(prefers-reduced-motion:no-preference){
 html.service-intro-pending .clarity-theme .hero-service-card{opacity:0;visibility:hidden;animation:service-intro-failsafe 0s 5s forwards}
}
@keyframes service-intro-failsafe{to{opacity:1;visibility:visible}}
/* Service information stays visible on desktop and touch devices. */