#category-websites .site-project{display:grid;grid-template-columns:minmax(220px,1fr) minmax(0,1.65fr);gap:clamp(28px,4vw,70px);align-items:center;padding:42px 0 54px;border-bottom:1px solid var(--line,#55534b);scroll-margin-top:100px}
#category-websites .site-project:first-child{padding-top:8px}
#category-websites .site-project-info .eyebrow{margin:0 0 16px;color:var(--accent,#ef796b);font-size:12px;line-height:1.5}
#category-websites .site-project h4{font-size:clamp(25px,2.6vw,42px);line-height:1.16;letter-spacing:-.035em;font-weight:600;margin:0 0 20px;text-wrap:balance}
#category-websites .site-project-role{font-size:17px;line-height:1.65;color:var(--muted,#bdbbb2);margin:0 0 24px;max-width:28ch}
#category-websites .site-visit{display:inline-flex;align-items:center;gap:10px;font-size:16px;color:var(--ink);text-decoration:underline;text-underline-offset:5px}
#category-websites .site-visit span{font-size:25px;font-weight:700;text-decoration:none}
#category-websites .site-scroll-preview{position:relative;overflow-x:hidden;overflow-y:hidden;width:100%;aspect-ratio:1.35;cursor:grab;scrollbar-width:none;overscroll-behavior-x:none;background:var(--surface,#111);contain:paint}
#category-websites .site-page-capture{display:block;width:100%;height:auto;max-width:none;max-height:none;object-fit:initial;user-select:none;-webkit-user-drag:none}
#category-websites .website-more{border:0;margin-top:24px;padding:0}
#category-websites .website-more>summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:18px;line-height:1.5;padding:18px 0;border-bottom:1px solid var(--line,#55534b);list-style:none}
#category-websites .website-more>summary::-webkit-details-marker{display:none}
#category-websites .expand-mark{font-size:28px;line-height:1}
#category-websites .less-label,#category-websites .website-more[open] .more-label{display:none}
#category-websites .website-more[open] .less-label{display:inline}
#category-websites .website-more[open] .expand-mark{transform:rotate(45deg)}
#category-websites .website-more-content{padding-top:28px}
#category-websites .site-upcoming-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:40px 0 10px}
#category-websites .site-upcoming h4{font-size:23px;line-height:1.25;margin:14px 0}
#category-websites .site-upcoming p:not(.eyebrow){font-size:16px;line-height:1.6;color:var(--muted)}
#category-websites .site-upcoming .eyebrow{font-size:12px;color:var(--accent,#ef796b)}
@media(max-width:800px){#category-websites .site-project{grid-template-columns:1fr;gap:24px;padding:32px 0}#category-websites .site-project h4{font-size:30px;max-width:24ch;margin-bottom:14px}#category-websites .site-project-role{max-width:45ch;margin-bottom:16px;font-size:16px}#category-websites .site-upcoming-grid{grid-template-columns:1fr;gap:20px}#category-websites .site-scroll-preview{aspect-ratio:1.25}}
@media(prefers-reduced-motion:reduce){#category-websites .site-page-capture{transform:none!important;will-change:auto}}

#category-websites .site-scroll-preview::-webkit-scrollbar{display:none}
#category-websites .site-scroll-preview.is-dragging{cursor:grabbing}
#category-websites .site-scroll-preview:focus-visible{outline:2px solid var(--accent);outline-offset:5px}

#category-websites .site-scroll-preview.is-manual{overflow-y:auto}
