/* Projects page only — isolated portfolio styling. */
.projects-page { background:#fff; color:#171815; overflow-x:clip; }
.projects-page .projects-hero { background:#fff; padding:20px 0 24px; text-align:center; }
.projects-page .projects-hero .shell { max-width:1040px; }
.projects-page .projects-hero h1 { max-width:820px; margin:0 auto 12px; font-family:Manrope,Inter,Arial,sans-serif; font-size:clamp(40px,4.7vw,60px); font-weight:800; line-height:.99; letter-spacing:-.065em; color:#111; }
.projects-page .projects-hero-dot { color:var(--lime,#dfff45); }
.projects-page .projects-hero .lead { max-width:640px; margin:0 auto; color:#62645f; font-family:Inter,Arial,sans-serif; font-size:clamp(13px,1.25vw,15px); font-weight:400; line-height:1.5; }

/* Match the founder profile's real client-logo strip: muted, grayscale assets, even rhythm and a seamless loop. */
.projects-page .projects-logo-band { background:#fbfbfa; padding:0; }
.projects-page .projects-logo-viewport { width:100%; overflow:hidden; border-top:1px solid #f0f0ed; border-bottom:1px solid #e9e9e5; background:#fbfbfa; }
.projects-page .projects-logo-track { display:flex; width:max-content; animation:projects-logo-travel 32s linear infinite; will-change:transform; }
.projects-page .projects-logo-sequence { display:flex; flex:0 0 auto; align-items:center; gap:clamp(18px,2.2vw,30px); padding:0 clamp(12px,2vw,24px); }
.projects-page .projects-logo-sequence a { width:clamp(112px,12vw,160px); height:64px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; padding:3px 5px; box-sizing:border-box; border-right:1px solid #e7e7e2; }
.projects-page .projects-logo-sequence img { display:block; width:100%; max-width:145px; height:42px; object-fit:contain; filter:grayscale(1); opacity:.82; transition:filter .2s ease,opacity .2s ease; }
.projects-page .projects-logo-sequence a:hover img { filter:grayscale(0); opacity:1; }
.projects-page .projects-logo-viewport:hover .projects-logo-track { animation-play-state:paused; }
@keyframes projects-logo-travel { from { transform:translateX(0); } to { transform:translateX(-50%); } }

.projects-page .projects-work-section { padding:16px 0 26px; background:#fff; }
.projects-page .portfolio-filters { justify-content:center; gap:7px; margin:0 0 16px; }
.projects-page .portfolio-filters .tab { min-height:34px; padding:8px 15px; border:1px solid #e7e7e2; border-radius:7px; background:#fff; color:#252620; font:600 11px/1.2 Inter,Arial,sans-serif; transition:background-color .2s,border-color .2s,color .2s; }
.projects-page .portfolio-filters .tab.active { background:var(--lime,#dfff45); border-color:var(--lime,#dfff45); color:#171815; }
.projects-page .portfolio-filters .tab:focus-visible { outline:2px solid #171815; outline-offset:3px; }
.projects-page .portfolio-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px 14px; align-items:stretch; }
.projects-page .portfolio-card { position:relative; min-width:0; height:100%; border:1px solid #e9e9e5; border-radius:9px; background:#fff; overflow:hidden; padding:0; box-shadow:0 2px 8px rgba(20,20,15,.025); transition:border-color .2s,box-shadow .2s,transform .2s; }
.projects-page .portfolio-card:hover { border-color:#d6d8c9; box-shadow:0 7px 18px rgba(20,20,15,.06); transform:translateY(-1px); }
.projects-page .portfolio-open { position:relative; z-index:1; height:100%; min-width:0; display:flex; flex-direction:column; cursor:pointer; text-align:left; }
.projects-page .client-logo-panel { position:relative; flex:0 0 auto; width:100%; aspect-ratio:16/7.2; min-height:0; padding:16px; border:0; border-bottom:1px solid #ededeb; background:#f5f6f7; overflow:hidden; box-sizing:border-box; }
.projects-page .portfolio-card:nth-child(1) .client-logo-panel { background:#07152d; }
.projects-page .portfolio-card:nth-child(2) .client-logo-panel { background:#0c1024; }
.projects-page .portfolio-card:nth-child(3) .client-logo-panel { background:#f0f7f1; }
.projects-page .portfolio-card:nth-child(4) .client-logo-panel { background:#f1f2f5; }
.projects-page .portfolio-card:nth-child(5) .client-logo-panel { background:#fff0f6; }
.projects-page .portfolio-card:nth-child(6) .client-logo-panel { background:#f4effc; }
.projects-page .client-logo-panel img { display:block; width:min(84%,300px); height:58px; max-height:70%; object-fit:contain; }
.projects-page .client-site-link { display:flex; align-items:center; justify-content:center; max-width:100%; width:100%; }
.projects-page .client-logo-panel .anonymous-mark { color:#171815; font:800 clamp(28px,4vw,46px)/1 Manrope,Inter,Arial,sans-serif; letter-spacing:-.08em; }
.projects-page .project-card-screenshot-panel { padding:0; aspect-ratio:auto; min-height:0; height:auto; background:#f6f7f6; line-height:0; }
.projects-page .project-card-screenshot-panel .project-card-carousel-image { position:relative; inset:auto; display:block; width:100%; max-width:none; height:auto; padding:0; margin:0; object-fit:contain; object-position:center; vertical-align:middle; background:#f6f7f6; }
.projects-page .project-card-screenshot-panel .project-card-carousel-image[hidden] { display:none; }
.projects-page .project-card-carousel-controls { position:absolute; z-index:4; inset:0 0 auto; height:100%; display:flex; align-items:center; justify-content:space-between; padding:0 7px; pointer-events:none; box-sizing:border-box; }
.projects-page .project-card-carousel-button { pointer-events:auto; display:grid; place-items:center; width:29px; height:29px; padding:0 0 2px; border:1px solid rgba(23,24,21,.12); border-radius:50%; background:rgba(255,255,255,.96); color:#171815; font:500 24px/1 Inter,Arial,sans-serif; cursor:pointer; box-shadow:0 1px 4px rgba(0,0,0,.06); transition:background .2s,transform .2s; }
.projects-page .project-card-carousel-button:hover { background:var(--lime,#dfff45); transform:scale(1.04); }
.projects-page .project-card-carousel-button:focus-visible { outline:2px solid #171815; outline-offset:2px; }
.projects-page .project-card-carousel-button:disabled { opacity:.35; cursor:default; }
.projects-page .portfolio-meta { display:flex; justify-content:space-between; align-items:center; gap:8px; margin:10px 13px 6px; font:500 8px/1.35 Inter,Arial,sans-serif; letter-spacing:.07em; text-transform:uppercase; color:#65675f; }
.projects-page .portfolio-meta span { min-width:0; }
.projects-page .portfolio-meta span:last-child { text-align:right; }
.projects-page .portfolio-card h3 { margin:0 13px 8px; min-height:2.35em; font:750 clamp(15px,1.35vw,18px)/1.18 Manrope,Inter,Arial,sans-serif; letter-spacing:-.045em; color:#171815; overflow-wrap:normal; word-break:normal; }
.projects-page .portfolio-card p,.projects-page .portfolio-tags { display:none !important; }
.projects-page .portfolio-open::after { content:"View project details"; display:block; margin:auto 13px 0; padding:11px 0 12px; border-top:1px solid #f0f0ec; font:600 10px/1.2 Inter,Arial,sans-serif; color:#171815; }
.projects-page .portfolio-card[hidden] { display:none !important; }
.projects-page .portfolio-open:focus-visible { outline:2px solid #171815; outline-offset:-4px; border-radius:8px; }
.projects-page .portfolio-footnote { margin:22px 0 0; padding-top:12px; border-top:1px solid #ededeb; color:#777972; font:400 10px/1.5 Inter,Arial,sans-serif; }

@media(max-width:900px) {
 .projects-page .projects-hero { padding-top:22px; }
 .projects-page .projects-hero h1 { font-size:clamp(40px,5.8vw,54px); }
 .projects-page .projects-logo-sequence a { width:130px; height:60px; }
 .projects-page .projects-logo-sequence img { height:38px; }
 .projects-page .portfolio-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
 .projects-page .portfolio-card h3 { font-size:18px; }
}
@media(max-width:560px) {
 .projects-page .projects-hero { padding:24px 0 20px; }
 .projects-page .projects-hero h1 { font-size:clamp(34px,9.2vw,42px); line-height:1.02; letter-spacing:-.06em; }
 .projects-page .projects-hero .lead { max-width:34ch; font-size:13px; line-height:1.55; }
 .projects-page .projects-logo-sequence a { width:112px; height:56px; padding:3px 5px; }
 .projects-page .projects-logo-sequence { gap:16px; }
 .projects-page .projects-logo-sequence img { height:34px; }
 .projects-page .projects-work-section { padding-top:14px; }
 .projects-page .portfolio-filters { justify-content:flex-start; flex-wrap:nowrap; overflow-x:auto; padding:3px 2px 8px; margin-bottom:12px; scrollbar-width:thin; }
 .projects-page .portfolio-filters .tab { flex:0 0 auto; padding:9px 13px; }
 .projects-page .portfolio-grid { grid-template-columns:1fr; gap:14px; }
 .projects-page .client-logo-panel { aspect-ratio:16/7.1; }
 .projects-page .portfolio-card h3 { font-size:19px; min-height:0; }
 .projects-page .portfolio-meta { font-size:8px; }
 .projects-page .project-card-carousel-button { width:32px; height:32px; }
}
@media(prefers-reduced-motion:reduce) {
 .projects-page .projects-logo-track { animation:none; transform:none; }
 .projects-page .portfolio-card,.projects-page .project-card-carousel-button,.projects-page .projects-logo-sequence img { transition:none; }
}