/* ==========================================================================
   Arabian Eagle widgets
   Reference: 05-reference-code/css/globals.css
   Relies on the design tokens loaded by the theme.
   ========================================================================== */

/* -------------------------------------------------------------------------
   Hero
   ------------------------------------------------------------------------- */

.nesr-hero {
  position: relative;
  min-height: 780px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  background: var(--nesr-dark-2);
  color: var(--nesr-white);
}
.nesr-hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.nesr-hero__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(13, 12, 11, .16) 0%, rgba(13, 12, 11, .36) 48%, rgba(13, 12, 11, .9) 100%),
    linear-gradient(0deg, rgba(13, 12, 11, .62) 0%, transparent 48%);
}
.nesr-hero__content {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  flex: 1;
  padding-block: 150px 40px;
}
.nesr-hero__copy { max-width: 920px; }
.nesr-hero__kicker {
  display: inline-flex;
  padding: 7px 13px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 99px;
  background: rgba(255, 255, 255, .08);
  color: rgba(255, 255, 255, .82);
  font-size: 13px;
  font-weight: 500;
  backdrop-filter: blur(10px);
}
.nesr-hero h1 {
  max-width: 920px;
  margin-block: 20px;
  font-size: clamp(3.15rem, 4.6vw, 4.5rem);
  line-height: 1.14;
  letter-spacing: -.035em;
  font-weight: 600;
}
.nesr-hero h1 > span { display: block; text-wrap: balance; }
@media (min-width: 1121px) {
  .nesr-hero h1 > span:first-child { white-space: nowrap; }
}
.nesr-hero__copy > p {
  max-width: 660px;
  margin-block-end: 34px;
  color: rgba(255, 255, 255, .78);
  font-size: 19px;
  line-height: 1.85;
}
.nesr-hero__copy > * { animation: nesr-hero-rise 720ms both; }
.nesr-hero__copy > h1 { animation-delay: 80ms; }
.nesr-hero__copy > p { animation-delay: 150ms; }
.nesr-hero__copy > .nesr-button-group { animation-delay: 220ms; }

/* Trust strip */
.nesr-hero__trust {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-block-end: 28px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 14px;
  background: rgba(25, 23, 22, .58);
  backdrop-filter: blur(16px);
}
.nesr-trust-item {
  min-height: 92px;
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 12px 24px;
  border-inline-end: 1px solid rgba(255, 255, 255, .16);
}
.nesr-trust-item:last-child { border-inline-end: 0; }
.nesr-trust-item__icon {
  width: 46px;
  height: 46px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid rgba(243, 107, 33, .38);
  border-radius: 12px;
  background: rgba(243, 107, 33, .12);
  color: var(--nesr-orange);
}
.nesr-trust-item > span:last-child {
  color: rgba(255, 255, 255, .9);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.55;
}

/* -------------------------------------------------------------------------
   Solutions grid
   ------------------------------------------------------------------------- */

.nesr-solutions-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 20px;
}
.nesr-solution-card {
  position: relative;
  min-height: 330px;
  grid-column: span 4;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  border-radius: var(--nesr-radius-card);
  color: var(--nesr-white);
  isolation: isolate;
}
.nesr-solution-card--1 { min-height: 470px; grid-column: span 7; }
.nesr-solution-card--2 { min-height: 470px; grid-column: span 5; }
.nesr-solution-card img {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.86) contrast(1.04);
  transition: transform 480ms cubic-bezier(.2, .8, .2, 1);
}
.nesr-solution-card:hover img { transform: scale(1.045); }
.nesr-solution-card__shade {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(0deg, rgba(15, 14, 13, .88), rgba(15, 14, 13, .06) 72%);
}
.nesr-solution-card__number {
  position: absolute;
  inset-inline-start: 22px;
  top: 20px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .42);
  border-radius: 50%;
  background: rgba(24, 23, 22, .24);
  font-size: 13px;
  backdrop-filter: blur(8px);
}
.nesr-solution-card__body { width: 100%; padding: 28px; }
.nesr-solution-card__body h3 { font-size: 25px; line-height: 1.4; font-weight: 600; }
.nesr-solution-card__body p {
  max-width: 470px;
  margin-block: 7px 12px;
  color: rgba(255, 255, 255, .74);
  line-height: 1.7;
}
.nesr-solution-card__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--nesr-orange);
  font-size: 14px;
  font-weight: 600;
}

