.projectCard{width:100%;min-width:0;color:var(--color-text);border-radius:.85rem;flex-direction:column;gap:.65rem;padding:.5rem;text-decoration:none;transition:transform .3s,background-color .3s;display:flex;overflow:hidden}.projectCard .projectCardImageContainer{cursor:pointer;background-color:rgba(var(--color-text-rgb),.06);aspect-ratio:1;border-radius:.75rem;position:relative;overflow:hidden}.projectCard .projectCardImageContainer .projectCardImage{object-fit:cover;width:100%;height:100%;transition:transform .4s}.projectCard .projectCardImageContainer:after{content:"";opacity:0;z-index:1;background:linear-gradient(#0000 30%,#0006 60%,#000000bf 100%);transition:opacity .4s;position:absolute;inset:0}.projectCard .projectCardImageContainer .projectCardContent{z-index:2;color:#fff;opacity:0;transition:all .4s;position:absolute;bottom:20px;left:20px;transform:translateY(10px)}.projectCard .projectCardImageContainer .projectCardContent h3,.projectCard .projectCardImageContainer .projectCardContent p{color:#fff}.projectCard>h3{margin-top:.25rem;font-size:clamp(16px,2vw,18px);font-weight:500;line-height:1.25}.projectCard>p{color:var(--color-text-secondary);font-size:14px}.projectCard:hover{background-color:rgba(var(--color-text-rgb),.035);transform:translateY(-4px)}.projectCard:hover .projectCardImage{transform:scale(1.05)}.projectCard:hover .projectCardImageContainer:after{opacity:1}.projectCard:hover .projectCardContent{opacity:1;transform:translateY(0)}.projectCard:nth-child(7n+1) .projectCardImageContainer,.projectCard:nth-child(7n+5) .projectCardImageContainer{aspect-ratio:4/3}@media (prefers-reduced-motion:reduce){.projectCard,.projectCardImage,.projectCardImageContainer:after,.projectCardContent{transition:none}.projectCard:hover,.projectCard:hover .projectCardImage{transform:none}}
.projectsContainer{grid-template-columns:repeat(12,minmax(0,1fr));align-items:start;gap:clamp(1rem,2vw,1.5rem);width:100%;max-width:1180px;margin-inline:auto;display:grid}.projectsContainer>.projectCard{grid-column:span 4}.projectsContainer>.projectCard:nth-child(7n+1),.projectsContainer>.projectCard:nth-child(7n+5){grid-column:span 6}.projectsContainer .emptyProjects{text-align:center;width:100%;color:var(--color-text-secondary);border:1px solid rgba(var(--color-border-rgb),.18);background:radial-gradient(circle at 50% 0%,rgba(var(--color-accent-rgb),.1),transparent 34%),rgba(var(--color-button-secondary-rgb),.34);border-radius:.75rem;grid-column:1/-1;padding:clamp(2.5rem,8vw,5rem) 1rem;font-size:16px;line-height:1.6}.projectsContainer .emptyProjects:before{content:"Alukkart";color:var(--color-text);margin-bottom:.75rem;font-family:DM Serif Display,Georgia,serif;font-size:clamp(24px,5vw,36px);display:block}@media (max-width:980px){.projectsContainer{grid-template-columns:repeat(2,minmax(0,1fr))}.projectsContainer>.projectCard,.projectsContainer>.projectCard:nth-child(7n+1),.projectsContainer>.projectCard:nth-child(7n+5){grid-column:span 1}}@media (max-width:640px){.projectsContainer{grid-template-columns:1fr}}
.workSection{flex-direction:column;align-items:center;gap:2rem;width:100%;max-width:1180px;padding:3rem 1.5rem;display:flex}.workSection .titleContainer{align-items:flex-start}.workSection .titleContainer .title{font-size:clamp(12px,4vw,14px)}.workSection .titleContainer .subTitle{font-size:clamp(32px,4vw,36px)}
.heroSection{isolation:isolate;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:clamp(620px,100svh - 74px,860px);padding:clamp(2rem,6vw,5rem) 1.5rem 3.5rem;display:flex;position:relative}.heroSection:before{content:"";aspect-ratio:1;border:1px solid rgba(var(--color-text-rgb),.08);z-index:-1;border-radius:50%;width:min(720px,88vw);position:absolute;inset:7% auto auto 50%;transform:translate(-50%)}.heroSection:after{content:"";background:linear-gradient(90deg,rgba(var(--color-text-rgb),0),rgba(var(--color-accent-rgb),.5),rgba(var(--color-text-rgb),0));z-index:-1;width:min(520px,72vw);height:1px;position:absolute;inset:auto auto 11% 50%;transform:translate(-50%)}.heroSection .heroImageReveal{border-radius:.75rem;overflow:hidden;box-shadow:0 22px 70px #00000029}.heroSection img{border-radius:.75rem;width:min(550px,86vw);height:auto;transition:transform .3s ease-in-out;display:block}.heroSection img:hover{transform:translateY(-5px)}@media (max-width:768px){.heroSection img{width:min(100%,520px)}}.heroSection .titleContainer{margin-top:1.5rem}.heroSection .titleContainer .title{color:var(--color-accent)}.heroSection .titleContainer .subTitle{max-width:920px;line-height:.96}.heroSection .heroProof{max-width:720px;color:var(--color-text-secondary);text-align:center;margin-top:1rem;font-size:clamp(12px,2vw,16px);line-height:1.6}.heroSection .heroSectionButton{flex-flow:wrap;justify-content:center;align-items:center;gap:.75rem;margin-top:2rem;display:inline-flex}.heroSection .heroSectionButton .viewButton,.heroSection .heroSectionButton .contactButton{border:1px solid var(--color-border);cursor:pointer;align-items:center;gap:.5rem;min-height:48px;padding:.75rem 1.5rem;font-size:16px;text-decoration:none;transition:all .3s ease-in-out;display:flex}.heroSection .heroSectionButton .viewButton{background-color:var(--color-button);color:var(--color-bg)}.heroSection .heroSectionButton .viewButton:hover{background-color:var(--color-hover-primary);color:var(--color-text);border-color:var(--color-border)}.heroSection .heroSectionButton .contactButton{background-color:rgba(var(--color-button-secondary-rgb),.7);color:var(--color-text);border-color:rgba(var(--color-border-rgb),.25)}.heroSection .heroSectionButton .contactButton:hover{border-color:var(--color-accent);color:var(--color-accent)}@media (prefers-reduced-motion:reduce){.heroSection img,.heroSection .viewButton{transition:none}}
.contactForm{flex-direction:column;gap:2.5rem;width:100%;max-width:500px;display:flex}.contactForm .field{flex-direction:column;gap:.75rem;display:flex}.contactForm label{letter-spacing:.15em;color:var(--color-text-secondary);font-size:.75rem;font-weight:500}.contactForm input,.contactForm textarea{border:none;border-bottom:1px solid var(--color-border);width:100%;color:var(--color-text);background:0 0;outline:none;padding:.75rem 0;font-size:1rem;transition:border-color .3s}.contactForm textarea{resize:none;min-height:120px}.contactForm input:focus,.contactForm textarea:focus{border-bottom:1px solid #b453e6}.contactForm button{background-color:var(--color-button);width:fit-content;min-height:48px;color:var(--color-bg);border:1px solid var(--color-border);cursor:pointer;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:16px;transition:all .3s ease-in-out;display:flex}.contactForm button:hover{background-color:var(--color-hover-primary);color:var(--color-text);border-color:var(--color-border)}.contactForm button:disabled{cursor:wait;opacity:.65}.contactForm .error{color:#d64545;margin-top:.25rem;font-size:.75rem;animation:.2s fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.contactSection{background-color:var(--color-bg);flex-direction:column;justify-content:center;align-items:center;width:100%;padding:4rem 1.5rem;display:flex}.contactSection .subTitle{font-size:clamp(24px,4vw,36px)}.contactSection .moreInfoContent{text-align:center;flex-direction:column;align-items:center;gap:1rem;max-width:500px;margin:1rem;font-size:14px;display:flex}.contactSection .moreInfoContent p{color:var(--color-text-secondary);line-height:23px}.contactSection .moreInfoContent .personalData{gap:1rem;display:flex}.contactSection .moreInfoContent .personalData a{color:var(--color-text)}