.projects-section{position:relative;isolation:isolate;padding:55px 4.5% 45px;scroll-margin-top:115px;background:linear-gradient(180deg,#02050b00,#02050bf2 12%,#010409 60%,#02050b00)}
.projects-section::before{content:"";position:absolute;inset:18% 0 8%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 20% 38%,#14284322,transparent 52%),radial-gradient(ellipse at 80% 70%,#8e70420c,transparent 45%)}
.projects-container{max-width:1280px;margin:auto}
.projects-heading{display:grid;grid-template-columns:1.25fr 1fr;column-gap:65px;align-items:center;text-align:left;margin:0 0 48px;max-width:none}
.projects-heading .eyebrow{grid-column:1/-1;font-size:11px;letter-spacing:.2em;margin:0 0 18px}
.projects-heading h2{font-size:clamp(31px,3.2vw,46px);letter-spacing:-.045em;line-height:1.25;margin:0}
.projects-title-break{display:block}
.projects-heading>p:last-child{color:var(--muted);font-size:14px;line-height:1.85;margin:0;padding-left:28px;border-left:1px solid #b8955759;max-width:430px}
.projects-grid{display:grid;grid-template-columns:1.12fr 1fr;gap:22px;align-items:stretch}
.project-card{position:relative;isolation:isolate;min-width:0;border:2px solid transparent;border-radius:18px;background:linear-gradient(135deg,#09111bef,#03070df5) padding-box,linear-gradient(135deg,#b397666e,#38455850 32%,#18233488 68%,#9b80535e) border-box;box-shadow:inset 0 1px 0 #cadfff0d,0 10px 35px #0003;backdrop-filter:blur(14px);overflow:hidden;transition:box-shadow .35s,transform .35s}
.project-card:hover{box-shadow:inset 0 0 30px #749dd908,0 18px 45px #0005,0 0 24px #a18a4810;transform:translateY(-3px)}
.project-featured{grid-row:span 2;display:flex;flex-direction:column;background:linear-gradient(135deg,#0b131ded,#03070df5) padding-box,linear-gradient(135deg,#d3b47ca6,#78634345 40%,#263e5f70 72%,#b1966599) border-box}
.project-featured:hover{box-shadow:inset 0 0 36px #ba9b5609,0 18px 50px #0005,0 0 28px #b49a5914}
.project-visual{position:relative;isolation:isolate;min-width:0;display:flex;align-items:center;padding:23px;background:radial-gradient(ellipse at 50% 55%,#26457026,transparent 70%)}
.project-browser{position:relative;z-index:1;width:100%;border:1px solid #4b5b6870;border-radius:9px;overflow:hidden;background:#070e17;box-shadow:0 12px 30px #0004;transform:translateY(0);transition:transform .4s}
.project-card:hover .project-browser{transform:translateY(-3px)}
.project-browser-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 10px;background:linear-gradient(100deg,#162230,#0d1621);color:#7a8b9f;line-height:1}
.project-browser-bar>span{font-size:6px;letter-spacing:2px;color:#8b9bb1}.project-browser-bar small{font-size:8px;letter-spacing:.03em}.project-browser-bar i{width:23px}
.project-browser img{display:block;width:100%;height:auto}
.project-featured .project-visual{padding:30px 26px 22px;flex:1}
.project-copy{padding:24px;min-width:0}
.project-featured .project-copy{padding:12px 30px 30px}
.project-label{font-size:9px;letter-spacing:.15em;color:#8bb7f4;margin:0 0 13px}
.project-featured .project-label{color:#d7b982}
.project-title-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px 18px;margin-bottom:17px}
.project-title-row h3{font-family:Manrope,Inter,sans-serif;font-weight:500;font-size:26px;letter-spacing:-.04em;margin:0;line-height:1.25}
.project-featured h3{font-size:34px}
.project-category{display:inline-block;border:1px solid #62728a70;border-radius:6px;padding:5px 8px;color:#c0cad7;font-size:10px;white-space:nowrap;background:#030a1438}
.project-context,.project-details p{color:var(--muted);font-size:12px;line-height:1.8;margin:0}
.project-featured .project-context,.project-featured .project-details p{font-size:13px}
.project-details{margin:15px 0 20px}.project-details summary{font-size:11px;color:#bbc9dc;cursor:pointer;width:fit-content;padding:3px 0;list-style:none}.project-details summary::after{content:'+';margin-left:12px;color:#91aed1}.project-details[open] summary::after{content:'−'}.project-details summary:focus-visible{outline:2px solid #a5c9ff;outline-offset:4px}.project-details p{margin-top:9px}
.project-link{display:inline-block;color:#8ab5f2;font-size:12px;padding:4px 0;border-bottom:1px solid #6998d250;transition:color .2s,border-color .2s}.project-link:hover{color:#d1e3ff;border-color:#bad7ff}
.project-secondary{display:grid;grid-template-columns:.95fr 1fr;align-items:center;min-height:315px}
.project-secondary .project-visual{padding:20px 0 20px 20px}.project-secondary .project-copy{padding:24px 22px}
.project-landing .project-browser img{aspect-ratio:auto;object-fit:contain;object-position:top}
.projects-closing{text-align:center;margin-top:37px}.projects-closing .button{font-size:11px}
.projects-directory-links{display:grid;gap:12px;margin-top:25px}.projects-directory-links>a{display:grid;grid-template-columns:1fr auto;gap:8px 16px;padding:17px;border:1px solid var(--line);border-radius:9px;transition:border-color .2s}.projects-directory-links>a:hover{border-color:#7ea6d3}.projects-directory-links strong{font-weight:500}.projects-directory-links span{font-size:11px;color:var(--muted);grid-row:2}.projects-directory-links small{font-size:11px;color:#8bb7f4;grid-column:2;grid-row:1 / span 2;align-self:center}
@media(min-width:1500px){.project-secondary{min-height:340px}}
@media(max-width:1100px) and (min-width:801px){.projects-grid{grid-template-columns:1fr 1fr;gap:17px}.project-secondary{grid-template-columns:.8fr 1fr}.project-secondary .project-copy{padding:20px 16px}.project-title-row h3{font-size:23px}.project-featured h3{font-size:32px}.project-secondary .project-visual{padding-left:14px}.project-featured .project-visual{padding:22px 18px}.project-featured .project-copy{padding:10px 24px 26px}}
@media(max-width:800px){.projects-grid{grid-template-columns:1fr 1fr}.project-featured{grid-column:1/-1;grid-row:auto}.project-featured .project-visual{padding:25px 25px 15px}.project-secondary{display:flex;flex-direction:column;align-items:stretch;min-height:0}.project-secondary .project-visual{padding:20px 20px 0}.project-secondary .project-copy{padding:22px;flex:1;display:flex;flex-direction:column;align-items:flex-start}.project-secondary .project-browser img{height:245px;object-fit:cover;object-position:top}.project-landing .project-browser img{height:auto;object-fit:contain;object-position:top}.project-secondary .project-link{margin-top:auto}.projects-heading{grid-template-columns:1fr;gap:0;margin-bottom:32px}.projects-heading>p:last-child{margin-top:20px;padding-left:0;border:0;max-width:560px}.projects-title-break{display:block}}
@media(max-width:540px){.projects-section{padding:45px 5% 35px}.projects-grid{grid-template-columns:1fr;gap:20px}.project-featured{grid-column:auto}.project-featured .project-visual,.project-secondary .project-visual{padding:16px 16px 0}.project-featured .project-copy,.project-secondary .project-copy{padding:24px}.project-featured h3{font-size:30px}.project-secondary .project-browser img{height:auto;aspect-ratio:auto}.project-title-row h3{font-size:28px}.project-context,.project-details p{font-size:13px}.projects-heading>p:last-child{font-size:13px}.projects-closing .button{width:100%;max-width:320px}.projects-directory-links>a{grid-template-columns:1fr}.projects-directory-links small{grid-row:3;grid-column:1}}
@media(prefers-reduced-motion:reduce){.project-card,.project-browser,.project-link{transition:none}.project-card:hover,.project-card:hover .project-browser{transform:none}}

.project-visual::before{content:"";position:absolute;pointer-events:none;z-index:0;inset:8% 4%;border:1px solid #8299b622;border-radius:48% 52% 63% 37% / 44% 39% 61% 56%;background:radial-gradient(ellipse at 30% 30%,#80a9df16,transparent 65%);box-shadow:0 0 35px #5e8fd410;transform:rotate(-8deg)}
.project-card.has-entered .project-visual::before{animation:project-halo-settle 3.5s ease-out both}
@keyframes project-halo-settle{from{opacity:0;transform:rotate(-16deg) scale(.9);border-radius:40% 60% 48% 52%}to{opacity:1;transform:rotate(-8deg) scale(1);border-radius:48% 52% 63% 37% / 44% 39% 61% 56%}}
@media(prefers-reduced-motion:reduce){.project-card.has-entered .project-visual::before{animation:none}}
