/* Shared controls for the active site. Page styles provide their contextual colours. */
:root{
  --ui-control-font:500 11px/1.25 'DM Mono',ui-monospace,monospace;
  --ui-nav-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M3.5 12.5V4.5h8M8 16V8h8' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
  --ui-open-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M16.5 12.5V4.5h-8M12 16V8H4' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
  --ui-bookmark-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3.5h12v17l-6-4-6 4z' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ui-copy-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='8' y='8' width='12' height='12' rx='1.5' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M16 8V5.5A1.5 1.5 0 0 0 14.5 4h-9A1.5 1.5 0 0 0 4 5.5v9A1.5 1.5 0 0 0 5.5 16H8' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E");
  --ui-check-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m4 12.5 5.5 5.5L20 6.5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ui-chat-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5.5h16v11H9l-5 4z' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ui-spark-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 2 1.8 7.2L21 11l-7.2 1.8L12 20l-1.8-7.2L3 11l7.2-1.8zM19 18v4m-2-2h4' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ui-book-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5c-2.7-1.8-5.5-2-9-1v14c3.5-1 6.3-.8 9 1 2.7-1.8 5.5-2 9-1V4c-3.5-1-6.3-.8-9 1zm0 0v14' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ui-send-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.5 21 3l-5.5 18-3.7-7-8.8-2.5zM11.8 14 21 3' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ui-right-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 12h17m-7-7 7 7-7 7' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

:is(a.hero-button,a.ai-training-link,a.all-projects-link,.katalog-teaser a,.contact-route-actions>a,a.button,button.button,a.pill,a.case-link,button.project-submit){
  display:inline-flex;align-items:center;justify-content:space-between;gap:18px;
  min-height:46px;padding:11px 18px;border-radius:999px;
  font:var(--ui-control-font);letter-spacing:.035em;text-decoration:none;text-transform:uppercase;
}
:is(a.hero-button,a.ai-training-link,a.all-projects-link,.katalog-teaser a,.contact-route-actions>a,a.button,button.button,a.pill,a.case-link,button.project-submit):focus-visible{
  outline:2px solid currentColor;outline-offset:3px;
}
:is(a.hero-button,a.ai-training-link,a.all-projects-link,.katalog-teaser a,.contact-route-actions>a,a.button,button.button,a.pill,a.case-link,button.project-submit)::after,
.catalog-card-open::after,.case-gallery-controls button::after,.global-footer__top::after,.save-catalog-button .save-star{
  content:"";display:block;flex:0 0 17px;width:17px;height:17px;background:currentColor;
  -webkit-mask-image:var(--ui-nav-mark);mask-image:var(--ui-nav-mark);
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-size:contain;mask-size:contain;
}
:is(a.hero-button,a.ai-training-link,a.all-projects-link,.katalog-teaser a,.contact-route-actions>a,a.button,button.button,a.pill,a.case-link,button.project-submit)::after,
.catalog-card-open::after{-webkit-mask-image:var(--ui-open-mark);mask-image:var(--ui-open-mark)}
:is(a.ai-training-link,a.all-projects-link,.katalog-teaser a,.contact-route-actions>a,a.button,button.button) > span[aria-hidden="true"],
a.pill > span[aria-hidden="true"],.catalog-card-open > span,.code-back > span[aria-hidden="true"],.global-footer__top > span[aria-hidden="true"]{display:none}
:is(a.button,a.pill)[href^="#"]::after{transform:rotate(90deg)}
:is(a.button,a.case-link,.contact-route-actions>a)[target="_blank"]::after{transform:none}
button.project-submit.is-loading::after{display:none}

:is(.catalog-hero,.article-hero,.save-panel) .save-catalog-button{
  display:inline-flex;align-items:center;justify-content:space-between;gap:20px;
  min-height:42px;padding:9px 15px;border-radius:999px;
  font:var(--ui-control-font);letter-spacing:.035em;text-transform:uppercase;
}
.save-catalog-button .save-star{order:2;flex-basis:18px;width:18px;height:18px;font-size:0!important;-webkit-mask-image:var(--ui-bookmark-mark);mask-image:var(--ui-bookmark-mark)}
a.hero-button--primary::after,a.ai-training-link::after{-webkit-mask-image:var(--ui-right-mark);mask-image:var(--ui-right-mark)}
a.hero-button--secondary::after,a.hero-button[data-contact-trigger]::after,a.button[href="#consultation"]::after{-webkit-mask-image:var(--ui-chat-mark);mask-image:var(--ui-chat-mark);transform:none}
.katalog-teaser a::after{-webkit-mask-image:var(--ui-book-mark);mask-image:var(--ui-book-mark)}
a.button.consultation-telegram::after,button.project-submit::after{-webkit-mask-image:var(--ui-send-mark);mask-image:var(--ui-send-mark)}
button[data-copy-catalog]{display:inline-flex;align-items:center;justify-content:space-between;gap:18px}
button[data-copy-catalog]::after{content:"";display:block;flex:0 0 20px;width:20px;height:20px;background:currentColor;-webkit-mask:var(--ui-copy-mark) center/contain no-repeat;mask:var(--ui-copy-mark) center/contain no-repeat}
button[data-copy-catalog].is-copied::after{-webkit-mask-image:var(--ui-check-mark);mask-image:var(--ui-check-mark)}
.all-projects-page .invite-arrow::before{flex-basis:17px;width:17px;height:17px;border-radius:0;-webkit-mask:var(--ui-spark-mark) center/contain no-repeat;mask:var(--ui-spark-mark) center/contain no-repeat}
.contact-telegram-link{display:inline-flex;align-items:center;gap:8px;width:max-content;max-width:100%;margin-top:14px;color:inherit;font:500 11px/1.35 'DM Mono',ui-monospace,monospace;letter-spacing:.035em;text-decoration:underline;text-underline-offset:5px;text-transform:uppercase}
.contact-telegram-link::before{content:"";display:block;flex:0 0 18px;width:18px;height:18px;background:currentColor;-webkit-mask:var(--ui-send-mark) center/contain no-repeat;mask:var(--ui-send-mark) center/contain no-repeat}
.contact-telegram-link:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.hero-actions .contact-telegram-link{margin-top:0}
.contact-panel .contact-telegram-link{margin:-12px 0 24px}
.save-panel{gap:20px;margin-bottom:54px;padding:22px 24px;border-radius:20px}
.save-panel h2{margin:8px 0 6px;font-size:clamp(22px,2.6vw,30px);line-height:1.13}
.save-panel p{font-size:13px;line-height:1.45}

:is(.catalog-filter,.article-aside nav a){min-height:34px;padding:6px 12px;border:1px solid var(--ink);border-radius:8px;background:transparent;color:var(--ink);font:600 12px/1.3 Manrope,Arial,sans-serif;letter-spacing:0;text-align:center;text-decoration:none;text-transform:none}
:is(.catalog-filter,.article-aside nav a):hover,:is(.catalog-filter,.article-aside nav a):focus-visible{background:var(--accent-pale);color:var(--ink)}
.catalog-filter.is-active,.catalog-filter.is-active:hover,.catalog-filter.is-active:focus-visible{border-color:var(--accent);background:var(--accent);color:var(--ink)}
:is(.prompt-composer .copy-button,.code-copy){min-height:36px;padding:8px 12px;border-radius:8px;font:600 11px/1.2 Manrope,Arial,sans-serif;letter-spacing:0;text-transform:none}
button[data-copy-catalog]{min-height:42px;padding:10px 16px;border-radius:999px;font:var(--ui-control-font);letter-spacing:.035em;text-transform:uppercase}

.catalog-card-open{display:inline-flex;align-items:center;gap:6px}
.catalog-card-open::after{background:var(--accent-deep)}
.global-footer__top{display:inline-flex;align-items:center;gap:7px}
.global-footer__top::after{transform:none}
:is(a.text-link,a.video-link,a.code-back){text-decoration:underline;text-underline-offset:4px}
.site-menu.site-menu-panel .menu-panel-contact{justify-content:space-between;min-height:46px;border-radius:999px;font:var(--ui-control-font);letter-spacing:.035em;text-transform:uppercase}
.site-menu.site-menu-panel .menu-panel-contact svg{order:2;width:18px;height:18px}

:is(.step,.ai-training-flow li,.contact-route li,.result-visual-flow li):not(:last-child)::after{
  content:"";display:block;width:18px;height:18px;border-radius:0;background:currentColor;
  -webkit-mask:var(--ui-nav-mark) center/contain no-repeat;
  mask:var(--ui-nav-mark) center/contain no-repeat;
}
.step:not(:last-child)::after{transform:rotate(90deg)}
.consultation-route li:not(:last-child)::after{content:"";display:inline-block;width:14px;height:14px;background:currentColor;vertical-align:-2px;-webkit-mask:var(--ui-nav-mark) center/contain no-repeat;mask:var(--ui-nav-mark) center/contain no-repeat}
@media(min-width:1101px){.learning-flow li:not(:last-child)::after{content:"";display:block;width:17px;height:17px;background:currentColor;-webkit-mask:var(--ui-nav-mark) center/contain no-repeat;mask:var(--ui-nav-mark) center/contain no-repeat}}

.global-header .menu-toggle,.case-gallery-controls button{
  width:40px;height:40px;border:1px solid rgba(24,26,24,.28);border-radius:10px;
}
.case-gallery-controls button{display:grid;place-items:center;font-size:0}
.case-gallery-controls button::after{flex-basis:17px}
.case-gallery-controls button[data-carousel-direction="prev"]::after{transform:rotate(180deg)}
:is(.menu-panel-close,.save-dialog-close,.modal-close){
  position:relative;display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;
  margin:0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--ink,#1C211F);
  font-size:0;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent;
}
:is(.menu-panel-close,.save-dialog-close,.modal-close)::before,
:is(.menu-panel-close,.save-dialog-close,.modal-close)::after{
  content:"";position:absolute;left:11px;right:11px;top:19px;height:2px;border-radius:2px;
  background:currentColor;transform:rotate(45deg);
}
:is(.menu-panel-close,.save-dialog-close,.modal-close)::after{transform:rotate(-45deg)}
:is(.menu-panel-close,.save-dialog-close,.modal-close):hover{background:rgba(24,26,24,.07)}
:is(.menu-panel-close,.save-dialog-close,.modal-close):focus-visible{
  outline:2px solid currentColor;outline-offset:2px;background:rgba(24,26,24,.07);
}
.save-dialog-close{position:absolute;top:16px;right:18px}
.menu-close-label,.menu-close-icon,.modal-close span{display:none}

@media(max-width:700px){
  .save-panel{margin:0 20px 48px;padding:19px}
  .save-panel h2{font-size:22px}
  .save-panel-button{width:100%}
  .ai-training-flow li:not(:last-child)::after,.contact-route li:not(:last-child)::after{transform:rotate(90deg)}
}
@media(max-width:480px){
  .result-visual-flow li:not(:last-child)::after{transform:rotate(90deg)}
  .consultation-route li:not(:last-child)::after{content:none}
}