:root{
  --v2-bg: #f7f1e6;
  --v2-bg-soft: #f9f4ea;
  --v2-panel: rgba(255,252,246,0.94);
  --v2-text: #4f3f31;
  --v2-muted: rgba(79,63,49,0.74);
  --v2-accent: #9f7440;
  --v2-border: rgba(184,139,74,0.22);
  --v2-shadow: 0 12px 34px rgba(88,63,36,0.08);
}

html,
body{
  background: var(--v2-bg) !important;
  color: var(--v2-text) !important;
  max-width: 100%;
  overflow-x: hidden !important;
  scroll-behavior: smooth;
}

@supports (overflow-x: clip){
  html,
  body{
    overflow-x: clip !important;
  }
}

img,
video,
iframe,
canvas,
svg{
  max-width: 100%;
}

.section--soft,
.page-hero{
  background: linear-gradient(180deg, #f6efe3 0%, var(--v2-bg-soft) 100%) !important;
}

.panel,
.card,
.blog-card,
.service-card,
.price-card,
.price-col,
.faq details{
  background: var(--v2-panel) !important;
  border-color: var(--v2-border) !important;
  color: var(--v2-text) !important;
  box-shadow: var(--v2-shadow) !important;
}

.section-title,
.page-title,
h1,h2,h3,h4,h5,h6,
p,li,span,strong,label{
  color: var(--v2-text);
}

.section-kicker,
.hero-kicker,
.footer-col h4,
.footer-col a{
  color: var(--v2-accent) !important;
}

.navbar,
.navbar--pro{
  background: rgba(247,241,230,0.94) !important;
  border-bottom: 1px solid var(--v2-border) !important;
}

.brand,
.brand-text,
.nav-links a{
  color: var(--v2-text) !important;
}

.lang-flags{
  background: rgba(255,255,255,0.75) !important;
  border-color: rgba(184,139,74,0.30) !important;
}

.btn.primary{
  background: #b88b4a !important;
  color: #fff !important;
}

.btn.ghost{
  background: rgba(184,139,74,0.12) !important;
  color: #7a5730 !important;
  border-color: rgba(184,139,74,0.38) !important;
}

.container{
  width: min(1120px, 92%);
  margin: 0 auto;
}

.side-social{
  position: fixed !important;
  right: 10px !important;
  left: auto !important;
  top: auto !important;
  bottom: 124px !important;
  transform: none !important;
  z-index: 2050 !important;
}

.lcw-toggle{
  position: fixed !important;
  right: 10px !important;
  bottom: 12px !important;
  z-index: 2200 !important;
}

.lcw-box{
  position: fixed !important;
  right: 10px !important;
  left: auto !important;
  bottom: 62px !important;
  z-index: 2200 !important;
}

.h5-reveal{
  opacity: 0;
  filter: blur(1px);
  transition: opacity 620ms ease, transform 620ms ease, filter 620ms ease;
  transition-delay: var(--h5-delay, 0ms);
  will-change: opacity, transform;
}

.h5-reveal.h5-from-up{ transform: translate3d(0, 22px, 0); }
.h5-reveal.h5-from-down{ transform: translate3d(0, -18px, 0); }
.h5-reveal.h5-from-left{ transform: translate3d(-22px, 0, 0); }
.h5-reveal.h5-from-right{ transform: translate3d(22px, 0, 0); }

.h5-reveal.is-in{
  opacity: 1;
  transform: translate3d(0,0,0);
  filter: blur(0);
}

.v2-interactive{
  transition: transform 240ms ease, box-shadow 240ms ease;
  transform-origin: center center;
}

.v2-btn{
  transition: transform 180ms ease, box-shadow 180ms ease, filter 180ms ease;
}

@media (hover: hover) and (pointer: fine){
  .v2-interactive:hover{
    box-shadow: 0 16px 36px rgba(88,63,36,0.12) !important;
  }

  .v2-btn:hover{
    transform: translateY(-1px);
    filter: saturate(1.05);
  }
}

@media (hover: none), (pointer: coarse){
  .v2-interactive.is-pressed{
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(88,63,36,0.12) !important;
  }

  .v2-btn:active{
    transform: scale(0.97);
  }
}

@media (max-width: 900px){
  :root{
    --v2-m-pad: 10px;
    --v2-m-gap: 12px;
    --v2-m-cols: 4;
    --v2-float-safe: 82px;
  }

  /* unified mobile box model for all blocks */
  .section,
  .container,
  .panel,
  .card,
  .price-col,
  .price-card,
  .service-card,
  .blog-card,
  .g-item,
  .contact-left,
  .contact-right{
    box-sizing: border-box;
  }

  .container{
    width: calc(100vw - (var(--v2-m-pad) * 2)) !important;
    max-width: calc(100vw - (var(--v2-m-pad) * 2)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .section{
    padding: 44px 0 !important;
  }

  /* reserve right gutter so content won't be covered by fixed side-social/livechat */
  .section > .container,
  .page-hero > .container,
  .content,
  .footer > .container,
  .feedback .container{
    padding-right: var(--v2-float-safe) !important;
  }

  /* mobile layout is computed by grid tracks */
  .section > .container{
    display: grid !important;
    grid-template-columns: repeat(var(--v2-m-cols), minmax(0, 1fr)) !important;
    gap: var(--v2-m-gap) !important;
    align-items: start;
  }

  .section > .container > *{
    grid-column: 1 / -1 !important;
    min-width: 0 !important;
  }

  .panel,
  .card,
  .price-col,
  .price-card,
  .service-card,
  .blog-card{
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    min-width: 0 !important;
    padding: 14px !important;
  }

  .cards,
  .content .cards,
  .price-grid,
  .gallery-home,
  .gallery-grid,
  .contact,
  .feature,
  .pricing-grid,
  .service-grid,
  .blog-grid{
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .cards > * ,
  .content .cards > * ,
  .price-grid > * ,
  .gallery-home > * ,
  .gallery-grid > * ,
  .contact > * ,
  .feature > * ,
  .pricing-grid > * ,
  .service-grid > * ,
  .blog-grid > * ,
  .menu-grid > *{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .cards > *,
  .content .cards > *,
  .price-grid > *,
  .gallery-home > *,
  .gallery-grid > *,
  .contact > *,
  .feature > *,
  .pricing-grid > *,
  .service-grid > *,
  .blog-grid > *{
    min-width: 0 !important;
  }

  .price-table{
    min-width: 0 !important;
    width: 100% !important;
    table-layout: fixed !important;
  }

  .price-table th,
  .price-table td{
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  .panel *,
  .card *,
  .price-col *,
  .price-card *,
  .service-card *,
  .blog-card *{
    max-width: 100%;
  }

  /* prevent pricing split card from squeezing text on mobile */
  .price-card.price-split,
  .pricing-grid .price-card.price-split{
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-items: start !important;
    gap: 10px !important;
  }

  .price-card.price-split .price-left,
  .pricing-grid .price-left{
    min-width: 0 !important;
  }

  .price-card.price-split .price-thumb,
  .pricing-grid .price-thumb{
    width: 100% !important;
    height: 170px !important;
    flex: 0 0 auto !important;
    border-radius: 12px !important;
    overflow: hidden !important;
  }

  .price-card.price-split .price-thumb img,
  .pricing-grid .price-thumb img{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    max-width: none !important;
    max-height: none !important;
  }

  /* reduce layout squeeze feeling from interactive transform on small screens */
  .v2-interactive{
    transform: none !important;
  }

  .side-social{
    right: 6px !important;
    bottom: 86px !important;
    display: grid !important;
    grid-template-columns: repeat(2, 32px) !important;
    grid-auto-rows: 32px !important;
    gap: 6px !important;
    width: auto !important;
    height: auto !important;
  }

  .side-social a{
    width: 32px !important;
    height: 32px !important;
    border-radius: 999px !important;
    overflow: hidden !important;
  }

  .side-social img{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: inherit !important;
  }

  .lcw-toggle{
    right: 8px !important;
    bottom: 10px !important;
  }

  .lcw-box{
    right: 6px !important;
    bottom: 56px !important;
    width: calc(100vw - 12px) !important;
    max-width: calc(100vw - 12px) !important;
    height: min(68vh, 500px) !important;
  }

  .h5-reveal.h5-from-left{ transform: translate3d(-22px, 0, 0) !important; }
  .h5-reveal.h5-from-right{ transform: translate3d(22px, 0, 0) !important; }
  .h5-reveal.h5-from-up{ transform: translate3d(0, 22px, 0) !important; }
  .h5-reveal.h5-from-down{ transform: translate3d(0, -18px, 0) !important; }
}

@media (max-width: 520px){
  :root{
    --v2-m-pad: 7px;
    --v2-m-gap: 10px;
    --v2-float-safe: 74px;
  }

  .container{
    width: calc(100vw - (var(--v2-m-pad) * 2)) !important;
    max-width: calc(100vw - (var(--v2-m-pad) * 2)) !important;
  }

  .section{
    padding: 36px 0 !important;
  }

  .section > .container,
  .page-hero > .container,
  .content,
  .footer > .container,
  .feedback .container{
    padding-right: var(--v2-float-safe) !important;
  }

  .panel,
  .card,
  .price-col,
  .price-card,
  .service-card,
  .blog-card{
    padding: 12px !important;
  }

  .price-card.price-split .price-thumb,
  .pricing-grid .price-thumb{
    height: 150px !important;
  }
}

/* Minimum-device pack (320px baseline) */
@media (max-width: 360px){
  :root{
    --v2-m-pad: 6px;
    --v2-m-gap: 8px;
    --v2-float-safe: 66px;
  }

  html{
    font-size: 15px;
  }

  .container{
    width: calc(100vw - (var(--v2-m-pad) * 2)) !important;
    max-width: calc(100vw - (var(--v2-m-pad) * 2)) !important;
  }

  .section{
    padding: 30px 0 !important;
  }

  .navbar .nav-top--grid{
    gap: 6px !important;
    padding: 8px 8px !important;
  }

  .brand-logo{
    height: 26px !important;
  }

  .lang-flags{
    gap: 5px !important;
    padding: 4px 6px !important;
    max-width: 136px !important;
    overflow: hidden !important;
  }

  .lang-flags .flag-btn,
  .lang-flags .flag-img{
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
    flex: 0 0 24px !important;
  }

  .nav-controls{
    padding: 8px !important;
  }

  #pageSwitcher,
  .page-switcher{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .panel,
  .card,
  .price-col,
  .price-card,
  .service-card,
  .blog-card{
    padding: 10px !important;
    border-radius: 12px !important;
  }

  .price-card.price-split .price-thumb,
  .pricing-grid .price-thumb{
    height: 132px !important;
  }

  .feedback-wrap{
    grid-template-columns: 1fr !important;
    padding: 12px 8px !important;
  }

  .fb-arrow,
  .fb-side-btn{
    display: none !important;
  }

  .fb-main-wrap{
    width: 160px !important;
    height: 160px !important;
  }

  .fb-main{
    width: 146px !important;
    height: 146px !important;
  }

  .fb-text{
    width: 100% !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
  }

  .side-social{
    right: 4px !important;
    bottom: 88px !important;
    gap: 5px !important;
  }

  .side-social a{
    width: 28px !important;
    height: 28px !important;
    overflow: hidden !important;
  }

  .side-social img{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: inherit !important;
  }

  .lcw-toggle{
    right: 6px !important;
    bottom: 8px !important;
    padding: 8px 10px !important;
    font-size: 13px !important;
  }

  .lcw-box{
    right: 4px !important;
    bottom: 48px !important;
    width: calc(100vw - 8px) !important;
    max-width: calc(100vw - 8px) !important;
    height: min(62vh, 440px) !important;
    border-radius: 10px !important;
  }

  .modal.show .modal-panel{
    width: calc(100vw - 10px) !important;
    max-width: calc(100vw - 10px) !important;
    max-height: 82vh !important;
  }

  .modal-body,
  .card p,
  .price-col li,
  .contact-lines,
  .faq p{
    word-break: break-word;
    overflow-wrap: anywhere;
  }
}

/* Mobile layout repair: keep content aligned while fixed widgets float above it. */
@media (max-width: 900px){
  .navbar,
  .navbar--pro{
    padding: 10px 12px !important;
  }

  .nav-top--grid{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 0 !important;
  }

  .brand{
    min-width: 0 !important;
  }

  .brand-text{
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .lang-flags{
    flex: 0 0 auto !important;
  }

  .nav-controls{
    display: flex !important;
    width: 100% !important;
    padding: 10px 0 0 !important;
  }

  #pageSwitcher,
  .page-switcher{
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 42px !important;
    color: #4f3f31 !important;
    background: rgba(255,255,255,0.86) !important;
    border: 1px solid rgba(184,139,74,0.18) !important;
    box-shadow: none !important;
  }

  .slider.hero,
  .hero--tall{
    min-height: 520px !important;
    height: calc(100svh - 126px) !important;
    max-height: 680px !important;
    border-radius: 0 0 14px 14px !important;
  }

  .slide-content,
  .slide-content h1,
  .slide-content h2,
  .slide-content p,
  .hero-content,
  .hero-content p{
    color: #fff !important;
  }

  .hero-content p,
  .slide-content p{
    opacity: .94 !important;
    text-shadow: 0 2px 14px rgba(0,0,0,.45) !important;
  }

  .section > .container,
  .page-hero > .container,
  .content,
  .footer > .container,
  .feedback .container{
    padding-right: 0 !important;
  }

  .section > .container{
    display: block !important;
  }

  .section > .container > * + *{
    margin-top: 14px !important;
  }

  .container{
    width: min(100% - 24px, 1120px) !important;
    max-width: min(100% - 24px, 1120px) !important;
  }

  .cards,
  .content .cards,
  .price-grid,
  .gallery-home,
  .gallery-grid,
  .contact,
  .feature,
  .pricing-grid,
  .service-grid,
  .blog-grid{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .panel,
  .card,
  .price-col,
  .price-card,
  .service-card,
  .blog-card,
  .g-item,
  .contact-left,
  .contact-right,
  .feature-media,
  .feature-text--visual{
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
  }

  .h5-reveal,
  .h5-reveal.h5-from-left,
  .h5-reveal.h5-from-right,
  .h5-reveal.h5-from-up,
  .h5-reveal.h5-from-down{
    transform: translate3d(0, 12px, 0) !important;
  }

  .h5-reveal.is-in{
    transform: translate3d(0, 0, 0) !important;
  }

  .side-social{
    right: 8px !important;
    bottom: 78px !important;
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    grid-auto-rows: auto !important;
    gap: 8px !important;
    z-index: 2050 !important;
    opacity: .94 !important;
  }

  .side-social a{
    width: 44px !important;
    height: 44px !important;
    overflow: hidden !important;
    background: rgba(0,0,0,0.48) !important;
    border-color: rgba(255,255,255,0.2) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.26) !important;
  }

  .side-social img{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: inherit !important;
  }

  .lcw-toggle{
    right: 8px !important;
    bottom: 10px !important;
    min-height: 42px !important;
  }

  .feedback{
    overflow: hidden !important;
  }

  .feedback-head{
    text-align: center !important;
    margin-bottom: 14px !important;
  }

  .feedback .section-title,
  .feedback .section-h2{
    color: var(--v2-text) !important;
  }

  .feedback-wrap{
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) 42px !important;
    justify-items: center !important;
    align-items: center !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: auto !important;
    padding: 20px 14px 18px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    background:
      radial-gradient(360px 220px at 50% 18%, rgba(220,179,97,.16), transparent 68%),
      rgba(255,252,246,.96) !important;
  }

  .feedback-wrap .fb-side-btn{
    display: none !important;
  }

  .feedback-wrap .fb-arrow{
    display: grid !important;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    place-items: center !important;
    align-self: center !important;
    border-radius: 999px !important;
    border: 1px solid rgba(184,139,74,.34) !important;
    background: rgba(255,255,255,.82) !important;
    color: #7a5730 !important;
    box-shadow: 0 8px 20px rgba(88,63,36,.14) !important;
    font-size: 18px !important;
    line-height: 1 !important;
    z-index: 3 !important;
  }

  .feedback-wrap .fb-arrow.left{
    grid-column: 1 !important;
    justify-self: start !important;
  }

  .feedback-wrap .fb-arrow.right{
    grid-column: 3 !important;
    justify-self: end !important;
  }

  .fb-stage{
    grid-column: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    justify-items: center !important;
    gap: 10px !important;
    padding: 0 !important;
  }

  .fb-row{
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 0 !important;
    margin: 0 auto !important;
  }

  .fb-center{
    width: 100% !important;
  }

  .fb-main-wrap{
    width: 178px !important;
    height: 178px !important;
    margin: 0 auto !important;
  }

  .fb-main{
    width: 158px !important;
    height: 158px !important;
    border-width: 5px !important;
  }

  .fb-halo{
    inset: -14px !important;
    opacity: .62 !important;
  }

  .fb-meta{
    width: 100% !important;
    margin-top: 6px !important;
    padding: 0 !important;
    text-align: center !important;
  }

  .fb-name{
    color: var(--v2-text) !important;
    font-size: 20px !important;
    line-height: 1.25 !important;
    letter-spacing: .12em !important;
  }

  .fb-line{
    width: 54px !important;
    margin: 8px auto 10px !important;
    background: rgba(184,139,74,.9) !important;
  }

  .fb-text{
    width: 100% !important;
    max-width: 100% !important;
    color: rgba(79,63,49,.78) !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    padding: 0 4px !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
  }

  .fb-dots{
    width: 100% !important;
    margin-top: 8px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px !important;
  }

  .fb-dot{
    width: 8px !important;
    height: 8px !important;
    background: rgba(79,63,49,.22) !important;
  }

  .fb-dot.active{
    background: rgba(184,139,74,.95) !important;
  }
}

@media (max-width: 520px){
  .container{
    width: calc(100% - 20px) !important;
    max-width: calc(100% - 20px) !important;
  }

  .navbar,
  .navbar--pro{
    padding: 9px 10px !important;
  }

  .brand-logo{
    height: 30px !important;
  }

  .brand-text{
    font-size: 16px !important;
  }

  .lang-flags{
    gap: 6px !important;
    padding: 5px 8px !important;
  }

  .lang-flags .flag-btn,
  .lang-flags .flag-img{
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
  }

  .slider.hero,
  .hero--tall{
    min-height: 500px !important;
    height: calc(100svh - 118px) !important;
  }

  .slide-content{
    padding: 0 20px !important;
  }

  .slider-btn{
    width: 40px !important;
    height: 40px !important;
  }

  .side-social{
    right: 6px !important;
    bottom: 76px !important;
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    grid-auto-rows: auto !important;
    gap: 7px !important;
  }

  .side-social a{
    width: 40px !important;
    height: 40px !important;
    overflow: hidden !important;
  }

  .side-social img{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: inherit !important;
  }

  .feedback-wrap{
    padding: 18px 12px 16px !important;
    grid-template-columns: 36px minmax(0, 1fr) 36px !important;
  }

  .feedback-wrap .fb-arrow{
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    font-size: 16px !important;
  }

  .fb-main-wrap{
    width: 160px !important;
    height: 160px !important;
  }

  .fb-main{
    width: 142px !important;
    height: 142px !important;
  }

  .fb-name{
    font-size: 18px !important;
  }

  .fb-text{
    font-size: 13.5px !important;
    line-height: 1.6 !important;
  }
}

/* Site-wide contrast repair: final color layer for light theme + image hero areas. */
body{
  color: var(--v2-text) !important;
}

a{
  color: var(--v2-accent);
}

.section-kicker,
.section-kicker2,
.section-kicker3,
.section-kicker4,
.hero-kicker,
.footer-col h4,
.footer-col a,
.text-link,
.contact-lines a,
.price-col h3,
.faq summary{
  color: var(--v2-accent) !important;
}

.section-title,
.section-title2,
.section-title3,
.section-title4,
.page-title,
.contact-title,
.card h3,
.card--dark h3,
.service-card h3,
.blog-card h3,
.price-card h3,
.modal-title,
.modal-head h3,
.footer-col strong,
.contact-lines strong{
  color: var(--v2-text) !important;
}

.section-desc,
.section-desc2,
.section-desc3,
.section-desc4,
.card p,
.card--dark p,
.service-card p,
.blog-card p,
.price-card p,
.price-col li,
.faq p,
.contact-lines,
.modal-desc,
.modal-body,
.footer-col p,
.footer-col li,
.footer-bottom{
  color: var(--v2-muted) !important;
}

.panel,
.card,
.card--dark,
.blog-card,
.service-card,
.price-card,
.price-col,
.faq details,
.contact-left,
.contact-right,
.modal-panel{
  color: var(--v2-text) !important;
}

.field span{
  color: rgba(79,63,49,.78) !important;
}

.field input,
.field textarea{
  background: #fffdf9 !important;
  color: var(--v2-text) !important;
  border-color: rgba(184,139,74,.28) !important;
}

.field input::placeholder,
.field textarea::placeholder{
  color: rgba(79,63,49,.48) !important;
}

.slider .slide-content,
.slider .slide-content h1,
.slider .slide-content h2,
.slider .slide-content p,
.hero .hero-content,
.hero .hero-content h1,
.hero .hero-content h2,
.hero .hero-content p{
  color: #fff !important;
}

.slider .hero-kicker,
.hero .hero-kicker{
  color: rgba(220,179,97,.96) !important;
}

.slider .btn.primary,
.hero .btn.primary{
  background: #d3a24d !important;
  color: #fff !important;
}

.slider .btn.ghost,
.hero .btn.ghost{
  background: rgba(255,255,255,.16) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.42) !important;
}

.page-hero,
.page-hero h1,
.page-hero h2,
.page-hero p{
  color: var(--v2-text) !important;
}

.page-hero .page-subtitle,
.page-hero .section-desc{
  color: var(--v2-muted) !important;
}

.navbar,
.navbar--pro,
.brand,
.brand-text,
.nav-links a,
#pageSwitcher,
.page-switcher{
  color: var(--v2-text) !important;
}

#pageSwitcher option,
.page-switcher option,
#languageSwitcher option{
  color: #1f160f !important;
  background: #fffdf9 !important;
}

.feedback .section-title,
.feedback .section-h2,
.fb-name{
  color: var(--v2-text) !important;
}

.feedback-wrap{
  background:
    radial-gradient(640px 360px at 50% 24%, rgba(220,179,97,.16), transparent 68%),
    rgba(255,252,246,.96) !important;
  color: var(--v2-text) !important;
}

.fb-text{
  color: var(--v2-muted) !important;
}

.fb-dot{
  background: rgba(79,63,49,.22) !important;
}

.fb-dot.active,
.fb-line{
  background: rgba(184,139,74,.95) !important;
}

.feedback-wrap .fb-arrow{
  background: rgba(255,255,255,.86) !important;
  color: #7a5730 !important;
  border-color: rgba(184,139,74,.36) !important;
}

.footer{
  background: #efe5d6 !important;
  color: var(--v2-text) !important;
}

.footer-social a{
  background: rgba(255,255,255,.72) !important;
  border-color: rgba(184,139,74,.24) !important;
}

.price-table,
.price-table th,
.price-table td{
  color: var(--v2-text) !important;
}

.modal-panel .btn.ghost{
  color: #5a3e2b !important;
  background: rgba(90,62,43,.1) !important;
  border-color: rgba(90,62,43,.25) !important;
}

.book-modal,
.book-modal__panel,
.book-modal__title,
.book-modal label,
.book-modal p,
.book-modal span,
.img-modal,
.img-modal__panel{
  color: #fff !important;
}

.book-modal input,
.book-modal textarea,
.book-modal select{
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.18) !important;
}

.book-modal option{
  color: #1a1a1a !important;
  background: #fff !important;
}

.content,
.about-page,
.about-text,
.about-contact,
.blog-page,
.pricing-page,
.gallery-page,
.services-page,
.menu-page,
.landing-page{
  color: var(--v2-text) !important;
}

.content h1,
.content h2,
.content h3,
.content h4,
.section-subtitle,
.hero__content h1,
.hero__content h2,
.badge,
.badge span,
.about-contact h3,
.about-text h1,
.about-text h2,
.about-text h3,
.menu-title,
.menu-page h1,
.menu-page h2,
.menu-page h3,
.landing-page h1,
.landing-page h2,
.landing-page h3,
.card__body h1,
.card__body h2,
.card__body h3{
  color: var(--v2-text) !important;
}

.content p,
.content li,
.content small,
.hero__content p,
.lead,
.about-text p,
.about-contact li,
.about-contact p,
.menu-page p,
.menu-page li,
.landing-page p,
.landing-page li,
.card__body p,
.card__body li{
  color: var(--v2-muted) !important;
}

.about-contact a,
.menu-page a,
.landing-page a:not(.btn),
.content a:not(.btn){
  color: var(--v2-accent) !important;
}

.about-contact,
.landing-page .card,
.landing-page .card__body,
.content .card{
  background-color: rgba(255,252,246,.94) !important;
  color: var(--v2-text) !important;
}

.btn,
.btn:visited,
.btn--primary,
.btn--primary:visited,
.btn.primary,
.btn.primary:visited{
  color: #fff !important;
}

.btn.ghost,
.btn--outline,
.btn--outline:visited{
  color: #7a5730 !important;
}

.page-hero .btn,
.hero .btn,
.slider .btn{
  color: #fff !important;
}

/* Mobile motion pack: stronger H5 dynamics without layout shift. */
@media (max-width: 900px) and (prefers-reduced-motion: no-preference){
  .slide.active{
    animation: h5HeroBreath 7.5s ease-in-out infinite alternate;
    transform-origin: center center;
  }

  .hero-kicker{
    animation: h5SoftGlow 2.8s ease-in-out infinite;
  }

  .h5-reveal{
    opacity: 0 !important;
    filter: blur(7px) saturate(.92) !important;
    transition:
      opacity 780ms cubic-bezier(.2,.72,.18,1),
      transform 780ms cubic-bezier(.2,.72,.18,1),
      filter 780ms cubic-bezier(.2,.72,.18,1),
      box-shadow 360ms ease !important;
    transition-delay: var(--h5-delay, 0ms) !important;
    transform: translate3d(-56px, 18px, 0) scale(.965) !important;
  }

  .h5-reveal.h5-from-left{
    transform: translate3d(-72px, 16px, 0) scale(.965) !important;
  }

  .h5-reveal.h5-from-right{
    transform: translate3d(72px, 16px, 0) scale(.965) !important;
  }

  .h5-reveal.h5-from-up{
    transform: translate3d(-52px, 20px, 0) scale(.965) !important;
  }

  .h5-reveal.h5-from-down{
    transform: translate3d(52px, -16px, 0) scale(.965) !important;
  }

  .h5-reveal.is-in{
    opacity: 1 !important;
    filter: blur(0) saturate(1) !important;
    transform: translate3d(0, 0, 0) scale(1) !important;
  }

  .v2-interactive{
    transition:
      transform 220ms cubic-bezier(.2,.72,.18,1),
      box-shadow 220ms ease,
      filter 220ms ease !important;
  }

  .v2-interactive.is-pressed{
    transform: translate3d(0, -4px, 0) scale(.985) !important;
    filter: saturate(1.06) !important;
    box-shadow: 0 18px 34px rgba(88,63,36,.18) !important;
  }

  .v2-btn{
    transition:
      transform 180ms cubic-bezier(.2,.72,.18,1),
      box-shadow 180ms ease,
      filter 180ms ease !important;
  }

  .v2-btn:active,
  .btn:active,
  .slider-btn:active,
  .feedback-wrap .fb-arrow:active,
  .side-social a:active,
  .lcw-toggle:active{
    transform: scale(.94) !important;
    filter: saturate(1.12) brightness(1.03) !important;
  }

  .btn.primary,
  .lcw-toggle{
    animation: h5ButtonPulse 2.6s ease-in-out infinite;
  }

  .side-social a{
    animation: h5FloatStrong 2.4s ease-in-out infinite !important;
    transform-origin: center center;
  }

  .side-social a:nth-child(2){ animation-delay: .14s !important; }
  .side-social a:nth-child(3){ animation-delay: .28s !important; }
  .side-social a:nth-child(4){ animation-delay: .42s !important; }

  .service-item img,
  .g-item img,
  .feature-img,
  .feature-text-img,
  .fb-main{
    transition: transform 420ms cubic-bezier(.2,.72,.18,1), filter 420ms ease !important;
  }

  .service-item:active img,
  .g-item:active img,
  .feature-media:active .feature-img,
  .feature-text--visual:active .feature-text-img,
  .fb-main-wrap:active .fb-main{
    transform: scale(1.035) !important;
    filter: saturate(1.08) contrast(1.03) !important;
  }

  .fb-halo{
    animation: h5HaloPulse 2.1s ease-in-out infinite !important;
  }

  .fb-dot.active{
    animation: h5DotPulse 1.5s ease-in-out infinite !important;
  }
}

@keyframes h5HeroBreath{
  from{ transform: scale(1); }
  to{ transform: scale(1.045); }
}

@keyframes h5SoftGlow{
  0%,100%{ text-shadow: 0 0 0 rgba(220,179,97,0); }
  50%{ text-shadow: 0 0 18px rgba(220,179,97,.42); }
}

@keyframes h5ButtonPulse{
  0%,100%{ box-shadow: 0 10px 24px rgba(184,139,74,.20); }
  50%{ box-shadow: 0 14px 34px rgba(184,139,74,.38); }
}

@keyframes h5FloatStrong{
  0%,100%{ transform: translate3d(0,0,0) scale(1); }
  50%{ transform: translate3d(0,-5px,0) scale(1.04); }
}

@keyframes h5HaloPulse{
  0%,100%{ transform: scale(.98); opacity: .56; }
  50%{ transform: scale(1.05); opacity: .82; }
}

@keyframes h5DotPulse{
  0%,100%{ transform: scale(1); opacity: .9; }
  50%{ transform: scale(1.35); opacity: 1; }
}

/* Home promo/menu pair: keep ed*.png and DM*.jpg in one horizontal row for every language. */
.page-home .feature{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: clamp(8px, 2vw, 18px) !important;
}

.page-home .feature-text--visual,
.page-home .feature-media{
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  aspect-ratio: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 16px !important;
  overflow: visible !important;
  background: transparent !important;
  box-shadow: none !important;
}

.page-home .feature-text-img,
.page-home .feature-img{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  border: 1px solid rgba(184,139,74,.36) !important;
  border-radius: 16px !important;
  box-sizing: border-box !important;
}

@media (max-width: 520px){
  .page-home .feature{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .page-home .feature-text--visual,
  .page-home .feature-media{
    height: auto !important;
    aspect-ratio: auto !important;
    border-radius: 12px !important;
  }

  .page-home .feature-text-img,
  .page-home .feature-img{
    height: auto !important;
    object-fit: contain !important;
    border-radius: 12px !important;
  }
}

/* Mobile motion readability refinement: strong left/right slide, no unreadable blur. */
@media (max-width: 900px) and (prefers-reduced-motion: no-preference){
  .h5-reveal{
    opacity: 0 !important;
    filter: blur(1.5px) saturate(.98) !important;
    transition:
      opacity 680ms cubic-bezier(.16,.84,.2,1),
      transform 680ms cubic-bezier(.16,.84,.2,1),
      filter 520ms ease,
      box-shadow 300ms ease !important;
    transform: translate3d(-64px, 0, 0) scale(.985) !important;
  }

  .h5-reveal.h5-from-left,
  .h5-reveal.h5-from-up{
    transform: translate3d(-78px, 0, 0) scale(.985) !important;
  }

  .h5-reveal.h5-from-right,
  .h5-reveal.h5-from-down{
    transform: translate3d(78px, 0, 0) scale(.985) !important;
  }

  .h5-reveal.is-in{
    opacity: 1 !important;
    filter: blur(0) saturate(1) !important;
    transform: translate3d(0, 0, 0) scale(1) !important;
  }

  .panel.h5-reveal,
  .card.h5-reveal,
  .blog-card.h5-reveal,
  .service-card.h5-reveal,
  .price-card.h5-reveal,
  .price-col.h5-reveal{
    will-change: opacity, transform;
  }
}

/* About contact readability: override old gray glass cards on light mobile theme. */
.about-contact{
  background: rgba(255,252,246,.96) !important;
  border: 1px solid rgba(184,139,74,.24) !important;
  box-shadow: 0 14px 34px rgba(88,63,36,.08) !important;
  color: var(--v2-text) !important;
}

.about-contact h3{
  color: var(--v2-text) !important;
}

.about-contact li{
  background: rgba(255,255,255,.82) !important;
  border: 1px solid rgba(184,139,74,.18) !important;
  color: var(--v2-text) !important;
}

.about-contact strong{
  color: #5d4530 !important;
  text-shadow: none !important;
}

.about-contact span{
  color: rgba(79,63,49,.82) !important;
  text-shadow: none !important;
}

.about-contact a{
  color: #93652c !important;
  text-shadow: none !important;
  font-weight: 600 !important;
}

@media (max-width: 900px){
  .about-contact{
    padding: 16px !important;
    border-radius: 16px !important;
  }

  .about-contact ul{
    display: grid !important;
    gap: 12px !important;
  }

  .about-contact li{
    padding: 14px 14px !important;
    border-radius: 14px !important;
    line-height: 1.65 !important;
  }

  .about-contact strong{
    display: block !important;
    margin-bottom: 6px !important;
    font-size: 15px !important;
    font-weight: 800 !important;
  }

  .about-contact span,
  .about-contact a{
    display: inline-block !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
  }
}

/* Footer cleanup: hide the repeated zalochief.jpg QR image column site-wide. */
.footer-logo{
  display: none !important;
}

.footer-grid{
  grid-template-columns: 1.4fr 1fr 1fr !important;
}

@media (max-width: 980px){
  .footer-grid{
    grid-template-columns: 1fr 1fr !important;
  }
}

@media (max-width: 520px){
  .footer-grid{
    grid-template-columns: 1fr !important;
  }
}

/* Site background is finalized at the end of this file. */

/* Mobile header: keep the CHIEF SPA title visible beside the logo. */
@media (max-width: 520px){
  .brand{
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .brand-text{
    display: inline-block !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: 120px !important;
    font-size: 14px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

@media (max-width: 360px){
  .brand{
    gap: 5px !important;
  }

  .brand-text{
    max-width: 92px !important;
    font-size: 12px !important;
  }
}

/* Brand title: refined gold sheen beside the logo. */
.brand-text{
  position: relative;
  display: inline-block;
  overflow: hidden;
  color: #9f7440 !important;
  background: none !important;
  -webkit-text-fill-color: #9f7440;
  text-shadow: 0 1px 0 rgba(255,255,255,0.55), 0 5px 12px rgba(122,78,28,0.12);
}

.brand-text::before{
  content: "";
  position: absolute;
  top: -35%;
  bottom: -35%;
  width: 42%;
  background: linear-gradient(100deg, rgba(255,255,255,0) 0%, rgba(255,246,201,0.68) 48%, rgba(255,255,255,0) 100%);
  opacity: .72;
  pointer-events: none;
  transform: translateX(-180%) skewX(-18deg);
  will-change: transform;
  animation: chiefBrandSheen 5.2s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce){
  .brand-text::before{
    animation: none !important;
  }
}

@keyframes chiefBrandSheen{
  0%, 72%{
    transform: translateX(-180%) skewX(-18deg);
  }
  100%{
    transform: translateX(310%) skewX(-18deg);
  }
}

/* Final full-site background override: one complete design image, never tiled. */
html{
  min-height: 100% !important;
  background-color: #f7f1e6 !important;
  background-image: url("../images/images/web-bg.jpg") !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: 100% 100vh !important;
  background-attachment: fixed !important;
}

body{
  min-height: 100vh !important;
  background: transparent !important;
  position: relative !important;
  isolation: isolate !important;
}

body::before{
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(255,252,246,0.08) 0%, rgba(255,252,246,0.20) 48%, rgba(247,241,230,0.30) 100%) !important;
}

.section,
.section--soft,
.page-hero,
main{
  background-image: none !important;
  background-color: transparent !important;
}

@media (max-width: 768px){
  html{
    background-image: none !important;
    background-attachment: scroll !important;
    background-size: auto !important;
    background-position: center top !important;
  }

  body{
    background: #f7f1e6 !important;
  }

  body::after{
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: -2 !important;
    pointer-events: none !important;
    background-image: url("../images/images/web-bg.jpg") !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: 100vw 100dvh !important;
  }

  body::before{
    position: fixed !important;
    background:
      linear-gradient(180deg, rgba(255,252,246,0.02) 0%, rgba(255,252,246,0.10) 48%, rgba(247,241,230,0.18) 100%) !important;
  }
}

@media (min-width: 769px){
  html{
    background-size: 100% 100vh !important;
    background-position: center top !important;
  }
}

/* Home hero: fill the PC viewport below the navbar and use drag instead of arrows. */
@media (min-width: 901px){
  body.page-home .slider.hero,
  body.page-home .hero--tall{
    height: calc(100vh - 76px) !important;
    min-height: 680px !important;
    max-height: none !important;
  }
}

body.page-home .slider.hero{
  cursor: grab;
  user-select: none;
  touch-action: pan-y;
}

body.page-home .slider.hero.is-dragging{
  cursor: grabbing;
}

body.page-home .slider.hero .slider-btn{
  display: none !important;
}

body.page-home .video-slide-viewport .video-slide-nav{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  padding: 0 0 7px !important;
}

.hero-wave-text{
  display: inline-flex !important;
  flex-wrap: wrap;
  gap: .03em;
  color: #fffaf0 !important;
  line-height: 1.12 !important;
  -webkit-text-fill-color: #fffaf0 !important;
  text-shadow:
    0 2px 0 rgba(90,62,43,.95),
    0 6px 18px rgba(0,0,0,.72),
    0 0 22px rgba(220,179,97,.42) !important;
}

.hero-wave-char{
  display: inline-block;
  color: #fffaf0 !important;
  -webkit-text-fill-color: #fffaf0 !important;
  -webkit-text-stroke: 1px rgba(90,62,43,.55);
  transform-origin: 50% 80%;
  animation: heroWaveJump 1.65s ease-in-out infinite;
  animation-delay: calc(var(--wave-i) * 70ms);
  will-change: transform, text-shadow;
}

body.page-home .slider .hero-kicker{
  color: #f5c76e !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.68) !important;
}

body.page-home .slider .slide-content p{
  color: #fff !important;
  opacity: 1 !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.82) !important;
}

@keyframes heroWaveJump{
  0%, 100%{
    transform: translateY(0) scale(1);
    text-shadow:
      0 2px 0 rgba(90,62,43,.95),
      0 6px 18px rgba(0,0,0,.72),
      0 0 22px rgba(220,179,97,.42);
  }
  22%{
    transform: translateY(-8px) scale(1.045);
    text-shadow:
      0 2px 0 rgba(90,62,43,.95),
      0 10px 24px rgba(0,0,0,.78),
      0 0 26px rgba(220,179,97,.62);
  }
  44%{
    transform: translateY(2px) scale(.99);
  }
}

@media (prefers-reduced-motion: reduce){
  .hero-wave-char{
    animation: none !important;
  }
}

@media (max-width: 768px){
  .hero-wave-text{
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    gap: 0 !important;
    white-space: nowrap !important;
  }

  .hero-wave-char{
    animation-name: heroWaveJumpMobile;
    animation-duration: 1.8s;
  }

  @keyframes heroWaveJumpMobile{
    0%, 100%{
      transform: translateY(0) scale(1);
    }
    22%{
      transform: translateY(-4px) scale(1.025);
    }
    44%{
      transform: translateY(1px) scale(.995);
    }
  }
}

@media (max-width: 768px){
  .video-more{
    display: flex !important;
    gap: 10px !important;
    overflow-x: auto !important;
    padding: 12px 12px 16px !important;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }

  .video-more-card{
    flex: 0 0 168px !important;
    scroll-snap-align: start;
  }
}

/* Unified site content reveal: left/right entrance at a calmer 3s pace. */
.h5-reveal{
  opacity: 0 !important;
  filter: blur(2px) saturate(.98) !important;
  transition:
    opacity 3000ms cubic-bezier(.16,.84,.2,1),
    transform 3000ms cubic-bezier(.16,.84,.2,1),
    filter 3000ms cubic-bezier(.16,.84,.2,1) !important;
  transition-delay: var(--h5-delay, 0ms) !important;
}

.h5-reveal.h5-from-left,
.h5-reveal.h5-from-up{
  transform: translate3d(-72px, 0, 0) scale(.985) !important;
}

.h5-reveal.h5-from-right,
.h5-reveal.h5-from-down{
  transform: translate3d(72px, 0, 0) scale(.985) !important;
}

.h5-reveal.is-in{
  opacity: 1 !important;
  filter: blur(0) saturate(1) !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
}

@media (max-width: 768px){
  .h5-reveal{
    filter: none !important;
  }

  .h5-reveal.h5-from-left,
  .h5-reveal.h5-from-up{
    transform: translate3d(-18px, 0, 0) !important;
  }

  .h5-reveal.h5-from-right,
  .h5-reveal.h5-from-down{
    transform: translate3d(18px, 0, 0) !important;
  }

  .h5-reveal.is-in{
    filter: none !important;
    transform: translate3d(0, 0, 0) !important;
  }
}

/* Feedback selected avatar color refinement. */
.fb-main{
  border: 6px solid rgb(159 131 91 / 95%) !important;
  box-shadow: none !important;
}

.fb-halo{
  display: none !important;
  animation: none !important;
}

.fb-line,
.fb-dot.active{
  background: rgb(159 131 91 / 95%) !important;
}

.feedback-wrap .fb-arrow{
  background: rgba(255,252,246,.96) !important;
  color: rgb(159 131 91 / 95%) !important;
  border: 1px solid rgba(159,131,91,.18) !important;
  box-shadow: 0 14px 28px rgba(159,131,91,.24) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  padding: 0 0 7px !important;
}

.feedback-wrap .fb-arrow:hover{
  background: #fff !important;
  color: rgb(159 131 91 / 95%) !important;
  border-color: rgba(159,131,91,.24) !important;
  box-shadow: 0 16px 32px rgba(159,131,91,.28) !important;
}

.footer{
  padding-top: 36px !important;
  padding-bottom: 14px !important;
}
