.portfolio-preview-section{background:var(--color-bg);padding:var(--space-24)0;position:relative;overflow:hidden}.portfolio-preview-section:before{content:"";background:linear-gradient(to right,transparent,var(--color-border),transparent);height:1px;position:absolute;top:0;left:5%;right:5%}.portfolio-preview-section__observer{height:0;display:block}.portfolio-preview-section__header{text-align:center;max-width:600px;margin:0 auto var(--space-16);opacity:0;transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);transform:translateY(24px)}.portfolio-preview-section--visible .portfolio-preview-section__header{opacity:1;transform:translateY(0)}.portfolio-preview-section__eyebrow{font-family:var(--font-mono);font-size:var(--text-xs);font-weight:var(--weight-medium);letter-spacing:var(--tracking-wider);text-transform:uppercase;color:var(--color-accent);margin-bottom:var(--space-5);display:inline-block}.portfolio-preview-section__title{font-family:var(--font-heading);font-size:clamp(2rem,4vw,3rem);font-weight:var(--weight-bold);color:var(--color-text);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);margin:0 0 var(--space-5)}.portfolio-preview-section__desc{font-size:var(--text-lg);color:var(--color-text-secondary);max-width:52ch;line-height:var(--leading-normal);margin:0 auto}.portfolio-preview-section__grid{gap:var(--space-4);margin-bottom:var(--space-14);grid-template-columns:1fr;display:grid}@media (min-width:640px){.portfolio-preview-section__grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.portfolio-preview-section__grid{grid-template-columns:repeat(3,1fr)}}.preview-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-8)var(--space-6)var(--space-6);opacity:0;min-height:220px;transition:border-color var(--duration-default)var(--ease-in-out),box-shadow var(--duration-default)var(--ease-in-out),transform var(--duration-slow)var(--ease-out);flex-direction:column;gap:0;display:flex;position:relative;overflow:hidden;transform:translateY(28px)}.portfolio-preview-section--visible .preview-card{opacity:1;transition-delay:calc(var(--card-index,0)*.1s + .2s);transition-property:opacity,transform;transition-duration:.65s;transition-timing-function:var(--ease-out);transform:translateY(0)}.portfolio-preview-section--visible .preview-card:hover{border-color:var(--color-border-accent);box-shadow:var(--shadow-glow);transform:translateY(-4px)}.preview-card__deco{width:120px;height:120px;color:var(--color-text);opacity:.03;pointer-events:none;transition:opacity var(--duration-default)var(--ease-in-out);position:absolute;top:0;right:0}.portfolio-preview-section--visible .preview-card:hover .preview-card__deco{opacity:.06}.preview-card__content{z-index:1;gap:var(--space-3);flex-direction:column;flex:1;display:flex;position:relative}.preview-card__category{font-family:var(--font-mono);font-size:var(--text-xs);font-weight:var(--weight-medium);text-transform:uppercase;letter-spacing:var(--tracking-wider);color:var(--color-accent);align-self:flex-start;display:inline-block}.preview-card__name{font-family:var(--font-heading);font-size:clamp(1.25rem,2vw,1.5rem);font-weight:var(--weight-bold);color:var(--color-text);line-height:var(--leading-snug);letter-spacing:var(--tracking-tight);margin:0}.preview-card__teaser{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--leading-normal);margin:0}.preview-card__arrow{z-index:1;color:var(--color-text-dim);margin-top:var(--space-6);transition:color var(--duration-fast)var(--ease-in-out),transform var(--duration-default)var(--ease-out);align-self:flex-start;align-items:center;display:flex;position:relative}.portfolio-preview-section--visible .preview-card:hover .preview-card__arrow{color:var(--color-accent);transform:translate(5px)}.portfolio-preview-section__footer{text-align:center;opacity:0;transition:opacity .7s .45s var(--ease-out),transform .7s .45s var(--ease-out);transform:translateY(16px)}.portfolio-preview-section--visible .portfolio-preview-section__footer{opacity:1;transform:translateY(0)}