/* One state system per component family. Resting colors remain in colors.css.
   Motion amounts/timing are configured once in palette.json. */
:root { --zam-focus-color:var(--zam-focus); }
a { transition:color .28s ease,text-decoration-color .32s ease; }
button { transition:color .28s ease,background-color .28s ease,box-shadow .32s ease; }
.etaps { --zam-focus-color:var(--zam-gold-on-light); }
section#next, .archive-service { --zam-focus-color:var(--zam-focus); }

/* 1. Keyboard focus, including controls generated by the parent's carousel. */
:is(a, button, input, select, textarea, [role="button"]):focus-visible {
  outline: 2px solid var(--zam-focus-color); outline-offset: 4px;
}
.main-menu .menu li:focus-within .sub-menu li { padding: 10px; height: 40px; }
.main-menu .sub-menu li a:focus-visible { outline-offset: 0; }

/* 2. CTA family: same response for every size and every template. */
:is(.butt_big, .usl_butt_vn, .etaps_butt, .usl_zakaz, .proj_butt, .post_butt,
    .form_col input.form_butt, .form_col .wpcf7-submit) {
  transition: filter var(--zam-motion-fast) ease, transform var(--zam-motion-ui) var(--zam-motion-ease),
    box-shadow var(--zam-motion-ui) ease, background-position var(--zam-motion-ui) var(--zam-motion-ease);
}
@media (hover: hover) and (pointer: fine) {
  :is(.butt_big, .usl_butt_vn, .etaps_butt, .usl_zakaz, .proj_butt, .post_butt,
      .form_col input.form_butt, .form_col .wpcf7-submit):not(:disabled):hover {
    color: var(--zam-on-gold); filter: brightness(var(--zam-hover-brightness));
    transform: translateY(var(--zam-action-lift));
    box-shadow: var(--zam-button-active-shadow); background-position:var(--zam-action-background-active);
  }
}
:is(.butt_big, .usl_butt_vn, .etaps_butt, .usl_zakaz, .proj_butt, .post_butt,
    .form_col input.form_butt, .form_col .wpcf7-submit):not(:disabled):active {
  color: var(--zam-on-gold); transform: scale(var(--zam-press-scale)); filter: brightness(.97);
}
.form_col .wpcf7-submit:disabled {
  color: var(--zam-on-gold); background-color: var(--zam-line); background-image: none;
  box-shadow: none; cursor: not-allowed; filter: none; transform: none;
}

:is(.butt_big, .usl_butt_vn, .etaps_butt, .usl_zakaz, .proj_butt, .post_butt, .form_col .wpcf7-submit):not(:disabled):focus-visible {
  background-position:var(--zam-action-background-active); box-shadow:var(--zam-button-active-shadow);
}

/* 3. Links: legible feedback without layout shift or fake whole-card click areas. */
:is(.butt_small, .usl_butt, .usl_zag, .post_name, .phone, .zakaz,
    .cont_tel, .cont_mail, .cont_adr, .pol_row a, footer a, .pag_p) {
  transition: color var(--zam-motion-fast) ease, text-decoration-color var(--zam-motion-fast) ease;
  text-underline-offset: .22em; text-decoration:underline; text-decoration-thickness:1px; text-decoration-color:transparent;
}
:is(.butt_small, .usl_butt, .usl_zag, .post_name, .phone, .zakaz,
    .cont_tel, .cont_mail, .cont_adr, .pol_row a, footer a, .pag_p):is(:hover, :focus-visible) {
  color: var(--zam-link-hover); text-decoration-color:var(--zam-gold-mid); text-decoration-thickness:1px;
}
.butt_small, .usl_butt, .zakaz, footer a { text-decoration-color:rgba(var(--zam-gold-rgb),.48); }
.zam-service-copy h3 a, .zam-rich-copy a {
  text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:.22em; text-decoration-color:transparent;
  transition:color .28s ease,text-decoration-color .32s ease;
}
.zam-service-copy h3 a:is(:hover,:focus-visible), .zam-rich-copy a:is(:hover,:focus-visible) { color:var(--zam-link-hover); text-decoration-color:var(--zam-gold-mid); }
/* Primary navigation has its own single accent treatment, shared by all pages. */
.main-menu .menu > li > a {
  color:var(--zam-navigation-text); background-image:var(--zam-navigation-indicator);
  background-size:var(--zam-navigation-rest-size) var(--zam-navigation-line-height); background-position:left bottom; background-repeat:no-repeat;
  transition:color var(--zam-motion-fast) ease,background-size var(--zam-motion-ui) var(--zam-motion-ease);
}
.main-menu .menu > li > a:is(:hover,:focus-visible),
.main-menu .menu > .current-menu-item > a, .main-menu .menu > .current-menu-ancestor > a {
  color:var(--zam-gold); background-size:var(--zam-navigation-active-size) var(--zam-navigation-line-height);
}
.etap_col > img { transition:transform var(--zam-motion-ui) var(--zam-motion-ease); }
@media(hover:hover) and (pointer:fine) {
  .etap_col:hover > img { transform:translateY(var(--zam-step-icon-lift)); }
}
.main-menu .sub-menu li:is(:hover, :focus-within), .podmenu li:is(:hover, :focus-within),
.spoiler-body li:is(:hover, :focus-within) { background-color: var(--zam-surface); color: var(--zam-gold-light); }
.main-menu .sub-menu li, .podmenu li, .spoiler-body li { transition:background-color .28s ease,color .28s ease; }
.pag_p:not(.activ):is(:hover, :focus-visible)::after {
  content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background-color: var(--zam-gold);
}
.soc_ico a, a:has(> .soc_ico), .close_wind, .spoiler-head { cursor: pointer; }
:is(.soc_ico a, .soc_ico, .close_wind, .spoiler-head) {
  transition: filter var(--zam-motion-fast) ease;
}
:is(.soc_ico a, .soc_ico, .close_wind, .spoiler-head):is(:hover, :focus-visible) { filter: brightness(var(--zam-hover-brightness)); }

