/**
 * IHGZ homepage layout — loaded on front page only
 * Strong layout redesign (not just colors)
 */

/* ===== HERO: full-bleed, brand-first, no side card ===== */
body.home .hero-demo .e-hero,
body.front-page .hero-demo .e-hero {
  min-height: 100vh !important;
  min-height: 100svh !important;
  align-items: flex-end !important;
  background: #081F38 !important;
}
body.home .hero-demo .e-hero img.bg,
body.front-page .hero-demo .e-hero img.bg {
  filter: brightness(0.45) contrast(1.1) saturate(0.85) !important;
  transform: scale(1.08) !important;
}
body.home .hero-demo .e-hero::before,
body.front-page .hero-demo .e-hero::before {
  background:
    linear-gradient(100deg, rgba(8, 31, 56, 0.92) 0%, rgba(8, 31, 56, 0.55) 48%, rgba(8, 31, 56, 0.25) 100%) !important;
}
body.home .hero-demo .e-hero::after,
body.front-page .hero-demo .e-hero::after {
  background:
    radial-gradient(circle at 70% 30%, rgba(31, 164, 99, 0.28), transparent 42%),
    linear-gradient(0deg, rgba(8, 31, 56, 0.55), transparent 40%) !important;
}
body.home .hero-demo .hero-container,
body.front-page .hero-demo .hero-container {
  max-width: 100% !important;
  padding: 0 6vw 7vh !important;
  margin: 0 !important;
}
body.home .hero-demo .hero-grid,
body.front-page .hero-demo .hero-grid {
  display: block !important;
  max-width: 720px !important;
}
body.home .hero-demo .hero-panel,
body.front-page .hero-demo .hero-panel {
  display: none !important;
}
body.home .hero-demo .hero-content,
body.front-page .hero-demo .hero-content {
  flex: none !important;
  text-align: right !important;
  max-width: 720px;
}
body.home .hero-demo .hero-title,
body.front-page .hero-demo .hero-title {
  font-size: clamp(2.6rem, 6vw, 4.6rem) !important;
  color: #ffffff !important;
  text-shadow: none !important;
  margin: 0 0 0.45em !important;
  line-height: 1.15 !important;
  letter-spacing: -0.03em !important;
}
body.home .hero-demo .hero-title::before,
body.front-page .hero-demo .hero-title::before {
  content: none !important;
}
body.home .hero-demo .hero-kicker,
body.front-page .hero-demo .hero-kicker {
  color: #1FA463 !important;
  font-size: clamp(1.05rem, 2vw, 1.35rem) !important;
  margin-bottom: 0.75rem !important;
}
body.home .hero-demo .hero-desc,
body.front-page .hero-demo .hero-desc {
  color: rgba(255, 255, 255, 0.82) !important;
  max-width: 36em !important;
  font-size: 1.05rem !important;
}
body.home .hero-demo .hero-points,
body.front-page .hero-demo .hero-points {
  display: none !important;
}
body.home .hero-demo .e-actions,
body.front-page .hero-demo .e-actions {
  margin-top: 1.75rem !important;
}
body.home .hero-demo .e-primary,
body.front-page .hero-demo .e-primary {
  border-radius: 4px !important;
  padding: 1rem 1.75rem !important;
  background: #1FA463 !important;
  box-shadow: none !important;
}
body.home .hero-demo .e-primary:hover,
body.front-page .hero-demo .e-primary:hover {
  background: #148A52 !important;
  transform: none !important;
}
body.home .hero-demo .e-secondary,
body.front-page .hero-demo .e-secondary {
  display: none !important;
}
body.home .hero-demo .deco-circle,
body.front-page .hero-demo .deco-circle {
  display: none !important;
}

/* Metrics strip under hero */
body.home .ihgz-metrics-strip,
body.front-page .ihgz-metrics-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  background: #0B2A4A;
  color: #fff;
  direction: rtl;
}
body.home .ihgz-metrics-strip .m,
body.front-page .ihgz-metrics-strip .m {
  padding: 1.35rem 1rem;
  text-align: center;
  border-inline-start: 1px solid rgba(255,255,255,0.12);
}
body.home .ihgz-metrics-strip .m:first-child,
body.front-page .ihgz-metrics-strip .m:first-child {
  border-inline-start: none;
}
body.home .ihgz-metrics-strip strong,
body.front-page .ihgz-metrics-strip strong {
  display: block;
  font-size: 1.55rem;
  color: #1FA463;
  font-weight: 900;
}
body.home .ihgz-metrics-strip span,
body.front-page .ihgz-metrics-strip span {
  font-size: 0.88rem;
  color: rgba(255,255,255,0.75);
}

