/**
 * Industries We Serve — inner pages.
 * All selectors live under .intercoil-inner-page (see inner-pages.css notes).
 *
 * Structure:
 *   1. Page tokens
 *   2. Hero refinements
 *   3. Opening (statement + two-column prose)
 *   4. Mosaic (asymmetric image composition)
 *   5. Split rows
 *   6. Panorama
 *   7. Stat feature
 *   8. Partner logo wall
 *   9. Scopes (typographic list)
 *  10. Network band (wholesale)
 *  11. Closing + buttons + cert marks
 *  12. Mobile overrides
 *  13. Reduced motion
 *
 * Reuse notes:
 *   - Hero shell, glows, grain, fade come from inner-pages.css (.inner-hero).
 *   - Scroll reveals use the shared .reveal-up / .reveal-mask utilities.
 *   - Everything stays on the core Intercoil palette; the imagery carries
 *     each industry's character, not a recolor.
 */

/* ════════════════════════════════════════════════════════════
   1. PAGE TOKENS
   ════════════════════════════════════════════════════════════ */

.intercoil-inner-page.industry-page {
  --industry-ink: #39415c;
}

/* ════════════════════════════════════════════════════════════
   2. HERO
   Long single-sentence headlines need a calmer scale than the
   default simple title.
   ════════════════════════════════════════════════════════════ */

.intercoil-inner-page .industry-hero__title {
  max-width: 22ch;
  font-size: clamp(2.1rem, 5vw, 4rem);
  line-height: 1.1;
}

/* ════════════════════════════════════════════════════════════
   3. OPENING — magazine-style intro
   Oversized statement, then supporting prose flowing in two
   columns like an editorial standfirst.
   ════════════════════════════════════════════════════════════ */

.intercoil-inner-page .industry-opening {
  position: relative;
  padding: clamp(40px, 6vw, 90px) 0 clamp(56px, 8vw, 100px);
}

.intercoil-inner-page .industry-opening__statement {
  margin: 0;
  max-width: 30ch;
  font-size: clamp(1.7rem, 3.6vw, 2.9rem);
  font-weight: 600;
  line-height: 1.26;
  letter-spacing: -0.015em;
  background: var(--grad-heading-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--color-navy);
}

.intercoil-inner-page .industry-opening__columns {
  margin-top: clamp(30px, 4.5vw, 48px);
  max-width: 1060px;
}

@media (min-width: 800px) {
  .intercoil-inner-page .industry-opening__columns {
    columns: 2;
    column-gap: clamp(48px, 6vw, 90px);
  }
}

.intercoil-inner-page .industry-opening__prose {
  margin: 0 0 1.4em;
  font-size: clamp(1rem, 1.4vw, 1.125rem);
  line-height: 1.8;
  color: var(--industry-ink);
  break-inside: avoid;
}

.intercoil-inner-page .industry-opening__prose:last-child {
  margin-bottom: 0;
}

/* ════════════════════════════════════════════════════════════
   4. MOSAIC — asymmetric image composition
   One dominant frame with two supporting frames. Purely visual;
   also reused as a mid-page gallery via the --section modifier.
   ════════════════════════════════════════════════════════════ */

.intercoil-inner-page .industry-mosaic--section {
  margin-top: var(--inner-pad);
}

.intercoil-inner-page .industry-mosaic__layout {
  display: grid;
  gap: clamp(12px, 1.8vw, 24px);
}

@media (min-width: 760px) {
  .intercoil-inner-page .industry-mosaic__layout {
    grid-template-columns: 1.5fr 1fr;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    height: clamp(420px, 52vw, 640px);
  }

  .intercoil-inner-page .industry-mosaic__item--1 {
    grid-row: 1 / span 2;
  }
}

.intercoil-inner-page .industry-mosaic__item {
  margin: 0;
  border-radius: var(--radius-img);
  overflow: hidden;
  min-height: 0;
}

@media (max-width: 759px) {
  .intercoil-inner-page .industry-mosaic__item {
    aspect-ratio: 16 / 10;
  }

  .intercoil-inner-page .industry-mosaic__item--1 {
    aspect-ratio: 4 / 3;
  }
}

