/* ============================================================
   SECTORS — EpoxyOn (engineering). 1:1 with x8zsc1. Fluid / rem.
   Deep page; light bands via data-site="materials".
   ============================================================ */

/* Page hero */
.esc-hero{ min-height:22.5rem; display:flex; flex-direction:column; justify-content:flex-end; background-size:cover; background-position:center; }
.esc-hero-body{ display:flex; flex-direction:column; gap:0.75rem; padding-block:0 2.75rem; max-width:51rem; }
.esc-crumb{ font-family:var(--font-display); font-weight:700; font-size:0.719rem; letter-spacing:.1em; color:#B9C2B0; margin:0; }
.esc-title{ font-family:var(--font-display); font-weight:800; font-size:2.875rem; letter-spacing:-.011em; line-height:1.05; color:#fff; margin:0; }
.esc-sub{ font-size:0.9375rem; line-height:1.5; color:#D7DDD0; max-width:33.75rem; margin:0; }

/* Shared header */
.esc-hdr{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.625rem; }
.esc-h2{ font-family:var(--font-display); font-weight:800; font-size:1.375rem; color:var(--text-primary); margin:0; }
.esc-hdr-c{ font-family:var(--font-display); font-weight:700; font-size:0.719rem; letter-spacing:.09em; color:var(--text-secondary); white-space:nowrap; }
.esc-hdr-l{ font-family:var(--font-display); font-weight:700; font-size:0.781rem; letter-spacing:.03em; color:var(--text-primary); white-space:nowrap; }
.esc-hdr-l:hover{ color:var(--brand); }

/* Sector tiles (light band) */
.esc-tiles-sec{ background:var(--bg); }
.esc-tiles-sec .wrap{ padding-block:3.5rem 3rem; }
.esc-tiles{ display:grid; grid-template-columns:repeat(3,1fr); gap:0.875rem; }
.esc-tile{ display:flex; flex-direction:column; justify-content:flex-end; min-height:18.125rem; background-size:cover; background-position:center; border-radius:0.25rem; padding:0 0 0.875rem 0.875rem; text-decoration:none; }
.esc-tile-l{ font-family:var(--font-display); font-weight:800; font-size:0.781rem; letter-spacing:.06em; color:#fff; }
.esc-also{ font-family:var(--font-display); font-weight:600; font-size:0.719rem; letter-spacing:.04em; color:var(--text-secondary); margin:1.375rem 0 0; }

/* Demands (dark surface) */
.esc-demands{ background:var(--surface); }
.esc-demands .wrap{ padding-block:3.25rem; }
.esc-dem-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2.75rem; }
.esc-dem{ display:flex; gap:0.875rem; align-items:flex-start; }
.esc-dem-ic{ flex:none; width:2.125rem; height:2.125rem; color:var(--text-primary); }
.esc-dem-tc{ display:flex; flex-direction:column; gap:0.3125rem; }
.esc-dem-h{ font-family:var(--font-display); font-weight:800; font-size:0.9375rem; color:var(--text-primary); }
.esc-dem-d{ font-size:0.813rem; line-height:1.5; color:var(--text-secondary); }

/* System match (light band) */
.esc-match{ background:var(--bg); }
.esc-match .wrap{ padding-block:3.5rem 3.75rem; }
.esc-table{ display:flex; flex-direction:column; }
.esc-mrow{ display:flex; align-items:center; gap:1.5rem; padding-block:0.875rem; border-bottom:1px solid var(--line); text-decoration:none; }
.esc-mrow:last-child{ border-bottom:0; }
.esc-need{ flex:1 1 0; font-size:0.844rem; color:var(--text-secondary); }
.esc-sys{ flex:0 0 16.875rem; font-family:var(--font-display); font-weight:800; font-size:0.875rem; color:var(--text-primary); }
.esc-code{ flex:0 0 9.375rem; font-family:var(--font-display); font-weight:700; font-size:0.719rem; letter-spacing:.04em; color:var(--text-secondary); }
.esc-arrow{ font-family:var(--font-display); font-weight:800; font-size:0.875rem; color:var(--text-primary); }
.esc-mrow:hover .esc-sys, .esc-mrow:hover .esc-arrow{ color:var(--brand); }

/* CTA (fixed dark) */
.esc-cta{ display:flex; flex-direction:column; align-items:center; gap:1.125rem; background:#171B17; padding:3.75rem 3rem; text-align:center; }
.esc-cta-eyebrow{ font-family:var(--font-display); font-weight:700; font-size:0.75rem; letter-spacing:.1em; color:rgba(255,255,255,.65); margin:0; }
.esc-cta-h{ font-family:var(--font-display); font-weight:800; font-size:1.875rem; color:#fff; max-width:44rem; margin:0; }
.esc-cta-btn{ margin-top:0.5rem; }

/* Responsive */
@media (max-width:1000px){
  .esc-title{ font-size:2.25rem; }
  .esc-tiles{ grid-template-columns:repeat(2,1fr); }
  .esc-dem-grid{ grid-template-columns:1fr; gap:1.5rem; }
}
@media (max-width:700px){
  .esc-tiles{ grid-template-columns:1fr; }
  .esc-mrow{ flex-wrap:wrap; gap:0.375rem 1rem; }
  .esc-need{ flex-basis:100%; }
  .esc-sys{ flex-basis:auto; }
  .esc-hdr{ flex-direction:column; align-items:flex-start; gap:0.375rem; }
  .esc-hdr-c, .esc-hdr-l{ white-space:normal; }
}