/* -------------------------------------------------------------------------
   Custom-order band
   ------------------------------------------------------------------------- */

.nesr-custom-section { padding-block: 40px; background: var(--nesr-warm-white); }
.nesr-custom-panel {
  min-height: 520px;
  display: grid;
  grid-template-columns: 7fr 5fr;
  overflow: hidden;
  border-radius: var(--nesr-radius-panel);
  background: var(--nesr-ink);
  color: var(--nesr-white);
}
.nesr-custom-panel__image { min-height: 520px; overflow: hidden; }
.nesr-custom-panel__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.86) contrast(1.04);
}
.nesr-custom-panel__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 60px;
}
.nesr-custom-panel__copy h2 {
  margin-block: 12px 14px;
  font-size: clamp(2.25rem, 3.3vw, 3rem);
  line-height: 1.28;
  letter-spacing: -.025em;
  font-weight: 600;
}
.nesr-custom-panel__copy p {
  margin-block-end: 30px;
  color: rgba(255, 255, 255, .68);
  font-size: 17px;
  line-height: 1.85;
}

/* -------------------------------------------------------------------------
   Project showcase
   ------------------------------------------------------------------------- */

.nesr-projects-showcase {
  padding-block: 108px;
  overflow: hidden;
  background: var(--nesr-dark-1);
  color: var(--nesr-white);
}
.nesr-showcase {
  display: grid;
  grid-template-columns: 4fr 8fr;
  align-items: stretch;
  gap: 54px;
}
.nesr-showcase__intro {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-block: 16px;
}
.nesr-showcase__intro h2 {
  margin-block: 15px 16px;
  font-size: clamp(2.35rem, 3.3vw, 3.25rem);
  line-height: 1.24;
  letter-spacing: -.025em;
  font-weight: 600;
}
.nesr-showcase__intro > p {
  color: rgba(255, 255, 255, .58);
  font-size: 16px;
  line-height: 1.9;
}
.nesr-showcase__tabs {
  width: 100%;
  min-height: 292px;
  margin-block-start: auto;
  padding-block-start: 38px;
}
.nesr-showcase__tab {
  width: 100%;
  min-height: 72px;
  display: grid;
  grid-template-columns: 38px 1fr 24px;
  align-items: center;
  gap: 12px;
  padding-inline: 10px;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, .14);
  background: transparent;
  color: rgba(255, 255, 255, .5);
  cursor: pointer;
  text-align: start;
  transition: color 180ms ease, border-color 180ms ease, background-color 180ms ease;
}
.nesr-showcase__tab:first-child { border-top: 1px solid rgba(255, 255, 255, .14); }
.nesr-showcase__tab > span { font-size: 12px; font-weight: 500; }
.nesr-showcase__tab strong { font-size: 18px; font-weight: 500; }
.nesr-showcase__tab .nesr-icon {
  opacity: 0;
  transform: translateX(8px);
  transition: opacity 180ms ease, transform 180ms ease;
}
.nesr-showcase__tab:hover,
.nesr-showcase__tab.is-active {
  border-color: rgba(243, 107, 33, .55);
  background: rgba(255, 255, 255, .025);
  color: var(--nesr-white);
}
.nesr-showcase__tab.is-active > span { color: var(--nesr-orange); }
.nesr-showcase__tab.is-active .nesr-icon {
  opacity: 1;
  transform: translateX(0);
  color: var(--nesr-orange);
}

