/* UI kit: Buttons, Figma 3102:16183. Loaded after page and mobile styles so
   interaction states change appearance without changing the existing layout. */
:root {
  --ui-orange: #e2480a;
  --ui-orange-hover: rgb(226 72 10 / 80%);
  --ui-orange-pressed: #d13d03;
  --ui-orange-disabled: rgb(226 72 10 / 30%);
  --ui-ghost-hover: #fbe4da;
  --ui-green: #516b43;
}

:where(a[href], button):focus-visible {
  outline: 2px solid var(--ui-orange);
  outline-offset: 3px;
}

:where(a[aria-disabled="true"], button:disabled) {
  cursor: default;
  pointer-events: none;
}

/* Filled text buttons: default #E2480A, hover 80%, pressed #D13D03. */
:is(.header__cta-btn, .hero__mob-btn--fill, .catalog__action--custom,
  .news__action--filled, .proj-cta__btn--filled, .arch-hero__btn--filled,
  .arch-cta__btn--filled, .question-modal__submit, .arch-consult__submit,
  .pd-form__submit, .catpg-filters__apply,
  .pdp-panel__btn):not(:disabled, [aria-disabled="true"]):hover {
  background-color: var(--ui-orange-hover);
}

:is(.header__cta-btn, .hero__mob-btn--fill, .catalog__action--custom,
  .news__action--filled, .proj-cta__btn--filled, .arch-hero__btn--filled,
  .arch-cta__btn--filled, .question-modal__submit, .arch-consult__submit,
  .pd-form__submit, .catpg-filters__apply,
  .pdp-panel__btn):not(:disabled, [aria-disabled="true"]):active {
  background-color: var(--ui-orange-pressed);
}

:is(.header__cta-btn, .hero__mob-btn--fill, .catalog__action--custom,
  .news__action--filled, .proj-cta__btn--filled, .arch-hero__btn--filled,
  .arch-cta__btn--filled, .question-modal__submit, .arch-consult__submit,
  .pd-form__submit, .catpg-filters__apply,
  .pdp-panel__btn):is(:disabled, [aria-disabled="true"]) {
  background-color: var(--ui-orange-disabled);
  color: #fff;
  opacity: 1;
}

/* Orange outline buttons: pale hover and solid chosen/pressed state. */
:is(.header__catalog-btn, .hero__mob-btn--outline,
  .news__action--outline, .proj-cta__btn--outline,
  .arch-cta__btn--outline, .catpg-card__cta,
  .catpg-card__mob-consult, .catalog__action--quote,
  .catalog__action--pdf,
  .arch-hero__btn--outline):not([aria-disabled="true"]):hover {
  background-color: var(--ui-ghost-hover);
  border-color: var(--ui-orange);
  color: var(--ui-orange);
}

:is(.header__catalog-btn, .hero__mob-btn--outline,
  .news__action--outline, .proj-cta__btn--outline,
  .arch-cta__btn--outline, .catpg-card__cta,
  .catpg-card__mob-consult, .catalog__action--quote,
  .catalog__action--pdf,
  .arch-hero__btn--outline):not([aria-disabled="true"]):active {
  background-color: var(--ui-orange);
  border-color: var(--ui-orange);
  color: #fff;
}

:is(.header__catalog-btn, .hero__mob-btn--outline,
  .news__action--outline, .proj-cta__btn--outline,
  .arch-cta__btn--outline, .catpg-card__cta,
  .catpg-card__mob-consult, .catalog__action--quote,
  .catalog__action--pdf,
  .arch-hero__btn--outline)[aria-disabled="true"] {
  opacity: .3;
}

/* Ghost/chosen filters and category switches. */
:is(.proj-filter__item, .catpg-filters__pill,
  .arch-consult__switch-btn):not(.proj-filter__item--active, .is-active,
  :disabled, [aria-disabled="true"]):hover {
  background-color: var(--ui-ghost-hover);
  border-color: var(--ui-orange);
  color: var(--ui-orange);
}