.intercoil-inner-page .industry-mosaic__item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--inner-ease);
}

.intercoil-inner-page .industry-mosaic__item:hover img {
  transform: scale(1.035);
}

/* ════════════════════════════════════════════════════════════
   5. SPLIT ROWS — layered editorial media/text
   ════════════════════════════════════════════════════════════ */

.intercoil-inner-page .industry-split {
  padding-top: var(--inner-pad);
}

.intercoil-inner-page .industry-split__layout {
  display: grid;
  gap: clamp(40px, 6vw, 80px);
  align-items: center;
}

@media (min-width: 900px) {
  .intercoil-inner-page .industry-split__layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(56px, 8vw, 110px);
  }

  .intercoil-inner-page .industry-split--reverse .industry-split__media {
    order: 2;
  }
}

.intercoil-inner-page .industry-split__media {
  position: relative;
}

.intercoil-inner-page .industry-split__figure {
  margin: 0;
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-img);
  overflow: hidden;
  box-shadow: var(--shadow-card);
}

.intercoil-inner-page .industry-split__figure img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.9s var(--inner-ease);
}

.intercoil-inner-page .industry-split__media:hover .industry-split__figure img {
  transform: scale(1.035);
}

.intercoil-inner-page .industry-split__figure-accent {
  position: absolute;
  right: -6%;
  bottom: -12%;
  width: 40%;
  aspect-ratio: 1 / 1;
  margin: 0;
  border-radius: var(--radius-img);
  border: 6px solid var(--color-white);
  overflow: hidden;
  box-shadow: var(--shadow-hover);
}

.intercoil-inner-page .industry-split--reverse .industry-split__figure-accent {
  right: auto;
  left: -6%;
}

.intercoil-inner-page .industry-split__figure-accent img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.intercoil-inner-page .industry-split__title {
  margin: 0 0 clamp(20px, 3vw, 30px);
  max-width: 20ch;
  font-size: clamp(1.75rem, 3.2vw, 2.6rem);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.02em;
  color: var(--color-navy);
}

.intercoil-inner-page .industry-split__text {
  margin: 0 0 1.35em;
  max-width: 56ch;
  font-size: clamp(1rem, 1.35vw, 1.1rem);
  line-height: 1.8;
  color: var(--industry-ink);
}

.intercoil-inner-page .industry-split__text:last-child {
  margin-bottom: 0;
}

/* Certification marks (Tailored Manufacturing) */
.intercoil-inner-page .industry-marks {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: clamp(24px, 3.5vw, 34px) 0 0;
  padding: 0;
  list-style: none;
}

.intercoil-inner-page .industry-marks__item {
  padding: 10px 20px;
  border-radius: var(--radius-btn);
  background: rgba(0, 31, 140, 0.07);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-royal);
}

/* ════════════════════════════════════════════════════════════
   6. PANORAMA — full-bleed cinematic band
   ════════════════════════════════════════════════════════════ */

.intercoil-inner-page .industry-panorama {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(500px, 70vh, 700px);
  padding: clamp(90px, 12vw, 150px) 0;
  isolation: isolate;
  overflow: hidden;
  color: var(--color-white);
}

.intercoil-inner-page .industry-panorama__media {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.intercoil-inner-page .industry-panorama__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.05);
}

@media (prefers-reduced-motion: no-preference) {
  .intercoil-inner-page .industry-panorama__img {
    animation: industryPanoramaBreathe 20s var(--inner-ease) infinite alternate;
  }
}

@keyframes industryPanoramaBreathe {
  0%   { transform: scale(1.05); }
  100% { transform: scale(1.1); }
}

.intercoil-inner-page .industry-panorama__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0, 8, 56, 0.55) 0%, rgba(0, 8, 56, 0.82) 100%),
    radial-gradient(ellipse 90% 70% at 50% 100%, rgba(0, 31, 140, 0.5) 0%, transparent 70%);
}

.intercoil-inner-page .industry-panorama__inner {
  position: relative;
  z-index: 1;
  max-width: min(820px, 100%);
  text-align: center;
}

