/* Portfolio: editorial cards, original vector scenes, zero media dependencies. */
.portfolio{padding-top:80px;padding-bottom:90px}
.portfolio-edition{font-size:11px;letter-spacing:.08em;color:#8ba39c;display:flex;align-items:center;gap:14px}
.portfolio-edition i{width:5px;height:5px;background:var(--green);border-radius:50%;box-shadow:0 0 12px #79ef9160}
.portfolio-heading{display:grid;grid-template-columns:1.1fr 1fr;align-items:end;gap:9%;margin:52px 0 46px}
.portfolio-heading h2{margin:0;font-size:clamp(52px,6.8vw,104px);line-height:.95;letter-spacing:-.065em;font-weight:500}
.portfolio-heading h2>span{color:var(--green)}
.portfolio-heading p{font-size:18px;line-height:1.7;max-width:475px;margin:0 0 25px;color:#b5c5c7}
.portfolio-hint{font-size:12px;color:#8ba39c;display:flex;align-items:center;gap:12px}
.portfolio-hint>span{color:var(--green);font-size:21px}
.portfolio-tools{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px;border-bottom:1px solid var(--line);padding-bottom:23px}
.portfolio-filters{display:flex;gap:8px;flex-wrap:wrap}
.portfolio-filters[hidden]{display:none}
.portfolio-filters button{display:flex;gap:16px;align-items:center;padding:12px 16px;border:1px solid #c6dfd422;border-radius:0;background:transparent;color:#b6c8c5;font:inherit;font-size:12px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.portfolio-filters button>span{font-size:9px;opacity:.55}
.portfolio-filters button[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:#192b25}
.portfolio-filters button:hover{border-color:var(--green)}
.portfolio-count{font-size:11px;color:#8ba39c;white-space:nowrap;font-variant-numeric:tabular-nums}
.portfolio-grid{display:grid;grid-template-columns:1fr 1fr;gap:38px 28px}
.project-card{min-width:0;--pv:#79ef91}
.project-card[hidden]{display:none}
.project-open{display:block;color:inherit;text-decoration:none;outline-offset:6px}
.project-cover{aspect-ratio:720/430;position:relative;overflow:hidden;background:radial-gradient(ellipse at 55% 55%,#365a4c77,transparent 68%),#15272a;border:1px solid #d9f1e422;isolation:isolate;transition:border-color .4s}
.project-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(130deg,#ffffff05,transparent 40%);pointer-events:none}
.project-cover--ml-highway,.project-cover--cv-highway{background:radial-gradient(ellipse at 50% 65%,#45656855,transparent 65%),#15232c;--pv:#a2e8d2}
.project-cover--ai-crm{background:radial-gradient(ellipse at 60% 40%,#4a5f4355,transparent 65%),#1c2b2a}
.project-cover--ai-dashboard{background:radial-gradient(ellipse at 50% 65%,#35516377,transparent 65%),#172530;--pv:#91d7df}
.project-cover--ai-legal{background:radial-gradient(ellipse at 50% 55%,#6b644833,transparent 65%),#232c2a;--pv:#d9d5a5}
.project-cover-meta{position:absolute;inset:20px 22px auto;display:flex;justify-content:space-between;align-items:center;gap:8px;z-index:2;color:#bdd5cb;font-size:9px;letter-spacing:.1em;pointer-events:none}
.project-nda{padding:4px 7px;border:1px solid #bdd5cb3b;color:#a6bdb4;font-size:8px}
.project-scene{display:block;width:100%;height:100%;color:var(--pv);transition:transform .65s cubic-bezier(.2,.65,.2,1)}
.project-peek{position:absolute;right:20px;bottom:18px;display:flex;gap:20px;align-items:center;background:#79ef91;color:#172b22;padding:10px 15px;font-size:11px;opacity:0;transform:translateY(9px);transition:opacity .25s,transform .25s}
.project-peek>span{font-size:19px;line-height:1}
.project-info{padding:22px 3px 0}
.project-title-row{display:flex;align-items:center;justify-content:space-between;gap:18px}
.project-title-row h3{font-size:clamp(25px,2.5vw,39px);line-height:1.2;letter-spacing:-.045em;font-weight:500;margin:0}
.project-arrow{font-size:28px;color:var(--green);transition:transform .25s}
.project-info>p{color:#aebfc0;font-size:15px;line-height:1.65;max-width:510px;min-height:50px;margin:12px 0 18px}
.project-tags{display:flex;gap:8px 17px;flex-wrap:wrap;color:#819e92;font-size:10px;line-height:1.5;letter-spacing:.02em}
.portfolio-footnote{display:flex;justify-content:space-between;gap:20px;margin-top:48px;border-top:1px solid var(--line);padding-top:20px;font-size:11px;line-height:1.7;color:#829b93}
@media(hover:hover){.project-open:hover .project-cover{border-color:#79ef9180}.project-open:hover .project-scene{transform:scale(1.035)}.project-open:hover .project-peek{opacity:1;transform:none}.project-open:hover .project-arrow{transform:translate(3px,-3px)}}
.project-open:focus-visible{outline:2px solid var(--green)}
.project-open:focus-visible .project-peek{opacity:1;transform:none}
/* Diagram vocabulary. */
.project-scene text{font-family:inherit;fill:#d8ece2;letter-spacing:.07em}
.project-scene .pv-small{font-size:13px}.project-scene .pv-tiny{font-size:11px;fill:#a8c1b5}.project-scene .pv-big{font-size:33px;letter-spacing:-.04em}
.pv-panel{fill:#1e3435;stroke:#a1ccb94a;stroke-width:1.2}.pv-inset{fill:#122626;stroke:#a1ccb920;stroke-width:1}
.pv-core{fill:#79ef9120;stroke:var(--pv);stroke-width:1.5}.pv-solid{fill:var(--pv)}.pv-muted{fill:#9fc9b654}
.pv-wire{stroke:var(--pv);stroke-width:1.5;opacity:.55}.pv-orbit{fill:none;stroke:var(--pv);stroke-opacity:.25;stroke-width:1;stroke-dasharray:4 6}
.pv-road{fill:#314144;stroke:#78928977;stroke-width:1}.pv-road-edge{stroke:#b7cec4;stroke-width:3;opacity:.4}.pv-road-line{stroke:#afc7bb;stroke-width:4;opacity:.65}
.pv-crack{stroke:#f7a878;stroke-width:3}.pv-target{fill:none;stroke:var(--pv);stroke-width:2;stroke-linejoin:round}
.pv-scan-line{stroke:var(--pv);stroke-width:2;filter:drop-shadow(0 0 5px #79ef9180)}.pv-scan-glow{fill:#79ef910a}
.pv-sign{fill:#c7775b;stroke:#efaa88;stroke-width:2}.project-scene .pv-speed{font-size:76px;fill:#21312e;font-weight:600;letter-spacing:-.05em}
.pv-grid-line{stroke:#a1ccb921;stroke-width:1}.pv-chart{stroke:var(--pv);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:900;stroke-dashoffset:0}.pv-bar{fill:#91d7df25;transform-box:fill-box;transform-origin:center bottom}
.pv-float{animation:project-float 5s ease-in-out infinite;animation-delay:var(--delay,0s)}.pv-delay{animation-delay:-2s}.pv-flow{stroke-dasharray:5 9;animation:project-flow 3s linear infinite}.pv-pulse{animation:project-pulse 3s ease-in-out infinite}.pv-scan{animation:project-scan 5s ease-in-out infinite}.pv-draw{animation:project-draw 7s ease-in-out infinite}.pv-bar{animation:project-bar 4s ease-in-out infinite;animation-delay:var(--delay,0s)}
.project-card:not(.is-visible) .project-scene *,.portfolio.is-modal-open .project-scene *{animation-play-state:paused}
@keyframes project-float{50%{translate:0 -7px}}@keyframes project-flow{to{stroke-dashoffset:-56}}@keyframes project-pulse{50%{opacity:.45}}@keyframes project-scan{0%,100%{translate:0 -50px;opacity:.35}50%{translate:0 90px;opacity:1}}@keyframes project-draw{0%,10%{stroke-dashoffset:900}65%,100%{stroke-dashoffset:0}}@keyframes project-bar{50%{scale:1 .6}}
/* Project detail dialog: independent scrolling, sticky controls, native focus management. */
.project-dialog{width:min(980px,calc(100% - 40px));max-height:90svh;margin:auto;padding:0;border:1px solid #63877666;background:#19272e;color:#eff5f1;overscroll-behavior:contain;box-shadow:0 35px 140px #0009}
.project-dialog::backdrop{background:#081210de;backdrop-filter:blur(10px)}
html:has(.project-dialog[open]){overflow:hidden}
.project-dialog-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;position:sticky;top:0;z-index:3;padding:16px 36px;background:#19272ef7;border-bottom:1px solid #ffffff1c;backdrop-filter:blur(12px)}
.project-dialog-index{font-size:10px;letter-spacing:.1em;color:#91aea0}
.project-dialog-close{display:flex;align-items:center;gap:16px;min-height:44px;border:0;padding:0 0 0 12px;font:inherit;font-size:12px;background:none;color:#d0ded6;cursor:pointer}
.project-dialog-close>span{font-size:30px;font-weight:400;color:var(--green)}
.project-dialog-body{padding:38px 48px 40px}
.project-dialog h2{font-size:clamp(35px,5vw,66px);font-weight:500;line-height:1.06;letter-spacing:-.055em;margin:22px 0 16px;outline:none}
.project-dialog-subtitle{font-size:clamp(18px,2.2vw,25px);line-height:1.4;color:#a8d6b6;max-width:650px;margin:0 0 34px}
.project-facts{display:grid;grid-template-columns:1.3fr 1fr .7fr;gap:20px;border-block:1px solid #ffffff20;padding:22px 0;margin:0 0 38px}
.project-facts dt{color:#829f93;font-size:10px;letter-spacing:.03em;margin-bottom:9px}.project-facts dd{font-size:13px;margin:0;line-height:1.6}
.project-story{display:grid;grid-template-columns:.8fr 1.2fr;gap:42px}
.project-dialog h3{font-size:17px;line-height:1.4;font-weight:500;letter-spacing:-.02em;margin:0 0 13px}
.project-story p{font-size:14px;line-height:1.8;color:#b0c2bd;margin:0}
.project-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:0;list-style:none;margin:34px 0}
.project-flow li{display:flex;flex-direction:column;gap:14px;border:1px solid #79ef912b;background:linear-gradient(135deg,#79ef910d,transparent);padding:20px;font-size:12px;line-height:1.6}
.project-flow li>span:first-child{color:var(--green);font-size:10px}
.project-value ul{display:grid;gap:10px;padding:0;list-style:none;margin:15px 0 0}
.project-value li{display:flex;gap:12px;font-size:14px;line-height:1.7;color:#c6d4cf}.project-value li:before{content:"↗";color:var(--green)}
.project-disclosure{margin:28px 0;color:#839c91;font-size:11px;line-height:1.8;max-width:720px}
.project-discuss{display:flex;width:100%;justify-content:space-between;gap:15px}
.project-dialog-navigation{display:flex;justify-content:space-between;border-top:1px solid #ffffff20;padding:17px 48px}
.project-dialog-navigation button{border:0;background:none;font:inherit;font-size:12px;color:#b6c8c5;min-height:40px;cursor:pointer;padding:5px 0}
.project-dialog button:focus-visible,.portfolio-filters button:focus-visible{outline:2px solid var(--green);outline-offset:5px}
@media(max-width:1000px){.portfolio-heading{gap:6%;grid-template-columns:1fr 1fr}.portfolio-heading p{font-size:16px}.portfolio-filters button{padding:11px;font-size:11px;gap:10px}.portfolio-grid{gap:30px 20px}.project-info>p{font-size:14px;min-height:70px}}
@media(max-width:720px){.portfolio{padding-top:55px;padding-bottom:60px}.portfolio-edition{font-size:8px;gap:8px}.portfolio-edition i{width:3px;height:3px}.portfolio .section-top>.eyebrow{font-size:10px;letter-spacing:.4px}.portfolio-heading{grid-template-columns:1fr;gap:24px;margin:32px 0 28px}.portfolio-heading h2{font-size:clamp(48px,13vw,76px)}.portfolio-heading p{font-size:15px;line-height:1.65;margin-bottom:16px}.portfolio-hint{font-size:11px}.portfolio-tools{display:block;margin-bottom:22px;padding-bottom:18px}.portfolio-filters{display:grid;grid-template-columns:1fr 1fr;gap:7px}.portfolio-filters button{justify-content:space-between;padding:12px 10px;font-size:10px;gap:6px;min-height:42px}.portfolio-count{display:block;margin-top:16px;font-size:10px}.portfolio-grid{grid-template-columns:1fr;gap:32px}.project-cover-meta{inset:13px 14px auto;font-size:7px;letter-spacing:.05em}.project-nda{font-size:7px;padding:3px 5px}.project-info{padding-top:17px}.project-title-row h3{font-size:29px}.project-info>p{min-height:0;font-size:14px;margin:10px 0 14px}.project-tags{font-size:9px;gap:6px 13px}.portfolio-footnote{flex-direction:column;gap:4px;margin-top:32px;font-size:10px}.project-dialog{width:calc(100% - 20px);max-height:94svh}.project-dialog-toolbar{padding:8px 20px}.project-dialog-body{padding:24px 22px}.project-dialog h2{font-size:36px;margin-top:18px}.project-dialog-subtitle{font-size:20px;margin-bottom:24px}.project-facts{grid-template-columns:1fr 1fr;gap:18px;padding:18px 0;margin-bottom:25px}.project-facts>div:first-child{grid-column:1/-1}.project-facts dd{font-size:12px}.project-story{grid-template-columns:1fr;gap:25px}.project-story p{font-size:13px}.project-flow{grid-template-columns:1fr;gap:8px;margin:26px 0}.project-flow li{flex-direction:row;gap:18px;padding:15px}.project-value li{font-size:13px}.project-discuss{font-size:12px;padding:17px 18px}.project-dialog-navigation{padding:10px 22px}.project-dialog-navigation button{font-size:11px}}
@media(prefers-reduced-motion:reduce){.project-scene *{animation:none!important}.project-scene,.project-peek,.project-arrow,.project-cover,.portfolio-filters button{transition:none}.project-open:hover .project-scene{transform:none}.pv-chart{stroke-dashoffset:0}}