:is(.proj-filter__item, .catpg-filters__pill):not(.proj-filter__item--active,
  .is-active, :disabled, [aria-disabled="true"]):active {
  background-color: var(--ui-orange);
  border-color: var(--ui-orange);
  color: #fff;
}

:is(.proj-filter__item--active, .catpg-filters__pill.is-active):hover {
  background-color: var(--ui-orange-hover);
  border-color: var(--ui-orange);
  color: #fff;
}

.arch-consult__switch-btn.is-active:hover {
  background-color: var(--ui-green);
}

/* Icon buttons: arrows, catalogue view, cart, close and favourite. */
.slide-arrow:not(:disabled):active .slide-arrow__icon--default {
  opacity: 0;
}

.slide-arrow:not(:disabled):active .slide-arrow__icon--hover {
  opacity: 1;
  filter: brightness(.85);
}

:is(.header__burger, .mmenu__close):not(:disabled):hover {
  background-color: var(--ui-orange-hover);
}

:is(.header__burger, .mmenu__close):not(:disabled):active {
  background-color: var(--ui-orange-pressed);
}

.catpg-toolbar__icon:not(:disabled):hover {
  color: var(--ui-orange-hover);
}

.catpg-toolbar__icon:not(:disabled):active {
  color: var(--ui-orange-pressed);
}

.favorite-button {
  position: relative;
}

.favorite-button--card {
  position: absolute;
}

.favorite-button::after {
  content: '';
  position: absolute;
  width: 17px;
  height: 16px;
  background: var(--ui-orange);
  -webkit-mask: url("../img/favorite-outline.69edd3e5a318.svg") center / contain no-repeat;
  mask: url("../img/favorite-outline.69edd3e5a318.svg") center / contain no-repeat;
  opacity: 0;
  pointer-events: none;
}

.favorite-button[aria-pressed="true"]::after {
  -webkit-mask-image: url("../img/favorite-filled.e0e7467135fb.svg");
  mask-image: url("../img/favorite-filled.e0e7467135fb.svg");
}

.favorite-button:not(:disabled):hover img,
.favorite-button:not(:disabled):active img {
  opacity: 0;
}

.favorite-button:not(:disabled):hover::after {
  opacity: 1;
}

.favorite-button:not(:disabled):active::after {
  background: var(--ui-orange-pressed);
}

.catpg-card__mob-cart:not(:disabled):hover,
.cost-modal__add:not(:disabled):hover {
  background-color: var(--ui-orange);
}

.catpg-card__mob-cart:not(:disabled):active,
.cost-modal__add:not(:disabled):active {
  background-color: var(--ui-orange-hover);
}

.pdp-gallery__thumb:not(:disabled):hover {
  border-color: var(--ui-orange);
}

.pdp-gallery__thumb:not(:disabled):active {
  border-color: var(--ui-orange-pressed);
}

:is(.slide-arrow, .catpg-toolbar__icon, .favorite-button,
  .catpg-card__mob-cart, .cost-modal__add, .pdp-gallery__thumb,
  .catpg-mob-filter-btn, .catpg-list__qty button):disabled {
  opacity: .3;
}

:is(.question-modal__close, .map-widget__close,
  .catpg-filters__mob-close, .catpg-mob-filter-btn):not(:disabled):hover {
  opacity: .8;
}

:is(.question-modal__close, .map-widget__close,
  .catpg-filters__mob-close, .catpg-mob-filter-btn):not(:disabled):active {
  opacity: .6;
}

.catpg-list__qty button:not(:disabled):hover {
  color: var(--ui-orange);
}

.catpg-list__qty button:not(:disabled):active {
  color: var(--ui-orange-pressed);
}

:is(.header__catalog-btn, .arch-hero__btn--outline,
  .arch-cta__btn--outline, .catalog__action--quote,
  .catalog__action--pdf):active img {
  filter: brightness(0) invert(1);
}

/* Underlined text actions from the kit. */
:is(.catpg-filters__reset, .catpg-list__consult,
  .pdp-file__name, .hero__cta-link, .pdp-contact__title):not([aria-disabled="true"]):hover {
  color: var(--ui-orange);
  text-decoration-thickness: 2px;
}

