.recent-work { margin-bottom: 5rem; }
.project-carousel { border: 1px solid rgba(217,122,67,.32); border-radius: 24px; overflow: hidden; background: var(--surface); box-shadow: 0 28px 80px rgba(0,0,0,.24); }
.project-toolbar { display:flex; align-items:center; justify-content:space-between; padding:1.2rem 1.6rem; font-size:.875rem; letter-spacing:.12em; color:var(--gold); }
.project-controls { display:flex; gap:.5rem; }
.project-controls[hidden], .project-slide[hidden] { display:none; }
.project-controls button { color:var(--text); background:var(--surface-2); border:1px solid var(--line); border-radius:50%; width:44px; height:44px; font-size:1.2rem; cursor:pointer; transition:transform .2s ease,border-color .2s ease,background .2s ease; }
.project-controls button:hover { transform:translateY(-2px); background:var(--forest); border-color:var(--gold); }
.project-carousel a:focus-visible,.project-carousel button:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
.browser-preview { margin:0 1.5rem; border:1px solid rgba(224,181,103,.25); border-radius:14px; overflow:hidden; background:#0a0b09; box-shadow:0 18px 52px rgba(0,0,0,.22); }
.browser-bar { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.85rem 1rem; background:#10130f; color:var(--muted); font-size:.875rem; }
.browser-bar > :first-child { color:var(--gold); letter-spacing:.15em; }
.preview-label { color:var(--ember); font-size:.75rem; font-weight:700; letter-spacing:.1em; }
.browser-preview iframe { display:block; width:100%; height:620px; border:0; background:#fff; }
.project-copy { padding:2rem; display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:2.5rem; }
.project-copy h3 { font-family:"Fraunces",Georgia,serif; font-size:clamp(1.8rem,3vw,2.6rem); margin:.4rem 0 1rem; }
.project-copy p { color:var(--muted); line-height:1.7; }
.project-features { display:flex; flex-wrap:wrap; gap:.5rem; padding:0; list-style:none; margin:1.3rem 0 0; }
.project-features li { font-size:.9rem; padding:.4rem .75rem; border:1px solid rgba(130,144,109,.38); border-radius:30px; background:rgba(38,51,41,.3); }
.project-action { align-self:end; }
.project-action a { display:inline-block; padding:.85rem 1rem; color:var(--gold); border:1px solid rgba(224,181,103,.4); border-radius:999px; font-weight:700; font-size:.875rem; letter-spacing:.06em; text-decoration:none; transition:transform .2s ease,border-color .2s ease,background .2s ease; }
.project-action a:hover { transform:translateY(-2px); border-color:var(--gold); background:rgba(224,181,103,.08); }
.project-action p { font-size:.9rem; }
@media(max-width:640px) { .project-copy { grid-template-columns:1fr; gap:1rem; padding:1.3rem; } .browser-preview { margin:0 .6rem; } .browser-preview iframe { height:540px; } .preview-label { display:none; } .browser-bar { gap:.5rem; font-size:.75rem; padding:.8rem .6rem; } .project-toolbar { padding:1rem; } }
@media(prefers-reduced-motion:reduce) { .project-controls button,.project-action a { transition:none; } .project-controls button:hover,.project-action a:hover { transform:none; } .project-slide { animation:none; } }
@media(prefers-reduced-motion:no-preference) { .project-slide { animation:project-reveal .35s ease-out; } @keyframes project-reveal { from { opacity:.4; transform:translateY(6px); } to { opacity:1; transform:none; } } }
