/* Shared motion layer; loaded after page-specific styles. */
:root { --motion-ease: cubic-bezier(.22,1,.36,1); --motion-fast: 200ms; }
.button, .nav-cta, .mobile-contact, .review-controls button, .intro-social a,
.button:hover, .nav-cta:hover, .mobile-contact:hover, .intro-social a:hover,
.review-controls button:not(:disabled):hover,
.button:active, .nav-cta:active, .mobile-contact:active, .review-controls button:not(:disabled):active { translate: none; }
.button, .nav-cta, .mobile-contact, .review-controls button {
  transition: background-color 200ms ease, color 200ms ease, border-color 200ms ease, opacity 120ms ease;
}
.button:active, .nav-cta:active, .mobile-contact:active { opacity: .8; }
.button:focus-visible .cta-icon, .nav-cta:focus-visible .cta-icon { transform: translateX(3px); }
#navigation > a:not(.nav-cta) { position: relative; text-decoration: none; }
#navigation > a:not(.nav-cta)::after {
  content: ''; position: absolute; bottom: -7px; left: 0; width: 100%; height: 1px;
  background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform 200ms var(--motion-ease);
}
#navigation > a[aria-current]:not(.nav-cta)::after,
#navigation > a:focus-visible:not(.nav-cta)::after { transform: scaleX(1); }
#navigation > a[aria-current] { color: var(--accent); }
.menu-icon { display: inline-block; position: relative; width: 18px; height: 18px; vertical-align: middle; }
.menu-icon::before, .menu-icon::after {
  content: ''; position: absolute; left: 1px; top: 8px; width: 16px; height: 1px;
  background: currentColor; transition: transform 220ms var(--motion-ease);
}
.menu-icon::before { transform: translateY(-3px); }
.menu-icon::after { transform: translateY(3px); }
[aria-expanded="true"] .menu-icon::before { transform: rotate(45deg); }
[aria-expanded="true"] .menu-icon::after { transform: rotate(-45deg); }
@media (max-width:760px) {
  .motion-menu .header #navigation {
    display: flex; flex-direction: column; visibility: hidden; opacity: 0; transform: translateY(-6px); pointer-events: none;
    transition: opacity 220ms ease, transform 220ms var(--motion-ease), visibility 0s linear 220ms;
    max-height: calc(100dvh - 90px); overflow-y: auto;
  }
  .motion-menu .header #navigation.is-open {
    visibility: visible; opacity: 1; transform: none; pointer-events: auto; animation: none;
    transition-delay: 0s;
  }
  #navigation > a:not(.nav-cta)::after { bottom: 7px; width: 28px; }
  .mobile-contact.contact-contextual {
    visibility: hidden; opacity: 0; pointer-events: none;
    transition: opacity 180ms ease, visibility 0s linear 180ms, background-color 200ms ease;
  }
  .mobile-contact.contact-contextual.is-visible { visibility: visible; opacity: 1; pointer-events: auto; transition-delay: 0s; }
}
.blog-feature-image img, .blog-card-image img { transition: transform 450ms var(--motion-ease); }
@media (hover:hover) and (pointer:fine) {
  #navigation > a:hover:not(.nav-cta)::after { transform: scaleX(1); }
  .blog-feature-image:hover img, .blog-card-image:hover img { transform: scale(1.025); }
}
.blog-feature-image:focus-visible img, .blog-card-image:focus-visible img { transform: scale(1.025); }
.care-detail.faq-closing .care-toggle::after { transform: rotate(90deg); }
.image-lightbox {
  width: min(1000px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 20px;
  border: 1px solid var(--brand-line); border-radius: 16px; color: var(--ink); background: var(--paper);
}
.image-lightbox::backdrop { background: color-mix(in srgb, var(--brand-cocoa) 80%, transparent); }
.image-lightbox img { display: block; width: 100%; height: auto; max-height: 72dvh; object-fit: contain; }
.image-lightbox p { margin: 16px 0 0; font-size: 15px; line-height: 1.5; }
.lightbox-close {
  display: block; margin: 0 0 16px auto; min-height: 44px; padding: 10px 18px;
  border: 1px solid var(--brand-line); border-radius: 24px; color: var(--ink); background: var(--brand-porcelain); cursor: pointer;
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .blog-feature-image img, .blog-card-image img { transform: none !important; }
}
@media print {
  .image-lightbox, .mobile-contact { display: none !important; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Heroicons long arrows: one light, consistent family for actions and navigation. */
.cta-icon,.arrow-icon{width:22px;height:22px;flex-shrink:0}
.pricing-card .button .cta-icon{width:22px;height:22px}
.cta-icon,.arrow-icon{transition:transform 200ms var(--motion-ease)}
@media(hover:hover) and (pointer:fine){
 .button:hover .cta-icon,.nav-cta:hover .cta-icon,.mobile-contact:hover .cta-icon,
 .footer-whatsapp:hover .arrow-icon,.footer-refined-map:hover .arrow-icon,
 .instagram-link:hover .arrow-icon,.blog-read:hover .arrow-icon{transform:translateX(3px)}
}
@media(prefers-reduced-motion:reduce){.cta-icon,.arrow-icon{transition:none!important;transform:none!important}}
.result-card figcaption a,.blog-read{display:inline-flex;align-items:center;gap:8px}
