/* Premium Experience: light, consistent refinement without changing WebGL */
:root{--cardah-motion:cubic-bezier(.22,1,.36,1)}
html{scroll-padding-top:110px}
body{overflow-x:clip}
:where(a,button,input,textarea,select):focus-visible{outline:2px solid #b98968!important;outline-offset:4px}
:where(button,a){-webkit-tap-highlight-color:transparent}
:where(.section-wrap){scroll-margin-top:110px}
/* Clearer content hierarchy and calmer section rhythm */
.section-heading{align-items:end}
.section-description{line-height:1.75}
.work-section,.expertise-section,.approach-section,.about-section{position:relative}
/* Cards: preserve actual imagery, avoid heavy zoom effects */
.project-image-wrap{overflow:hidden;box-shadow:0 14px 34px rgba(12,16,14,.06);transition:box-shadow .45s var(--cardah-motion),transform .45s var(--cardah-motion)}
.project-open:hover .project-image-wrap,.project-open:focus-visible .project-image-wrap{box-shadow:0 22px 50px rgba(12,16,14,.13);transform:translateY(-3px)}
.project-open:active .project-image-wrap{transform:translateY(-1px)}
.project-card-data{gap:16px}
/* More intentional call-to-action response */
.nav-cta,.filter,.service-quote,.round-link{transition:background-color .28s,color .28s,transform .32s var(--cardah-motion),box-shadow .32s}
.nav-cta:hover,.service-quote:hover{transform:translateY(-2px)}
.nav-cta:active,.service-quote:active{transform:translateY(0)}
/* Smooth but subtle appearance; content remains visible if JS is disabled */
@media(prefers-reduced-motion:no-preference){.cardah-reveal-ready .cardah-reveal{opacity:0;transform:translateY(19px);transition:opacity .7s var(--cardah-motion),transform .8s var(--cardah-motion)}.cardah-reveal-ready .cardah-reveal.cardah-visible{opacity:1;transform:none}}
/* Keep long project titles, links, and contact information readable */
.project-card-data h3,.section-heading h2{overflow-wrap:break-word}
.footer a,.direct-contact a{transition:opacity .25s}
.footer a:hover,.direct-contact a:hover{opacity:.75}
/* Avoid hiding content under sticky header and provide more comfortable tap targets */
@media(max-width:900px){.main-nav a,.menu-toggle{min-height:44px}.section-heading{align-items:start}}
@media(max-width:670px){.project-card-data{gap:10px}.project-open:hover .project-image-wrap{transform:none}.footer{row-gap:26px}.direct-contact{line-height:1.5}}
@media(prefers-reduced-motion:reduce){.project-image-wrap,.nav-cta,.service-quote{transition:none!important;transform:none!important}}
