.elementor-10275 .elementor-element.elementor-element-de77169{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:-65px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}.elementor-10275 .elementor-element.elementor-element-32bb83f{padding:0px 0px 0px 0px;}.elementor-10275 .elementor-element.elementor-element-529df94d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--overlay-opacity:0.5;overflow:visible;}.elementor-10275 .elementor-element.elementor-element-529df94d:not(.elementor-motion-effects-element-type-background), .elementor-10275 .elementor-element.elementor-element-529df94d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#151724;}.elementor-10275 .elementor-element.elementor-element-529df94d::before, .elementor-10275 .elementor-element.elementor-element-529df94d > .elementor-background-video-container::before, .elementor-10275 .elementor-element.elementor-element-529df94d > .e-con-inner > .elementor-background-video-container::before, .elementor-10275 .elementor-element.elementor-element-529df94d > .elementor-background-slideshow::before, .elementor-10275 .elementor-element.elementor-element-529df94d > .e-con-inner > .elementor-background-slideshow::before, .elementor-10275 .elementor-element.elementor-element-529df94d > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#151724;--background-overlay:'';}.elementor-10275 .elementor-element.elementor-element-55ad52e4{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -18px) 0px;padding:0px 0px 0px 0px;}.elementor-10275 .elementor-element.elementor-element-55ad52e4 .elementskit-section-title-wraper .elementskit-section-title{color:#7434FA;font-size:62px;}.elementor-10275 .elementor-element.elementor-element-55ad52e4 .elementskit-section-title-wraper .elementskit-section-title:hover{color:#FFFFFF;}.elementor-10275 .elementor-element.elementor-element-55ad52e4 .elementskit-section-title-wraper .elementskit-section-title > span{color:#FFFFFF;}.elementor-10275 .elementor-element.elementor-element-55ad52e4 .elementskit-section-title-wraper .elementskit-section-title:hover > span{color:#FFCE05;}.elementor-10275 .elementor-element.elementor-element-55ad52e4 .elementskit-section-title-wraper .elementskit-border-divider{width:100px;}.elementor-10275 .elementor-element.elementor-element-55ad52e4 .elementskit-section-title-wraper .elementskit-border-divider.elementskit-style-long{width:100px;height:4px;}.elementor-10275 .elementor-element.elementor-element-55ad52e4 .elementskit-section-title-wraper .elementskit-border-star{width:100px;height:4px;}.elementor-10275 .elementor-element.elementor-element-55ad52e4 .elementskit-section-title-wraper .elementskit-border-divider, .elementor-10275 .elementor-element.elementor-element-55ad52e4 .elementskit-border-divider::before{height:4px;}.elementor-10275 .elementor-element.elementor-element-1d36cf6d{background-color:#151724;}.elementor-10275 .elementor-element.elementor-element-4d59b749{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--overlay-opacity:0.5;overflow:visible;}.elementor-10275 .elementor-element.elementor-element-4d59b749:not(.elementor-motion-effects-element-type-background), .elementor-10275 .elementor-element.elementor-element-4d59b749 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-10275 .elementor-element.elementor-element-4d59b749::before, .elementor-10275 .elementor-element.elementor-element-4d59b749 > .elementor-background-video-container::before, .elementor-10275 .elementor-element.elementor-element-4d59b749 > .e-con-inner > .elementor-background-video-container::before, .elementor-10275 .elementor-element.elementor-element-4d59b749 > .elementor-background-slideshow::before, .elementor-10275 .elementor-element.elementor-element-4d59b749 > .e-con-inner > .elementor-background-slideshow::before, .elementor-10275 .elementor-element.elementor-element-4d59b749 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#FFFFFF;--background-overlay:'';}.elementor-10275 .elementor-element.elementor-element-6c7bd2c2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:40px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;overflow:visible;}@media(max-width:767px){.elementor-10275 .elementor-element.elementor-element-55ad52e4 .elementskit-section-title-wraper .elementskit-section-title > span{padding:20px 0px 0px 0px;}}/* Start custom CSS for html, class: .elementor-element-32bb83f *//* ZagaTech — Hotel Page (scoped to #hotel-page) */