/* ===== ABOUT (s5): open split, no boxed card ===== */
body.home .s5-root .s5,
body.front-page .s5-root .s5 {
  padding: 0 !important;
  background: #F4FAF6 !important;
}
body.home .s5-root .container,
body.front-page .s5-root .container {
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.home .s5-root .row,
body.front-page .s5-root .row {
  margin: 0 !important;
  min-height: 560px;
}
body.home .s5-root .col-text,
body.home .s5-root .col-image,
body.front-page .s5-root .col-text,
body.front-page .s5-root .col-image {
  padding: 0 !important;
}
body.home .s5-root .col-text,
body.front-page .s5-root .col-text {
  display: flex;
  align-items: center;
  background: #F4FAF6;
}
body.home .s5-root .col-text .card,
body.front-page .s5-root .col-text .card {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 0 !important;
  padding: 4.5rem 6vw !important;
  max-width: 640px;
  margin-inline-start: auto;
}
body.home .s5-root .col-text .card:hover,
body.front-page .s5-root .col-text .card:hover {
  transform: none !important;
  box-shadow: none !important;
}
body.home .s5-root .image-card,
body.front-page .s5-root .image-card {
  height: 100% !important;
  min-height: 560px !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.home .s5-root .overlay-square,
body.home .s5-root .diag,
body.front-page .s5-root .overlay-square,
body.front-page .s5-root .diag {
  display: none !important;
}
body.home .s5-root .small-title,
body.front-page .s5-root .small-title {
  background: #0B2A4A !important;
  display: inline-block;
  padding: 0.35rem 0.85rem;
  margin-bottom: 1rem;
}
body.home .s5-root .main-title,
body.front-page .s5-root .main-title {
  font-size: clamp(1.6rem, 2.8vw, 2.35rem) !important;
}
body.home .s5-root .btn-primary,
body.front-page .s5-root .btn-primary {
  border-radius: 4px !important;
  background: #1FA463 !important;
}

/* ===== ARTICLES ===== */
body.home #services-articles,
body.front-page #services-articles {
  padding: 5.5rem 0 !important;
  background: linear-gradient(180deg, #ffffff 0%, #E8F2EC 100%) !important;
}
body.home #services-articles .h1,
body.front-page #services-articles .h1 {
  font-size: clamp(1.6rem, 3vw, 2.4rem) !important;
  max-width: 18ch;
  margin-inline-start: auto;
}
body.home #services-articles .service-card,
body.front-page #services-articles .service-card {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}
body.home #services-articles .service-card img,
body.home #services-articles .service-card .placeholder-media,
body.front-page #services-articles .service-card img,
body.front-page #services-articles .service-card .placeholder-media {
  border-radius: 0 !important;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  width: 100%;
}
body.home #services-articles .service-icon,
body.front-page #services-articles .service-icon {
  display: none !important;
}

/* ===== STEPS: clean 4-column process (do not override index styles) ===== */
body.home .steps-section,
body.front-page .steps-section {
  background: #F4FAF6 !important;
  color: inherit !important;
  padding: 5.5rem 0 !important;
}
body.home .steps-section .steps-badge,
body.front-page .steps-section .steps-badge {
  background: #0B2A4A !important;
  color: #fff !important;
  border: none !important;
  border-radius: 0 !important;
}
body.home .steps-section .steps-title,
body.front-page .steps-section .steps-title {
  color: #0A1F33 !important;
}
body.home .steps-section .steps-subtitle,
body.front-page .steps-section .steps-subtitle {
  color: #5A6F7D !important;
}
body.home .steps-section .steps-timeline,
body.front-page .steps-section .steps-timeline {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 1.25rem !important;
  max-width: none !important;
  margin: 0 !important;
}
body.home .steps-section .step-item,
body.front-page .steps-section .step-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  text-align: center !important;
}
body.home .steps-section .step-number,
body.front-page .steps-section .step-number {
  background: #0B2A4A !important;
  border-radius: 50% !important;
  width: 56px !important;
  height: 56px !important;
  color: #fff !important;
}
body.home .steps-section .step-heading,
body.front-page .steps-section .step-heading {
  color: #0A1F33 !important;
}
body.home .steps-section .step-description,
body.front-page .steps-section .step-description {
  color: #5A6F7D !important;
}
body.home .steps-section .step-icon,
body.front-page .steps-section .step-icon {
  color: #1FA463 !important;
  background: rgba(31, 164, 99, 0.1) !important;
}
body.home .steps-section .step-content,
body.front-page .steps-section .step-content {
  background: #fff !important;
  border: none !important;
  border-top: 3px solid #1FA463 !important;
  border-radius: 0 !important;
  box-shadow: 0 10px 28px rgba(11, 42, 74, 0.08) !important;
}
body.home .steps-section .step-connector,
body.home .steps-section .step-number-wrapper,
body.front-page .steps-section .step-connector,
body.front-page .steps-section .step-number-wrapper {
  display: contents;
}

