/**
 * IT WEBHUT — Final UI polish (spacing, alignment, balance only)
 */

:root {
  --itwh-section-y: 96px;
  --itwh-section-y-md: 80px;
  --itwh-section-y-sm: 64px;
  --itwh-space-title: 44px;
  --itwh-space-block: 28px;
  --itwh-space-element: 20px;
  --itwh-radius-ui: 16px;
  --itwh-btn-h: 52px;
}

/* ── 1. Global spacing & containers ── */

.itwh-chapter .container,
.itwh-prefooter-cta .container,
.footer1 > .container {
  max-width: var(--itwh-container, 1320px);
  padding-left: 24px;
  padding-right: 24px;
}

.itwh-chapter.about-one,
.itwh-chapter.solutions,
.itwh-chapter.portfolio-one,
.itwh-chapter.why-choose,
.itwh-chapter.projects,
.itwh-chapter.contact {
  padding-top: var(--itwh-section-y) !important;
  padding-bottom: var(--itwh-section-y) !important;
}

.itwh-chapter.section-padding {
  padding-top: var(--itwh-section-y) !important;
  padding-bottom: var(--itwh-section-y) !important;
}

@media (max-width: 991px) {
  .itwh-chapter.about-one,
  .itwh-chapter.solutions,
  .itwh-chapter.portfolio-one,
  .itwh-chapter.why-choose,
  .itwh-chapter.projects,
  .itwh-chapter.contact {
    padding-top: var(--itwh-section-y-md) !important;
    padding-bottom: var(--itwh-section-y-md) !important;
  }
}

.itwh-chapter--dark.portfolio-one.portfolio-one--static,
.itwh-chapter--dark.portfolio-one.portfolio-one--row3 {
  padding-top: var(--itwh-section-y) !important;
  padding-bottom: var(--itwh-section-y) !important;
}

.itwh-chapter--light.why-choose.why-choose--light {
  padding-top: var(--itwh-section-y) !important;
  padding-bottom: var(--itwh-section-y) !important;
}

.itwh-chapter--dark .customer-brand--slider {
  padding-bottom: var(--itwh-section-y) !important;
}

.itwh-chapter--dark .customer-brand--slider .container {
  padding-top: var(--itwh-space-block) !important;
}

.itwh-chapter .sec-title--center,
.itwh-chapter .section-top:not(.projects__header) {
  margin-bottom: var(--itwh-space-title);
}

.itwh-chapter .sec-title__title,
.itwh-chapter .section-top__title {
  margin-bottom: 0;
}

.itwh-products-static-wrap {
  padding-left: 0;
  padding-right: 0;
}

/* ── 2. Hero ── */

#hero .row.align-items-center {
  align-items: center !important;
}

#hero .hero-agency__visual {
  min-height: 460px;
  margin-left: auto;
  margin-right: 0;
  max-width: 100%;
}

#hero .hero-agency__showcase {
  transform: scale(1.06);
  transform-origin: bottom right;
}

#hero .hero-agency__showcase-card.card--1 {
  width: 252px;
  left: 0;
  top: auto;
  bottom: 0;
}

#hero .hero-agency__showcase-card.card--2 {
  width: 228px;
  right: 0;
  top: auto;
  bottom: 8px;
}

#hero .hero-agency__showcase-card.card--3 {
  width: calc(100% - 8px);
  left: 4px;
  top: 0;
  bottom: auto;
}

#hero .hero-agency__showcase-card.card--3 img {
  height: 200px;
  object-fit: contain;
}

@media (max-width: 991px) {
  #hero .hero-agency__visual {
    max-width: 100%;
    min-height: 440px;
  }

  #hero .hero-agency__showcase {
    transform: scale(1);
  }
}

.itwh-chapter--dark .itwh-intent-search--large {
  margin-top: var(--itwh-space-block);
}

/* Work process — keep Misiom pin layout; only section padding rhythm */
.itwh-chapter--light.work-process {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.itwh-chapter--light.work-process .work-process__top {
  padding-top: var(--itwh-section-y);
}

@media (max-width: 991px) {
  .itwh-chapter--light.work-process .work-process__top {
    padding-top: var(--itwh-section-y-md);
  }
}

/* ── 5. Contact ── */

.itwh-chapter--dark.contact .contact__shapes {
  opacity: 0.72;
}

.contact__shape--1 {
  width: 134px;
  height: 168px;
}

.contact__shape--2 {
  width: 112px;
  height: 136px;
}

.contact__shape--3 {
  width: 96px;
  height: 120px;
}

.contact__shape--4 {
  width: 104px;
  height: 128px;
}

.contact__bg-shape {
  transform: scale(0.8);
  transform-origin: bottom right;
  opacity: 0.55;
}

.itwh-chapter--dark.contact .contact__form-card {
  padding: 36px 40px 40px;
  border-radius: var(--itwh-radius-ui);
}

.itwh-chapter--dark.contact .contact__form-title {
  font-size: 22px;
  margin-bottom: 28px;
}

.itwh-chapter--dark.contact .contact__form-group {
  margin-bottom: 28px !important;
}

.itwh-chapter--dark.contact .contact__input-group {
  margin-bottom: 0 !important;
}

.itwh-chapter--dark.contact .contact__fields-row {
  --bs-gutter-x: 1.25rem;
  --bs-gutter-y: 1.5rem;
  margin-top: 8px;
  margin-bottom: 1.75rem;
}

.itwh-chapter--dark.contact .contact__input-group--textarea {
  margin-bottom: 1.75rem !important;
}

.itwh-chapter--dark.contact .contact__left-col {
  justify-content: center;
}

.itwh-chapter--dark.contact .contact__right-col {
  display: flex;
  align-items: stretch;
}

.itwh-chapter--dark.contact .contact__form-card {
  flex: 1;
}

@media (min-width: 992px) {
  .itwh-chapter--dark.contact .row.align-items-stretch {
    align-items: stretch !important;
  }
}

/* ── 6. Pre-footer & footer ── */

.itwh-prefooter-cta {
  padding-top: var(--itwh-section-y) !important;
  padding-bottom: calc(var(--itwh-section-y) + 32px) !important;
  border-top: 1px solid var(--itwh-border-dark);
}

.footer1.pt-120,
.footer1.pt-lg-100 {
  padding-top: 48px !important;
}

.footer1__top,
.footer1__top.pb-100 {
  padding-bottom: 64px !important;
}

.footer1__top .row {
  align-items: flex-start;
  --bs-gutter-y: 40px;
}

.footer1__widget {
  height: 100%;
}

.footer1__widget-title,
.footer1__widget .title {
  margin-bottom: 20px;
}

.footer1__links li + li {
  margin-top: 10px;
}

.footer1__bottom {
  padding-top: 28px;
  padding-bottom: 28px;
}

/* ── 7. Global alignment & UI tokens ── */

.btn-main-primary .text {
  min-height: var(--itwh-btn-h);
  display: inline-flex;
  align-items: center;
}

.itwh-chapter--grey.solutions .solutions__sidebar-item,
.itwh-chapter--dark.contact .contact__card,
.itwh-chapter--dark.contact .contact__form-card,
.itwh-chapter--dark .customer-brand__slider .customer-brand__card {
  border-radius: var(--itwh-radius-ui);
}

.itwh-chapter--light.about-one .about-one__progress,
.itwh-chapter--light.about-one .about-one__funfact {
  border-radius: var(--itwh-radius-ui);
}

.itwh-chapter--dark .hero-agency__showcase-card {
  border-radius: var(--itwh-radius-ui);
}
