/* Motion layer (2026-10-15) — fade-ins, hovers and the hero entrance, on every page. Loaded by the td-mikeymachvac
   plugin with motion.js. Looks only: no text, links or tags change. Everything here is opacity and transform, so nothing
   shifts the layout. The hidden "before" states sit under html.td-m, a class the plugin adds in <head> only when the
   visitor has not asked for reduced motion. If motion.js never arrives, that class comes off after 3 s and the page
   shows as it always did. */

:root { --td-ease: cubic-bezier(.22, .8, .24, 1); --td-ease-back: cubic-bezier(.34, 1.4, .5, 1); --td-red: #c8262e; --td-blue: #3a9ad9; --td-navy: #1b2f6b; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

/* ---------- scroll progress bar + header on scroll ---------- */
.td-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 100001; pointer-events: none; transform-origin: 0 50%; transform: scaleX(var(--td-p, 0)); background: linear-gradient(90deg, var(--td-red) 0 50%, var(--td-blue) 50% 100%); }
.fusion-tb-header .td-header { transition: box-shadow .35s var(--td-ease), background-color .35s; }
body.td-scrolled .fusion-tb-header .td-header, body.td-scrolled .fusion-sticky-container .td-header { box-shadow: 0 10px 30px -12px rgba(14,26,61,.28); }

/* ---------- reveal on scroll ---------- */
html.td-m [data-tdr] { opacity: 0; transition: opacity .8s var(--td-ease), transform .9s var(--td-ease), clip-path 1.1s var(--td-ease), filter .9s var(--td-ease); transition-delay: var(--td-d, 0s); will-change: opacity, transform; }
html.td-m [data-tdr="up"] { transform: translate3d(0, 34px, 0); }
html.td-m [data-tdr="up-sm"] { transform: translate3d(0, 16px, 0); }
html.td-m [data-tdr="left"] { transform: translate3d(-40px, 0, 0); }
html.td-m [data-tdr="right"] { transform: translate3d(40px, 0, 0); }
html.td-m [data-tdr="zoom"] { transform: scale(.94); }
html.td-m [data-tdr="pop"] { transform: translate3d(0, 22px, 0) scale(.96); transition-timing-function: var(--td-ease), var(--td-ease-back); }
html.td-m [data-tdr="wipe"] { opacity: 1; clip-path: inset(0 100% 0 0); }
html.td-m [data-tdr="wipe-r"] { opacity: 1; clip-path: inset(0 0 0 100%); }
html.td-m [data-tdr="wipe-up"] { opacity: 1; clip-path: inset(100% 0 0 0); }
html.td-m [data-tdr="blur"] { transform: translate3d(0, 20px, 0); filter: blur(8px); }
html.td-m [data-tdr].is-in { opacity: 1; transform: none; clip-path: inset(-60px -60px -60px -60px); filter: none; }
html.td-m [data-tdr].is-done { will-change: auto; }

/* photo frames: the frame wipes open, the picture inside settles from a slight zoom */
html.td-m .td-photo[data-tdr] img { transform: scale(1.14); transition: transform 1.6s var(--td-ease); transition-delay: var(--td-d, 0s); }
html.td-m .td-photo[data-tdr].is-in img { transform: scale(1); }

/* section headings: a red/blue rule draws in under the kicker line */
.td-kick p, .td-kick { position: relative; }
html.td-m .td-kick[data-tdr]::after { content: ''; position: absolute; left: 0; bottom: -6px; width: 46px; height: 3px; background: linear-gradient(90deg, var(--td-red) 0 50%, var(--td-blue) 50% 100%); transform: scaleX(0); transform-origin: 0 50%; transition: transform .9s var(--td-ease) .25s; }
html.td-m .td-kick[data-tdr].is-in::after { transform: scaleX(1); }

/* ---------- homepage hero ---------- */
.td-hero { overflow: hidden; isolation: isolate; }
/* a copy of the photo behind the navy fade: it settles in from a slow zoom, then drifts with the scroll */
.td-hero::after { content: ''; position: absolute; inset: -6% 0; z-index: -1; background: inherit; background-attachment: scroll; pointer-events: none; translate: 0 var(--td-hy, 0px); }
html.td-m .td-hero.lazyloaded::after { animation: td-kenburns 2.8s var(--td-ease) both; }
@keyframes td-kenburns { from { scale: 1.12; } to { scale: 1; } }
/* on a phone the photo is pinned to a band at the top (home.css), so the copy sits exactly on it and does not drift */
@media (max-width: 640px) { .td-hero::after { inset: 0; translate: none; } }
/* the navy fade sweeps in from the left */
html.td-m .td-hero::before { animation: td-fade-in 1.2s var(--td-ease) both; }
@keyframes td-fade-in { from { opacity: .55; } to { opacity: 1; } }