.intercoil-inner-page .industry-panorama__title {
  margin: 0 0 clamp(22px, 3.5vw, 34px);
  font-size: clamp(1.9rem, 4vw, 3.1rem);
  font-weight: 700;
  line-height: 1.16;
  letter-spacing: -0.02em;
  text-shadow: 0 4px 36px rgba(0, 0, 0, 0.35);
}

.intercoil-inner-page .industry-panorama__text {
  margin: 0 auto 1.4em;
  max-width: 62ch;
  font-size: clamp(1rem, 1.4vw, 1.15rem);
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.86);
}

.intercoil-inner-page .industry-panorama__text:last-child {
  margin-bottom: 0;
}

/* ════════════════════════════════════════════════════════════
   7. STAT FEATURE — one oversized fact on brand navy
   ════════════════════════════════════════════════════════════ */

.intercoil-inner-page .industry-stat {
  position: relative;
  padding: clamp(90px, 12vw, 160px) 0;
  background:
    radial-gradient(ellipse 70% 90% at 80% 0%, rgba(0, 160, 243, 0.16) 0%, transparent 60%),
    var(--color-navy);
  overflow: hidden;
  color: var(--color-white);
}

.intercoil-inner-page .industry-stat__inner {
  position: relative;
  z-index: 1;
  max-width: min(880px, 100%);
  text-align: center;
  margin-inline: auto;
}

.intercoil-inner-page .industry-stat__lead {
  margin: 0 0 clamp(18px, 3vw, 28px);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
}

.intercoil-inner-page .industry-stat__figure {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: clamp(10px, 2vw, 20px);
  margin: 0 0 clamp(26px, 4vw, 40px);
  line-height: 0.9;
}

.intercoil-inner-page .industry-stat__value {
  font-size: clamp(6rem, 18vw, 12rem);
  font-weight: 700;
  letter-spacing: -0.04em;
  background: linear-gradient(120deg, var(--color-white) 20%, var(--color-accent) 110%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--color-white);
}

.intercoil-inner-page .industry-stat__suffix {
  font-size: clamp(1.5rem, 3.6vw, 2.5rem);
  font-weight: 300;
  color: rgba(255, 255, 255, 0.66);
}

.intercoil-inner-page .industry-stat__title {
  margin: 0 auto clamp(18px, 3vw, 26px);
  max-width: 30ch;
  font-size: clamp(1.5rem, 3vw, 2.25rem);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.015em;
}

.intercoil-inner-page .industry-stat__text {
  margin: 0 auto;
  max-width: 58ch;
  font-size: clamp(1rem, 1.4vw, 1.15rem);
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.72);
}

/* ════════════════════════════════════════════════════════════
   8. PARTNER LOGO WALL — hospitality
   Deep navy band; quiet logos, no containers.
   ════════════════════════════════════════════════════════════ */

.intercoil-inner-page .industry-logos {
  position: relative;
  padding: var(--inner-pad) 0;
  background:
    radial-gradient(ellipse 60% 80% at 15% 0%, rgba(0, 160, 243, 0.14) 0%, transparent 60%),
    radial-gradient(ellipse 50% 70% at 95% 100%, rgba(79, 123, 217, 0.14) 0%, transparent 60%),
    var(--color-navy);
  overflow: hidden;
  color: var(--color-white);
}

.intercoil-inner-page .industry-logos__head {
  max-width: 820px;
  margin-bottom: clamp(48px, 7vw, 80px);
}

.intercoil-inner-page .industry-logos__title {
  margin: 0 0 clamp(20px, 3vw, 30px);
  max-width: 22ch;
  font-size: clamp(1.75rem, 3.2vw, 2.6rem);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.02em;
}

.intercoil-inner-page .industry-logos__text {
  margin: 0 0 1.35em;
  font-size: clamp(1rem, 1.35vw, 1.1rem);
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.74);
}

.intercoil-inner-page .industry-logos__text:last-child {
  margin-bottom: 0;
}

.intercoil-inner-page .industry-logos__wall {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: clamp(28px, 4.5vw, 56px) clamp(24px, 4vw, 48px);
  align-items: center;
}