/* Fixed height — acceptance criterion: no layout shift when switching tabs. */
.nesr-showcase__stage {
  position: relative;
  height: 650px;
  overflow: hidden;
  border-radius: var(--nesr-radius-panel);
  background: #282525;
}
.nesr-showcase__panel { position: absolute; inset: 0; }
.nesr-showcase__panel img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.86) contrast(1.04);
  animation: nesr-project-reveal 320ms ease both;
}
.nesr-showcase__shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(15, 14, 13, .74), transparent 50%);
  pointer-events: none;
}
.nesr-showcase__meta {
  position: absolute;
  inset-inline: 28px;
  bottom: 26px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  color: var(--nesr-white);
}
.nesr-showcase__meta span {
  padding: 7px 12px;
  border: 1px solid rgba(255, 255, 255, .32);
  border-radius: 99px;
  background: rgba(20, 18, 18, .28);
  color: rgba(255, 255, 255, .78);
  font-size: 12px;
  backdrop-filter: blur(8px);
}
.nesr-showcase__meta strong { font-size: 28px; font-weight: 600; }

/* -------------------------------------------------------------------------
   About block
   ------------------------------------------------------------------------- */

.nesr-about-section { background: var(--nesr-warm-white); }
.nesr-about-grid {
  display: grid;
  grid-template-columns: 7fr 5fr;
  align-items: center;
  gap: 72px;
}
.nesr-about-visual {
  position: relative;
  min-height: 520px;
  overflow: hidden;
  border-radius: var(--nesr-radius-panel);
}
.nesr-about-visual img {
  width: 100%;
  height: 100%;
  min-height: 520px;
  object-fit: cover;
  filter: saturate(.86) contrast(1.04);
}
.nesr-experience-badge {
  position: absolute;
  inset-inline-start: 24px;
  bottom: 24px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(10px);
}
.nesr-experience-badge strong { color: var(--nesr-orange); font-size: 32px; line-height: 1; }
.nesr-experience-badge span { color: var(--nesr-ink-2); font-size: 14px; font-weight: 600; }
.nesr-about-copy h2 {
  margin-block: 12px 14px;
  font-size: clamp(2.25rem, 3.3vw, 3rem);
  line-height: 1.28;
  letter-spacing: -.025em;
  font-weight: 600;
}
.nesr-about-copy > p {
  max-width: 680px;
  margin-block-end: 26px;
  color: var(--nesr-muted);
  font-size: 17px;
}
.nesr-about-features {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px 18px;
  margin-block-end: 30px;
}
.nesr-about-features li {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--nesr-ink-2);
  font-size: 14px;
  font-weight: 500;
}
.nesr-about-features .nesr-icon { flex: 0 0 auto; color: var(--nesr-orange); }

/* -------------------------------------------------------------------------
   FAQ
   ------------------------------------------------------------------------- */

.nesr-faq-panel {
  padding: 48px 38px;
  border: 1px solid var(--nesr-border);
  border-radius: var(--nesr-radius-panel);
  background: var(--nesr-white);
}
.nesr-faq-panel h2 {
  margin-block: 12px 28px;
  font-size: clamp(2rem, 3vw, 2.6rem);
  line-height: 1.28;
  font-weight: 600;
}

/* -------------------------------------------------------------------------
   Map
   ------------------------------------------------------------------------- */

.nesr-map-section { padding-block: 40px 96px; background: var(--nesr-stone); }
.nesr-map-wrap {
  position: relative;
  min-height: 440px;
  overflow: hidden;
  border-radius: var(--nesr-radius-panel);
  background: var(--nesr-stone-2);
}
.nesr-map-facade {
  width: 100%;
  height: 440px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 7px;
  border: 0;
  background:
    radial-gradient(circle at 28% 35%, rgba(243, 107, 33, .14), transparent 22%),
    linear-gradient(135deg, #E9E3DD, #F4F1ED);
  color: var(--nesr-ink);
  cursor: pointer;
}
.nesr-map-facade__pin {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  margin-block-end: 5px;
  border-radius: 50%;
  background: var(--nesr-orange);
  color: var(--nesr-ink);
  box-shadow: 0 12px 28px rgba(243, 107, 33, .22);
  transition: transform 180ms ease;
}
.nesr-map-facade:hover .nesr-map-facade__pin { transform: translateY(-2px); }
.nesr-map-facade strong { font-size: 16px; font-weight: 600; }
.nesr-map-facade small { color: var(--nesr-muted); font-size: 12px; }
.nesr-map-wrap iframe {
  width: 100%;
  height: 440px;
  display: block;
  border: 0;
  filter: saturate(.7) contrast(1.03);
}
.nesr-map-card {
  position: absolute;
  width: min(420px, calc(100% - 48px));
  inset-inline-end: 24px;
  top: 24px;
  bottom: 24px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 34px;
  border: 1px solid rgba(255, 255, 255, .65);
  border-radius: 18px;
  background: rgba(255, 255, 255, .93);
  box-shadow: var(--nesr-shadow-card);
  backdrop-filter: blur(14px);
}
.nesr-map-card__icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  margin-block-end: 18px;
  border-radius: 50%;
  background: var(--nesr-orange);
  color: var(--nesr-ink);
}
.nesr-map-card h2 { margin-block: 12px 14px; font-size: 32px; font-weight: 600; }
.nesr-map-card p { color: var(--nesr-muted); font-size: 15px; }
.nesr-map-card address {
  margin-block: 13px 22px;
  color: var(--nesr-ink-2);
  font-style: normal;
  font-weight: 600;
}