/* the words come in one after another (short delays: the headline is what the visitor reads first) */
html.td-m .td-hero-kick .td-tag { display: inline-block; animation: td-tag-in .6s var(--td-ease-back) both; }
html.td-m .td-hero-kick .td-tag:nth-child(1) { animation-delay: .05s; }
html.td-m .td-hero-kick .td-tag:nth-child(2) { animation-delay: .13s; }
html.td-m .td-hero-kick .td-tag:nth-child(3) { animation-delay: .21s; }
@keyframes td-tag-in { from { opacity: .001; transform: translate3d(-18px, 0, 0) scale(.9); } to { opacity: 1; transform: none; } }
html.td-m .td-hero .td-hero-h, html.td-m .td-hero h1 { animation: td-rise-blur .95s var(--td-ease) .12s both; }
html.td-m .td-hero-lead { animation: td-rise .85s var(--td-ease) .3s both; }
html.td-m .td-hero-num { animation: td-rise .85s var(--td-ease) .42s both; }
html.td-m .td-hero .fusion-button { animation: td-rise .8s var(--td-ease) .54s both; }
html.td-m .td-hero .fusion-button + .fusion-button, html.td-m .td-hero .fusion-button-wrapper + .fusion-button-wrapper .fusion-button { animation-delay: .62s; }
html.td-m .td-hero-tag { animation: td-slide-in .9s var(--td-ease) .78s both; }
@keyframes td-rise { from { opacity: .001; transform: translate3d(0, 26px, 0); } to { opacity: 1; transform: none; } }
@keyframes td-rise-blur { from { opacity: .001; transform: translate3d(0, 34px, 0); filter: blur(10px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes td-slide-in { from { opacity: .001; transform: translate3d(-24px, 0, 0); } to { opacity: 1; transform: none; } }

/* the big number: a soft glow breathes behind it, and it lifts on hover */
.td-hero-num a, .td-aside-num a { display: inline-block; transition: transform .35s var(--td-ease), text-shadow .35s; }
.td-hero-num a:hover, .td-aside-num a:hover { transform: translate3d(0, -2px, 0); text-shadow: 0 0 28px rgba(143,208,255,.55); }
html.td-m .td-hero-num a { animation: td-glow 3.6s ease-in-out 1.6s infinite; }
@keyframes td-glow { 0%, 100% { text-shadow: 0 0 0 rgba(143,208,255,0); } 50% { text-shadow: 0 0 26px rgba(143,208,255,.45); } }

/* ---------- inner-page heroes ---------- */
html.td-m .td-page-hero .td-rail::before { animation: td-rail 1.1s var(--td-ease) .05s both; transform-origin: 50% 0; }
@keyframes td-rail { from { transform: scaleY(0); } to { transform: scaleY(1); } }
html.td-m .td-page-hero .td-kick, html.td-m .td-page-hero .td-landing-kick { animation: td-slide-in .7s var(--td-ease) .1s both; }
html.td-m .td-page-hero .td-page-h1 { animation: td-rise-blur .95s var(--td-ease) .18s both; }
html.td-m .td-page-hero .td-lead { animation: td-rise .85s var(--td-ease) .34s both; }
html.td-m .td-page-hero .fusion-button { animation: td-rise .8s var(--td-ease) .46s both; }
html.td-m .td-page-hero .td-landing-kick .td-tag { animation: td-tag-in .6s var(--td-ease-back) .12s both; }

/* ---------- buttons: lift, deeper shadow, a light sweep across ---------- */
.fusion-button { position: relative; overflow: hidden; transform: translateZ(0); transition: transform .3s var(--td-ease), box-shadow .3s var(--td-ease), background-color .25s, color .25s, border-color .25s !important; }
.fusion-button::after { content: ''; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.35) 50%, rgba(255,255,255,0) 100%); transform: skewX(-20deg) translateX(0); pointer-events: none; opacity: 0; }
.fusion-button:hover { transform: translate3d(0, -3px, 0); box-shadow: 0 14px 28px -10px rgba(14,26,61,.45); }
.fusion-button:hover::after { opacity: 1; animation: td-sheen .75s var(--td-ease); }
.fusion-button:active { transform: translate3d(0, -1px, 0) scale(.98); transition-duration: .1s; }
@keyframes td-sheen { from { left: -60%; } to { left: 130%; } }
.fusion-button .fusion-button-icon-divider, .fusion-button i { transition: transform .3s var(--td-ease); }
.fusion-button:hover i { transform: translateX(3px); }
.td-form .gform_wrapper .gform_button, .td-form-light .gform_wrapper .gform_button { transition: transform .3s var(--td-ease), box-shadow .3s var(--td-ease), background-color .25s !important; }
.td-form .gform_wrapper .gform_button:hover, .td-form-light .gform_wrapper .gform_button:hover { transform: translate3d(0, -3px, 0); box-shadow: 0 14px 28px -10px rgba(200,38,46,.6); }

/* ---------- header: menu underline, wordmark and phone ---------- */
.td-header .awb-menu__main-a .menu-text { position: relative; }
.td-header .awb-menu__main-a .menu-text::after { content: ''; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px; background: linear-gradient(90deg, var(--td-red) 0 50%, var(--td-blue) 50% 100%); transform: scaleX(0); transform-origin: 100% 50%; transition: transform .4s var(--td-ease); }
.td-header .awb-menu__main-a:hover .menu-text::after, .td-header .current-menu-item > .awb-menu__main-a .menu-text::after { transform: scaleX(1); transform-origin: 0 50%; }
.td-brand { transition: transform .4s var(--td-ease); }
.td-brand:hover { transform: translate3d(0, -1px, 0) scale(1.02); }
.td-phone a { transition: transform .3s var(--td-ease), color .25s, box-shadow .3s; }
.td-phone a:hover { transform: translate3d(0, -2px, 0); }
.awb-menu__sub-ul { transition: opacity .25s var(--td-ease), transform .3s var(--td-ease) !important; }
.awb-menu__sub-a { transition: padding-left .25s var(--td-ease), color .2s, background-color .2s !important; }
.awb-menu__sub-a:hover { padding-left: calc(var(--awb-submenu-items-padding-left, 20px) + 6px) !important; }
/* the phone strip on phones: a slow shimmer so the call action reads as live */
@media (max-width: 640px) {
  .td-strip { position: relative; overflow: hidden; }
  html.td-m .td-strip::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(255,255,255,.18) 50%, transparent 70%); background-size: 250% 100%; animation: td-strip 4.5s ease-in-out 1.5s infinite; pointer-events: none; }
  @keyframes td-strip { 0% { background-position: 150% 0; } 45%, 100% { background-position: -50% 0; } }
}