.intercoil-inner-page .industry-logos__mark {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  opacity: 0.62;
  transition: opacity 0.5s var(--inner-ease), transform 0.5s var(--inner-ease);
}

.intercoil-inner-page .industry-logos__mark:hover {
  opacity: 1;
  transform: translateY(-3px);
}

.intercoil-inner-page .industry-logos__mark img {
  display: block;
  max-width: min(130px, 100%);
  max-height: 52px;
  width: auto;
  height: auto;
}

/* ════════════════════════════════════════════════════════════
   9. SCOPES — typographic project-scope list
   Numbered, spacious, no card chrome.
   ════════════════════════════════════════════════════════════ */

.intercoil-inner-page .industry-scopes {
  padding-top: var(--inner-pad);
}

.intercoil-inner-page .industry-scopes__head {
  max-width: 760px;
  margin-bottom: clamp(44px, 6vw, 70px);
}

.intercoil-inner-page .industry-scopes__title {
  margin: 0 0 clamp(16px, 2.5vw, 24px);
  font-size: clamp(1.75rem, 3.2vw, 2.6rem);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.02em;
  color: var(--color-navy);
}

.intercoil-inner-page .industry-scopes__lead {
  margin: 0;
  font-size: clamp(1.1rem, 1.7vw, 1.3rem);
  line-height: 1.65;
  color: var(--industry-ink);
}

.intercoil-inner-page .industry-scopes__list {
  display: grid;
  gap: clamp(28px, 4vw, 44px) clamp(36px, 5vw, 70px);
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 640px) {
  .intercoil-inner-page .industry-scopes__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1020px) {
  .intercoil-inner-page .industry-scopes__list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.intercoil-inner-page .industry-scopes__num {
  display: block;
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.2em;
  color: rgba(0, 160, 243, 0.65);
}

.intercoil-inner-page .industry-scopes__label {
  display: block;
  max-width: 20ch;
  font-size: clamp(1.2rem, 1.9vw, 1.45rem);
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: var(--color-navy);
}

.intercoil-inner-page .industry-scopes__after {
  max-width: 1060px;
  margin-top: clamp(44px, 6vw, 70px);
}

@media (min-width: 800px) {
  .intercoil-inner-page .industry-scopes__after {
    columns: 2;
    column-gap: clamp(48px, 6vw, 90px);
  }
}

.intercoil-inner-page .industry-scopes__text {
  margin: 0 0 1.4em;
  font-size: clamp(1rem, 1.35vw, 1.1rem);
  line-height: 1.8;
  color: var(--industry-ink);
  break-inside: avoid;
}

.intercoil-inner-page .industry-scopes__text:last-child {
  margin-bottom: 0;
}

/* ════════════════════════════════════════════════════════════
   10. NETWORK BAND — wholesale trade reach
   Deep gradient ground, oversized stats, region columns.
   ════════════════════════════════════════════════════════════ */

.intercoil-inner-page .industry-network {
  position: relative;
  margin-top: clamp(56px, 8vw, 100px);
  padding: var(--inner-pad) 0;
  background: var(--grad-brand);
  overflow: hidden;
  color: var(--color-white);
}

.intercoil-inner-page .industry-network__arc {
  position: absolute;
  top: -40%;
  right: -18%;
  width: min(70vw, 900px);
  height: min(70vw, 900px);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(29, 190, 255, 0.16) 0%, transparent 62%);
  filter: blur(60px);
  pointer-events: none;
}

.intercoil-inner-page .industry-network__inner {
  position: relative;
  z-index: 1;
}

.intercoil-inner-page .industry-network__quote {
  margin: 0 0 clamp(56px, 8vw, 90px);
  max-width: 30ch;
  font-size: clamp(1.6rem, 3.4vw, 2.6rem);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.015em;
}

.intercoil-inner-page .industry-network__stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: clamp(32px, 5vw, 64px);
  margin: 0 0 clamp(56px, 8vw, 90px);
}

