.projects-page{overflow:hidden;background:var(--bg-1)}
.projects-hero{position:relative;padding:clamp(72px,10vw,132px) 0 72px;background:radial-gradient(ellipse at 82% 8%,rgba(96,165,250,.17),transparent 40%),linear-gradient(180deg,#f7faff 0%,var(--bg-1) 100%);border-bottom:1px solid var(--border-1)}
.projects-hero:after{position:absolute;inset:0;content:"";pointer-events:none;opacity:.28;background-image:linear-gradient(rgba(59,130,246,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(59,130,246,.12) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(180deg,#000,transparent 88%)}
.projects-hero__inner{position:relative;z-index:1;max-width:920px}
.projects-hero h1{max-width:850px;margin:18px 0 22px;font-size:clamp(2.7rem,7vw,5.6rem);line-height:.99;letter-spacing:-.065em;color:var(--text-100)}
.projects-hero__lead{max-width:690px;color:var(--text-400);font-size:clamp(1rem,1.6vw,1.18rem);line-height:1.8}
.projects-hero__note{display:flex;align-items:center;gap:10px;margin:22px 0 28px;color:var(--text-600);font-size:.88rem}
.projects-hero__note span{width:9px;height:9px;border-radius:50%;background:#3b82f6;box-shadow:0 0 0 5px rgba(59,130,246,.12)}
.projects-hero .btn span,.projects-cta .btn span{margin-left:10px}
.projects-list{padding-block:clamp(64px,8vw,104px)}
.projects-section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:30px}
.projects-section-head h2{margin:8px 0 0;font-size:clamp(1.8rem,4vw,2.65rem);letter-spacing:-.045em;color:var(--text-100)}
.projects-count{font-size:2rem;font-weight:750;letter-spacing:-.06em;color:#3b82f6}.projects-count span{font-size:.82rem;font-weight:600;letter-spacing:0;color:var(--text-600)}
.projects-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.project-card{overflow:hidden;border:1px solid var(--border-1);border-radius:20px;background:var(--bg-card);box-shadow:0 10px 30px rgba(21,39,75,.055);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;animation:project-enter .55s both;animation-delay:calc(var(--project-index)*70ms)}
.project-card:hover{transform:translateY(-5px);border-color:rgba(59,130,246,.35);box-shadow:0 20px 46px rgba(21,39,75,.12)}
.project-preview{height:clamp(230px,29vw,330px);padding:18px;background:var(--preview-bg);overflow:hidden}
.project-preview__browser{height:26px;display:flex;align-items:center;gap:5px;color:rgba(23,32,58,.58);font-size:10px}
.project-preview__browser i{width:6px;height:6px;border-radius:50%;background:rgba(23,32,58,.24)}
.project-preview__browser span{margin-left:10px;opacity:.75}
.project-preview__site{height:calc(100% - 26px);padding:16px 18px 14px;border-radius:12px 12px 4px 4px;background:var(--preview-surface);color:var(--preview-ink);box-shadow:0 12px 24px rgba(10,20,40,.12);overflow:hidden}
.project-preview__nav{display:flex;align-items:center;gap:12px;height:24px;font-size:10px}.project-preview__nav b{font-size:12px;margin-right:auto;letter-spacing:-.03em}.project-preview__nav span{width:24px;height:4px;border-radius:3px;background:currentColor;opacity:.25}
.project-preview__content{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:14px;margin:24px 0 18px}
.project-preview__copy{display:flex;align-items:flex-start;flex-direction:column;gap:8px}.project-preview__copy small{font-size:8px;letter-spacing:.12em;text-transform:uppercase;opacity:.65}.project-preview__copy strong{max-width:250px;font-size:clamp(17px,2.8vw,28px);line-height:1.03;letter-spacing:-.06em}.project-preview__copy p{margin:0;font-size:9px;opacity:.65}.project-preview__copy em{margin-top:4px;padding:7px 10px;border-radius:6px;background:var(--preview-accent);color:var(--preview-button-ink);font-size:8px;font-style:normal;font-weight:700}.project-preview__copy em span{margin-left:8px}
.project-preview__art{position:relative;display:grid;place-items:center;height:clamp(110px,14vw,166px);border-radius:9px;background:var(--preview-art);overflow:hidden}
.project-preview__art:before,.project-preview__art:after,.project-preview__art span{position:absolute;display:block;content:""}
.project-preview__art:before{width:62%;height:72%;left:12%;top:15%;border:1px solid rgba(255,255,255,.58);border-radius:48% 48% 8px 8px;transform:rotate(-10deg)}
.project-preview__art:after{width:54%;height:84%;right:7%;bottom:-24%;border-radius:50% 50% 0 0;background:rgba(255,255,255,.19)}
.project-preview__art span:first-child{width:34%;height:34%;top:20%;right:23%;border-radius:50%;background:rgba(255,255,255,.4)}
.project-preview__art span:nth-child(2){width:1px;height:68%;left:50%;top:14%;background:rgba(255,255,255,.34);transform:rotate(22deg)}
.project-preview__art span:nth-child(3){width:58%;height:1px;left:18%;bottom:23%;background:rgba(255,255,255,.36);transform:rotate(-13deg)}
.project-preview__tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.project-preview__tiles i{height:34px;border-radius:5px;background:var(--preview-tile);border:1px solid rgba(20,35,60,.07)}
.project-card__body{padding:21px 23px 24px}.project-card__meta{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--text-600);font-size:.78rem}.project-demo{padding:5px 8px;border-radius:999px;background:#eff6ff;color:#2563eb;font-weight:650;white-space:nowrap}.project-card h3{margin:13px 0 7px;color:var(--text-100);font-size:1.28rem;letter-spacing:-.035em}.project-card__body p{max-width:560px;margin:0;color:var(--text-500,var(--text-400));font-size:.91rem;line-height:1.65}
.project-card--atelier{--preview-bg:#e4e8e5;--preview-surface:#f8f8f4;--preview-ink:#202a27;--preview-accent:#283b36;--preview-button-ink:#fff;--preview-art:#9ba99e;--preview-tile:#e9ece7}
.project-card--shop{--preview-bg:#e8e2d8;--preview-surface:#fffdf9;--preview-ink:#302d28;--preview-accent:#435b4a;--preview-button-ink:#fff;--preview-art:#c9b99d;--preview-tile:#f1ece3}
.project-card--klinik{--preview-bg:#dcecf0;--preview-surface:#f8fcfc;--preview-ink:#23383c;--preview-accent:#438795;--preview-button-ink:#fff;--preview-art:#9abcc2;--preview-tile:#e4f0f1}
.project-card--cafe{--preview-bg:#eee2ce;--preview-surface:#fffaf1;--preview-ink:#35261e;--preview-accent:#a34b2f;--preview-button-ink:#fff;--preview-art:#bd7f4f;--preview-tile:#f0e3d0}
.project-card--auto{--preview-bg:#dfe6ef;--preview-surface:#f7f9fc;--preview-ink:#142238;--preview-accent:#155eef;--preview-button-ink:#fff;--preview-art:#5b769a;--preview-tile:#e8edf4}
.project-card--beauty{--preview-bg:#e6e5e1;--preview-surface:#fbfaf7;--preview-ink:#292b2a;--preview-accent:#57776c;--preview-button-ink:#fff;--preview-art:#bec8bb;--preview-tile:#efeee9}
.projects-cta{padding:0 0 clamp(64px,8vw,104px)}.projects-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:clamp(28px,5vw,52px);border:1px solid var(--border-1);border-radius:22px;background:linear-gradient(135deg,#f2f7ff,#fff 68%);box-shadow:0 14px 36px rgba(21,39,75,.06)}.projects-cta h2{margin:8px 0;font-size:clamp(1.55rem,3.2vw,2.25rem);letter-spacing:-.045em;color:var(--text-100)}.projects-cta p{margin:0;color:var(--text-400);line-height:1.6}
@keyframes project-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.projects-hero{padding-top:70px}.projects-grid{grid-template-columns:1fr;gap:18px}.project-preview{height:280px}.project-preview__copy strong{font-size:26px}.project-preview__art{height:150px}.projects-cta__inner{align-items:flex-start;flex-direction:column}.projects-cta .btn{width:100%;justify-content:center}}
@media(max-width:420px){.projects-section-head{align-items:flex-start;flex-direction:column;gap:10px}.projects-count{font-size:1.4rem}.project-preview{padding:12px;height:245px}.project-preview__site{padding:13px}.project-preview__content{margin:18px 0 14px}.project-preview__art{height:120px}.project-card__body{padding:18px}}
@media(prefers-reduced-motion:reduce){.project-card{animation:none;transition:none}.project-card:hover{transform:none}}