/* ===== FAQ ===== */
body.home .faq-section,
body.front-page .faq-section {
  padding: 5rem 0 !important;
  background: #ffffff !important;
}
body.home .faq-section .faq-container,
body.front-page .faq-section .faq-container {
  max-width: 820px !important;
  margin: 0 auto !important;
}
body.home .faq-section .faq-item,
body.front-page .faq-section .faq-item {
  border: none !important;
  border-bottom: 1px solid #B8D4C4 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
  background: transparent !important;
}

/* ===== TESTIMONIALS ===== */
body.home .testimonials-section,
body.front-page .testimonials-section {
  padding: 5.5rem 0 !important;
  background: #E8F2EC !important;
}
body.home .testimonials-section .testi-grid,
body.front-page .testimonials-section .testi-grid {
  display: grid !important;
  grid-template-columns: 1.2fr 1fr 1fr !important;
  gap: 1.5rem !important;
  align-items: stretch;
}
body.home .testimonials-section .testi-card,
body.front-page .testimonials-section .testi-card {
  border-radius: 0 !important;
  border: none !important;
  box-shadow: none !important;
  background: #fff !important;
  padding: 1.75rem !important;
}
body.home .testimonials-section .testi-card.highlight,
body.front-page .testimonials-section .testi-card.highlight {
  background: #0B2A4A !important;
  color: #fff !important;
}
body.home .testimonials-section .testi-card.highlight .testi-quote,
body.home .testimonials-section .testi-card.highlight .testi-name,
body.home .testimonials-section .testi-card.highlight .testi-role,
body.front-page .testimonials-section .testi-card.highlight .testi-quote,
body.front-page .testimonials-section .testi-card.highlight .testi-name,
body.front-page .testimonials-section .testi-card.highlight .testi-role {
  color: #fff !important;
}
body.home .testimonials-section .testi-highlight,
body.front-page .testimonials-section .testi-highlight {
  margin-top: 2rem !important;
  border-radius: 0 !important;
  background: #1FA463 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 1rem;
  padding: 1.5rem 1.75rem !important;
}
body.home .testimonials-section .testi-tags,
body.front-page .testimonials-section .testi-tags {
  display: none !important;
}

@media (max-width: 991px) {
  body.home .ihgz-metrics-strip,
  body.front-page .ihgz-metrics-strip {
    grid-template-columns: repeat(2, 1fr);
  }
  body.home .s5-root .row,
  body.front-page .s5-root .row {
    min-height: 0;
  }
  body.home .s5-root .image-card,
  body.front-page .s5-root .image-card {
    min-height: 320px !important;
  }
  body.home .steps-section .steps-timeline,
  body.front-page .steps-section .steps-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.home .testimonials-section .testi-grid,
  body.front-page .testimonials-section .testi-grid {
    grid-template-columns: 1fr !important;
  }
  body.home .hero-demo .e-hero,
  body.front-page .hero-demo .e-hero {
    min-height: 88vh !important;
    align-items: center !important;
  }
  body.home .hero-demo .hero-container,
  body.front-page .hero-demo .hero-container {
    padding: 18vh 6vw 8vh !important;
  }
}

@media (max-width: 576px) {
  body.home .ihgz-metrics-strip,
  body.front-page .ihgz-metrics-strip {
    grid-template-columns: 1fr 1fr;
  }
  body.home .testimonials-section .testi-highlight,
  body.front-page .testimonials-section .testi-highlight {
    flex-direction: column;
    text-align: center;
  }
}