:is(.catpg-filters__reset, .catpg-list__consult,
  .pdp-file__name, .hero__cta-link, .pdp-contact__title):not([aria-disabled="true"]):active {
  color: var(--ui-orange-pressed);
  text-decoration-thickness: 2px;
}

:is(.hero__cta-link, .pdp-contact__title):not([aria-disabled="true"]):hover {
  color: #fff;
}

:is(.hero__cta-link, .pdp-contact__title):not([aria-disabled="true"]):active {
  color: rgb(255 255 255 / 70%);
}

/* Text and text+icon links on a light background. */
:is(.catpg-filters__cat-heading, .arch-know__card-link,
  .categories__link,
  .about-banner__link, .arch-cases__all, .portfolio__all,
  .slide-more, .portfolio__mob-all, .pdp-related__photo,
  .hero__portal-link, .categories__mob-row,
  .arch-tools__item):not([aria-disabled="true"]):hover {
  color: var(--ui-orange);
}

:is(.catpg-filters__cat-heading, .arch-know__card-link,
  .categories__link,
  .about-banner__link, .arch-cases__all, .portfolio__all,
  .slide-more, .portfolio__mob-all, .pdp-related__photo,
  .hero__portal-link, .categories__mob-row,
  .arch-tools__item):not([aria-disabled="true"]):active {
  color: var(--ui-orange-pressed);
}

:is(.header__menu-item, .catpg-filters__categories a,
  .catpg-filters__series-list a):not([aria-disabled="true"]):hover {
  font-weight: 700;
}

:is(.catpg-filters__cat-heading, .arch-know__card-link,
  .categories__link,
  .about-banner__link, .arch-cases__all, .portfolio__all,
  .slide-more, .portfolio__mob-all,
  .hero__portal-link, .categories__mob-row,
  .arch-tools__item)[aria-disabled="true"] {
  opacity: .3;
}

/* Main navigation and catalogue series: black on hover, muted when pressed. */
:is(.header__menu-item, .catpg-filters__categories a,
  .catpg-filters__series-list a):not([aria-disabled="true"]):hover {
  color: #000;
}

:is(.header__menu-item, .catpg-filters__categories a,
  .catpg-filters__series-list a):not([aria-disabled="true"]):active {
  color: #8c8c8c;
}

.catpg-filters__series-list a.is-active:hover {
  color: var(--ui-orange);
  text-decoration: underline;
}

.catpg-more a:not([aria-disabled="true"]):hover {
  color: var(--ui-green);
  font-weight: 700;
}

.catpg-more a:not([aria-disabled="true"]):active {
  color: #000;
}

.catpg-more a[aria-disabled="true"] {
  opacity: .3;
}

:is(.header__menu-item, .catpg-filters__categories a,
  .catpg-filters__series-list a)[aria-disabled="true"] {
  opacity: .3;
}

.slide-more:hover .slide-more__text,
.categories__link:hover,
.arch-cases__all:hover,
.portfolio__all:hover,
.about-banner__link:hover {
  color: var(--ui-orange);
  text-decoration: underline;
}

.slide-more:active .slide-more__text,
.categories__link:active,
.arch-cases__all:active,
.portfolio__all:active,
.about-banner__link:active {
  color: var(--ui-orange-pressed);
}

:is(.header__action-link, .header__mbar-icons a,
  .header__socials a):not([aria-disabled="true"]):hover {
  text-decoration: underline;
}

:is(.header__action-link, .header__mbar-icons a,
  .header__socials a):not([aria-disabled="true"]):active {
  opacity: .7;
}

.header__socials a:hover img {
  transform: scale(1.12);
}

:is(.header__logo, .header__mbar-logo):hover img {
  opacity: .8;
}

:is(.header__logo, .header__mbar-logo):active img {
  opacity: .6;
}

.header__menu-item-wrap:hover .header__menu-chevron,
.header__menu-item-wrap:focus-within .header__menu-chevron {
  transform: rotate(180deg);
}