/* -------------------------------------------------------------------------
   Responsive
   ------------------------------------------------------------------------- */

@media (max-width: 1120px) {
  .nesr-custom-panel__copy { padding: 44px; }
  .nesr-about-grid { gap: 44px; }
}

@media (max-width: 900px) {
  .nesr-hero { min-height: 720px; }
  .nesr-hero__content { padding-block: 130px 30px; }
  .nesr-hero h1 { font-size: clamp(2.4rem, 5.8vw, 3.4rem); }
  .nesr-hero__trust { grid-template-columns: repeat(2, 1fr); }
  .nesr-trust-item { min-height: 76px; }
  .nesr-trust-item:nth-child(2) { border-inline-end: 0; }
  .nesr-trust-item:nth-child(-n+2) { border-bottom: 1px solid rgba(255, 255, 255, .16); }

  .nesr-solutions-grid { grid-template-columns: repeat(2, 1fr); }
  .nesr-solution-card,
  .nesr-solution-card--1,
  .nesr-solution-card--2 { min-height: 390px; grid-column: span 1; }
  .nesr-solution-card--1 { grid-column: 1 / -1; }

  .nesr-custom-panel { grid-template-columns: 1fr; }
  .nesr-custom-panel__image { min-height: 430px; }

  .nesr-showcase { grid-template-columns: 1fr; gap: 34px; }
  .nesr-showcase__intro { padding-block: 0; }
  .nesr-showcase__tabs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 18px;
    min-height: 0;
    margin-block-start: 30px;
    padding-block-start: 0;
  }
  .nesr-showcase__tab:nth-child(2) { border-top: 1px solid rgba(255, 255, 255, .14); }
  .nesr-showcase__stage { height: 540px; }

  .nesr-about-grid { grid-template-columns: 1fr; }
  .nesr-about-visual,
  .nesr-about-visual img { min-height: 480px; }
}

