/* umka-theme-bundle — merged 2026-08-10 */
/* --- theme-graphite-gold-v1 --- */
/* UmkaPro graphite + gold theme — 2026-07-26 */
:root{
  --bg:#202326!important;
  --bg-soft:#25292d!important;
  --panel:#2b3034!important;
  --panel-2:#31373c!important;
  --text:#f4f4f2!important;
  --muted:#aeb5ba!important;
  --line:#434b51!important;
  --accent:#d7a544!important;
  --accent2:#e4ba6a!important;
  --gold:#d7a544!important;
  --shadow:0 24px 70px rgba(0,0,0,.30)!important;
}
html,body{background:#202326!important;color:var(--text)!important}
body{
  background:
    radial-gradient(1100px 720px at 16% 2%,rgba(215,165,68,.13),transparent 58%),
    radial-gradient(900px 640px at 88% 12%,rgba(228,186,106,.07),transparent 58%),
    linear-gradient(180deg,#25292d 0%,#202326 48%,#1c1f22 100%)!important;
}
main{background:transparent!important}
.top,.topbar{
  background:rgba(31,35,38,.93)!important;
  border-bottom-color:#3f474c!important;
  box-shadow:0 12px 34px rgba(0,0,0,.18)!important;
}
.drawer__panel,.nav__submenu{
  background:rgba(39,44,48,.985)!important;
  border-color:#4a5359!important;
}
.drawer__nav>a,.drawer__details>summary,.nav__submenu a:hover{
  background:#2c3236!important;
  border-color:#465057!important;
}
.language-switch,.header-quicklink,.iconbtn,.hamb,.btn--ghost,.btn--quiet,.ghost-btn{
  background:#2a2f33!important;
  border-color:#4b555b!important;
  color:#f4f4f2!important;
}
.btn--accent,.btn-primary,.primary-btn,.fab--accent,.floating-cta a.primary,.umka-messenger__button{
  background:linear-gradient(135deg,#e5bb67 0%,#d7a544 58%,#b9832d 100%)!important;
  border-color:rgba(215,165,68,.55)!important;
  color:#17130d!important;
  box-shadow:0 15px 38px rgba(215,165,68,.18),0 7px 20px rgba(0,0,0,.24)!important;
}
.btn--accent:hover,.btn-primary:hover,.primary-btn:hover,.umka-messenger__button:hover{
  filter:brightness(1.06)!important;
  box-shadow:0 20px 48px rgba(215,165,68,.24),0 9px 24px rgba(0,0,0,.28)!important;
}
.umka-messenger__icon{background:rgba(28,31,34,.18)!important;color:#17130d!important}
.umka-messenger__title,.umka-messenger__subtitle{color:#17130d!important}
.umka-messenger__menu{background:#2b3034!important;border-color:#4b555b!important}
.umka-messenger__menu a:hover{background:rgba(215,165,68,.18)!important}

.hero,.home-premium-v5 .hero,body.service-detail-v7 .hero,.case-hero{
  background:#23272a!important;
  border-color:#41494f!important;
}
.hero::after,body.service-detail-v7 .hero::after{
  background:linear-gradient(180deg,rgba(31,34,37,.15),rgba(31,34,37,.88) 76%)!important;
}
.hero-video-bg::after,.hero-bg-overlay{
  background:linear-gradient(90deg,rgba(29,32,35,.88),rgba(29,32,35,.46) 48%,rgba(29,32,35,.30))!important;
}
.visual,.visual__top,.hero__proof,.hero__proof-item,.service-hero-fact,.services-hero__fact,.en-hero-proof{
  background:linear-gradient(145deg,rgba(49,55,60,.96),rgba(39,44,48,.96))!important;
  border-color:#4a545b!important;
}
.kpi,.hero__proof-item,.badge,.pill,.tag,.stepnum,.mini-kpi{
  background:#2c3236!important;
  border-color:#4b555b!important;
}
.pill b,.stepnum,.eyebrow,.tag--accent,.mini-kpi,.service-tile__num,.umka-arch-card__num,
.install-card__kicker,.case-modal__eyebrow,.price-band__price,.format-label{
  color:#d7a544!important;
}

section,.section,.related,.faq,.service-flow-v7,.service-detail-v7,.section--alt{
  border-color:#41494f!important;
}
.section--alt,.service-flow-v7,.related,.faq,.case-section,.page-service main>section:nth-of-type(even),.en-page main>section:nth-of-type(even){
  background:#25292d!important;
}
.home-page main>section:nth-of-type(odd),.page-service main>section:nth-of-type(odd),.en-page main>section:nth-of-type(odd){
  background:#202326!important;
}
.home-page main>section:nth-of-type(even){background:#25292d!important}

.card,.cta,.faq,.faq__item,.visual,.kpi,.service-card,.service-card-premium,.service-tile,
.install-card,.turnkey-item,.turnkey-band,.design-feature,.design-result,.design-step,.design-doc,
.price-factor,.price-step,.price-band,.price-insight__panel,.price-saving,.mini-card-v6,.info-card-v6,
.proof-card,.umka-arch-card,.service-next-v7__card,.service-flow-v7__panel,.case-gallery-card,
.case-summary,.case-hero__box,.savant-gallery__item,.knx-gallery__item,.shchity-gallery__item,
.shot,.wide-card,.wifi-mini-card,.design-package-card,.quiz-q,.quiz-opt,.service-tile--compact,
.process-step,.price-table__row,.en-photo-proof,.umka-premium-band,.umka-proof-strip,.umka-proof-main{
  background:linear-gradient(145deg,#2e3438,#272c30)!important;
  border-color:#454e54!important;
  box-shadow:0 16px 42px rgba(0,0,0,.18)!important;
}
.card:hover,.service-card:hover,.service-tile:hover,.install-card:hover,.case-gallery-card:hover{
  border-color:#8b672d!important;
  box-shadow:0 18px 46px rgba(0,0,0,.22),0 0 0 1px rgba(215,165,68,.10)!important;
}
.card__inner,.install-card__body,.case-gallery-card__caption{background:transparent!important}
.install-card__media,.shot--photo,.case-modal__media,.case-modal__media img,.savant-gallery__item--contain img{
  background:#23272a!important;
}
.install-card__kicker,.tag--accent{
  background:rgba(215,165,68,.11)!important;
  border-color:rgba(215,165,68,.30)!important;
}

input,select,textarea,.field input,.field select,.field textarea{
  background:#24292d!important;
  border-color:#4a545b!important;
  color:#f4f4f2!important;
}
input:focus,select:focus,textarea:focus{
  border-color:#9b7837!important;
  box-shadow:0 0 0 3px rgba(215,165,68,.12)!important;
}
input::placeholder,textarea::placeholder{color:#8f989e!important}

.qa,.faq__item{border-color:#454e54!important}
.chev{background:#2d3337!important;border-color:#4a545b!important}
.qa.open .chev{border-color:rgba(215,165,68,.46)!important}
.q,.faq__q{color:#f4f4f2!important}
.a p,.faq__a p,.lead,.small,.muted,.sectionhead p,.card p,.card li{color:#aeb5ba!important}

.case-modal{background:rgba(24,27,30,.82)!important}
.case-modal__dialog{background:linear-gradient(180deg,#30363a,#272c30)!important;border-color:#4b555b!important}
.case-modal__close,.case-modal__nav button{background:#2b3034!important;border-color:#4a545b!important}

footer,.footer{
  background:#191c1f!important;
  border-top-color:#3f474c!important;
}
.fab,.floating-cta a{
  background:rgba(42,47,51,.94)!important;
  border-color:#4b555b!important;
}
.fab:hover{border-color:rgba(215,165,68,.55)!important}

/* replace all former neon-orange interaction glow with restrained gold */
.u-cursor__dot{background:rgba(215,165,68,.96)!important;box-shadow:0 0 10px rgba(215,165,68,.72),0 0 22px rgba(215,165,68,.30)!important}
.u-cursor__ring{border-color:rgba(215,165,68,.42)!important;box-shadow:0 0 16px rgba(215,165,68,.18)!important}
.u-cursor.is-hover .u-cursor__ring,.u-cursor.is-magnet .u-cursor__ring{border-color:rgba(215,165,68,.82)!important;box-shadow:0 0 28px rgba(215,165,68,.28),0 0 58px rgba(215,165,68,.12)!important}
.u-cursor__trail{background:rgba(215,165,68,.55)!important;box-shadow:0 0 10px rgba(215,165,68,.24)!important}

@media(max-width:900px){
  .home-page .topbar,.page-service .topbar,.en-page .topbar,.home-page .top,.page-service .top{
    background:rgba(31,35,38,.97)!important;
  }
  .drawer__panel{background:#272c30!important}
  .drawer__nav>a,.drawer__details>summary{background:#2d3337!important}
}
/* --- theme-graphite-gold-v2 --- */
/* UmkaPro graphite + gold theme — 2026-07-26 */
:root{
  --bg:#202326!important;
  --bg-soft:#25292d!important;
  --panel:#2b3034!important;
  --panel-2:#31373c!important;
  --text:#f4f4f2!important;
  --muted:#aeb5ba!important;
  --line:#434b51!important;
  --accent:#d7a544!important;
  --accent2:#e4ba6a!important;
  --gold:#d7a544!important;
  --shadow:0 24px 70px rgba(0,0,0,.30)!important;
}
html,body{background:#202326!important;color:var(--text)!important}
body{
  background:
    radial-gradient(1100px 720px at 16% 2%,rgba(215,165,68,.13),transparent 58%),
    radial-gradient(900px 640px at 88% 12%,rgba(228,186,106,.07),transparent 58%),
    linear-gradient(180deg,#25292d 0%,#202326 48%,#1c1f22 100%)!important;
}
main{background:transparent!important}
.top,.topbar{
  background:rgba(31,35,38,.93)!important;
  border-bottom-color:#3f474c!important;
  box-shadow:0 12px 34px rgba(0,0,0,.18)!important;
}
.drawer__panel,.nav__submenu{
  background:rgba(39,44,48,.985)!important;
  border-color:#4a5359!important;
}
.drawer__nav>a,.drawer__details>summary,.nav__submenu a:hover{
  background:#2c3236!important;
  border-color:#465057!important;
}
.language-switch,.header-quicklink,.iconbtn,.hamb,.btn--ghost,.btn--quiet,.ghost-btn{
  background:#2a2f33!important;
  border-color:#4b555b!important;
  color:#f4f4f2!important;
}
.btn--accent,.btn-primary,.primary-btn,.fab--accent,.floating-cta a.primary,.umka-messenger__button{
  background:linear-gradient(135deg,#e5bb67 0%,#d7a544 58%,#b9832d 100%)!important;
  border-color:rgba(215,165,68,.55)!important;
  color:#17130d!important;
  box-shadow:0 15px 38px rgba(215,165,68,.18),0 7px 20px rgba(0,0,0,.24)!important;
}
.btn--accent:hover,.btn-primary:hover,.primary-btn:hover,.umka-messenger__button:hover{
  filter:brightness(1.06)!important;
  box-shadow:0 20px 48px rgba(215,165,68,.24),0 9px 24px rgba(0,0,0,.28)!important;
}
.umka-messenger__icon{background:rgba(28,31,34,.18)!important;color:#17130d!important}
.umka-messenger__title,.umka-messenger__subtitle{color:#17130d!important}
.umka-messenger__menu{background:#2b3034!important;border-color:#4b555b!important}
.umka-messenger__menu a:hover{background:rgba(215,165,68,.18)!important}

.hero,.home-premium-v5 .hero,body.service-detail-v7 .hero,.case-hero{
  background:#23272a!important;
  border-color:#41494f!important;
}
.hero::after,body.service-detail-v7 .hero::after{
  background:linear-gradient(180deg,rgba(31,34,37,.15),rgba(31,34,37,.88) 76%)!important;
}
.hero-video-bg::after,.hero-bg-overlay{
  background:linear-gradient(90deg,rgba(29,32,35,.88),rgba(29,32,35,.46) 48%,rgba(29,32,35,.30))!important;
}
.visual,.visual__top,.hero__proof,.hero__proof-item,.service-hero-fact,.services-hero__fact,.en-hero-proof{
  background:linear-gradient(145deg,rgba(49,55,60,.96),rgba(39,44,48,.96))!important;
  border-color:#4a545b!important;
}
.kpi,.hero__proof-item,.badge,.pill,.tag,.stepnum,.mini-kpi{
  background:#2c3236!important;
  border-color:#4b555b!important;
}
.pill b,.stepnum,.eyebrow,.tag--accent,.mini-kpi,.service-tile__num,.umka-arch-card__num,
.install-card__kicker,.case-modal__eyebrow,.price-band__price,.format-label{
  color:#d7a544!important;
}

section,.section,.related,.faq,.service-flow-v7,.service-detail-v7,.section--alt{
  border-color:#41494f!important;
}
.section--alt,.service-flow-v7,.related,.faq,.case-section,.page-service main>section:nth-of-type(even),.en-page main>section:nth-of-type(even){
  background:#25292d!important;
}
.home-page main>section:nth-of-type(odd),.page-service main>section:nth-of-type(odd),.en-page main>section:nth-of-type(odd){
  background:#202326!important;
}
.home-page main>section:nth-of-type(even){background:#25292d!important}

.card,.cta,.faq,.faq__item,.visual,.kpi,.service-card,.service-card-premium,.service-tile,
.install-card,.turnkey-item,.turnkey-band,.design-feature,.design-result,.design-step,.design-doc,
.price-factor,.price-step,.price-band,.price-insight__panel,.price-saving,.mini-card-v6,.info-card-v6,
.proof-card,.umka-arch-card,.service-next-v7__card,.service-flow-v7__panel,.case-gallery-card,
.case-summary,.case-hero__box,.savant-gallery__item,.knx-gallery__item,.shchity-gallery__item,
.shot,.wide-card,.wifi-mini-card,.design-package-card,.quiz-q,.quiz-opt,.service-tile--compact,
.process-step,.price-table__row,.en-photo-proof,.umka-premium-band,.umka-proof-strip,.umka-proof-main{
  background:linear-gradient(145deg,#2e3438,#272c30)!important;
  border-color:#454e54!important;
  box-shadow:0 16px 42px rgba(0,0,0,.18)!important;
}
.card:hover,.service-card:hover,.service-tile:hover,.install-card:hover,.case-gallery-card:hover{
  border-color:#8b672d!important;
  box-shadow:0 18px 46px rgba(0,0,0,.22),0 0 0 1px rgba(215,165,68,.10)!important;
}
.card__inner,.install-card__body,.case-gallery-card__caption{background:transparent!important}
.install-card__media,.shot--photo,.case-modal__media,.case-modal__media img,.savant-gallery__item--contain img{
  background:#23272a!important;
}
.install-card__kicker,.tag--accent{
  background:rgba(215,165,68,.11)!important;
  border-color:rgba(215,165,68,.30)!important;
}

input,select,textarea,.field input,.field select,.field textarea{
  background:#24292d!important;
  border-color:#4a545b!important;
  color:#f4f4f2!important;
}
input:focus,select:focus,textarea:focus{
  border-color:#9b7837!important;
  box-shadow:0 0 0 3px rgba(215,165,68,.12)!important;
}
input::placeholder,textarea::placeholder{color:#8f989e!important}

.qa,.faq__item{border-color:#454e54!important}
.chev{background:#2d3337!important;border-color:#4a545b!important}
.qa.open .chev{border-color:rgba(215,165,68,.46)!important}
.q,.faq__q{color:#f4f4f2!important}
.a p,.faq__a p,.lead,.small,.muted,.sectionhead p,.card p,.card li{color:#aeb5ba!important}

.case-modal{background:rgba(24,27,30,.82)!important}
.case-modal__dialog{background:linear-gradient(180deg,#30363a,#272c30)!important;border-color:#4b555b!important}
.case-modal__close,.case-modal__nav button{background:#2b3034!important;border-color:#4a545b!important}

footer,.footer{
  background:#191c1f!important;
  border-top-color:#3f474c!important;
}
.fab,.floating-cta a{
  background:rgba(42,47,51,.94)!important;
  border-color:#4b555b!important;
}
.fab:hover{border-color:rgba(215,165,68,.55)!important}

/* replace all former neon-orange interaction glow with restrained gold */
.u-cursor__dot{background:rgba(215,165,68,.96)!important;box-shadow:0 0 10px rgba(215,165,68,.72),0 0 22px rgba(215,165,68,.30)!important}
.u-cursor__ring{border-color:rgba(215,165,68,.42)!important;box-shadow:0 0 16px rgba(215,165,68,.18)!important}
.u-cursor.is-hover .u-cursor__ring,.u-cursor.is-magnet .u-cursor__ring{border-color:rgba(215,165,68,.82)!important;box-shadow:0 0 28px rgba(215,165,68,.28),0 0 58px rgba(215,165,68,.12)!important}
.u-cursor__trail{background:rgba(215,165,68,.55)!important;box-shadow:0 0 10px rgba(215,165,68,.24)!important}

@media(max-width:900px){
  .home-page .topbar,.page-service .topbar,.en-page .topbar,.home-page .top,.page-service .top{
    background:rgba(31,35,38,.97)!important;
  }
  .drawer__panel{background:#272c30!important}
  .drawer__nav>a,.drawer__details>summary{background:#2d3337!important}
}


/* UmkaPro graphite + gold v2 — explicit header and contact form correction */
:root{
  --umka-graphite-header:#34393d;
  --umka-graphite-panel:#30353a;
  --umka-graphite-panel-2:#292e32;
  --umka-graphite-field:#24292d;
  --umka-graphite-line:#535d63;
  --umka-gold:#d7a544;
  --umka-gold-light:#e4ba6a;
}

/* The header had its own hard-coded almost-black background. */
html body .topbar,
html body .top,
html body.home-page .topbar,
html body.page-service .topbar,
html body.en-page .topbar,
html body .topbar#top{
  background:rgba(52,57,61,.97)!important;
  background-color:#34393d!important;
  border-bottom:1px solid #555f65!important;
  box-shadow:0 12px 34px rgba(0,0,0,.24)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
html body .topbar .topbar__row,
html body .top .toprow{
  background:transparent!important;
}
html body .topbar .nav a:hover,
html body .topbar .nav__summary:hover{
  background:#41474c!important;
}
html body .topbar .iconbtn,
html body .topbar .header-quicklink,
html body .topbar .hamb{
  background:#2d3236!important;
  border-color:#59636a!important;
}
html body .nav__submenu{
  background:#343a3f!important;
  border-color:#59636a!important;
  box-shadow:0 20px 54px rgba(0,0,0,.34)!important;
}
html body .nav__submenu a:hover{
  background:#41484d!important;
}

/* Contact area: remove the legacy orange glow and make it graphite. */
html body #contact{
  background:#262b2f!important;
  border-color:#444d53!important;
}
html body #contact .contact,
html body #contact .contact.reveal,
html body .contact.reveal{
  background:linear-gradient(145deg,#353b40 0%,#2d3236 56%,#292e32 100%)!important;
  border:1px solid #535d63!important;
  box-shadow:0 22px 58px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.035)!important;
}
html body #contact .contact::before,
html body #contact .contact::after{
  background:none!important;
  box-shadow:none!important;
}
html body #contact form,
html body #contact #leadForm{
  background:#2b3034!important;
  border:1px solid #505a60!important;
  border-radius:20px!important;
  padding:20px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
html body #contact .field{
  background:transparent!important;
}
html body #contact label,
html body #contact .small,
html body #contact .hint{
  color:#b9c0c4!important;
}
html body #contact input:not([type="checkbox"]),
html body #contact textarea,
html body #contact select{
  background:#24292d!important;
  background-color:#24292d!important;
  border:1px solid #566067!important;
  color:#f4f4f2!important;
  box-shadow:none!important;
}
html body #contact input:not([type="checkbox"]):focus,
html body #contact textarea:focus,
html body #contact select:focus{
  border-color:#a9833d!important;
  box-shadow:0 0 0 4px rgba(215,165,68,.12)!important;
}
html body #contact input[type="checkbox"]{
  accent-color:#d7a544!important;
}
html body #contact .formrow .btn:not(.btn--accent){
  background:#343a3f!important;
  border-color:#59636a!important;
  color:#f4f4f2!important;
}
html body #contact .formrow .btn--accent,
html body #contact button[type="submit"]{
  background:linear-gradient(135deg,#e4ba6a 0%,#d7a544 58%,#b8832d 100%)!important;
  border-color:rgba(215,165,68,.65)!important;
  color:#17130d!important;
}

/* The short calculator form uses the same visual language. */
html body .quiz-section{
  background:#24292d!important;
}
html body .quiz-form{
  background:#2b3034!important;
  border:1px solid #505a60!important;
  border-radius:20px!important;
  padding:20px!important;
}
html body .quiz-q,
html body .quiz-opt{
  background:#30363a!important;
  border-color:#535d63!important;
}
html body .quiz-opt:has(input:checked){
  border-color:#a9833d!important;
  background:rgba(215,165,68,.12)!important;
}
html body .quiz-form input[type="radio"]{
  accent-color:#d7a544!important;
}

/* Remaining hard-coded orange accents. */
html body .design-note,
html body .design-warning{
  background:rgba(215,165,68,.10)!important;
  border-color:rgba(215,165,68,.34)!important;
}
html body .design-step::before{
  background:#d7a544!important;
  color:#17130d!important;
}
html body .service-next-v7__card small{
  color:#d7a544!important;
}

@media(max-width:900px){
  html body .topbar,
  html body .top,
  html body.home-page .topbar,
  html body.page-service .topbar,
  html body.en-page .topbar{
    background:#34393d!important;
  }
  html body .drawer__panel{
    background:#30363a!important;
    border-color:#535d63!important;
  }
  html body #contact form,
  html body #contact #leadForm{
    padding:16px!important;
    border-radius:17px!important;
  }
}
/* --- theme-graphite-gold-v3 --- */
/* UmkaPro messenger widget v3: muted gold + real icons */
html body .umka-messenger__button,
html body.home-page.home-premium-v5 .umka-messenger__button,
html body .umka-messenger summary.umka-messenger__button{
  background:#d7a544!important;
  background-image:linear-gradient(135deg,#e2bf76 0%,#d7a544 48%,#b68a3d 100%)!important;
  border:1px solid rgba(239,207,137,.72)!important;
  color:#17130d!important;
  outline:none!important;
  box-shadow:0 16px 38px rgba(0,0,0,.30),0 0 0 1px rgba(215,165,68,.10)!important;
}
html body .umka-messenger__button:hover{
  background:#e4ba6a!important;
  background-image:linear-gradient(135deg,#ebcf95 0%,#dfb967 50%,#be9144 100%)!important;
  filter:none!important;
  transform:translateY(-2px)!important;
}
html body .umka-messenger__button:focus,
html body .umka-messenger__button:focus-visible{
  outline:2px solid #e8c97f!important;
  outline-offset:3px!important;
  box-shadow:0 16px 38px rgba(0,0,0,.30),0 0 0 5px rgba(215,165,68,.18)!important;
}
html body .umka-messenger__icon{
  background:rgba(35,31,24,.16)!important;
  color:#17130d!important;
  box-shadow:inset 0 0 0 1px rgba(23,19,13,.10)!important;
}
html body .umka-messenger__title,
html body .umka-messenger__subtitle{color:#17130d!important}

html body .umka-messenger__menu{
  background:#292e32!important;
  border-color:#566067!important;
  padding:10px!important;
  gap:8px!important;
}
html body .umka-messenger__menu a{
  display:grid!important;
  grid-template-columns:46px 1fr 18px!important;
  align-items:center!important;
  gap:13px!important;
  min-height:66px!important;
  padding:9px 13px 9px 9px!important;
  background:#343a3f!important;
  border:1px solid #4b555b!important;
  border-radius:15px!important;
  color:#f7f7f5!important;
  font-weight:800!important;
  text-decoration:none!important;
  transition:transform .18s ease,border-color .18s ease,background .18s ease!important;
}
html body .umka-messenger__menu a::after{
  content:'→';
  color:#929da3;
  font-size:18px;
  font-weight:400;
  justify-self:end;
}
html body .umka-messenger__menu a:hover{
  transform:translateX(-2px)!important;
  background:#3a4146!important;
  border-color:#8b6b32!important;
}
html body .umka-menu-label{font-size:16px;line-height:1.1}
html body .umka-menu-icon{
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border-radius:13px;
  color:#fff;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 7px 18px rgba(0,0,0,.16);
}
html body .umka-menu-icon svg{width:25px;height:25px;display:block}
html body .umka-menu-icon svg path{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
html body .umka-menu-icon--wa{background:linear-gradient(135deg,#28b979,#11885a)}
html body .umka-menu-icon--tg{background:linear-gradient(135deg,#45afe8,#267eb7)}
html body .umka-menu-icon--tg svg path,
html body .umka-menu-icon--max svg path{fill:currentColor;stroke:none}
html body .umka-menu-icon--max{background:linear-gradient(135deg,#6659dc,#9a5bda)}

@media(max-width:760px){
  html body .umka-messenger__menu a{min-height:62px!important;grid-template-columns:44px 1fr 17px!important}
  html body .umka-menu-icon{width:44px;height:44px;border-radius:12px}
  html body .umka-menu-label{font-size:15px}
}
/* --- theme-graphite-gold-v4 --- */
/* UmkaPro graphite + gold v4 — darker header */
:root{
  --umka-header-deep:#191c1f;
  --umka-header-deep-mobile:#1b1e21;
  --umka-header-line:#363d42;
}

/* Dark graphite header: visibly darker than the page, but not pure black. */
html body .topbar,
html body .top,
html body.home-page .topbar,
html body.page-service .topbar,
html body.page-case .topbar,
html body.en-page .topbar,
html body .topbar#top{
  background:#191c1f!important;
  background-color:#191c1f!important;
  border-bottom:1px solid var(--umka-header-line)!important;
  box-shadow:0 12px 34px rgba(0,0,0,.34)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
html body .topbar::before,
html body .topbar::after,
html body .top::before,
html body .top::after{
  background-color:transparent!important;
}
html body .topbar .topbar__row,
html body .top .toprow{
  background:transparent!important;
}
html body .topbar .nav a:hover,
html body .topbar .nav__summary:hover{
  background:#262a2e!important;
}
html body .topbar .iconbtn,
html body .topbar .header-quicklink,
html body .topbar .language-switch,
html body .topbar .hamb{
  background:#24282c!important;
  border-color:#424a50!important;
}
html body .nav__submenu{
  background:#202428!important;
  border-color:#424b51!important;
}
html body .nav__submenu a:hover{background:#2a2f33!important}

@media(max-width:900px){
  html body .topbar,
  html body .top,
  html body.home-page .topbar,
  html body.page-service .topbar,
  html body.page-case .topbar,
  html body.en-page .topbar{
    background:#1b1e21!important;
    background-color:#1b1e21!important;
  }
  html body .drawer__panel{background:#202428!important}
}
/* --- theme-header-deep-v5 --- */
/* UmkaPro — deep graphite header v5 */
:root{
  --umka-header-v5:#0d0f11;
  --umka-header-v5-hover:#171a1d;
  --umka-header-v5-line:#2d3236;
}
html body .topbar,
html body .top,
html body.home-page .topbar,
html body.page-service .topbar,
html body.page-case .topbar,
html body.en-page .topbar,
html body .topbar#top,
html body .topbar.is-scrolled,
html body .topbar.scrolled,
html body .top.is-scrolled,
html body .top.scrolled{
  background:#0d0f11!important;
  background-color:#0d0f11!important;
  background-image:none!important;
  border-bottom:1px solid #2d3236!important;
  box-shadow:0 12px 34px rgba(0,0,0,.52)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html body .topbar > .container,
html body .topbar .topbar__row,
html body .top > .container,
html body .top .toprow{
  background:#0d0f11!important;
  background-color:#0d0f11!important;
  background-image:none!important;
}
html body .topbar::before,
html body .topbar::after,
html body .top::before,
html body .top::after{
  background:none!important;
  background-color:transparent!important;
  opacity:0!important;
}
html body .topbar .nav a:hover,
html body .topbar .nav__summary:hover,
html body .topbar .iconbtn:hover,
html body .topbar .header-quicklink:hover{
  background:#171a1d!important;
}
html body .topbar .iconbtn,
html body .topbar .header-quicklink,
html body .topbar .language-switch,
html body .topbar .hamb{
  background:#15181b!important;
  border-color:#343a3f!important;
}
html body .nav__submenu,
html body .drawer__panel{
  background:#14171a!important;
  border-color:#343a3f!important;
}
@media(max-width:900px){
  html body .topbar,
  html body .top,
  html body .topbar > .container,
  html body .topbar .topbar__row,
  html body .top > .container,
  html body .top .toprow{
    background:#0b0d0f!important;
    background-color:#0b0d0f!important;
    background-image:none!important;
  }
}
/* --- theme-header-graphite-v6 --- */
/* UmkaPro — unified graphite header v6 */
:root{
  --umka-header-v6:#171b1e;
  --umka-header-v6-mobile:#15191c;
  --umka-header-v6-hover:#24292d;
  --umka-header-v6-line:#3a4248;
}
html body .topbar,
html body header.topbar,
html body div.topbar,
html body .top,
html body.home-page .topbar,
html body.page-service .topbar,
html body.page-case .topbar,
html body.en-page .topbar,
html body .topbar#top,
html body .topbar.is-scrolled,
html body .topbar.scrolled,
html body .topbar.sticky,
html body .topbar.fixed{
  background:#171b1e!important;
  background-color:#171b1e!important;
  background-image:none!important;
  border-bottom:1px solid #3a4248!important;
  box-shadow:0 10px 28px rgba(0,0,0,.34)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html body .topbar > .container,
html body header.topbar > .container,
html body div.topbar > .container,
html body .topbar .topbar__row,
html body .top > .container,
html body .top .toprow{
  background:#171b1e!important;
  background-color:#171b1e!important;
  background-image:none!important;
}
html body .topbar::before,
html body .topbar::after,
html body .top::before,
html body .top::after{
  background:none!important;
  opacity:0!important;
}
html body .topbar .nav a:hover,
html body .topbar .nav__summary:hover,
html body .topbar .iconbtn:hover,
html body .topbar .header-quicklink:hover{
  background:#24292d!important;
}
html body .topbar .iconbtn,
html body .topbar .header-quicklink,
html body .topbar .language-switch,
html body .topbar .hamb{
  background:#20252a!important;
  border-color:#41494f!important;
}
html body .nav__submenu,
html body .drawer__panel{
  background:#1a1f22!important;
  border-color:#3a4248!important;
}
@media(max-width:900px){
  html body .topbar,
  html body header.topbar,
  html body div.topbar,
  html body .top,
  html body .topbar > .container,
  html body .topbar .topbar__row,
  html body .top > .container,
  html body .top .toprow{
    background:#15191c!important;
    background-color:#15191c!important;
    background-image:none!important;
  }
}
/* --- theme-motion-premium-v1 --- */
/* UmkaPro Premium Motion v1 — subtle, performant, reduced-motion safe */
:root{
  --umka-motion-ease:cubic-bezier(.22,.72,.25,1);
  --umka-motion-fast:260ms;
  --umka-motion-base:620ms;
}

/* Reveal is enabled only after JS marks the document ready. Content stays visible without JS. */
html.umka-motion-ready .umka-motion-item{
  opacity:0;
  transform:translate3d(0,24px,0) scale(.988);
  filter:blur(3px);
  transition:
    opacity var(--umka-motion-base) var(--umka-motion-ease),
    transform var(--umka-motion-base) var(--umka-motion-ease),
    filter 520ms var(--umka-motion-ease),
    border-color 320ms ease,
    box-shadow 420ms ease,
    background-color 320ms ease;
  transition-delay:var(--umka-motion-delay,0ms);
  will-change:opacity,transform,filter;
}
html.umka-motion-ready .umka-motion-item.umka-motion-left{
  transform:translate3d(-28px,0,0) scale(.99);
}
html.umka-motion-ready .umka-motion-item.umka-motion-right{
  transform:translate3d(28px,0,0) scale(.99);
}
html.umka-motion-ready .umka-motion-item.is-inview{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  filter:none;
  will-change:auto;
}

/* Hero arrives slightly faster and more confidently. */
html.umka-motion-ready .umka-motion-hero{
  transition-duration:720ms;
}

/* Premium card interaction. */
:is(.card,.service-card-premium,.service-tile,.install-card,.shot,.qa,.faq__item,.kpi,.visual,.slide){
  transition:
    transform 420ms var(--umka-motion-ease),
    border-color 320ms ease,
    box-shadow 420ms ease,
    background-color 320ms ease;
  transform-origin:center center;
}
:is(.card,.service-card-premium,.service-tile,.install-card,.shot,.visual,.slide) img{
  transition:transform 760ms var(--umka-motion-ease),filter 520ms ease;
  transform:translateZ(0) scale(1.001);
  backface-visibility:hidden;
}
@media (hover:hover) and (pointer:fine){
  :is(.card--link,.service-card-premium,.service-tile,.install-card,.shot,.visual,.slide):hover{
    transform:translate3d(0,-6px,0);
    border-color:rgba(215,165,68,.32)!important;
    box-shadow:0 24px 58px rgba(0,0,0,.30),0 0 0 1px rgba(215,165,68,.08) inset;
  }
  :is(.card--link,.service-card-premium,.service-tile,.install-card,.shot,.visual,.slide):hover img{
    transform:translateZ(0) scale(1.035);
    filter:saturate(1.04) contrast(1.02);
  }
  .service-card-icon,.stepnum--icon,.iconbtn{
    transition:transform 360ms var(--umka-motion-ease),border-color 280ms ease,background-color 280ms ease,box-shadow 320ms ease;
  }
  :is(.card--link,.service-card-premium,.service-tile):hover .service-card-icon,
  .card:hover .stepnum--icon{
    transform:translate3d(0,-2px,0) scale(1.045);
    border-color:rgba(215,165,68,.42)!important;
    box-shadow:0 10px 26px rgba(0,0,0,.22),0 0 22px rgba(215,165,68,.09);
  }
}

/* Buttons: subtle lift and a very restrained light pass. */
.btn,.umka-messenger__button{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  transition:transform 260ms var(--umka-motion-ease),box-shadow 340ms ease,filter 260ms ease,border-color 260ms ease!important;
}
.btn::before,.umka-messenger__button::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-45% auto -45% -35%;
  width:28%;
  transform:skewX(-18deg) translateX(-220%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);
  transition:transform 720ms var(--umka-motion-ease);
  pointer-events:none;
}
@media (hover:hover) and (pointer:fine){
  .btn:hover,.umka-messenger__button:hover{transform:translate3d(0,-2px,0)}
  .btn:hover::before,.umka-messenger__button:hover::before{transform:skewX(-18deg) translateX(620%)}
}

/* Menus and details open smoothly. */
.nav__details[open] .nav__submenu{
  transform-origin:top left;
  animation:umka-menu-in 240ms var(--umka-motion-ease) both;
}
.drawer__details[open] .drawer__submenu,
details.qa[open] > :not(summary),
details.faq__item[open] > :not(summary),
.faq details[open] > :not(summary){
  animation:umka-details-in 300ms var(--umka-motion-ease) both;
}
.umka-messenger__details[open] .umka-messenger__menu{
  animation:umka-menu-up 240ms var(--umka-motion-ease) both;
}
.drawer[aria-hidden="false"] .drawer__panel,
.drawer.is-open .drawer__panel,
.drawer.open .drawer__panel{
  animation:umka-drawer-in 360ms var(--umka-motion-ease) both;
}

@keyframes umka-menu-in{
  from{opacity:0;transform:translate3d(0,-7px,0) scale(.985)}
  to{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
@keyframes umka-menu-up{
  from{opacity:0;transform:translate3d(0,9px,0) scale(.985)}
  to{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
@keyframes umka-details-in{
  from{opacity:0;transform:translate3d(0,-7px,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}
@keyframes umka-drawer-in{
  from{opacity:.5;transform:translate3d(18px,0,0)}
  to{opacity:1;transform:translate3d(0,0,0)}
}

/* Section headings get a quiet animated gold accent. */
.sectionhead{position:relative}
.sectionhead::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-14px;
  width:44px;
  height:1px;
  background:linear-gradient(90deg,rgba(215,165,68,.9),rgba(215,165,68,0));
  transform-origin:left center;
  transform:scaleX(.15);
  opacity:.35;
  transition:transform 700ms var(--umka-motion-ease),opacity 500ms ease;
}
.sectionhead.is-inview::after,
.umka-motion-item.is-inview.sectionhead::after{
  transform:scaleX(1);
  opacity:1;
}

/* Keep motion lighter on phones. */
@media (max-width:760px){
  html.umka-motion-ready .umka-motion-item{
    transform:translate3d(0,15px,0) scale(.994);
    filter:blur(1.5px);
    transition-duration:500ms;
    transition-delay:min(var(--umka-motion-delay,0ms),140ms);
  }
  html.umka-motion-ready .umka-motion-item.umka-motion-left,
  html.umka-motion-ready .umka-motion-item.umka-motion-right{
    transform:translate3d(0,15px,0) scale(.994);
  }
  html.umka-motion-ready .umka-motion-item.is-inview{transform:none;filter:none}
  .sectionhead::after{bottom:-10px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  html.umka-motion-ready .umka-motion-item,
  html.umka-motion-ready .umka-motion-item.is-inview,
  :is(.card,.service-card-premium,.service-tile,.install-card,.shot,.qa,.faq__item,.kpi,.visual,.slide),
  :is(.card,.service-card-premium,.service-tile,.install-card,.shot,.visual,.slide) img,
  .btn,.umka-messenger__button,.sectionhead::after{
    opacity:1!important;
    transform:none!important;
    filter:none!important;
    animation:none!important;
    transition:none!important;
  }
}
/* --- visual-system-v7 --- */
/* UmkaPro unified visual system v7
   Rule: numbered processes use numbers only; service/benefit/system cards may use icons. */

/* Restore native cursor and disable the old decorative cursor. */
html.umka-no-custom-cursor body,
html.umka-no-custom-cursor body *{cursor:auto!important}
html.umka-no-custom-cursor a,
html.umka-no-custom-cursor button,
html.umka-no-custom-cursor summary,
html.umka-no-custom-cursor [role="button"],
html.umka-no-custom-cursor [data-href]{cursor:pointer!important}
.u-cursor{display:none!important}

/* Header and drawer action icons. */
.iconbtn{display:inline-flex;align-items:center;justify-content:center;gap:0!important}
.iconbtn svg{width:18px!important;height:18px!important;display:block;fill:none;stroke:currentColor;stroke-width:1.45!important;stroke-linecap:round;stroke-linejoin:round}
.iconbtn .fill-current{fill:currentColor;stroke:none}
.iconbtn--close svg{width:17px!important;height:17px!important}
.iconbtn--wa,.iconbtn--tg,.iconbtn--close{border-width:1px!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),0 10px 26px rgba(0,0,0,.18)!important}
.iconbtn--wa{color:#83d9a5!important;background:linear-gradient(145deg,rgba(26,54,42,.56),rgba(18,29,25,.72))!important;border-color:rgba(91,199,137,.20)!important}
.iconbtn--tg{color:#8fd5f5!important;background:linear-gradient(145deg,rgba(27,54,69,.58),rgba(18,27,32,.72))!important;border-color:rgba(83,170,214,.20)!important}
.iconbtn--close{color:rgba(245,247,249,.88)!important;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;border-color:rgba(255,255,255,.11)!important}

/* Messenger menu icons. */
.umka-menu-icon{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:44px!important;height:44px!important;flex:0 0 44px!important;border-radius:14px!important;background:linear-gradient(145deg,rgba(255,255,255,.052),rgba(255,255,255,.018))!important;border:1px solid rgba(255,255,255,.10)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 10px 24px rgba(0,0,0,.22)!important;transition:transform .2s ease,border-color .2s ease}
.umka-menu-icon svg{width:20px!important;height:20px!important;fill:none;stroke:currentColor;stroke-width:1.42!important;stroke-linecap:round;stroke-linejoin:round}
.umka-menu-icon .fill-current{fill:currentColor;stroke:none}
.umka-menu-icon--wa{color:#86dca8!important;border-color:rgba(77,190,122,.22)!important}
.umka-menu-icon--tg{color:#8ed6f8!important;border-color:rgba(76,163,208,.22)!important}
.umka-menu-icon--max{color:#b8a6f5!important;border-color:rgba(151,119,225,.23)!important}
.umka-messenger__menu a{gap:12px!important}
.umka-messenger__menu a:hover .umka-menu-icon{transform:translateY(-1px);border-color:rgba(215,165,68,.32)!important}
.umka-menu-label{font-weight:700;letter-spacing:.01em}

/* Shared premium icon badge. */
.stepnum.stepnum--icon,
.service-card-icon,
.page-service .service-tile__icon,
.design-feature__icon,
.design-icon-badge{
  display:grid!important;place-items:center!important;
  width:44px!important;height:44px!important;min-width:44px!important;
  border-radius:14px!important;
  border:1px solid rgba(215,165,68,.24)!important;
  background:linear-gradient(145deg,rgba(215,165,68,.075),rgba(255,255,255,.018))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 10px 24px rgba(0,0,0,.16)!important;
  color:#d7a544!important;
}
.stepnum.stepnum--icon svg,
.service-card-icon svg,
.page-service .service-tile__icon svg,
.design-feature__icon svg,
.design-icon-badge svg{
  width:21px!important;height:21px!important;
  fill:none;stroke:#d7a544!important;stroke-width:1.45!important;
  stroke-linecap:round;stroke-linejoin:round;
}
.stepnum.stepnum--icon .fill-current,
.service-card-icon .fill-current,
.page-service .service-tile__icon .fill-current,
.design-feature__icon .fill-current,
.design-icon-badge .fill-current{fill:#d7a544!important;stroke:none!important}
.service-card-icon{margin:16px 0 17px!important}
.page-service .service-tile__icon{margin:0 0 16px!important}
.design-feature__icon,.design-icon-badge{margin:0 0 13px!important}
.service-card-premium:hover .service-card-icon,
.page-service .service-tile:hover .service-tile__icon{transform:translateY(-2px);border-color:rgba(215,165,68,.42)!important}

/* A process already has a number: never place a second icon beside it. */
.design-step>.design-icon-badge{display:none!important}
.design-step::before,
.page-service .process-step::before{
  background:linear-gradient(145deg,#dfb456,#ca9638)!important;
  color:#14110c!important;
  border:1px solid rgba(242,212,141,.34)!important;
  box-shadow:0 8px 18px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.14)!important;
}
.design-step::before{width:40px!important;height:40px!important;margin-bottom:16px!important;border-radius:50%!important}
.page-service .process-step::before{color:#14110c!important}
.service-flow-v7__num,
.umka-arch-card__num,
.page-service .service-tile__num,
.turnkey-step::before,
.price-saving::before{color:#d7a544!important}

/* Keep hierarchy clean on information cards. */
.design-package-card h3,
.design-result h3,
.design-step h3,
.design-feature h3{margin-top:0!important}
.design-audience .card h2{font-size:clamp(20px,2vw,25px)!important;line-height:1.18!important}

@media(max-width:760px){
  .umka-menu-icon{width:42px!important;height:42px!important;flex-basis:42px!important;border-radius:13px!important}
  .stepnum.stepnum--icon,.service-card-icon,.page-service .service-tile__icon,.design-feature__icon,.design-icon-badge{width:42px!important;height:42px!important;min-width:42px!important;border-radius:13px!important}
  .stepnum.stepnum--icon svg,.service-card-icon svg,.page-service .service-tile__icon svg,.design-feature__icon svg,.design-icon-badge svg{width:20px!important;height:20px!important}
}

/* About section benefit icons. */
#about .card__inner>.stepnum--icon{margin:0 0 16px!important}
#about .tagrow{margin-top:0!important}