/* ---------- tags ---------- */
.td-tag { transition: transform .25s var(--td-ease), opacity .2s, box-shadow .25s; }
a.td-tag:hover { opacity: 1; transform: translate3d(0, -2px, 0); box-shadow: 0 6px 14px -6px rgba(14,26,61,.5); }

/* ---------- "what happens when you call" ---------- */
.td-step { position: relative; transition: background-color .35s, transform .35s var(--td-ease); }
.td-step::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--td-blue); transform: scaleX(0); transform-origin: 0 50%; transition: transform .45s var(--td-ease); }
.td-step:nth-child(odd)::after { background: var(--td-red); }
.td-step:hover { background-color: #f6f8fb; }
.td-step:hover::after { transform: scaleX(1); }
.td-step__n { display: inline-block; transition: transform .45s var(--td-ease-back); }
.td-step:hover .td-step__n { transform: translate3d(0, -4px, 0) scale(1.12); }

/* ---------- service cards ---------- */
.td-card { overflow: hidden; transition: box-shadow .45s var(--td-ease), transform .45s var(--td-ease) !important; }
.td-card:hover { transform: translate3d(0, -8px, 0); box-shadow: 0 26px 50px -18px rgba(27,47,107,.32); }
.td-card img { transition: transform 1.1s var(--td-ease), filter .6s; }
.td-card:hover img { transform: scale(1.07); filter: saturate(1.08) contrast(1.03); }
.td-card__more { display: inline-block; transition: transform .35s var(--td-ease), color .25s; }
.td-card:hover .td-card__more { transform: translateX(6px); }
.td-card h3 { transition: color .25s; }

/* ---------- photo frames, promises, licence badge ---------- */
.td-photo { overflow: hidden; }
.td-photo img { transition: transform 1.2s var(--td-ease); }
.td-photo:hover img { transform: scale(1.045); }
.td-promises li::before { transition: transform .6s var(--td-ease-back); }
.td-promises li:hover::before { transform: rotate(180deg) scale(1.15); }
.td-lic { transition: transform .35s var(--td-ease), box-shadow .35s; }
.td-lic:hover { transform: translate3d(0, -2px, 0); box-shadow: 0 10px 24px -12px rgba(0,0,0,.4); }

/* ---------- emergency band: the number pulses like a call coming in ---------- */
.td-emerg-num a { position: relative; transition: transform .35s var(--td-ease), box-shadow .35s; }
.td-emerg-num a:hover { transform: translate3d(0, -3px, 0) scale(1.02); box-shadow: 0 18px 36px -14px rgba(0,0,0,.5); }
html.td-m .td-emerg-num a::after { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 0 rgba(255,255,255,.55); animation: td-ring 2.6s var(--td-ease) infinite; pointer-events: none; }
@keyframes td-ring { 0% { box-shadow: 0 0 0 0 rgba(255,255,255,.5); } 70%, 100% { box-shadow: 0 0 0 18px rgba(255,255,255,0); } }

/* ---------- links: towns, related pages, footer, articles ---------- */
.td-towns--simple li a, .td-related li a, .td-sitemap li a { transition: color .25s, transform .3s var(--td-ease); }
.td-towns--simple li a:hover, .td-related li a:hover, .td-sitemap li a:hover { transform: translateX(5px); }
.td-towns li { transition: background-color .3s, padding .3s var(--td-ease); }
.td-towns--grid li:hover { background-color: #f6f8fb; padding-left: 10px; padding-right: 10px; }
.td-footer .fusion-text p a { display: inline-block; transition: color .25s, transform .3s var(--td-ease); }
.td-footer .fusion-text p a:hover { transform: translateX(4px); }
.td-article a { transition: text-decoration-color .3s, color .25s; }
.td-article a:hover { text-decoration-color: currentColor; }
.td-svc .td-townlinks a { transition: color .25s, border-color .25s; }
.td-svc .td-townlinks a:hover { border-color: var(--td-red); }

/* ---------- forms: fields glow softly on focus ---------- */
.td-form .gform_wrapper .ginput_container input, .td-form .gform_wrapper .ginput_container textarea, .td-form .gform_wrapper .ginput_container select,
.td-form-light .gform_wrapper .ginput_container input, .td-form-light .gform_wrapper .ginput_container textarea, .td-form-light .gform_wrapper .ginput_container select { transition: box-shadow .3s var(--td-ease), border-color .3s, background-color .3s !important; }
.td-form .gform_wrapper .ginput_container input:focus, .td-form .gform_wrapper .ginput_container textarea:focus, .td-form .gform_wrapper .ginput_container select:focus { box-shadow: 0 0 0 5px rgba(143,208,255,.22) !important; }
.td-form-light .gform_wrapper .ginput_container input:focus, .td-form-light .gform_wrapper .ginput_container textarea:focus, .td-form-light .gform_wrapper .ginput_container select:focus { box-shadow: 0 0 0 5px rgba(27,47,107,.12) !important; background-color: #fff !important; }

/* ---------- map, contact strip, aside ---------- */
.td-map iframe { transition: box-shadow .4s var(--td-ease), transform .4s var(--td-ease); }
.td-map iframe:hover { box-shadow: 0 22px 44px -20px rgba(27,47,107,.4); }
.td-way { transition: transform .35s var(--td-ease); }
.td-way:hover { transform: translate3d(0, -4px, 0); }

/* ---------- motion off: anyone who asked their device for less motion gets the still site ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .td-hero::after { translate: none !important; }
  .td-progress { display: none; }
}

/* ---------- the chat (Athena agent) in the site's type, with Mike's photo ---------- */
#athena-agent, #athena-agent button, #athena-agent input, #athena-agent textarea { font-family: Barlow, Arial, sans-serif; }
#athena-agent .aa-title, #athena-agent [class*="title"], #athena-agent [class*="launcher"] strong { font-family: 'Barlow Condensed', Impact, sans-serif; letter-spacing: .03em; }
#athena-agent img[class*="avatar"], #athena-agent [class*="avatar"] img { object-fit: cover; object-position: 50% 30%; }