@media (max-width: 640px) {
  .nesr-hero { min-height: 720px; }
  .nesr-hero__bg { object-position: 45% center; }
  .nesr-hero__overlay {
    background: linear-gradient(0deg, rgba(12, 11, 10, .88) 0%, rgba(12, 11, 10, .46) 70%, rgba(12, 11, 10, .45) 100%);
  }
  .nesr-hero__content { align-items: flex-end; padding-block: 112px 24px; }
  .nesr-hero h1 { margin-block: 16px; font-size: clamp(1.45rem, 7.1vw, 2.2rem); line-height: 1.25; }
  .nesr-hero__copy > p { margin-block-end: 25px; font-size: 16px; line-height: 1.75; }
  .nesr-trust-item { min-height: 76px; gap: 10px; padding: 10px 12px; }
  .nesr-trust-item__icon { width: 40px; height: 40px; border-radius: 10px; }
  .nesr-trust-item > span:last-child { font-size: 12px; }

  /* Five stacked cards at 390px is a long empty scroll — shorten, and keep
     the first one taller so the stack still has a lead card. */
  .nesr-solutions-grid { grid-template-columns: 1fr; gap: 12px; }
  .nesr-solution-card,
  .nesr-solution-card--1,
  .nesr-solution-card--2 { min-height: 300px; grid-column: 1; }
  .nesr-solution-card--1 { min-height: 350px; }
  .nesr-solution-card__shade {
    background: linear-gradient(0deg, rgba(15, 14, 13, .9), rgba(15, 14, 13, .1) 62%);
  }
  .nesr-solution-card__number {
    inset-inline-start: 16px;
    top: 16px;
    width: 36px;
    height: 36px;
    font-size: 12px;
  }
  .nesr-solution-card__body { padding: 20px; }
  .nesr-solution-card__body h3 { font-size: 21px; line-height: 1.35; }
  .nesr-solution-card__body p { margin-block: 6px 10px; font-size: 14px; line-height: 1.6; }

  .nesr-custom-section { padding-block: 20px; }
  .nesr-custom-panel__image { min-height: 300px; }
  .nesr-custom-panel__copy { padding: 30px 24px; }
  .nesr-custom-panel__copy h2 { font-size: 2rem; }
  .nesr-custom-panel__copy p { font-size: 15px; }

  .nesr-projects-showcase { padding-block: 72px; }
  .nesr-showcase__intro h2 { font-size: 2rem; }
  .nesr-showcase__intro > p { font-size: 15px; }
  .nesr-showcase__stage { height: 430px; border-radius: 18px; }
  .nesr-showcase__tabs { grid-template-columns: 1fr 1fr; gap: 0 14px; margin-block-start: 26px; }
  .nesr-showcase__tab { min-height: 62px; grid-template-columns: 28px 1fr 18px; gap: 7px; }
  .nesr-showcase__tab strong { font-size: 15px; }
  .nesr-showcase__meta { inset-inline: 18px; bottom: 18px; }
  .nesr-showcase__meta strong { font-size: 22px; }

  .nesr-about-visual,
  .nesr-about-visual img { min-height: 360px; }
  .nesr-about-copy h2 { font-size: 2rem; }
  .nesr-about-features { grid-template-columns: 1fr; }

  .nesr-faq-panel { padding: 28px 20px; border-radius: 18px; }
  .nesr-faq-panel h2 { font-size: 2rem; }

  .nesr-map-section { padding-block: 16px 64px; }
  .nesr-map-wrap {
    min-height: 590px;
    display: flex;
    flex-direction: column-reverse;
    background: transparent;
  }
  .nesr-map-wrap iframe,
  .nesr-map-facade { height: 300px; border-radius: 0 0 18px 18px; }
  .nesr-map-card {
    position: relative;
    width: 100%;
    inset: auto;
    padding: 26px 22px;
    border-radius: 18px 18px 0 0;
    box-shadow: none;
  }
  .nesr-map-card h2 { font-size: 29px; }
  .nesr-map-card .nesr-button { width: 100%; }
}

/* ==========================================================================
   Inner pages — about and contact
   Reference: system-pages.css lines 200-260
   ========================================================================== */

/* -------------------------------------------------------------------------
   Inner page hero
   ------------------------------------------------------------------------- */

.nesr-page-hero {
  padding-block: 34px 90px;
  background: var(--nesr-dark-1);
  color: var(--nesr-white);
}
.nesr-page-hero__copy { max-width: 930px; padding-block: 80px 55px; }
.nesr-page-hero__copy h1 {
  margin-block: 16px 20px;
  font-size: clamp(3.3rem, 5.5vw, 5rem);
  line-height: 1.14;
  letter-spacing: -.04em;
  font-weight: 600;
}
.nesr-page-hero__copy p {
  max-width: 790px;
  color: rgba(255, 255, 255, .65);
  font-size: 18px;
}
.nesr-page-hero__figure {
  position: relative;
  height: 640px;
  overflow: hidden;
  border-radius: var(--nesr-radius-panel);
}
.nesr-page-hero__figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.75) contrast(1.05);
}
.nesr-page-hero__badge {
  position: absolute;
  inset-inline-start: 24px;
  bottom: 24px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 18px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .92);
  color: var(--nesr-ink);
  backdrop-filter: blur(10px);
}
.nesr-page-hero__badge strong { color: var(--nesr-orange); font-size: 32px; line-height: 1; }
.nesr-page-hero__badge span { font-size: 14px; font-weight: 600; }