#hotel-page{
  --ink:#0f1117; --bg:#0f1117; --bg-2:#121724;
  --brand:#00d1b2; --brand-2:#ffce05;
  --text:#ffffff; --muted:#cbd1dc; --surface:#ffffff;
  --soft:0 0 16px 5px rgba(147,147,147,.20);
  --soft-2:0 0 16px 5px rgba(0,0,0,.20);
  --radius:14px; --radius-lg:22px;
}
#hotel-page section{ margin-top:35px; }
.ht-wrap{ width:min(1200px,92%); margin-inline:auto; }
.ht-h2{ font-size:clamp(26px,3.2vw,40px); line-height:1.2; font-weight:900; margin:0 0 12px; }

/* Topbar */
.ht-topbar{ background:#fff; border-bottom:1px solid rgba(0,0,0,.08); color:#000;}
.ht-topbar__inner{ width:min(1200px,92%); margin-inline:auto; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:8px 0; }
.ht-topbar__badges, .ht-topbar__regions{ display:flex; gap:10px; flex-wrap:wrap; list-style:none; padding:0; margin:0; }
.ht-topbar__badges li{ font-weight:800; font-size:12px; background:#f4f6fa; padding:6px 10px; border-radius:999px; }
.ht-topbar__regions li{ font-weight:700; font-size:12px; color:#333; color:#000; }

/* Buttons */
.ht-btn{
  display:inline-flex; align-items:center; gap:10px; padding:12px 18px; border-radius:999px;
  background:linear-gradient(90deg, var(--brand), #00b09b); color:#fff; font-weight:900; text-decoration:none;
  box-shadow:0 10px 24px rgba(0,209,178,.35); transition:transform .2s, box-shadow .25s, background .25s;
}
.ht-btn:hover{ transform:translateY(-2px) scale(1.02); box-shadow:0 14px 32px rgba(0,209,178,.5); }
.ht-btn--ghost{ background:#fff; color:#0f1117; border:1px solid rgba(0,0,0,.12); box-shadow:var(--soft); }
.ht-btn--ghost:hover{ background:#f9fafc; }

/* Hero */
.ht-hero{ background:linear-gradient(180deg, var(--bg), var(--bg-2)); color:var(--text); padding:56px 0; }
.ht-hero__grid{ display:grid; grid-template-columns:1fr 1fr; gap:38px; align-items:center; }
.ht-hero__grid[data-layout="rl"]{ grid-template-areas:"text media"; }
.ht-hero__grid[data-layout="lr"]{ grid-template-areas:"media text"; }
.ht-hero__media{ grid-area:media; }
.ht-hero__text{ grid-area:text; }
.ht-hero__tag{ display:inline-block; font-weight:900; letter-spacing:.06em; text-transform:uppercase; background:linear-gradient(90deg, var(--brand-2), #ffeaa9); color:#111; padding:8px 12px; border-radius:999px; }
.ht-hero__title{ font-size:clamp(32px,4vw,56px); font-weight:900; margin:14px 0 8px; }
.ht-hero__desc{ color:var(--muted); font-weight:600; max-width:60ch; }
.ht-hero__actions{ display:flex; gap:12px; flex-wrap:wrap; margin-top:12px; }

.ht-fresh{ display:flex; gap:8px; align-items:center; margin-top:10px; color:#d7dbe6; font-size:14px; }
.ht-fresh .dot{ width:8px; height:8px; border-radius:50%; background:var(--brand); box-shadow:0 0 0 6px rgba(0,209,178,.15); display:inline-block; }

@media (max-width:991px){
  .ht-hero__grid{ grid-template-columns:1fr; gap:24px; }
  .ht-hero__grid[data-layout]{ grid-template-areas:"text" "media"; }
}

/* Bands / cards */
.ht-band{ background:#ffffff; color:#111; padding:30px 0; }
.ht-cards{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.ht-card{ border:1px solid rgba(0,0,0,.08); background:#fff; border-radius:12px; box-shadow:var(--soft); padding:14px;  }
.ht-card h3{ margin:0 0 6px; font-size:16px; font-weight:900;color:#000; }
@media (max-width:991px){ .ht-cards{ grid-template-columns:1fr 1fr; } }
@media (max-width:575px){ .ht-cards{ grid-template-columns:1fr; } }

/* ===== Replicated Intro (ZAGANEW style, adapted) ===== */
.section-intro{ font-size:16px; line-height:1.6; color:#000; background:#fff; padding:30px 0; }
.container--wide{ position:relative; width:min(1200px,92%); margin-inline:auto; }
.has-bottom-space{ padding-bottom:50px; }
.mb-30{ margin-bottom:30px; }
.section-intro__kicker{
  display:inline-block; font-weight:800; letter-spacing:.3px; padding:20px 8px; border-radius:999px; font-size:26px; color:#000;
  background:linear-gradient(135deg, #fff 0%, #fff 100%), url('https://zagatech.pro/assets/images/home/head_bg.webp');
  background-size:cover; background-blend-mode:overlay; box-shadow:0 4px 12px rgba(0,0,0,.25);
}
.section-intro__title{ margin-top:10px; font-size:clamp(28px,3.8vw,44px); line-height:1.2; font-weight:800; color:#000; }
.section-intro__text{ font-size:16px; color:#000; margin:0 0 16px 0; font-weight:500; }
.section-intro__image{ width:100%; height:auto; border-radius:12px; display:block; object-fit:cover; box-shadow:var(--soft); }
.features-grid .feature-card{
  color:#000; font-size:14px; box-shadow:var(--soft); padding:16px; font-weight:600; border-radius:8px;
  height:100%; cursor:pointer; margin-top:5px; margin-bottom:9px; background:var(--surface);
  transition:box-shadow .25s ease, background-color .25s ease, transform .2s ease;
}
.features-grid .feature-card:hover{ background-color:#ffce05; box-shadow:var(--soft-2); transform:translateY(-2px); }

/* Self-Assessment */
.assessment{ margin-top:16px; border:1px solid rgba(0,0,0,.08); border-radius:12px; padding:16px; background:#fff; box-shadow:var(--soft); }
.assessment h3{ font-size:18px; font-weight:800; margin:0 0 8px; color:#111; }
.assessment .row{ row-gap:14px; }
.as-control{ display:flex; align-items:center; gap:12px; }
.as-control label{ font-weight:700; min-width:150px; color:#222; font-size:14px; }
.as-score{ margin-top:8px; font-weight:800; color:#111; }
.as-pill{ display:inline-block; padding:4px 10px; border-radius:999px; background:#f5f5f7; margin-left:6px; font-weight:800; }

/* Solutions */
.ht-sol{ background:#0f1117; color:#fff; padding:38px 0; }
.ht-sol__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.ht-sol__item{ display:flex; align-items:center; gap:10px; border:1px solid rgba(255,255,255,.12); border-radius:12px; padding:14px; text-decoration:none; color:#fff; background:linear-gradient(180deg,#1a1d2a,#141724); }
.ht-sol__item:hover{ box-shadow:0 12px 28px rgba(0,0,0,.35), 0 0 0 3px rgba(255,206,5,.25) inset; transform:translateY(-2px); transition:.25s; }
@media (max-width:991px){ .ht-sol__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:575px){ .ht-sol__grid{ grid-template-columns:1fr; } }

/* Badges + code blocks + two-column */
.ht-badge{ display:inline-block; font-weight:900; padding:6px 12px; border-radius:999px; background:#ffecb2; color:#111; margin-bottom:8px; font-size:30px; }
.ht-two{ display:grid; grid-template-columns:1.2fr .8fr; gap:18px; align-items:start; color:#000;}
.ht-list{ list-style:disc; margin:0 0 0 18px; color:#000;}
.ht-code{ background:#0b0d14; color:#e9ecf1; border:1px solid #232535; border-radius:12px; padding:14px; overflow:auto; }
@media (max-width:991px){ .ht-two{ grid-template-columns:1fr; } }

/* Grid cards */
.ht-grid-3{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; color:#000;}
.ht-card2{ border:1px solid rgba(0,0,0,.08); border-radius:12px; background:#fff; padding:16px; box-shadow:var(--soft); color:#000;}
.ht-card2 h3{ margin:0 0 6px; font-size:16px; font-weight:900; }
@media (max-width:991px){ .ht-grid-3{ grid-template-columns:1fr; } }

/* Analytics band */
.ht-analytics{ background:#0f1117; color:#fff; padding:24px 0; }
.ht-metrics{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.ht-metric{ background:#141a23; border:1px solid rgba(255,255,255,.08); border-radius:12px; padding:14px; text-align:center; }
.ht-metric .k{ display:block; font-weight:900; color:#ffce05; }
.ht-metric b{ font-size:20px; display:block; }
.ht-metric small{ color:#cbd1dc; }
@media (max-width:991px){ .ht-metrics{ grid-template-columns:1fr 1fr; } }
@media (max-width:575px){ .ht-metrics{ grid-template-columns:1fr; } }

/* Marquee */
.ht-marq{ background:#ffce05; padding:18px 0; }
.ht-marq__track{ display:flex; width:max-content; gap:28px; animation:htmarq 28s linear infinite; }
@keyframes htmarq{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
.ht-marq .l{ height:34px; filter:contrast(1.1) saturate(1.05); }

/* Cases */
.ht-cases{ background:#151724; padding:30px 0; }
.ht-casegrid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; color:#000; }
.ht-case{ border:1px solid rgba(0,0,0,.08); border-radius:12px; background:#fff; padding:14px; box-shadow:var(--soft); }
.ht-case .m{ font-weight:900; margin-top:8px; }
@media (max-width:991px){ .ht-casegrid{ grid-template-columns:1fr; } }

/* Pricing */
.ht-tiers{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:12px 0; }
.ht-tier{ border:1px solid rgba(0,0,0,.08); border-radius:12px; background:#fff; padding:16px; box-shadow:var(--soft); }
@media (max-width:991px){ .ht-tiers{ grid-template-columns:1fr; } }

/* ROI */
.ht-roi{ background:#151724; padding:36px 0; }
.ht-roi__wrap{ display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
.ht-roi__card{ background:#0f1117; color:#e9ecf1; border:1px solid #2a2d3a; border-radius:16px; padding:18px; box-shadow:0 14px 34px rgba(0,0,0,.22); }
.ht-roi__form{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.ht-roi__form label{ display:flex; flex-direction:column; gap:6px; font-weight:800; font-size:12px; color:#dbe1ee; }
.ht-roi__form input{ background:#0b0d14; color:#fff; border:1px solid #2a2d3a; border-radius:10px; padding:10px; }
.ht-roi__result{ background:#ffffff; border:1px solid rgba(0,0,0,.08); border-radius:16px; padding:18px; box-shadow:var(--soft);  color:#000; }
.ht-roi__result .big{ font-size:28px; font-weight:900; color:#000; }
.ht-roi__result .sub{ color:#444; font-size:14px; color:#000; }
@media (max-width:991px){ .ht-roi__wrap{ grid-template-columns:1fr; } .ht-roi__form{ grid-template-columns:1fr; } }

/* FAQ */
.ht-faq{ background:#ffffff; padding:30px 0; }
.ht-faq details{ border:1px solid rgba(0,0,0,.08); border-radius:12px; padding:10px 12px; background:#fff; box-shadow:var(--soft); margin:10px 0; color:#000; }
.ht-faq summary{ cursor:pointer; font-weight:800; }
.ht-faq summary::-webkit-details-marker{ display:none; }

/* CTA */
.ht-cta{ background:#ffce05; }
.ht-cta__wrap{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:22px 0; color:#000; font-weight:500;}

/* Footer SEO */
.ht-seo{ background:#ffffff; padding:24px 0; color:#222; }

/* Motion safety */
@media (prefers-reduced-motion:reduce){
  .ht-marq__track{ animation:none!important; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1d36cf6d *//* ===============================
   ZagaTech Technology Card Grid
   =============================== */

/* === Container Grid for Cards === */
.row.row_soltn_col {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0px; /* space between cards */
    margin-top: 40px;
}

/* === Columns: 4 per row on Desktop === */
.row.row_soltn_col > div {
    flex: 0 0 calc(25% - 20px);
    max-width: calc(25% - 20px);
    box-sizing: border-box;
}

/* === 2 per row on Tablets === */
@media (max-width: 991px) {
    .row.row_soltn_col > div {
        flex: 0 0 calc(50% - 20px);
        max-width: calc(50% - 20px);
    }
}

/* === 1 per row on Mobile === */
@media (max-width: 576px) {
    .row.row_soltn_col > div {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* === Card Styling === */
.card.card_black_glassy {
    background: rgba(255, 255, 255, 0.03);
    border: 8px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    box-shadow: 0 4px 20px rgba(0,0,0,0.5);
    transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
    overflow: hidden;
    height: 90%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.card.card_black_glassy:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.7);
    background: rgba(255, 255, 255, 0.05);
}

/* === Card Content === */
.card_black_glassy .card-body {
    padding: 20px;
    text-align: centr;
}

/* === Technology Section Headings === */
.tech_head_center {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 12px;
    text-transform: capitalize;
}

/* === Technology List Styling === */
.tech_ul {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
}

.tech_ul li {
    position: relative;
    padding-left: 24px;
    margin-bottom: 8px;
    font-size: 15px;
    color: #ddd;
    font-weight: 400;
}

.tech_ul li::before {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    background: #ffce05;
    border-radius: 50%;
    left: 0;
    top: 6px;
    box-shadow: 0 0 6px rgba(255, 206, 5, 0.9);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-bac581 */.ztx_whychoose {
  background-color: #fff;
  padding: 10px 0;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.ztx_why_dot {
  position: absolute;
  top: 40%;
  right: 55%;
  width: 70px;
  animation: float 6s ease-in-out infinite;
  z-index: 0;
}

.ztx_banner_title_xl {
  font-size: 5rem;
  font-weight: 600;
  text-transform: uppercase;
  color: #000;
  line-height: 1;
  margin-bottom: 1.2rem;
}

.ztx_banner_title_xl .ztx_highlight_yellow {
  background: linear-gradient(180deg, #ffce05 100%, transparent 50%);
  display: inline-block;
}

.ztx_title_blk_big {
  font-size: 3.1rem;
  font-weight: 400;
  color: #000000;
  margin-top: 1rem;
}

.ztx_paracontent {
  font-size: 1rem;
  color: #0c0d0e;
  font-weight: 500;
  line-height: 1.7;
  text-align: justify;
}

.ztx_hr_black_big {
  height: 4px;
  width: 80px;
  background: #000;
  border: none;
  margin: 1rem 0;
}

.ztx_img_sec {
  position: relative;
  z-index: 2;
  margin-bottom: 2rem;
}

.ztx_img_full {
  border-radius: 12px;
  max-width: 100%;
  position: relative;
}

.ztx_pos_1,
.ztx_pos_2 {
  position: absolute;
  z-index: 3;
}

.ztx_pos_1 {
  top: -20px;
  left: -40px;
}

.ztx_pos_2 {
  bottom: -20px;
  right: -30px;
}

.ztx_progress_sec {
  margin-top: 2rem;
}

.ztx_progress_head {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0.4rem;
  color: #000;
}

.ztx_progress_div {
  height: 10px;
  background: #e0e0e0;
  border-radius: 20px;
  overflow: hidden;
  margin-bottom: 0.5rem;
}

.ztx_progress_fill {
  height: 100%;
  background-color: #ffce05;
  border-radius: 20px;
  transition: width 0.5s ease-in-out;
}

.ztx_progress_text {
  font-weight: 700;
  color: #000;
  font-size: 1rem;
  display: inline-block;
  margin-left: 8px;
}

.ztx_btn_group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 1.1rem;
}

.btn-home {
  background-color: #000;
  color: #fff;
  padding: 0.5rem 1.1rem;
  font-weight: 600;
  font-size: 0.95rem;
  border-radius: 80px;
  transition: 0.3s ease-in-out;
  border: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0.2rem;
}

.btn-home:hover {
  background-color: #ffce05;
  color: #000;
  border-radius: 80px;
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

@media (max-width: 992px) {
  .ztx_banner_title_xl {
    text-align: center;
    font-size: 2.4rem;
  }
  .ztx_img_sec {
    text-align: center;
  }
  .ztx_btn_group {
    justify-content: center;
  }
}

@media (max-width: 576px) {
  .ztx_banner_title_xl {
    font-size: 2rem;
  }
  .ztx_title_blk_big {
    font-size: 1.1rem;
    text-align: center;
  }
  .ztx_paracontent {
    font-size: 0.95rem;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-4397e1d8 *//* =========================
   Hire Developers (scoped)
   ========================= */
#zt-hire {
  --zth-bg: radial-gradient(1200px 500px at 10% -10%, rgba(237,191,9,0.12), transparent 40%),
            radial-gradient(1200px 600px at 110% 110%, rgba(255,255,255,0.06), transparent 45%),
            transparent;
  --zth-text: #e9ecf1;
  --zth-muted: #b7bcc7;
  --zth-title: #ffffff;
  --zth-accent: #edbf09;
  --zth-chip-bg: #141722;
  --zth-chip-border: rgba(255,255,255,0.10);
  --zth-chip-hover: #181c2a;
  --zth-shadow: 0 10px 25px rgba(0,0,0,0.20);
  --zth-shadow-hover: 0 18px 42px rgba(0,0,0,0.28);
  --zth-radius: 14px;

  background: var(--zth-bg);
  color: var(--zth-text);
  position: relative;
  overflow: hidden;
}

/* Optional light variant: <section class="zth light"> */
#zt-hire.light {
  --zth-text: #2c2725;
  --zth-muted: #4f4f4f;
  --zth-title: #101114;
  --zth-chip-bg: #ffffff;
  --zth-chip-border: rgba(0,0,0,0.10);
  --zth-chip-hover: #f6f7fa;
}

#zt-hire .zth__container { position: relative; z-index: 1; }

/* Headings & body copy */
#zt-hire .zth__badge{
  display:inline-block;
  font-weight:800;
  letter-spacing:.3px;
  padding:8px 16px;
  border-radius:999px;
  font-size:36px;
  line-height:1;
  margin:0 0 8px 0;
  color:#00; /* readable over image */

  /* Image + overlay */
  background:
    linear-gradient(rgba(0,0,0,.0), rgba(0,0,0,.0)),
    url('https://zagatech.pro/assets/images/home/head_bg.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  /* Optional subtle border for contrast on light backgrounds */
  border: 1px solid rgba(255,255,255,.15);
}

/* Optional: gentle background pan (premium feel) */
@media (prefers-reduced-motion: no-preference){
  #zt-hire .zth__badge{
    background-size: 120% auto, cover; /* animate only the gradient layer size */
    animation: zthBadgePan 12s ease-in-out infinite alternate;
  }
  @keyframes zthBadgePan{
    0%   { background-position: center, center; }
    100% { background-position: 80% center, center; }
  }
}


#zt-hire .zth__title{
  color: var(--zth-title);
  font-weight: 900;
  font-size: clamp(28px, 3.2vw, 42px);
  line-height: 1.2;
  margin: 0;
}

#zt-hire .zth__copy { margin-top: 4px; }
#zt-hire .zth__text{
  color: var(--zth-muted);
  font-size: 16px;
  line-height: 1.75;
  margin: 0 0 10px 0;
  color: #000;
}

/* Feature chips wrapper */
#zt-hire .zth__features {
  margin-top: 10px;
  /* optional: ignore Bootstrap's row gaps so spacing is chip-controlled */
  --bs-gutter-y: 0;
}

/* optional: neutralize mb-3 on col wrappers */
#zt-hire .zth__features > [class*="col-"] {
  margin-bottom: 0 !important;
}

/* Chip base + vertical spacing */
#zt-hire .zth__chip{
  background: var(--zth-chip-bg);
  border: 1px solid var(--zth-chip-border);
  border-radius: var(--zth-radius);
  padding: 14px 14px;
  margin-block: 8px;              /* ← space above & below each chip */
  box-shadow: var(--zth-shadow);
  transition: transform .16s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;

  /* hover color tokens */
  --chip-hover-bg: rgba(255,205,5,.70);
  --chip-hover-border: rgba(237,191,9,.55);
  --chip-hover-text: var(--zth-title);
}

/* a touch more space on desktops */
@media (min-width: 992px){
  #zt-hire .zth__chip{ margin-block: 12px; }
}

/* Leading check icon */
#zt-hire .zth__chip::before{
  content: "✓";
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--zth-accent);
  color: #000;
  font-weight: 900;
  font-size: 14px;
  flex: 0 0 22px;
}

#zt-hire .zth__chip span{
  color: var(--zth-title);
  font-weight: 800;
  font-size: 15px;
}

/* Single hover rule (deduped) */
#zt-hire .zth__chip:hover{
  transform: translateY(-2px);
  background: var(--chip-hover-bg);
  box-shadow: var(--zth-shadow-hover);
  border-color: var(--chip-hover-border);
}
#zt-hire .zth__chip:hover span{ color: var(--chip-hover-text); }




/* Media (image) */
@keyframes zthFloat {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-10px); }
}
#zt-hire .zth__media { position: relative; }
#zt-hire .zth__image{
  max-width: 100%; height: auto; display:block;
  border-radius: 12px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.15);
  animation: zthFloat 4.5s ease-in-out infinite;
}

/* Responsive refinements */
@media (max-width: 575px){
  #zt-hire .zth__badge{ font-size: 14px; }
  #zt-hire .zth__title{ font-size: clamp(24px, 6vw, 28px); }
  #zt-hire .zth__text{ font-size: 15px; }
  #zt-hire .zth__chip span{ font-size: 14px; }
}/* End custom CSS */
/* Start custom CSS *//* ---- Fix hero image being cut (Elementor/theme wrappers) ---- */

/* your section must never clip */
.hero-section { 
  overflow: visible !important; 
  border-radius: 0 !important; 
  /* make sure no fixed height */
  height: auto !important; 
  min-height: 0 !important;
}

/* common Elementor containers that cause clipping */
.elementor-section,
.elementor-container,
.elementor-column,
.elementor-widget-wrap,
.elementor-widget-container {
  overflow: visible !important;
  border-radius: 0 !important;
}

/* sometimes the theme page/content wraps also clip */
.entry-content,
.site-main,
.content-area {
  overflow: visible !important;
}

/* ensure the image itself never crops */
.hero-img {
  display: block;
  width: 100%;
  max-width: none;             /* let it render full height */
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;  /* stop top/bottom cropping */
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  position: relative;
  z-index: 1;
}

/* give the image column room */
.hero-row { 
  grid-template-columns: 1fr 1fr;  /* equal columns */
  align-items: start;              /* avoid vertical centering squeeze */
}

/* make sure the img wrapper itself doesn't clip */
.hero-img-wrap { 
  overflow: visible !important; 
}/* End custom CSS */