/* Finite fitting-line entrance; service and enquiry feedback. */
:root{--ease:cubic-bezier(.16,1,.3,1)}
html{scroll-padding-top:88px;scrollbar-color:#416260 #e9edec}
::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#e9edec}::-webkit-scrollbar-thumb{background:#416260;border:2px solid #e9edec;border-radius:6px}
a{text-underline-offset:4px}input,textarea{caret-color:var(--emerald)}
.demo-note{padding:8px 24px;text-align:center;font-size:12px;color:var(--mut);border-bottom:1px solid var(--line)}.demo-note a{color:var(--petrol);font-weight:600}
.site-header{background:var(--petrol);backdrop-filter:none}
.site-header:after{content:'';position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--yellow);transform:scaleX(var(--read,0));transform-origin:left}
#navigation a[aria-current=location]{color:var(--yellow)}#navigation .book-link[aria-current=location]{color:#211a01}
.hero-panel{position:relative}.hero-panel:before{content:'';width:70px;height:4px;background:var(--yellow);margin-bottom:25px;transform-origin:left;animation:fit-line .75s var(--ease) both}
.hero-panel h1{animation:fit-copy .7s var(--ease) both}.hero-lede{animation:fit-copy .7s .09s var(--ease) both}.hero-actions{animation:fit-copy .7s .18s var(--ease) both}
.hero-photo{overflow:hidden}.hero-photo img{animation:fit-photo 1s var(--ease) both}
@keyframes fit-line{from{transform:scaleX(.05)}to{transform:scaleX(1)}}
@keyframes fit-copy{from{opacity:.25;transform:translateX(16px);filter:blur(2px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes fit-photo{from{clip-path:inset(0 12% 0 0);transform:scale(1.025)}to{clip-path:inset(0);transform:scale(1)}}
.button,.choose,.menu-toggle,.reset-request{transition:background .2s,color .2s,box-shadow .2s,transform .25s var(--ease)}
.button:hover,.choose:hover{transform:translateY(-2px);box-shadow:0 7px 18px -9px #071c25}.button:active,.choose:active{transform:translateY(0)}
.choose{background:var(--yellow);color:#211a01}.choose:hover{background:#ffd83e}.choose svg{fill:none;stroke:currentColor;stroke-width:1.8;transition:transform .25s var(--ease)}.choose:hover svg{transform:translateX(4px)}
.service-row summary,.faq-list summary{transition:background .2s}.service-row[open] summary{background:var(--grey)}
.service-row[open] .sr-body,.faq-list details[open] .faq-body{animation:detail-in .3s var(--ease)}
@keyframes detail-in{from{opacity:.35;transform:translateY(-6px);clip-path:inset(0 0 20%)}to{opacity:1;transform:none;clip-path:inset(0)}}
.service-image{overflow:hidden}#panel-image{transition:filter .3s}.service-panel.is-changing #panel-image{animation:panel-in .4s var(--ease)}
@keyframes panel-in{from{opacity:.25;transform:scale(1.035)}to{opacity:1;transform:scale(1)}}
.work-item{overflow:hidden}.work-item img{transition:transform .7s var(--ease),filter .4s;transform-origin:var(--photo-x,50%) var(--photo-y,50%)}
@media(hover:hover) and (pointer:fine){.work-item:hover img{transform:scale(1.035);filter:saturate(1.08)}}
.work-item figcaption{position:relative;z-index:1}
.steps li{transition:opacity .35s}.steps li.is-current .step-no{background:var(--yellow);color:var(--petrol)}.step-no{transition:background .3s,color .3s}
.sample-preview:not([hidden]){animation:detail-in .3s var(--ease);overflow-wrap:anywhere}
.reset-request{display:block;margin:12px auto 0;padding:10px 18px;border:0;background:transparent;color:var(--petrol);text-decoration:underline;font:inherit;font-size:14px;cursor:pointer}
button:disabled{opacity:.55;cursor:not-allowed;transform:none}.note-count{font-size:12px;color:var(--mut);text-align:right;margin-top:6px}
input,select,textarea{font-size:16px}::placeholder{color:#526460;opacity:1}
:focus-visible{outline:3px solid #977100;outline-offset:4px}.hero :focus-visible,.site-header :focus-visible,.how :focus-visible,.site-footer :focus-visible,.service-panel :focus-visible{outline-color:#f5c518}
@media(max-width:920px){.hero-panel{padding:36px 32px 40px}.wrap{padding-inline:32px}.hero-panel:before{margin-bottom:20px}.hero-points{gap:10px;margin-top:28px;padding-top:20px}.hero-points>div{display:grid;grid-template-columns:115px 1fr;gap:10px}.hero-points dd{font-size:13px}.hero-points dt{font-size:13px}.demo-note{padding:8px 24px;font-size:11px}.hero-photo img{height:300px}.bar{gap:10px}.wordmark{font-size:19px;gap:7px}.wordmark svg{width:26px}.menu-toggle{padding:9px 12px}.sr-no{display:none}.service-row summary{padding:18px}.hero-actions .button{padding:14px 22px}}
@media(max-width:360px){.wordmark{font-size:17px}.hero-panel{padding-inline:28px}.wrap{padding-inline:28px}h1{font-size:32px}.hero-points>div{grid-template-columns:100px 1fr}.bar{padding-inline:20px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.work-item:hover img{transform:none;filter:none}}