/* -------------------------------------------------------------------------
   Numbered story
   ------------------------------------------------------------------------- */

.nesr-story-section { padding-block: 105px; }
.nesr-story-section > .nesr-container {
  display: grid;
  grid-template-columns: 5fr 7fr;
  gap: 80px;
}
.nesr-story-section__index {
  display: block;
  margin-block-end: 70px;
  color: var(--nesr-orange);
  font-size: 64px;
  line-height: 1;
}
.nesr-story-section h2 { margin-block-start: 12px; font-size: 38px; font-weight: 600; }
.nesr-story-section > .nesr-container > div:last-child > p {
  margin-block-end: 34px;
  color: var(--nesr-ink-2);
  font-size: 22px;
  line-height: 1.9;
}
.nesr-story-section img {
  width: 100%;
  height: 430px;
  object-fit: cover;
  border-radius: var(--nesr-radius-card);
  filter: saturate(.8);
}

/* -------------------------------------------------------------------------
   Feature grid
   ------------------------------------------------------------------------- */

.nesr-feature-section { padding-block: 100px; background: var(--nesr-stone); }
.nesr-feature-section__head { max-width: 760px; margin-block-end: 40px; }
.nesr-feature-section__head h2 { margin-block-start: 12px; font-size: 40px; font-weight: 600; }

.nesr-feature-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  border: 1px solid var(--nesr-border);
  background: var(--nesr-border);
}
.nesr-feature-grid article {
  min-height: 250px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 28px;
  background: var(--nesr-warm-white);
}
.nesr-feature-grid .nesr-feature-icon { width: 48px; height: 48px; }
.nesr-feature-grid strong {
  margin-block-start: 18px;
  color: var(--nesr-orange);
  font-size: 28px;
  line-height: 1;
}
.nesr-feature-grid h3 { margin-block: auto 8px; font-size: 20px; font-weight: 600; }
.nesr-feature-grid article:not(:has(strong)) h3 { margin-block-start: 32px; }
.nesr-feature-grid p { color: var(--nesr-muted); font-size: 14px; }

/* -------------------------------------------------------------------------
   Direct contact card
   ------------------------------------------------------------------------- */

.nesr-contact-card {
  padding: 34px;
  border-radius: var(--nesr-radius-panel);
  background: var(--nesr-ink);
  color: var(--nesr-white);
}
.nesr-contact-card h2 {
  margin-block: 14px 10px;
  font-size: 31px;
  line-height: 1.35;
  font-weight: 600;
}
.nesr-contact-card p { margin-block-end: 24px; color: rgba(255, 255, 255, .6); }
.nesr-contact-card > a {
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  border-top: 1px solid rgba(255, 255, 255, .14);
  color: var(--nesr-orange);
  font-weight: 600;
}
.nesr-contact-card > a > span { display: inline-flex; align-items: center; gap: 9px; }
.nesr-contact-card > a:hover { color: var(--nesr-white); }

/* -------------------------------------------------------------------------
   Responsive
   ------------------------------------------------------------------------- */

@media (max-width: 1120px) {
  .nesr-feature-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  .nesr-page-hero__figure { height: 460px; }
  .nesr-story-section > .nesr-container { grid-template-columns: 1fr; gap: 40px; }
  .nesr-story-section__index { margin-block-end: 30px; }
}

@media (max-width: 640px) {
  .nesr-page-hero { padding-block: 22px 60px; }
  .nesr-page-hero__copy { padding-block: 40px 32px; }
  .nesr-page-hero__copy h1 { font-size: 2.55rem; }
  .nesr-page-hero__copy p { font-size: 15px; }
  .nesr-page-hero__figure { height: 340px; }

  .nesr-story-section { padding-block: 70px; }
  .nesr-story-section h2 { font-size: 2rem; }
  .nesr-story-section > .nesr-container > div:last-child > p { font-size: 18px; }
  .nesr-story-section img { height: 300px; }

  .nesr-feature-section { padding-block: 70px; }
  .nesr-feature-section__head h2 { font-size: 2rem; }
  .nesr-feature-grid { grid-template-columns: 1fr; }
  .nesr-feature-grid article { min-height: 200px; }

  .nesr-contact-card { padding: 26px 22px; }
  .nesr-contact-card h2 { font-size: 26px; }
}

