/* =========================================================
   POLISH LAYER — Maestro Dental
   Loaded after styles.css and the page's inline block.
   Normalizes tokens, interaction states, motion, and
   responsive behavior. No visual redesign.
   ========================================================= */

:root{
  --r-btn:6px;
  --r-card:8px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --dur-1:160ms;
  --dur-2:260ms;
  --dur-3:520ms;
  --ring:0 0 0 2px #fff,0 0 0 4px var(--accent);
  --ring-dark:0 0 0 2px rgba(0,0,0,.28),0 0 0 4px #fff;
  --shadow-sm:0 1px 2px rgba(35,44,38,.05),0 2px 8px rgba(35,44,38,.05);
  --shadow-md:0 4px 12px rgba(35,44,38,.07),0 12px 28px rgba(35,44,38,.07);
}

/* ---------- Global hygiene ---------- */
html{scroll-behavior:smooth}
body{overflow-x:hidden;text-wrap:pretty}
img,svg,iframe{max-width:100%}
main section[id],footer{scroll-margin-top:96px}
:where(p,li){text-wrap:pretty}
h1,h2,h3,h4,.pull{text-wrap:balance}

/* ---------- Focus: visible, consistent, never on mouse ---------- */
:focus{outline:none}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:4px}
.hero :focus-visible,.financing :focus-visible,.footer :focus-visible,
.topbar :focus-visible{box-shadow:var(--ring-dark)}
.btn:focus-visible{border-radius:var(--r-btn)}

/* ---------- Buttons: one radius, one motion language ---------- */
.btn{border-radius:var(--r-btn) !important;transition:background-color var(--dur-2) var(--ease),color var(--dur-2) var(--ease),border-color var(--dur-2) var(--ease),box-shadow var(--dur-2) var(--ease),transform var(--dur-1) var(--ease);will-change:transform}
.btn:active{transform:translateY(1px) scale(.995)}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.45;pointer-events:none}
.mobile-cta{border-radius:var(--r-btn) !important;transition:transform var(--dur-3) var(--ease),opacity var(--dur-2) var(--ease)}
.mobile-cta:active{transform:translateY(1px)}

/* ---------- Cards: one radius, one lift ---------- */
.icon-services .service-card,.map-slot,.location .hours-card,
.review-card,.tour-slide,.doctor-card{border-radius:var(--r-card) !important}
.icon-services .service-card{transition:border-color var(--dur-2) var(--ease),box-shadow var(--dur-2) var(--ease),transform var(--dur-2) var(--ease)}
.icon-services .service-card:hover{transform:translateY(-2px)}
.icon-services .sc-photo{overflow:hidden;transition:transform 620ms var(--ease)}
.icon-services .service-card:hover .sc-photo{transform:scale(1.035)}
.review-card{transition:border-color var(--dur-2) var(--ease),box-shadow var(--dur-2) var(--ease)}

/* Service "Learn more" reads as an affordance on hover */
.sc-link{display:inline-flex;align-items:center;gap:.4em;transition:gap var(--dur-2) var(--ease),color var(--dur-2) var(--ease)}
.icon-services .service-card:hover .sc-link{gap:.7em}

/* ---------- Links ---------- */
a{transition:color var(--dur-1) var(--ease),opacity var(--dur-1) var(--ease)}
.footer ul a,.f-bottom a{text-underline-offset:3px}
.footer ul a:hover,.f-bottom a:hover{text-decoration:underline}

/* ---------- Nav ---------- */
.nav-links a{position:relative;padding-block:6px}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-2) var(--ease)}
.nav-links a:hover::after,.nav-links a:focus-visible::after{transform:scaleX(1)}
.nav-toggle,.nav-close,.nav-call{min-width:44px;min-height:44px;align-items:center;justify-content:center}

/* ---------- Slider controls: real touch targets, clear disabled ---------- */
.slider-arrow{min-width:44px;min-height:44px;transition:background-color var(--dur-2) var(--ease),border-color var(--dur-2) var(--ease),opacity var(--dur-2) var(--ease),transform var(--dur-1) var(--ease)}
.slider-arrow:active{transform:scale(.94)}
.slider-arrow:disabled{opacity:.32;cursor:default}
.slider-dots{display:flex;justify-content:center;gap:8px}
.slider-dots button{position:relative;transition:width var(--dur-2) var(--ease),background-color var(--dur-2) var(--ease)}
.slider-dots button::before{content:"";position:absolute;inset:-12px}
[data-slider-track]{transition:transform 560ms var(--ease)}

/* ---------- Social icons ---------- */
.f-social a,.nav-menu-social a{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;transition:background-color var(--dur-2) var(--ease),color var(--dur-2) var(--ease)}
.f-social a:hover,.nav-menu-social a:hover{background:rgba(255,255,255,.1)}
.nav-menu-social a:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}

/* ---------- Measure: no over-long lines ---------- */
.sec-head .support,.pull,.hero-copy .support{max-width:62ch}
.pillar p,.about-hl p,.amenity p,.icon-services .sc-body p{max-width:52ch}

/* ---------- Section rhythm ---------- */
section{padding-block:var(--section-pad)}
.hero{padding-block:0}

/* ---------- Scroll reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--dur-3) var(--ease),transform var(--dur-3) var(--ease);transition-delay:var(--reveal-delay,0ms)}
[data-reveal].is-in{opacity:1;transform:none}

/* ---------- Responsive refinement ---------- */
@media (max-width:1280px){
  .wrap{padding-inline:clamp(20px,4vw,56px)}
}
@media (max-width:1024px){
  .location .wrap{gap:32px}
  .about-grid{gap:44px}
}
@media (max-width:900px){
  main section[id],footer{scroll-margin-top:72px}
  .about-grid{grid-template-columns:1fr}
  .doctor-card.stacked{max-width:520px}
  .icon-services .sc-photo{aspect-ratio:16/10;min-height:0}
  .icon-services .sc-body{padding:26px 24px 28px}
}
@media (max-width:680px){
  .hero .wrap{padding-block:96px 64px}
  .cta-row,.connect-cta{display:flex;flex-wrap:wrap;gap:12px}
  .cta-row .btn,.connect-cta .btn{flex:1 1 200px;justify-content:center}
  .trust{gap:10px}
  .pull{font-size:clamp(19px,5vw,24px)}
  .f-bottom{display:flex;flex-direction:column;gap:10px;text-align:center;align-items:center}
}
@media (max-width:400px){
  .wrap{padding-inline:18px}
  .brand .logo-img{width:126px}
  .nav .wrap{gap:12px}
  .icon-services .sc-body{padding:22px 20px 24px}
  .location .hours-card{padding:22px 20px}
  .cta-row .btn,.connect-cta .btn{flex:1 1 100%}
}
@media (min-width:1800px){
  .wrap{max-width:1440px}
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}
  [data-reveal]{opacity:1 !important;transform:none !important}
  .icon-services .service-card:hover{transform:none}
  .icon-services .service-card:hover .sc-photo{transform:none}
}

/* ---------- Print ---------- */
@media print{
  .topbar,.nav,.mobile-cta,.slider-arrow,.slider-dots,#tweaks-root{display:none !important}
  [data-reveal]{opacity:1 !important;transform:none !important}
}
