/* ErieWeb's original orange, recovered from the pre-accessibility baseline. */
:root{--orange:#ff6900;--motion-ease:cubic-bezier(.22,.7,.3,1)}
/* .button and .button:hover were removed from this group deliberately. The rule is color:!important,
   so it beat style.css's `.button{background:#ff6900;color:#fff}` everywhere micro-motion loads -
   dark text on an orange button, site-wide. The background here is the same orange, so dropping the
   two selectors changes only the text colour and restores the intended white.
   The remaining selectors keep the dark-on-orange treatment on purpose; .care-extra .button is
   styled nowhere else, so it would lose its background entirely if removed too. */
.package-premium .package-choose,.package-card.featured .package-choose,.package-card.premium .package-choose,.module-add,.module-demo .dates button.active,.module-demo .times button.active,.map-pin,.care-extra .button{background:var(--orange);color:#202b34!important}
header nav a[aria-current],.module-icon,.faq summary span{color:#202b34;text-decoration-color:var(--orange)}
.care-more summary{cursor:pointer;padding:12px 0;min-height:44px;text-decoration:underline;text-underline-offset:4px}
.button,.package-choose,.text-link span,.button span,.care-tag i{transition:transform 180ms var(--motion-ease)}
.button:active,.package-choose:active{transform:translateY(1px)}
input,textarea,select{transition:border-color 180ms,outline-color 180ms}
input:focus-visible,textarea:focus-visible,select:focus-visible{outline-color:var(--orange)}
.footer-links a{text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px;transition:text-decoration-color 180ms}
.footer-links a:focus-visible{ text-decoration-color:var(--orange)}
.faq summary span{display:inline-block;transition:rotate 220ms var(--motion-ease)}
.faq details[open]>summary span{rotate:45deg}
.module-tabs>button[aria-selected=true]{box-shadow:inset 3px 0 0 var(--orange),0 5px 16px #202b3408}
.package-premium .package-choose span,.hero .text-link span{display:inline-block}
/* Hover uses the individual translate/scale/rotate properties so it never fights scroll transforms. */
@media(hover:hover) and (pointer:fine){
 .button:hover,.package-choose:hover{transform:translateY(-2px)}
 .button:hover{box-shadow:0 12px 26px #202b3422}
 /* .care-tag was removed from this group: it is a plain <div> holding a decorative arrow and a
   phrase ("Your address. Handled."), with no link, button or handler - so its arrow used to nudge
   on hover exactly like the two real controls it was grouped with. The .button and .text-link
   halves stay: both are always genuine anchors/buttons. */
.button:hover span,.text-link:hover span{transform:translate(3px,-1px)}
 .care-grid .care-card,.package-card{transition:transform 200ms var(--motion-ease),border-color 200ms}
 .module-tabs>button{transition:transform 200ms var(--motion-ease),border-color 200ms,translate 200ms var(--motion-ease),background-color 200ms}
 /* .care-card was removed from this group: its only link is inside the collapsed <details>, so the
   card body is not clickable. .package-card stays - it IS clickable (script.js routes it to the
   planner with its package id), so its lift is honest. */
.package-card:hover{transform:translateY(-3px);border-color:var(--orange);box-shadow:none}
 .footer-links a:hover{text-decoration-color:var(--orange)}
 #possibilities .feature,.hosting-benefits article,.managed-grid>article:not(.care-card),.partner-card,.contact-detail,.hosting-server{transition:translate 220ms var(--motion-ease),box-shadow 220ms}
 /* REMOVED for the same reason: only one of the six #possibilities features carries a .round-link,
   and .partner-card is not a link - it merely contains one (.partner-logo). Both lifted like
   buttons. The .round-link and the partner logo keep their own hover feedback. */
 /* REMOVED: .hosting-benefits article, .managed-grid>article:not(.care-card), .contact-detail
   all used to lift 4px on hover. None of them is clickable - the hosting/domain/support blocks and
   the Our Approach value blocks contain no link or button at all, and the contact blocks only
   contain a link, they are not one. A card that lifts like a button and does nothing when clicked
   is a broken promise, so the lift is gone. Their entrance animation is untouched.
   Genuinely interactive things keep their hover: see .button, .package-choose, .package-card,
   .module-tabs>button, .faq summary, .template-arrow, .round-link below. */
 /* REMOVED: .hosting-server is decorative artwork, not a control. */
 .faq summary{transition:translate 200ms var(--motion-ease)}
 .module-tabs>button:hover,.faq summary:hover{translate:4px 0}
 #possibilities .chips span{transition:translate 180ms var(--motion-ease)}
 /* REMOVED: #possibilities .chips span are plain labels ("Galleries", "Bookings", "Contact forms",
   "Menus") with no link, button or handler. They lifted like chips you could press. */
 #possibilities .palette-controls button{transition:scale 180ms var(--motion-ease)}
 #possibilities .palette-controls button:hover{scale:1.12}
 .template-arrow{transition:scale 180ms var(--motion-ease)}
 .template-arrow:hover{scale:1.08}
 .round-link{transition:rotate 260ms var(--motion-ease)}
 .round-link:hover{rotate:45deg}
}
/* Touch screens have no hover, so tappable cards and controls give a small press instead. */
@media(hover:none){
 #possibilities .feature,.care-grid .care-card,.package-card,.hosting-benefits article,.managed-grid>article,.partner-card,.module-tabs>button,.faq summary,.contact-detail{transition:scale 160ms var(--motion-ease)}
 .package-card:active,.module-tabs>button:active,.faq summary:active,a.contact-detail:active,button.contact-detail:active{scale:.98}
}
/* Illustrations only move while on screen and in a foreground tab. No permanent layer promotion. */
.ew-a{animation-play-state:paused}
.ew-art.ew-visible .ew-a,.ew-art.ew-visible.ew-a{animation-play-state:running}
html.ew-background .ew-a{animation-play-state:paused!important}
.ew-globe{transform-box:fill-box;transform-origin:center;animation:ew-globe 7s linear infinite}
.ew-twinkle{transform-box:fill-box;transform-origin:center;animation:ew-twinkle 2.8s ease-in-out infinite}
.ew-online{animation:ew-online 1.6s ease-in-out infinite}
.ew-led{animation:ew-led 1.9s steps(1,end) infinite}
.ew-led-1{animation-duration:2.7s;animation-delay:-.9s}
.ew-led-2{animation-duration:1.3s;animation-delay:-.4s}
.hosting-server:nth-child(3) .ew-a{animation-delay:-.8s}
.hosting-server:nth-child(4) .ew-a{animation-delay:-1.6s}
.ew-flow{animation:ew-flow 1.1s linear infinite}
.ew-activity{animation:ew-activity 2.4s ease-in-out infinite}
.ew-wave{animation:ew-wave 3.2s ease-in-out infinite alternate}
.ew-dot{transform-box:fill-box;transform-origin:center;animation:ew-typing 1.3s ease-in-out infinite}
.ew-dot-1{animation-delay:.16s}.ew-dot-2{animation-delay:.32s}
.ew-write{transform-box:fill-box;transform-origin:left center;animation:ew-write 4.6s var(--motion-ease) infinite}
.ew-float{animation:ew-float 4s ease-in-out infinite alternate}
.ew-bob{animation:ew-bob 3.6s ease-in-out infinite alternate}
.ew-sway{animation:ew-sway 8s ease-in-out infinite alternate}
.ew-wobble{animation:ew-wobble 4.2s ease-in-out infinite alternate}
.ew-ping{animation:ew-ping 2.2s ease-out infinite}
.ew-nudge{animation:ew-nudge 1.8s ease-in-out infinite alternate}
.ew-arrow{animation:ew-arrow 1.2s ease-in-out infinite alternate}
.ew-data{animation:ew-data .9s linear infinite}
.palette-controls.ew-art.ew-visible [aria-pressed=true]{animation:ew-ring 2.4s ease-out infinite}
.module-demo.ew-art.ew-visible .map-pin{animation:ew-ping 2.2s ease-out infinite}
html.ew-background .palette-controls [aria-pressed=true],html.ew-background .map-pin{animation-play-state:paused!important}
@keyframes ew-globe{0%{transform:scaleX(1)}25%{transform:scaleX(.06)}50%{transform:scaleX(-1)}75%{transform:scaleX(-.06)}100%{transform:scaleX(1)}}
@keyframes ew-twinkle{0%,100%{transform:scale(.7) rotate(0deg);opacity:.55}50%{transform:scale(1.15) rotate(90deg);opacity:1}}
@keyframes ew-online{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes ew-led{0%,31%,38%,72%,100%{opacity:1}8%,34%,55%,76%{opacity:.25}}
@keyframes ew-flow{to{stroke-dashoffset:-18}}
@keyframes ew-activity{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes ew-wave{from{translate:-7px 0}to{translate:7px 0}}
@keyframes ew-typing{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-6px);opacity:1}}
@keyframes ew-write{0%{transform:scaleX(0);opacity:1}35%,78%{transform:scaleX(1);opacity:1}90%,100%{transform:scaleX(1);opacity:0}}
@keyframes ew-float{from{translate:0 0}to{translate:0 -6px}}
@keyframes ew-bob{from{translate:0 0}to{translate:0 -10px}}
@keyframes ew-sway{from{rotate:0deg}to{rotate:5deg}}
@keyframes ew-wobble{from{rotate:-7deg;scale:1}to{rotate:7deg;scale:1.05}}
@keyframes ew-ping{0%{box-shadow:0 0 0 0 #ff690073}100%{box-shadow:0 0 0 14px #ff690000}}
@keyframes ew-nudge{from{translate:0 0}to{translate:3px -3px}}
@keyframes ew-arrow{from{translate:0 0}to{translate:0 4px}}
@keyframes ew-data{to{background-position:-16px 0}}
@keyframes ew-ring{0%{box-shadow:0 0 0 2px var(--card-ink),0 0 0 2px #ff690066}100%{box-shadow:0 0 0 2px var(--card-ink),0 0 0 13px #ff690000}}
/* Entrances for content already on screen at load; scroll-linked motion is applied inline by JS. */
.ew-intro{animation:ew-intro 780ms var(--motion-ease) both;animation-delay:var(--ew-delay,0ms)}
@keyframes ew-intro{from{opacity:0;translate:var(--ew-ix,0px) var(--ew-iy,0px)}to{opacity:1;translate:0 0}}
.module-demo> :not(.module-demo-top){animation:ew-module 220ms ease-out}
@keyframes ew-module{from{opacity:.7;transform:translateY(3px)}to{opacity:1;transform:none}}
.motion-paused .ew-a,.motion-paused .ew-intro,.motion-paused .palette-controls [aria-pressed=true],.motion-paused .map-pin{animation:none!important}
.motion-paused [data-ew]{opacity:1!important}
@media(prefers-reduced-motion:reduce){.ew-a,.ew-intro,.module-demo>*,.palette-controls [aria-pressed=true],.map-pin{animation:none!important}[data-ew]{opacity:1!important}*,*::before,*::after{transition:none!important}}
.motion-paused .care-grid .care-card{opacity:1!important;transform:none!important;pointer-events:auto!important}
@media(prefers-reduced-motion:reduce){.care-grid .care-card{opacity:1!important;transform:none!important;pointer-events:auto!important}}