/* Standalone section wrappers */
.nesr-faq-section { padding-block: 88px; background: var(--nesr-stone); }
.nesr-faq-section .nesr-faq-panel { max-width: 860px; margin-inline: auto; }

.nesr-contact-section { padding-block: 88px; background: var(--nesr-stone); }
.nesr-contact-section .nesr-contact-card { max-width: 520px; margin-inline: auto; }

/* Two consecutive sections on the same background: drop the doubled padding. */
.nesr-contact-section + .nesr-faq-section,
.nesr-faq-section + .nesr-contact-section { padding-block-start: 0; }

@media (max-width: 640px) {
  .nesr-faq-section,
  .nesr-contact-section { padding-block: 56px; }
}

/* ==========================================================================
   Quote request form
   ========================================================================== */
/* The form's own styles (grid, fields, upload control, combobox, status
   messages) live in the theme's assets/css/quote-form.css, loaded lazily
   by the renderer. Only the outer section and panel chrome lives here. */

.nesr-quote-section { padding-block: 88px; background: var(--nesr-stone); }
.nesr-quote-panel {
  max-width: 860px;
  margin-inline: auto;
  padding: 48px;
  border: 1px solid var(--nesr-border);
  border-radius: var(--nesr-radius-panel);
  background: var(--nesr-white);
}
.nesr-quote-panel h2 {
  margin-block: 12px 14px;
  font-size: clamp(2rem, 3vw, 2.6rem);
  line-height: 1.28;
  font-weight: 600;
}
.nesr-quote-panel__lead { margin-block-end: 30px; color: var(--nesr-muted); font-size: 17px; }

@media (max-width: 640px) {
  .nesr-quote-section { padding-block: 56px; }
  .nesr-quote-panel { padding: 28px 20px; border-radius: 18px; }
  .nesr-quote-panel h2 { font-size: 1.75rem; }
}

/* ==========================================================================
   Contact page layout — form plus sticky aside
   Reference: system-pages.css .contact-experience
   ========================================================================== */

.nesr-contact-experience { padding-block: 88px; background: var(--nesr-stone); }

.nesr-contact-experience__grid {
  display: grid;
  grid-template-columns: 8fr 4fr;
  align-items: start;
  gap: 26px;
}

.nesr-contact-form-panel {
  padding: 46px;
  border: 1px solid var(--nesr-border);
  border-radius: var(--nesr-radius-panel);
  background: var(--nesr-white);
}
.nesr-contact-form-panel__head { margin-block-end: 30px; }
.nesr-contact-form-panel__head h2 {
  margin-block: 12px 10px;
  font-size: clamp(1.9rem, 2.6vw, 2.2rem);
  line-height: 1.3;
  font-weight: 600;
}
.nesr-contact-form-panel__head p {
  max-width: 620px;
  color: var(--nesr-muted);
  font-size: 16px;
}

/*
 * Sticky aside.
 * top clears the 78px sticky header, otherwise it hides underneath.
 */
.nesr-contact-aside {
  position: sticky;
  top: 110px;
  display: grid;
  gap: 20px;
}

/* Visit card */
.nesr-visit-card {
  padding: 30px;
  border: 1px solid var(--nesr-border);
  border-radius: var(--nesr-radius-panel);
  background: var(--nesr-white);
}
.nesr-visit-card__icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  margin-block-end: 16px;
  border-radius: 50%;
  background: var(--nesr-orange-soft);
  color: var(--nesr-orange);
}
.nesr-visit-card h3 { font-size: 21px; font-weight: 600; }
.nesr-visit-card address {
  margin-block: 10px 18px;
  color: var(--nesr-muted);
  font-style: normal;
  font-size: 15px;
  line-height: 1.8;
}

