.project-preview__trigger{width:100%;min-height:48px;color:var(--color-text);font:inherit;cursor:pointer;background-color:color-mix(in srgb, var(--color-primary) 8%, var(--color-surface));border:1px solid var(--color-primary);border-radius:10px;justify-content:center;align-items:center;gap:10px;padding:12px 16px;font-weight:700;text-decoration:none;transition:color .18s,background-color .18s,border-color .18s,transform .18s;display:inline-flex}.project-preview__trigger:hover{color:var(--color-primary);background-color:color-mix(in srgb, var(--color-primary) 15%, var(--color-surface));transform:translateY(-2px)}.project-preview__trigger:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px}.project-preview__trigger-icon{color:var(--color-primary);flex:none;font-size:1rem}.project-preview__dialog{width:calc(100% - 32px);max-width:42rem;max-height:calc(100dvh - 32px);color:var(--color-text);background:radial-gradient(circle at 90% 0%, color-mix(in srgb, var(--color-primary) 16%, transparent), transparent 35%),var(--color-surface);border:1px solid var(--color-border);box-shadow:0 24px 60px color-mix(in srgb, var(--color-background) 75%, transparent);border-radius:16px;margin:auto;padding:0;overflow:hidden}.project-preview__dialog::backdrop{background-color:color-mix(in srgb, var(--color-background) 78%, transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.project-preview__dialog[data-device=mobile]{max-width:390px}.project-preview__dialog[data-device=tablet]{max-width:768px}.project-preview__dialog[data-device=desktop]{max-width:1200px}.project-preview__content{overscroll-behavior-y:contain;max-height:calc(100dvh - 32px);overflow-y:auto}.project-preview__header{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;display:flex}.project-preview__title{color:var(--color-text);margin:0;font-size:1.25rem;line-height:1.2}.project-preview__back-button,.project-preview__close-button{min-height:40px;color:var(--color-text);font:inherit;cursor:pointer;border:1px solid var(--color-border);background-color:#0000;border-radius:8px;justify-content:center;align-items:center;gap:8px;font-weight:700;transition:color .18s,background-color .18s,border-color .18s;display:inline-flex}.project-preview__back-button{padding:8px 12px}.project-preview__close-button{width:40px;color:var(--color-primary);padding:8px;font-size:1.25rem}.project-preview__back-button:hover,.project-preview__close-button:hover{color:var(--color-primary);background-color:color-mix(in srgb, var(--color-primary) 10%, var(--color-surface));border-color:var(--color-primary)}.project-preview__title:focus-visible,.project-preview__back-button:focus-visible,.project-preview__close-button:focus-visible,.project-preview__device-button:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px}.project-preview__screenshot-figure{background-color:var(--color-background);border:1px solid var(--color-border);border-radius:12px;margin:0;overflow:hidden}.project-preview__screenshot-caption{color:var(--color-text-secondary);background-color:color-mix(in srgb, var(--color-primary) 6%, var(--color-surface));border-top:1px solid var(--color-border);padding:10px 12px;font-size:.8125rem;font-weight:600;line-height:1.4}.project-preview__choices,.project-preview__gallery{gap:20px;padding:20px;display:grid}.project-preview__intro{color:var(--color-text-secondary);margin:0;line-height:1.5}.project-preview__device-list,.project-preview__screenshots{gap:12px;margin:0;padding:0;list-style:none;display:grid}.project-preview__device-button{width:100%;min-height:64px;color:var(--color-text);font:inherit;cursor:pointer;text-align:left;background-color:color-mix(in srgb, var(--color-primary) 7%, var(--color-surface));border:1px solid var(--color-border);border-radius:12px;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;transition:background-color .18s,border-color .18s,transform .18s;display:flex}.project-preview__device-button:hover{background-color:color-mix(in srgb, var(--color-primary) 14%, var(--color-surface));border-color:var(--color-primary);transform:translateY(-2px)}.project-preview__device-label{color:var(--color-text);font-weight:700}.project-preview__device-count{color:var(--color-primary);font-size:.875rem;font-weight:600}.project-preview__image{width:100%;height:auto;display:block}@media (min-width:75rem){.project-preview__trigger{width:fit-content}}.project-navigation{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:16px;grid-column:1/-1;grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr);align-items:center;gap:12px;padding:16px;display:grid}.project-navigation__link{min-width:0;min-height:44px;color:var(--color-text);align-items:center;gap:8px;text-decoration:none;display:flex}.project-navigation__link--previous{grid-column:1}.project-navigation__link--next{text-align:right;flex-direction:row-reverse;grid-column:3}.project-navigation__all{aspect-ratio:1;width:44px;color:var(--color-primary);background-color:var(--color-surface-light);border:1px solid var(--color-border);border-radius:50%;grid-column:2;place-items:center;font-size:1.25rem;text-decoration:none;display:grid}.project-navigation__link:hover,.project-navigation__all:hover{color:var(--color-primary)}.project-navigation__link:focus-visible,.project-navigation__all:focus-visible{outline:2px solid var(--color-primary);outline-offset:4px}.project-navigation__arrow{width:1rem;height:1rem;color:var(--color-primary);flex-shrink:0}.project-navigation__image,.project-navigation__category{display:none}.project-navigation__content{gap:4px;min-width:0;display:grid}.project-navigation__label,.project-navigation__category{color:var(--color-text-secondary);font-size:.75rem;line-height:1.4}.project-navigation__title{overflow-wrap:anywhere;font-size:.875rem;line-height:1.3}@media (min-width:75rem){.project-navigation{grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);gap:24px;padding:16px 20px}.project-navigation__link{gap:16px}.project-navigation__all{width:56px;font-size:1.5rem}.project-navigation__arrow{background-color:var(--color-surface-light);border:1px solid var(--color-border);border-radius:50%;width:24px;height:24px;padding:14px}.project-navigation__image{object-fit:cover;object-position:top;border-radius:8px;flex-shrink:0;width:96px;height:60px;display:block}.project-navigation__title{font-size:1rem}.project-navigation__category{display:block}}.project-detail{padding:24px 20px 48px}.project-detail__container{gap:32px;width:min(100%,72rem);margin-inline:auto;display:grid}.project-detail__intro,.project-detail__media{gap:32px;display:grid}.project-detail__back-link{width:fit-content;color:var(--color-primary);align-items:center;gap:8px;font-size:.875rem;font-weight:600;text-decoration:none;display:inline-flex}.project-detail__back-link:hover{color:var(--color-secondary)}.project-detail__back-link:focus-visible{outline:2px solid var(--color-primary);outline-offset:4px}.project-detail__back-icon{box-sizing:content-box;width:1rem;height:1rem;color:inherit;border:1px solid;border-radius:50%;flex:none;padding:8px;transition:transform .18s}.project-detail__back-link:hover .project-detail__back-icon{transform:translate(-4px)}.project-detail__header{gap:16px;display:grid}.project-detail__category{letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:.75rem;font-weight:700;line-height:1.4}.project-detail__category--primary{color:var(--color-primary)}.project-detail__category--success{color:var(--color-success)}.project-detail__demo-link--desktop-only{display:none}.project-detail__demo-notice{color:var(--color-text-secondary);margin:0;font-size:.875rem;line-height:1.5}.project-detail__title{color:var(--color-text);margin:0;font-size:clamp(2rem,9vw,3.25rem);line-height:1.05}.project-detail__description{max-width:42rem;color:var(--color-text-secondary);margin:0;font-size:1rem;line-height:1.6}.project-detail__actions{gap:12px;margin-top:8px;display:grid}.project-detail__action{width:100%}.project-detail__cover{aspect-ratio:16/9;background-color:var(--color-surface);border:1px solid var(--color-border);min-height:0;box-shadow:0 16px 40px color-mix(in srgb, var(--color-background) 55%, transparent);border-radius:20px;margin:0;position:relative;overflow:hidden}.project-detail__cover-image{object-fit:cover;object-position:center top;width:100%;height:100%;display:block;position:absolute;inset:0}.project-detail__information,.project-detail__objectives,.project-detail__deliverables{background:radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 42%),var(--color-surface);border:1px solid var(--color-border);border-radius:16px;padding:20px}.project-detail__objectives{display:none}.project-detail__objectives-list{color:var(--color-text-secondary);gap:12px;margin:0;padding-left:18px;font-size:.875rem;line-height:1.6;display:grid}.project-detail__objectives-list li::marker{color:var(--color-primary)}.project-detail__section-title{color:var(--color-text);margin:0 0 20px;font-size:1.25rem;line-height:1.2}.project-detail__information-list{gap:12px;margin:0;display:grid}.project-detail__information-item{border-bottom:1px solid color-mix(in srgb, var(--color-border) 75%, transparent);grid-template-columns:max-content minmax(0,1fr);gap:16px;padding-bottom:12px;display:grid}.project-detail__information-item:last-child{border-bottom:0;padding-bottom:0}.project-detail__information-label{color:var(--color-text-secondary);font-size:.875rem}.project-detail__information-value{min-width:0;color:var(--color-text);text-align:right;white-space:normal;overflow-wrap:anywhere;margin:0;font-size:.875rem;font-weight:600}.project-detail__technologies-list,.project-detail__deliverables-list{margin:0;padding:0;list-style:none}.project-detail__technologies-list{flex-wrap:wrap;gap:8px;display:flex}.project-detail__deliverables-list{gap:8px;display:grid}.project-detail__deliverable-link{width:100%;min-height:44px;color:var(--color-text);background-color:color-mix(in srgb, var(--color-primary) 7%, var(--color-surface));border:1px solid var(--color-border);border-radius:8px;align-items:center;gap:12px;padding:10px 12px;font-size:.875rem;font-weight:600;text-decoration:none;transition:color .18s,background-color .18s,border-color .18s,transform .18s;display:flex}.project-detail__deliverable-link:hover{color:var(--color-primary);background-color:color-mix(in srgb, var(--color-primary) 13%, var(--color-surface));border-color:var(--color-primary);transform:translateY(-2px)}.project-detail__deliverable-link:focus-visible{outline:2px solid var(--color-primary);outline-offset:4px}.project-detail__deliverable-external-icon{color:var(--color-text-secondary);flex:none;margin-left:auto;font-size:.75rem}@media (min-width:48rem){.project-detail{padding:32px 32px 64px}.project-detail__container,.project-detail__intro,.project-detail__media{gap:40px}.project-detail__header{gap:20px}.project-detail__information{padding:24px}.project-detail__information-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:0}.project-detail__information-item{border-bottom:0;grid-template-columns:1fr;gap:6px;padding:0 20px}.project-detail__information-item:not(:last-child){border-right:1px solid color-mix(in srgb, var(--color-border) 70%, transparent)}.project-detail__information-item:first-child{padding-left:0}.project-detail__information-item:last-child{padding-right:0}.project-detail__information-value{text-align:left}.project-detail__technologies-list .skill-card--compact{gap:8px;padding:8px 12px}.project-detail__technologies-list .skill-card__icon{width:20px;height:20px;font-size:1.25rem}.project-detail__technologies-list .skill-card__label{font-size:.875rem}}@media (min-width:75rem){.project-detail{padding:40px 48px 64px}.project-detail__container{grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);align-items:start;gap:32px 40px;width:min(100%,80rem)}.project-detail__intro{gap:32px}.project-detail__media{gap:20px}.project-detail__category{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;width:fit-content;padding:8px 12px}.project-detail__title{font-size:4rem}.project-detail__description{font-size:1.125rem}.project-detail__actions{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.project-detail__action{width:fit-content}.project-detail__technologies-list{margin-top:12px}.project-detail__technologies-list .skill-card--compact{border-radius:999px;min-height:44px}.project-detail__metadata{grid-column:1/-1;grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);gap:40px;display:grid}.project-detail__metadata .project-detail__section-title{font-size:1.125rem}.project-detail__metadata .project-detail__information:only-child{grid-column:1/-1}.project-detail__information-list{grid-template-columns:1fr;gap:20px}.project-detail__information-item{grid-template-columns:6rem minmax(0,1fr);gap:16px;padding:0}.project-detail__information-item:not(:last-child){border-right:0}.project-detail__objectives{padding:24px;display:block}.project-detail__deliverables{grid-column:1/-1}.project-detail__demo-link--desktop-only{display:inline-flex}.project-detail__demo-notice{display:none}}@media (prefers-reduced-motion:reduce){.project-preview__trigger,.project-preview__back-button,.project-preview__close-button,.project-preview__device-button,.project-detail__back-icon,.project-detail__deliverable-link{transition:none}.project-preview__trigger:hover,.project-preview__device-button:hover,.project-detail__back-link:hover .project-detail__back-icon,.project-detail__deliverable-link:hover{transform:none}}