/* Contact links: hover orange with underline, pressed orange without it. */
:is(.pdp-file__name):not([aria-disabled="true"]):hover {
  color: var(--ui-orange);
  text-decoration: underline;
}

:is(.pdp-file__name):not([aria-disabled="true"]):active {
  color: var(--ui-orange);
  text-decoration: none;
}

/* Links on the green menu/footer follow the white-on-green kit rows. */
:is(.header__topbar-link, .header__topbar-text,
  .mmenu__contacts a, .mmenu__nav a, .mmenu__socials a, .footer__legal a,
  .footer__col-list a, .footer__contact-lines a, .footer__social-links a):not([aria-disabled="true"]):hover {
  color: #fff;
  text-decoration: underline;
}

:is(.header__topbar-link, .header__topbar-text,
  .mmenu__contacts a, .mmenu__nav a, .mmenu__socials a, .footer__legal a,
  .footer__col-list a, .footer__contact-lines a, .footer__social-links a):not([aria-disabled="true"]):active {
  color: #fff;
  text-decoration: none;
  opacity: .7;
}

:is(.header__topbar-link, .header__topbar-text,
  .mmenu__contacts a, .mmenu__nav a, .mmenu__socials a, .footer__legal a,
  .footer__col-list a, .footer__contact-lines a, .footer__social-links a)[aria-disabled="true"] {
  opacity: .3;
}

/* Checkbox states are part of this kit as well. */
:is(.question-modal__consent input, .question-modal__option input,
  .pd-form__checkbox, .arch-consult__consent input):not(:disabled):hover {
  border-color: var(--ui-orange);
}

:is(.question-modal__consent input, .question-modal__option input,
  .pd-form__checkbox, .arch-consult__consent input):disabled {
  opacity: .3;
  cursor: default;
}

.question-modal__consent a:hover,
.pd-form__check-text a:hover {
  color: var(--ui-orange);
}

.cost-modal__dropzone:hover {
  --drop-border: var(--ui-orange);
}

.arch-tools__item:hover .arch-tools__item-title,
.categories__mob-row:hover .categories__mob-link {
  color: var(--ui-orange);
  text-decoration: underline;
}

.arch-tools__item:active .arch-tools__item-title,
.categories__mob-row:active .categories__mob-link {
  color: var(--ui-orange-pressed);
}

/* Links represented by images retain their card composition. */
:is(.catalog__card, .catalog2__card):not([aria-disabled="true"]):hover .catalog__card-img,
.proj-card:not([aria-disabled="true"]):hover .proj-card__media img,
.proj-case:not([aria-disabled="true"]):hover .proj-case__media img,
.proj-mob-card:not([aria-disabled="true"]):hover img,
.arch-cases__featured:not([aria-disabled="true"]):hover .arch-cases__featured-media img,
.arch-cases__card:not([aria-disabled="true"]):hover .arch-cases__card-media img,
.portfolio-slide__photo:not([aria-disabled="true"]):hover img,
.catpg-card__image > a:not([aria-disabled="true"]):hover img,
.pdp-related__photo:not([aria-disabled="true"]):hover img {
  filter: brightness(.92);
}

:is(.catalog__card, .catalog2__card):not([aria-disabled="true"]):active .catalog__card-img,
.proj-card:not([aria-disabled="true"]):active .proj-card__media img,
.proj-case:not([aria-disabled="true"]):active .proj-case__media img,
.proj-mob-card:not([aria-disabled="true"]):active img,
.arch-cases__featured:not([aria-disabled="true"]):active .arch-cases__featured-media img,
.arch-cases__card:not([aria-disabled="true"]):active .arch-cases__card-media img,
.portfolio-slide__photo:not([aria-disabled="true"]):active img,
.catpg-card__image > a:not([aria-disabled="true"]):active img,
.pdp-related__photo:not([aria-disabled="true"]):active img {
  filter: brightness(.85);
}

/* Bare text links in templates also get a visible state. */
a[href]:not([class], [aria-disabled="true"]):hover {
  text-decoration: underline;
}

a[href]:not([class], [aria-disabled="true"]):active {
  opacity: .7;
}