/* Inside the layout the form needs no extra panel — the container is the panel. */
.nesr-contact-form-panel .nesr-quote-form__submit { margin-block-start: 24px; }

@media (max-width: 1120px) {
  .nesr-contact-experience__grid { grid-template-columns: 7fr 5fr; }
  .nesr-contact-form-panel { padding: 36px; }
}

@media (max-width: 900px) {
  .nesr-contact-experience__grid { grid-template-columns: 1fr; }
  .nesr-contact-aside {
    position: static;
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .nesr-contact-experience { padding-block: 56px; }
  .nesr-contact-form-panel { padding: 26px 20px; border-radius: 18px; }
  .nesr-contact-form-panel__head h2 { font-size: 1.7rem; }
  .nesr-contact-aside { grid-template-columns: 1fr; }
  .nesr-visit-card { padding: 24px 20px; }
}

/* ==========================================================================
   Paired sections — the quote form beside the FAQ
   ==========================================================================
   Two widgets that each render a full-bleed band, asked to share one row.
   The wrapper is an ordinary Elementor container carrying the nesr-duo
   class; every rule below is rooted there, so a widget used on its own is
   untouched and the load order against faq.css cannot matter (two classes
   always outrank the one-class rules being overridden).
   -------------------------------------------------------------------- */

.e-con.nesr-duo {
  display: grid;
  /*
   * 60 / 40. The form is first in source order, so RTL puts it in the wide
   * column on the right and LTR on the left — either way the form leads and
   * the questions sit beside it.
   */
  grid-template-columns: 3fr 2fr;
  align-items: start;
  gap: 28px;
  /*
   * One band for the pair, instead of each section painting its own.
   * The inline padding reproduces .nesr-container's gutter — 40px, growing
   * to whatever centres the content once the viewport passes 1280 + 80 —
   * because the two inner containers are unset below.
   */
  padding: 88px max(40px, calc((100% - var(--nesr-container)) / 2));
  background: var(--nesr-stone);
}

.nesr-duo > * { min-width: 0; }

/* Each panel is now a card in a column: no band, no second gutter. */
.nesr-duo .nesr-quote-section,
.nesr-duo .nesr-faq-block {
  padding-block: 0;
  background: transparent;
}
.nesr-duo .nesr-container {
  width: 100%;
  max-width: none;
  padding-inline: 0;
}

/* The FAQ arrives as a bare block; the form arrives as a card. Match them. */
.nesr-duo .nesr-faq-block__grid {
  grid-template-columns: 1fr;
  max-width: none;
  gap: 30px;
  padding: 48px;
  border: 1px solid var(--nesr-border);
  border-radius: var(--nesr-radius-panel);
  background: var(--nesr-white);
}
.nesr-duo .nesr-faq-block__intro { position: static; }
.nesr-duo .nesr-quote-panel { max-width: none; }

/* Both headings now live in half a row — bring the two scales together. */
.nesr-duo .nesr-quote-panel h2,
.nesr-duo .nesr-faq-block__intro h2 { font-size: clamp(1.9rem, 2.4vw, 2.4rem); }

@media (max-width: 1120px) {
  .e-con.nesr-duo { gap: 22px; padding: 64px 24px; }
  .nesr-duo .nesr-faq-block__grid,
  .nesr-duo .nesr-quote-panel { padding: 36px; }
}

/* Side by side stops paying for itself once each column is a narrow strip. */
@media (max-width: 1000px) {
  .e-con.nesr-duo { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .e-con.nesr-duo { padding: 56px 16px; }
  .nesr-duo .nesr-faq-block__grid,
  .nesr-duo .nesr-quote-panel { padding: 28px 20px; border-radius: 18px; }
}

/* Half a row is a narrower measure than a full section — step the question
   text down so it reads as a list, not as a stack of headings. */
.nesr-duo .nesr-faq-item__text { font-size: 15px; line-height: 1.6; }

/* Centred layout puts the help card at the foot of the list; it needs the
   separation the intro column used to give it. */
.nesr-duo .nesr-faq-list .nesr-faq-help { margin-block-start: 24px; }

/* The searchable city combobox styles live in the theme's
   quote-form.css with the rest of the form fields. */