.intercoil-inner-page .industry-network__value {
  margin: 0 0 10px;
  font-size: clamp(3rem, 7vw, 5.5rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
  background: var(--grad-stats-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--color-soft-blue);
}

.intercoil-inner-page .industry-network__label {
  margin: 0;
  max-width: 24ch;
  font-size: 15px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.68);
}

.intercoil-inner-page .industry-network__regions {
  display: grid;
  gap: clamp(36px, 5vw, 64px);
}

@media (min-width: 760px) {
  .intercoil-inner-page .industry-network__regions {
    grid-template-columns: 1.2fr 1fr;
  }
}

.intercoil-inner-page .industry-network__region-title {
  margin: 0 0 clamp(16px, 2.5vw, 22px);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
}

/* Region chips reuse the existing pill shape from .industry-marks
   (manufacturing page), recolored for this section's dark gradient
   ground, so verified market coverage reads as a structured, scannable
   grid instead of a plain stacked list. */
.intercoil-inner-page .industry-network__region-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.intercoil-inner-page .industry-network__region-list li {
  padding: 12px 22px;
  border-radius: var(--radius-btn);
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.2);
  font-size: clamp(0.95rem, 1.3vw, 1.05rem);
  font-weight: 600;
  letter-spacing: -0.005em;
  color: var(--color-white);
}

.intercoil-inner-page .industry-network__region-group--muted .industry-network__region-list li {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.26);
  font-weight: 400;
  color: rgba(255, 255, 255, 0.68);
}

/* ════════════════════════════════════════════════════════════
   11. CLOSING + BUTTONS
   ════════════════════════════════════════════════════════════ */

.intercoil-inner-page .industry-closing {
  position: relative;
  display: flex;
  align-items: center;
  min-height: clamp(480px, 66vh, 640px);
  margin-top: var(--inner-pad);
  padding: clamp(90px, 12vw, 140px) 0;
  isolation: isolate;
  overflow: hidden;
  color: var(--color-white);
}

.intercoil-inner-page .industry-panorama + .industry-closing,
.intercoil-inner-page .industry-stat + .industry-closing,
.intercoil-inner-page .industry-logos + .industry-closing,
.intercoil-inner-page .industry-network + .industry-closing {
  margin-top: 0;
}

.intercoil-inner-page .industry-closing__media {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.intercoil-inner-page .industry-closing__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.intercoil-inner-page .industry-closing__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    rgba(0, 8, 56, 0.92) 0%,
    rgba(0, 31, 140, 0.55) 55%,
    rgba(0, 8, 56, 0.86) 100%
  );
}

.intercoil-inner-page .industry-closing__inner {
  position: relative;
  z-index: 1;
  text-align: center;
}

.intercoil-inner-page .industry-closing__quote {
  margin: 0 auto clamp(36px, 5.5vw, 56px);
  max-width: 30ch;
  font-size: clamp(1.7rem, 3.8vw, 2.9rem);
  font-weight: 700;
  line-height: 1.24;
  letter-spacing: -0.02em;
  text-shadow: 0 4px 40px rgba(0, 0, 0, 0.35);
}

.intercoil-inner-page .industry-closing__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
}

.intercoil-inner-page .industry-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 32px;
  border-radius: var(--radius-btn);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
  transition: transform 0.4s var(--inner-ease), box-shadow 0.4s var(--inner-ease), background 0.4s ease;
}

.intercoil-inner-page .industry-btn--primary {
  background: var(--color-white);
  color: var(--color-navy);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
}

.intercoil-inner-page .industry-btn--primary:hover {
  transform: translateY(-3px);
  box-shadow: 0 20px 52px rgba(0, 0, 0, 0.26);
}

.intercoil-inner-page .industry-btn__arrow {
  transition: transform 0.4s var(--inner-ease);
}

.intercoil-inner-page .industry-btn--primary:hover .industry-btn__arrow {
  transform: translateX(4px);
}