.usl_block { --zam-focus-color:var(--zam-focus); }

/* 4. Service/project/blog cards. Focus gives the same frame as mouse hover. */
:is(.usl_block, .proj_block, .blog_post) {
  transform:none;
  transition: transform var(--zam-motion-ui) var(--zam-motion-ease), box-shadow var(--zam-motion-ui) ease;
}

:is(.usl_block, .proj_block, .blog_post):focus-within { box-shadow:var(--zam-surface-active-shadow); background-image:var(--zam-surface-active); }
@media (hover: hover) and (pointer: fine) {
  :is(.usl_block, .proj_block, .blog_post):hover {
    transform: translateY(var(--zam-card-lift));
    box-shadow:var(--zam-surface-active-shadow); background-image:var(--zam-surface-active);
  }
}

/* 5. Fields: hover, focus, invalid and disabled have distinct meanings. */
.form_col :is(input, select, textarea):not([type="submit"]) { transition: border-color var(--zam-motion-fast) ease, box-shadow var(--zam-motion-fast) ease; }
.form_col :is(input, select, textarea):not([type="submit"]):not([type="checkbox"]):not(:focus):hover { border-color: var(--zam-gold-mid); }
.form_col :is(input, select, textarea):not([type="submit"]):focus {
  border-color: var(--zam-gold-light); outline: none; box-shadow: 0 0 0 3px rgba(var(--zam-gold-rgb), .2);
}
.form_col .wpcf7-not-valid { border-color: var(--zam-error); }
.form_col :is(input, select, textarea):disabled:not([type="submit"]) { color: var(--zam-subtle); cursor: not-allowed; }

/* 6. Slider, pagination and video controls: preserve original symbols and sizes. */
:is(.owl-prev, .owl-next, .owl-page, .pag_left, .pag_right, .vid_lay) {
  cursor: pointer; transition: filter var(--zam-motion-fast) ease, box-shadow var(--zam-motion-fast) ease, background-color var(--zam-motion-fast) ease;
}
.port_gall :is(.owl-prev, .owl-next):is(:hover, :focus-visible),
#otz_block :is(.owl-prev, .owl-next):is(:hover, :focus-visible),
.proj_carus :is(.owl-prev, .owl-next):is(:hover, :focus-visible),
:is(.pag_left, .pag_right):is(:hover, :focus-visible) {
  background-color:var(--zam-carousel-hover-fill);
  box-shadow: 0 0 0 1px var(--zam-gold-mid), 0 0 15px rgba(var(--zam-shadow-rgb), .35);
  opacity: 1;
}
#port_slider > .owl-controls .owl-buttons div:is(:hover, :focus-visible) { color: var(--zam-gold-light); opacity: 1; }
.proj_carus .owl-page:is(:hover, :focus-visible) span { background-color: var(--zam-gold); opacity: 1; }
.vid_lay:is(:hover, :focus-visible) { filter: brightness(var(--zam-hover-brightness)); }

/* A clearly perceptible but restrained brand response. */
:is(a.logo, a.custom-logo-link) img {
  transition:filter var(--zam-motion-ui) ease, transform var(--zam-motion-ui) var(--zam-motion-ease);
}
:is(a.logo, a.custom-logo-link):focus-visible img { filter:brightness(var(--zam-brand-hover-brightness)); }
@media (hover:hover) and (pointer:fine) {
  :is(a.logo, a.custom-logo-link):hover img {
    filter:brightness(var(--zam-brand-hover-brightness)); transform:translateY(var(--zam-brand-hover-lift)) scale(1.025);
  }
}

/* 7. Touch never needs hover to expose content. Reduced motion is component-scoped. */
@media (prefers-reduced-motion: reduce) {
  :is(.butt_big, .usl_butt_vn, .etaps_butt, .usl_zakaz, .proj_butt, .post_butt,
      .form_col input, .form_col select, .form_col textarea, .usl_block, .proj_block, .blog_post,
      .menu a, .etap_col > img, .owl-prev, .owl-next, .owl-page, .vid_lay, .pag_left, .pag_right) { transition: none; }
  :is(.usl_block, .proj_block, .blog_post, .butt_big, .usl_butt_vn, .etaps_butt, .usl_zakaz,
      .proj_butt, .post_butt, .form_col .wpcf7-submit):is(:hover, :active) { transform: none; }
  .etap_col:hover > img { transform:none; }
  a, button { transition:none; }
  :is(a.logo, a.custom-logo-link) img { transition:none; }
  :is(a.logo, a.custom-logo-link):is(:hover,:focus-visible) img { transform:none; }
}
