/* Zak100301 fixes layer on the existing dark design (critique + a11y). Remove the <link> in header.blade.php to roll back. */
:root{--zf-red:#9c0808;--zf-focus:#ff5a64;--zf-ease:cubic-bezier(.2,.8,.2,1)}

/* ---------- No sideways scroll on any device ---------- */
html,body{overflow-x:clip}
.roll__area,.circular-gallery-section,.marquee-container-wrapper,.offcanvas__area{overflow-x:hidden;max-width:100vw}
.offcanvas__menu,.offcanvas__menu ul,.offcanvas__menu a{max-width:100%}
@media (min-width:1400px){.story__area .from-text{right:0}}
@media (max-width:991px){
  .container.g-0>.row{margin-left:0;margin-right:0}
  .footer__row{margin-left:0!important;margin-right:0!important;max-width:100%}
  .work_listing,.row.work_listing{margin-left:0;margin-right:0}
}

/* ---------- Floating call / email / WhatsApp: compact stack, off the content ---------- */
.phone_connect,.email_connect,.whatsapp_connect{top:auto!important;right:20px!important;width:46px!important;height:46px!important;transform:none!important;box-shadow:0 8px 20px -8px rgba(0,0,0,.6);transition:transform .2s var(--zf-ease)}
.whatsapp_connect{bottom:84px!important}
.email_connect{bottom:140px!important}
.phone_connect{bottom:196px!important}
.phone_connect a img,.email_connect a img,.whatsapp_connect a img{width:34px!important;height:34px!important}
@media (hover:hover){.phone_connect:hover,.email_connect:hover,.whatsapp_connect:hover{transform:scale(1.08)!important}}
#scroll_top{right:20px!important;bottom:24px!important}
@media (max-width:767px){
  .email_connect{display:none!important}
  .phone_connect,.whatsapp_connect{right:12px!important;width:44px!important;height:44px!important}
  .whatsapp_connect{bottom:72px!important}
  .phone_connect{bottom:124px!important}
  #scroll_top{right:12px!important;bottom:18px!important}
}

/* ---------- Comfortable tap targets on touch ---------- */
@media (max-width:767px){
  .cus-url-btn{display:inline-flex!important;align-items:center;min-height:34px;padding-inline:12px!important}
  .service_view,.footer__copyright a,.blog__meta a{display:inline-flex;align-items:center;min-height:36px}
  .footer__area li a,.footer__link a,.footer__contact a{display:inline-block;padding:9px 0}
  .contact__info a,.contact-info a{display:inline-block;padding:6px 0}
}

/* ---------- Readability ---------- */
.circular-gallery-article-binomial{font-size:max(12px,clamp(.55rem,1.3vw,.75em))!important}
.circular-gallery-article-title{font-size:max(13px,clamp(.7rem,1.8vw,1em))!important}
.circular-gallery-counter{color:#d9d9d9}
.circular-gallery-counter span:first-child{color:#fff}
/* FAQ "more questions" box: input matches the card instead of a black block */
.subscribe-btn .form-control,input[placeholder="Your email address"]{background:#fff!important;color:#121212!important;border:1px solid #cfcfcf!important}
.subscribe-btn .form-control::placeholder{color:#6b6b6b!important}

/* ---------- Feedback ---------- */
a,button{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--zf-focus)!important;outline-offset:3px}
.cus-url-btn{transition:background .2s,color .2s,border-color .2s}
@media (hover:hover){.cus-url-btn:hover{background:var(--zf-red)!important;color:#fff!important;border-color:var(--zf-red)!important}}
.btn-item:active,.wc-btn-primary:active,.wc-btn-secondary:active,.service_view:active,button[type=submit]:active{transform:scale(.97)}
.blog__item .blog__img-wrapper,.blog__item .img-box{overflow:hidden}
.blog__item img{transition:transform .8s var(--zf-ease)}
@media (hover:hover){.blog__item:hover img{transform:scale(1.04)}}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}.blog__item img{transition:none}}

/* ---------- You-are-here in the header (set by zak-fixes.js) ---------- */
.header_nav_links ul li a.underline-below[aria-current="page"]::after{width:100%;background:#e01b24}
.header_nav_links ul li>ul.drop-down-ul a[aria-current="page"]{color:#ff5a64!important}

/* ---------- Accessibility (axe, WCAG 2.2 AA) ---------- */
.header__support > p{color:#cfcfcf!important}                       /* 2.96:1 -> 7:1 */
.blog__btn.cus-url-btn{color:#5c5c5c!important}                      /* "Read More" 2.84:1 -> 6.6:1 on white */
.footer__copyright a,.footer__btm p a{text-decoration:underline;text-underline-offset:2px} /* link not by colour alone */
.testimonial-dots{gap:0!important}
.testimonial-dot{width:24px!important;height:24px!important;padding:6px!important;border-radius:12px!important;background-clip:content-box!important} /* same 12px dot, 24px tap target */
.testimonial-dot.active{width:44px!important}

/* ---------- Polish ---------- */
.counter__number,.circular-gallery-counter,.workflow__number{font-variant-numeric:tabular-nums}   /* numbers don't jitter while counting */
.sec-title,.faq__title,.service__title,.blog__title,.footer__subscribe h2{text-wrap:balance}        /* no single-word last lines */
main p{text-wrap:pretty}
.blog__item .img-box img,.blog__item .blog__img-wrapper img{outline:1px solid rgba(0,0,0,.06);outline-offset:-1px} /* crisp image edge on white */
button:disabled,button[disabled],.btn[disabled]{opacity:.5;cursor:not-allowed}
.contact__info h2{margin-bottom:16px}  /* breathing room above phone links */

/* Smooth-scroll wrapper: viewport height so ScrollSmoother measures max scroll correctly (master.css makes it position:relative for sticky) */
#smooth-wrapper{height:100vh!important}

/* Zak100301 works grid + case study */
.albumFilter li span.work_filter_buttons{position:static;display:inline!important;font-size:16px;line-height:inherit}
.blog__item .blog__img-wrapper{position:relative}
.blog__item .wk-tag{position:absolute;z-index:2;top:12px;left:12px;padding:3px 10px;border-radius:20px;background:#c8232e;color:#fff;font-size:11px;letter-spacing:.08em;text-transform:uppercase;pointer-events:none}
.blog__item:not(.has-case) .blog__img-wrapper{cursor:default}
.case-study .cs-kicker,.case-study .cs-label{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#ff5a64;margin-bottom:10px}
.case-study .cs-summary{font-size:20px;line-height:1.5;max-width:760px;margin-top:24px;color:#555;text-wrap:pretty}
.case-study .cs-block{padding-bottom:90px}
.case-study .portfolio__detail-text p{text-wrap:pretty}
.case-study .cs-lists{gap:60px;flex-wrap:wrap;margin-top:30px}
.case-study .cs-lists>div{flex:0 0 auto;min-width:200px}
.case-study .cs-lists ul{list-style:none;padding:0;width:auto}
.case-study .cs-lists li{padding:3px 0}
.case-study .cs-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;background:#e5e5e5;border:1px solid #e5e5e5;margin:0 0 90px}
.case-study .cs-metric{background:#fff;padding:34px 28px}
.case-study .cs-metric strong{display:block;font-size:48px;line-height:1;font-weight:600;color:#121212;font-variant-numeric:tabular-nums}
.case-study .cs-metric span{display:block;margin-top:10px;color:#555}
.case-study .block-gallery video{width:50%;float:left;padding-bottom:20px}
.case-study .block-gallery video:nth-child(odd){padding-right:10px}.case-study .block-gallery video:nth-child(even){padding-left:10px}
.case-study .block-gallery.cs-single img,.case-study .block-gallery.cs-single video{width:100%;padding:0 0 20px}
.case-study .cs-wide img,.case-study .cs-wide video,.case-study .cs-split-imgs img,.case-study .cs-split-imgs video{width:100%;height:auto;display:block}
.case-study .block-img-text{margin-bottom:60px}
.case-study .block-img-text .cs-split-imgs{width:60%}.case-study .block-img-text p{width:40%}
.case-study .block-img-text .cs-split-imgs:only-child{width:100%}
.case-study .cs-wide{margin:0 0 60px}
.case-study .cs-wide figcaption{margin-top:12px;color:#666;font-size:14px}
.case-study .cs-split-imgs{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}
.case-study .cs-quote{margin:40px auto 0;max-width:900px;text-align:center}
.case-study .cs-quote blockquote{font-size:28px;line-height:1.45;color:#121212;text-wrap:balance}
.case-study .cs-quote figcaption{margin-top:18px;color:#555}
.case-study .cs-quote figcaption span{display:block;font-size:14px}
.case-study .cs-cta{padding:110px 0 120px;background:#121212;color:#fff}
.case-study .cs-cta h2{color:#fff;font-size:42px;margin-bottom:14px;text-wrap:balance}
.case-study .cs-cta p{color:#cfcfcf;margin-bottom:34px}
.case-study .cs-cta .wc-btn-primary{color:#fff;border-color:#fff;margin:0 auto}
@media (max-width:767px){.case-study .block-img-text{flex-direction:column}.case-study .block-img-text .cs-split-imgs,.case-study .block-img-text p{width:100%;padding:20px 0 0}.case-study .cs-summary{font-size:17px}.case-study .cs-metric strong{font-size:36px}.case-study .cs-quote blockquote{font-size:21px}.case-study .cs-cta h2{font-size:30px}.case-study .cs-block{padding-bottom:60px}}

/* Zak100301 form message toast */
.zk-flash{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:99999;max-width:min(560px,calc(100vw - 32px));background:#121212;color:#fff;border-left:4px solid #ff5a64;border-radius:10px;padding:14px 46px 14px 18px;font-size:15px;line-height:1.45;box-shadow:0 12px 40px rgba(0,0,0,.35)}
.zk-flash button{position:absolute;right:8px;top:6px;width:32px;height:32px;border:0;background:none;color:#cfcfcf;font-size:22px;cursor:pointer}

/* Zak100301 testimonial initials when no logo */
.testimonial-avatar .t-initials{display:flex;width:100%;height:100%;align-items:center;justify-content:center;background:#2a0b0d;color:#fff;font-weight:700;font-size:18px;letter-spacing:.5px}