.intercoil-inner-page .industry-btn--ghost {
  color: var(--color-white);
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.intercoil-inner-page .industry-btn--ghost:hover {
  background: rgba(255, 255, 255, 0.2);
  transform: translateY(-3px);
}

/* ════════════════════════════════════════════════════════════
   12. MOBILE OVERRIDES
   ════════════════════════════════════════════════════════════ */

@media (max-width: 899px) {
  .intercoil-inner-page .industry-split__figure-accent {
    display: none;
  }
}

@media (max-width: 640px) {
  .intercoil-inner-page .industry-hero__title {
    font-size: clamp(1.8rem, 8vw, 2.4rem);
  }

  .intercoil-inner-page .industry-logos__wall {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .intercoil-inner-page .industry-network__stats {
    grid-template-columns: 1fr;
  }

  .intercoil-inner-page .industry-closing__actions .industry-btn {
    width: 100%;
    justify-content: center;
  }
}

/* ════════════════════════════════════════════════════════════
   12b. HOSPITALITY — full-page UI polish
   Page-scoped only (.industry-page--hospitality). None of these
   touch the shared, unscoped rules above, so Corporate, Wholesale
   and Tailored Manufacturing (which reuse the same base classes)
   are unaffected.
   ════════════════════════════════════════════════════════════ */

/* Hero — same shell/overlay as every inner page; only widen the title
   measure slightly so this particular sentence gets a better balance
   of lines instead of an isolated short final line. */
.intercoil-inner-page.industry-page--hospitality .industry-hero__title {
  max-width: 25ch;
}

/* Intro — a touch more separation between the oversized statement and
   the two-column prose so the heading reads as the clear anchor. */
.intercoil-inner-page.industry-page--hospitality .industry-opening__columns {
  margin-top: clamp(40px, 5.5vw, 60px);
}

/* Opening mosaic — the three photos had no shadow while every other
   image treatment on the page (split figures) does, which is part of
   why the small frames felt loosely attached to the large one. */
.intercoil-inner-page.industry-page--hospitality .industry-mosaic__item {
  box-shadow: var(--shadow-card);
}

/* Footprint (01) / Portfolio (02) — tighten these two rows into a
   matched pair: a little more air between the number and the title
   it introduces (the shared 8px is tuned for denser contexts). */
.intercoil-inner-page.industry-page--hospitality .industry-split .ghost-index {
  margin-bottom: 14px;
}

/* Section 02 only ever carried padding-top from the shared .industry-split
   rule — the gap before the next section is normally provided entirely by
   that next section's own top padding. Elsewhere on this page (e.g. the
   Wholesale network band) a white-to-navy transition reinforces that gap
   on the dark section's side; .industry-logos never had that reinforcement,
   so the white area ended almost flush against the navy proof section. */
.intercoil-inner-page.industry-page--hospitality .industry-split--reverse {
  padding-bottom: clamp(56px, 8vw, 100px);
}

/* ── Compact proof module ──────────────────────────────────────
   Client feedback: consolidate the statistic and hotel-logo evidence
   into ONE short navy band, not a tall multi-part composition. No
   supporting paragraphs render here at all (see template comment).
   Section padding itself is also reduced below the shared --inner-pad
   used elsewhere, so the whole module reads as one compact band that
   doesn't outsize the Footprint/Portfolio rows above it. */

.intercoil-inner-page.industry-page--hospitality .industry-logos {
  padding: clamp(48px, 6vw, 80px) 0;
}

.intercoil-inner-page.industry-page--hospitality .industry-logos__credibility {
  display: grid;
  gap: clamp(32px, 5vw, 48px);
}

@media (min-width: 860px) {
  .intercoil-inner-page.industry-page--hospitality .industry-logos__credibility {
    grid-template-columns: minmax(0, 0.38fr) minmax(0, 0.62fr);
    gap: clamp(48px, 6vw, 80px);
    align-items: center;
  }
}

/* One flex column is the single alignment container for the whole
   statistic side — eyebrow, figure and statement are flex children
   centered by the SAME align-items rule, instead of three siblings
   each centering themselves a different way (the figure via flex,
   the title via margin:auto, the lead via inherited text-align). That
   mismatch — not a missing override — was what put "18" on a
   different axis than the statement below it. */
.intercoil-inner-page.industry-page--hospitality .industry-logos__proof {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 100%;
  max-width: 380px;
  margin-inline: auto;
  gap: clamp(18px, 2.5vw, 26px);
}

@media (min-width: 860px) {
  .intercoil-inner-page.industry-page--hospitality .industry-logos__proof {
    max-width: 420px;
  }
}

/* Value + qualifier as one clean typographic unit, scaled down from the
   shared oversized-stat treatment. align-items is corrected to center
   for the column direction — the inherited "baseline" from the shared
   row-layout rule doesn't center a stacked column, which is the actual
   bug: it left "18" flush against the figure box's start edge. */
.intercoil-inner-page.industry-page--hospitality .industry-logos__proof .industry-stat__figure {
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin: 0;
}

.intercoil-inner-page.industry-page--hospitality .industry-logos__proof .industry-stat__value {
  font-size: clamp(3.5rem, 7vw, 5.5rem);
}

.intercoil-inner-page.industry-page--hospitality .industry-logos__proof .industry-stat__suffix {
  font-size: clamp(1.1rem, 2vw, 1.5rem);
}

.intercoil-inner-page.industry-page--hospitality .industry-logos__proof .industry-stat__title {
  margin: 0;
  max-width: 380px;
  font-size: clamp(1.2rem, 2.15vw, 1.55rem);
}

.intercoil-inner-page.industry-page--hospitality .industry-logos__proof .industry-stat__lead {
  margin: 0;
}

.intercoil-inner-page.industry-page--hospitality .industry-logos__head {
  max-width: 100%;
  margin: 0;
}

.intercoil-inner-page.industry-page--hospitality .industry-logos__head .industry-logos__title {
  margin-bottom: clamp(16px, 2.5vw, 22px);
  font-size: clamp(1.4rem, 2.5vw, 1.9rem);
}

.intercoil-inner-page.industry-page--hospitality .industry-logos__wall {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 32px) clamp(16px, 2.5vw, 28px);
}

@media (min-width: 480px) {
  .intercoil-inner-page.industry-page--hospitality .industry-logos__wall {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 860px) {
  .intercoil-inner-page.industry-page--hospitality .industry-logos__wall {
    /* Fixed 4 × 3 grid of equal cells, per spec, rather than an
       auto-fit count that varies with viewport width. */
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Equal-sized cells: each centers its logo on both axes regardless of
   the source PNG's own aspect ratio, so rows line up cleanly. Logos
   were also low-opacity even outside hover, which read as weak proof —
   the resting state is raised here without enlarging the marks. */
.intercoil-inner-page.industry-page--hospitality .industry-logos__mark {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 64px;
  opacity: 0.85;
}

.intercoil-inner-page.industry-page--hospitality .industry-logos__mark:hover {
  opacity: 1;
}

.intercoil-inner-page.industry-page--hospitality .industry-logos__mark img {
  width: auto;
  height: auto;
  max-width: min(130px, 100%);
  max-height: 48px;
  object-fit: contain;
}

/* All 12 source marks share an identical 372×220 canvas, but the actual
   logotype fills very different portions of it (measured: Shangri-La
   ~25%, Jumeirah ~28%, Rotana ~32% of canvas height vs. ~55–95% for the
   rest), so a uniform max-height alone leaves them looking mismatched.
   These two adjustments correct only the measured outliers. */
.intercoil-inner-page.industry-page--hospitality .industry-logos__mark--boost img {
  transform: scale(1.25);
}

.intercoil-inner-page.industry-page--hospitality .industry-logos__mark--reduce img {
  transform: scale(0.85);
}

/* ════════════════════════════════════════════════════════════
   13. REDUCED MOTION
   (Shared reveal utilities are already handled in motion.css.)
   ════════════════════════════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
  .intercoil-inner-page .industry-panorama__img {
    animation: none !important;
    transform: none !important;
  }

  .intercoil-inner-page .industry-mosaic__item img,
  .intercoil-inner-page .industry-split__figure img,
  .intercoil-inner-page .industry-logos__mark,
  .intercoil-inner-page .industry-btn {
    transition: none !important;
  }
}