/* Home page (from the design "Warm & personal") */
@keyframes rise{from{opacity:0;translate:0 28px}to{opacity:1;translate:0 0}}
.reveal{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 70%}
@supports not (animation-timeline: view()){.reveal{animation:none}}
.case{transition:translate .25s ease,box-shadow .25s ease}
.case:hover{translate:0 -4px;box-shadow:0 14px 30px rgba(43,35,32,0.10)}
.case .more{color:#B4442E;font-size:14px;font-weight:500;opacity:.75;transition:opacity .25s ease}
.case:hover .more{opacity:1}
.case[hidden]{display:none!important}
.arrow{display:inline-block;transition:translate .2s ease}
.case:hover .arrow,.btn:hover .arrow{translate:4px 0}
.btn{transition:filter .2s ease,background-color .2s ease}
.btn:hover{filter:brightness(0.9)}
.btn-ghost{transition:background-color .2s ease}
.btn-ghost:hover{background-color:rgba(43,35,32,0.06)}
.chipbtn{transition:background-color .2s ease,color .2s ease,border-color .2s ease}
.chipbtn{color:#2B2320;background:transparent;border:1.5px solid #CDBFAE}
.chipbtn[aria-pressed="true"]{color:#FBF6EE;background:#2B2320;border-color:#2B2320}
.sketch-arrow{stroke-dasharray:1;stroke-dashoffset:1;animation:sketch-draw .6s ease-out forwards}
.sketch-arrow.a1{animation-delay:.5s}
.sketch-arrow.a2{animation-delay:1.1s;animation-duration:.8s}
.sketch-arrow.a3{animation-delay:2.1s}
.sketch-label{opacity:0;animation:sketch-fade .5s ease-out 1.7s forwards}
@keyframes sketch-draw{to{stroke-dashoffset:0}}
@keyframes sketch-fade{to{opacity:1}}
@media (prefers-reduced-motion: reduce){.reveal{animation:none}.case,.arrow{transition:none}.case:hover{translate:none}.sketch-arrow{stroke-dashoffset:0;animation:none}.sketch-label{opacity:1;animation:none}}
@media (max-width:640px){
header>div{padding:12px 16px!important;gap:4px!important}
nav[aria-label="Main"]{gap:16px!important;font-size:14px!important}
nav[aria-label="Main"] a{display:inline-flex;align-items:center;min-height:44px;box-sizing:border-box}
nav[aria-label="Main"] a.btn{padding:0 16px!important}
h1{font-size:40px!important}
h2{font-size:32px!important}
#w-proc-h{font-size:42px!important}
#w-contact-h{font-size:40px!important}
#w-top{padding:28px 16px 56px!important;gap:32px!important}
#w-top>div:last-child{padding:16px 10px!important}
section[aria-labelledby="w-do-h"]{padding:8px 16px 56px!important;gap:24px!important}
section:not(#w-top):not([aria-labelledby="w-do-h"])>div{padding:56px 16px!important;gap:32px!important}
.case{padding:22px!important}
form{padding:22px!important}
footer>div{padding:24px 16px!important}
}
