/* Short, purposeful transitions. Transform and opacity do the visual work. */
:root{--ease-out:cubic-bezier(.16,1,.3,1);--ease-soft:cubic-bezier(.22,.61,.36,1)}
.intro{animation-duration:.72s;animation-timing-function:var(--ease-out)}
.hero h1.intro{animation:none}
.hero-line{display:block;animation:line-arrive .8s var(--ease-out) both}
.hero-line:nth-child(1){animation-delay:.05s}.hero-line:nth-child(2){animation-delay:.13s}.hero-line:nth-child(3){animation-delay:.21s}
.hero-copy .hero-desc.intro{animation-delay:.28s}.hero-copy .hero-actions.intro{animation-delay:.34s}.hero-copy .hero-license.intro{animation-delay:.39s}
.hero-visual.intro{animation:photo-arrive .9s var(--ease-out) .1s both}
.will-reveal{transform:translateY(28px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.will-reveal.visible{transform:translateY(0)}
.reveal.visible .principle,.reveal.visible .steps li,.reveal.visible .service-links a{animation:detail-arrive .6s var(--ease-out) both}
.reveal.visible .principle:nth-of-type(2),.reveal.visible .steps li:nth-child(2),.reveal.visible .service-links a:nth-child(2){animation-delay:.07s}
.reveal.visible .principle:nth-of-type(3),.reveal.visible .steps li:nth-child(3),.reveal.visible .service-links a:nth-child(3){animation-delay:.14s}
.header nav a{position:relative;border-bottom:0}
.header nav a:after{content:'';position:absolute;left:0;right:0;bottom:5px;height:1px;background:var(--purple);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease-out)}
.header nav a:hover:after,.header nav a[aria-current]:after{transform:scaleX(1)}
.button{transition:background .25s var(--ease-soft),transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.button:hover{transform:translateY(-2px);box-shadow:0 6px 14px #39064e14}.button:active{transform:translateY(0) scale(.985);box-shadow:0 1px 4px #39064e0d;transition-duration:.12s}
.button span,.text-link span{transition:transform .35s var(--ease-out)}
.button:hover span,.text-link:hover span{transform:translate(3px,-3px)}
.service-tabs button{position:relative;border-left:0!important;transition:color .25s var(--ease-soft),padding .4s var(--ease-out)}
.service-tabs button:before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--purple);transform:scaleY(0);transform-origin:top;transition:transform .4s var(--ease-out)}
.service-tabs button[aria-selected=true]:before{transform:scaleY(1)}
.service-panel{min-height:310px;animation:panel-arrive .4s var(--ease-out)}
.service-links a{transition:padding .3s var(--ease-out),color .2s}.service-links a:hover{padding-left:6px}
.service-links a>span{transition:transform .3s var(--ease-out)}.service-links a:hover>span{transform:translate(2px,-2px)}
summary>span{transition:transform .35s var(--ease-out)}
details[open] .answer{animation:answer-arrive .3s var(--ease-soft)}
@supports(interpolate-size:allow-keywords){
 details{interpolate-size:allow-keywords}
 details::details-content{block-size:0;overflow:clip;opacity:0;transition:block-size .35s var(--ease-out),opacity .2s var(--ease-soft),content-visibility .35s allow-discrete}
 details[open]::details-content{block-size:auto;opacity:1}
}
.menu-toggle span{transition:transform .3s var(--ease-out)}
.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.inquiry-form input,.inquiry-form select,.inquiry-form textarea{transition:border-color .2s,background .2s}
.inquiry-form input:focus,.inquiry-form select:focus,.inquiry-form textarea:focus{background:#eee9e4;border-color:var(--purple)}
.draft-status:not(:empty){animation:detail-arrive .35s var(--ease-out)}
@keyframes line-arrive{from{opacity:0;transform:translateY(23px)}to{opacity:1;transform:translateY(0)}}
@keyframes photo-arrive{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
@keyframes detail-arrive{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:none}}
@keyframes panel-arrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
@keyframes answer-arrive{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media(max-width:800px){
 .header nav{display:flex;flex-direction:column;align-items:stretch;gap:0;visibility:hidden;opacity:0;transform:translateY(-9px);pointer-events:none;transition:opacity .22s var(--ease-soft),transform .35s var(--ease-out),visibility .35s}
 .header nav.open{visibility:visible;opacity:1;transform:none;pointer-events:auto}
 .header nav a:after{bottom:10px;right:auto;width:35px}
 .header nav.open a{animation:detail-arrive .35s var(--ease-out) both}
 .header nav.open a:nth-child(2){animation-delay:.035s}.header nav.open a:nth-child(3){animation-delay:.07s}.header nav.open a:nth-child(4){animation-delay:.105s}
 .service-panel{min-height:320px}.hero-line{animation-duration:.7s}
}
@media(prefers-reduced-motion:reduce){
 *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .hero-line,.hero-visual.intro,.will-reveal{opacity:1;transform:none}
}