/* Larger header symbol, without scaling the wordmark. */
.header .brand{gap:12px}
.header .brand>img{width:44px;height:54px;object-fit:contain;flex-shrink:0}

/* A shared, restrained response to hover, keyboard focus and press. */
.cta{transition:transform .38s cubic-bezier(.2,.8,.2,1)}
.cta>span{position:relative;overflow:hidden;isolation:isolate;background-size:200% 100%;background-position:0 50%;transition:background-position .6s ease,border-color .3s ease}
.cta>span:after{content:'';position:absolute;inset:-50% -20%;background:linear-gradient(105deg,transparent 35%,#ffffff80 50%,transparent 65%);transform:translateX(-110%);pointer-events:none;transition:transform .75s cubic-bezier(.2,.65,.25,1)}
.cta>b{transition:transform .4s cubic-bezier(.2,.8,.2,1),background-color .3s ease,color .3s ease}
.cta:focus-visible>span{background-position:100% 50%}
.cta:focus-visible>b{background:var(--ink);color:var(--lime);transform:translate(2px,-2px) rotate(-8deg)}
.outline-contact{position:relative;isolation:isolate;overflow:hidden;transition:color .3s ease,transform .35s cubic-bezier(.2,.8,.2,1)}
.outline-contact:before{content:'';position:absolute;inset:-1px;background:var(--ink);border-radius:inherit;transform:translateY(104%);transition:transform .4s cubic-bezier(.2,.8,.2,1);z-index:-1;pointer-events:none}
.header .outline-contact:focus-visible{color:var(--white)}
.outline-contact:focus-visible:before{transform:translateY(0)}
.submit-button{position:relative;overflow:hidden;isolation:isolate;transition:transform .35s cubic-bezier(.2,.8,.2,1),background-color .3s ease,color .3s ease}
.submit-button:after{content:'';position:absolute;inset:-50% -20%;background:linear-gradient(105deg,transparent 35%,#ffffff26 50%,transparent 65%);transform:translateX(-110%);transition:transform .75s cubic-bezier(.2,.65,.25,1);pointer-events:none}
.submit-button>span{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.submit-button:focus-visible>span{transform:translate(3px,-3px)}
.filters button{transition:transform .28s cubic-bezier(.2,.8,.2,1),background-color .25s ease,color .25s ease,border-color .25s ease}
.header nav a{position:relative}
.header nav a:after{content:'';position:absolute;left:0;right:0;bottom:-7px;height:3px;border-radius:4px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.header nav a:focus-visible:after{transform:scaleX(1)}
.project-open{transition:color .25s ease,border-color .3s ease}
.project-open>b{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.project-pagination button,.project-close,.dialog-close,.menu-toggle{transition:transform .3s cubic-bezier(.2,.8,.2,1),background-color .25s ease,color .25s ease}
.menu-toggle span{transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .2s ease}
.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(8px) rotate(45deg)}
.menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-8px) rotate(-45deg)}

@media(hover:hover) and (pointer:fine){
  .cta:hover{transform:translateY(-3px)}
  .cta:hover>span{background-position:100% 50%}
  .cta:hover>span:after,.submit-button:hover:after{transform:translateX(110%)}
  .cta:hover>b{background:var(--ink);color:var(--lime);transform:translate(2px,-2px) rotate(-8deg)}
  .header .outline-contact:hover{color:var(--white);transform:translateY(-2px)}
  .outline-contact:hover:before{transform:translateY(0)}
  .submit-button:hover{background:var(--green);color:var(--white);transform:translateY(-3px)}
  .submit-button:hover>span{transform:translate(3px,-3px)}
  .project-contact:hover{background:var(--ink);color:var(--lime)}
  .filters button:hover{background:var(--ink);color:var(--lime);transform:translateY(-2px)}
  .header nav a:hover:after{transform:scaleX(1)}
  .project:hover .project-open{color:var(--lime);border-color:var(--lime)}
  .project:hover .project-open>b{transform:translate(4px,-4px) rotate(-8deg)}
  .project-pagination button:hover:not(:disabled){transform:translateY(-2px) scale(1.05)}
  .project-close:hover,.dialog-close:hover{transform:rotate(90deg)}
}
.cta:active,.outline-contact:active,.submit-button:active,.filters button:active,.project-pagination button:active:not(:disabled),.project-close:active,.dialog-close:active,.menu-toggle:active{transform:translateY(1px) scale(.97);transition-duration:.1s}
.cta:active>b{transform:none}
@media(max-width:1000px){.header nav a:after{right:auto;width:42px;bottom:7px}}
@media(max-width:600px){.header .brand{gap:8px}.header .brand>img{width:36px;height:44px}}
@media(prefers-reduced-motion:reduce){
  .cta,.cta>b,.outline-contact,.submit-button,.submit-button>span,.filters button,.project-open>b,.project-pagination button,.project-close,.dialog-close,.menu-toggle{transform:none!important;transition:none!important}
  .cta>span:after,.submit-button:after{display:none}
}
@media(max-width:370px){.about-grid>div{min-width:0}}
