/* Original template layout is defined in style.css. */
.header-logo img,.mobile-logo img{max-width:210px;height:auto}
.service-block ul{padding-left:20px;text-align:left}
.service-block li{margin-bottom:10px}
details{padding:20px 0;border-bottom:1px solid #ddd}
summary{cursor:pointer;font-weight:700;color:var(--title-color);font-size:20px}
details p{margin-top:16px}
[id]{scroll-margin-top:100px}
.vscost-calc .vs-btn{margin-top:16px}
/* Keep the decorative about image behind the copy and photo collage. */
.about--layout1{isolation:isolate}
.about--layout1 > .about-overlay{z-index:0;opacity:.08;pointer-events:none}
.about--layout1 > .container{position:relative;z-index:1}

/* Shared content rhythm, without changing the template's columns or imagery. */
main{--section-space:96px;--section-space-mobile:64px;--section-title-space:64px}
main > section.space-extra-bottom{padding-bottom:48px}
main > section[class="space-top space-extra-bottom"] + section[class="space-top space-extra-bottom"]{padding-top:48px}
main > .project--layout1 + .vsfaqs--layout1{padding-top:64px}
main > .blog--layout1 > .container > .space-extra-bottom:empty{display:none}

/* Text-only inner pages: adjacent blocks share one section gap. */
main > section[class="space-top space-extra-bottom"] > .container > h2{margin-bottom:24px}
main > section[class="space-top space-extra-bottom"] > .container > p{margin-bottom:20px}
main > section[class="space-top space-extra-bottom"] > .container > ul{margin-block:20px 28px}
main > section[class="space-top space-extra-bottom"] > .container > ul > li{margin-bottom:10px}
main > section[class="space-top space-extra-bottom"] > .container > :last-child{margin-bottom:0}
main .service-block > h3{margin-bottom:16px}
main .service-block > p{margin-bottom:20px}
main .service-block > ul{margin-bottom:24px}
main .service-block > ul > li:last-child{margin-bottom:0}
main .about--layout1 .sec-title{margin-bottom:24px}
main .about--layout1 .vs-counter{margin-top:12px}

@media(max-width:991px){
  main > section.space-extra-bottom{padding-bottom:32px}
  main > section[class="space-top space-extra-bottom"] + section[class="space-top space-extra-bottom"]{padding-top:32px}
  main > .project--layout1 + .vsfaqs--layout1{padding-top:48px}
  main .about--layout1 .img-box1{margin-bottom:40px}
  main > section[class="space-top space-extra-bottom"] > .container > h2{margin-bottom:20px}
}
img{height:auto}

/* Keep all quote-panel copy readable against its black background. */
.vscost-calc p{color:var(--white-color)}

/* Keep the hero navigation and call action on a single desktop row. */
@media(min-width:992px){
  .header-layout1 .menu-top > .row{flex-wrap:nowrap;gap:24px}
  .header-layout1 .menu-top > .row > :first-child{width:auto;flex:0 0 auto}
  .header-layout1 .menu-top > .row > :last-child{width:auto;flex:1;min-width:0}
  .header-layout1 .menu-top > .row > :last-child > .row{flex-wrap:nowrap;--bs-gutter-x:24px}
  .header-layout1 .main-menu > ul{display:flex;align-items:center;gap:clamp(12px,1.5vw,24px)}
  .header-layout1 .main-menu.menu-style1 > ul > li > a{padding:14px 0;margin:0;white-space:nowrap}
  .header-layout1 .header-btns{display:flex;align-items:center;flex-wrap:nowrap;gap:20px}
  .header-layout1 .header-btns .vs-btn{white-space:nowrap}
}
@media(min-width:992px) and (max-width:1199px){
  .header-layout1 .header-logo img{max-width:160px}
  .header-layout1 .menu-top > .row{gap:16px}
  .header-layout1 .menu-top > .row > :last-child > .row{--bs-gutter-x:16px}
  .header-layout1 .main-menu > ul{gap:12px}
  .header-layout1 .main-menu.menu-style1 > ul > li > a{font-size:14px}
  .header-layout1 .header-btns{gap:12px}
  .header-layout1 .header-btns svg{width:28px}
  .header-layout1 .header-btns .vs-btn{padding:18px 24px}
}

/* Desktop hamburger uses the same navigation drawer as the mobile trigger. */
.desktop-menu-toggle{border:0;cursor:pointer}
.desktop-menu-toggle:not(.icon-btn){padding:0;background:transparent;color:var(--theme-color)}
.desktop-menu-toggle:focus-visible{outline:2px solid var(--theme-color);outline-offset:4px}

/* Persistent WhatsApp contact, clear of the right-hand scroll control. */
.whatsapp-float{position:fixed;left:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:999;width:60px;height:60px;border-radius:50%;display:block;box-shadow:0 3px 12px #0003}
.whatsapp-float img{display:block;width:100%;height:100%;object-fit:contain}
.whatsapp-float:focus-visible{outline:3px solid #fff;outline-offset:3px;box-shadow:0 0 0 6px #167c24}
@media(max-width:575px){.whatsapp-float{left:16px;width:54px;height:54px;bottom:calc(16px + env(safe-area-inset-bottom,0px))}}

.footer-credits{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;margin:12px 0 0;font-size:14px;text-transform:none}
.footer-credits a{color:var(--white-color);font-weight:600}
.footer-credits a:hover,.footer-credits a:focus-visible{color:var(--theme-color);text-decoration:underline}
@media(min-width:992px){.footer-credits{justify-content:flex-start}}

/* Article-only reading rhythm; existing site layout stays unchanged. */
.paint-guide{max-width:900px;margin-inline:auto}
.paint-guide section,.paint-guide nav{margin-top:40px}
.paint-guide h2{margin-bottom:20px}
.paint-guide h3{font-size:22px;margin-top:24px}
.paint-guide li{margin-bottom:10px}
.paint-guide figure{margin:28px 0}
.paint-guide figure img{width:100%;height:auto}
.paint-guide figcaption,.paint-guide__meta{font-size:14px;color:#595959}
.paint-guide figcaption{margin-top:8px}
.paint-guide__contact{display:inline-block;margin:16px}
.paint-guide-card{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;margin-bottom:24px}
.paint-guide table{min-width:540px}

.paint-guide .table-responsive{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.paint-guide table{width:100%;border-collapse:collapse;margin-block:16px}
.paint-guide th,.paint-guide td{padding:12px;border:1px solid #ddd;text-align:left;vertical-align:top}
.paint-guide thead{background:#f5f5f5}
.paint-guide caption{text-align:left;color:#595959}

/* Preserve the original homepage card image proportions with the new artwork. */
.blog--layout1 .blog-img__img{width:100%;aspect-ratio:551/432;object-fit:cover}

/* Keep the desktop tagline clear of the orange corner decoration. */
@media (min-width:992px){
  .header-layout1 .header-top .header-text:not(.header-info){padding-left:40px}
}

/* Stretch service cards to the tallest slide and align their actions. */
.service--layout1 .slick-track{display:flex;align-items:stretch}
.service--layout1 .slick-track::before,.service--layout1 .slick-track::after{display:none}
.service--layout1 .slick-slide{height:auto;display:flex}
.service--layout1 .service-block{width:100%;display:flex;flex-direction:column;align-items:center}
.service--layout1 .service-block__link{margin-top:auto;flex-shrink:0}

/* Shared rounded actions: clean pill silhouettes without template edge bars. */
body .vs-btn,body .icon-btn,body .project-block__link,body .usta-service-link,body .service-page-cta{
  border-radius:999px!important;overflow:hidden;min-height:44px;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease;
}
body .vs-btn{background:#000;color:#fff;border:1px solid #000}
body .vs-btn::before,body .vs-btn::after,body .vs-btn__bar{display:none}
body .vs-btn:hover,body .vs-btn:focus-visible{background:var(--theme-color,#fc6601);border-color:var(--theme-color,#fc6601);color:#fff}
body .vs-btn[href^="tel:"],body .vs-btn[href*="iletisim"],body .service-page-cta[href^="tel:"]{background:var(--theme-color,#fc6601);border-color:var(--theme-color,#fc6601);color:#fff}
body .vs-btn[href^="tel:"]:hover,body .vs-btn[href*="iletisim"]:hover,body .service-page-cta[href^="tel:"]:hover{background:#000;border-color:#000;color:#fff}
body .service-page-cta{background:#000;text-align:center}
body .service-page-cta[href*="wa.me"],body .vs-btn[href*="wa.me"]{background:#168344;border-color:#168344;color:#fff}
body .service-page-cta[href*="wa.me"]:hover,body .vs-btn[href*="wa.me"]:hover{background:#106632;border-color:#106632}
body .usta-service-link{background:#000}
body .usta-service-link:hover,body .usta-service-link:focus-visible{background:#fc6601;color:#fff}
body .vs-menu-toggle{border-radius:50%}
body .vs-btn:focus-visible,body .icon-btn:focus-visible,body .usta-service-link:focus-visible,body .service-page-cta:focus-visible{outline:3px solid #fc6601;outline-offset:4px}
@media(prefers-reduced-motion:reduce){body .vs-btn,body .icon-btn,body .usta-service-link,body .service-page-cta{transition:none}}

/* Footer navigation rules must not flatten the phone action. */
body .footer-widget.widget_nav_menu .vs-widget-about a.vs-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:auto;max-width:100%;min-height:54px;padding:16px 26px;margin-top:8px;border:1px solid var(--theme-color);border-radius:999px!important;font-size:18px;font-weight:700;line-height:1.2;white-space:nowrap;text-align:center;background:var(--theme-color);color:#fff}
body .footer-widget.widget_nav_menu .vs-widget-about a.vs-btn:hover{background:#fff;border-color:#fff;color:#000}
body .footer-widget.widget_nav_menu .vs-widget-about a.vs-btn::before,body .footer-widget.widget_nav_menu .vs-widget-about a.vs-btn::after{display:none}

/* Blend the logo row into the footer instead of a separate dark stripe. */
.footer-layout--style .footer-layout__bottom{background:transparent}
.footer-layout--style .footer-layout__bottom::before{display:none}
