/* The smile is the focal entrance; the rest supports exploration and contact. */
.header{transition:box-shadow .35s var(--ease),background .35s var(--ease)}
.header.is-scrolled{background:#fff;box-shadow:0 7px 24px #2429460b}
.header::after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--green);transform:scaleX(var(--scroll-progress,0));transform-origin:left;pointer-events:none}
nav .nav-link.is-current{color:var(--green)}
nav .nav-link.is-current::after{transform:scaleX(1)}
.hero h1 span{position:relative;display:inline-block}
.hero h1 span::after{content:"";position:absolute;left:3%;right:1%;bottom:-.045em;height:.055em;border-radius:50%;background:#82a66a;transform:rotate(-3deg);transform-origin:left}
.button{position:relative;isolation:isolate;overflow:hidden;transition:background .25s,transform .4s var(--ease),box-shadow .4s var(--ease)}
.button::after{content:"";position:absolute;inset:-50% -25%;background:linear-gradient(110deg,transparent 35%,#ffffff20 50%,transparent 65%);transform:translateX(-115%);pointer-events:none;z-index:-1}
.button:active{transform:translateY(0) scale(.98)}
.text-link{transition:color .2s,text-decoration-color .3s,text-underline-offset .3s var(--ease)}
.text-link:hover{text-decoration-color:currentColor;text-underline-offset:10px}
.service{transition:border-color .4s}
.service>svg{transition:transform .6s var(--ease),color .3s;transform-origin:50% 70%}
.quick-grid>a svg{transition:transform .45s var(--ease)}
.appointment-form{transition:box-shadow .4s,background .4s}
.appointment-form:focus-within{background:#eff5e9;box-shadow:0 12px 40px #3035620b}
input,select{transition:border-color .2s,box-shadow .2s,background .2s}
input:focus,select:focus{border-color:var(--green);box-shadow:0 0 0 3px #487f3112}
.faq-items details{transition:border-color .3s}
.faq-items details[open]{border-color:#9cb78a}
.faq-items summary{transition:color .2s}
.faq-items summary:hover{color:var(--green)}
.map-choice{transition:background .25s,color .25s,border-color .25s}
.menu-lines,.menu-lines::after{transition:transform .3s var(--ease),border-color .3s}
.menu-toggle[aria-expanded="true"] .menu-lines{transform:rotate(45deg);height:0;border-bottom:0}
.menu-toggle[aria-expanded="true"] .menu-lines::after{top:-1px;transform:rotate(90deg)}
@media(hover:hover) and (pointer:fine){
  .button:hover{box-shadow:0 8px 20px #30356215}
  .button:hover::after{transform:translateX(115%);transition:transform .75s var(--ease)}
  .service:hover{border-color:var(--green)}
  .service:hover>svg{transform:translateY(-4px) rotate(-7deg);color:var(--green-dark)}
  .quick-grid>a:hover svg{transform:translateY(-3px) rotate(-6deg)}
  .brand-feature:hover img{transform:rotate(-8deg) scale(1.075);filter:drop-shadow(0 9px 7px #30356218)}
}
@media(max-width:850px){nav.is-open{animation:menu-reveal .3s var(--ease)}}
@keyframes menu-reveal{from{opacity:.25;clip-path:inset(0 0 100% 0);transform:translateY(-8px)}to{opacity:1;clip-path:inset(0);transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .button::after{display:none}
  .button:active,.service:hover>svg,.quick-grid>a:hover svg,.brand-feature:hover img{transform:none}
  nav.is-open{animation:none}
  .header::after{display:none}
}
