/* Fueltek v6.9.276 — compact, accessible sector-page flow.
   Keeps the full SEO copy while containing headings, shortening repeated
   card sections and placing a relevant operational image inside the story. */

main > section{
  padding-top:clamp(46px,4.5vw,72px);
  padding-bottom:clamp(46px,4.5vw,72px);
}

main > section:not(.hero)::before{top:clamp(21px,2.2vw,34px)}

/* Keep headings and copy inside their allocated column at every zoom level. */
.section-copy,
.section-copy > div,
.detail-grid,
.benefit-grid,
.evidence-grid,
.trust-strip,
.why{min-width:0;max-width:100%}

#sector-context .section-copy,
#benefits .section-copy,
#sector-needs .section-copy,
#daily-workflow .section-copy,
#equipment .section-copy,
#outcomes .section-copy,
#evidence .section-copy,
#faq .section-copy,
#related .section-copy{
  grid-template-columns:minmax(230px,292px) minmax(0,1fr);
  gap:clamp(30px,4vw,64px);
}

@media(min-width:1181px){
  #sector-context .section-copy > div:first-child,
  #benefits .section-copy > div:first-child,
  #sector-needs .section-copy > div:first-child,
  #daily-workflow .section-copy > div:first-child,
  #equipment .section-copy > div:first-child,
  #outcomes .section-copy > div:first-child,
  #evidence .section-copy > div:first-child,
  #faq .section-copy > div:first-child,
  #related .section-copy > div:first-child{position:static}
}

.section-copy h2,.why h2{
  max-width:100%;
  font-family:Inter,ui-sans-serif,system-ui,sans-serif;
  font-size:clamp(32px,2.8vw,50px);
  font-style:normal;
  font-weight:330;
  line-height:.98;
  letter-spacing:-.045em;
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:none;
  text-transform:uppercase;
}

.section-copy h2 span,.why h2 span{font-weight:850;letter-spacing:-.04em}
.section-copy .eyebrow{margin-bottom:13px;font-size:11px}

/* The chapter rail remains a fast route through the page after the hero. */
@media(min-width:1221px){
  .sector-journey{
    position:sticky;
    z-index:72;
    top:88px;
    padding-top:8px;
    padding-bottom:8px;
    border:1px solid rgba(243,179,36,.25);
    border-radius:0 0 18px 18px;
    background:linear-gradient(90deg,rgba(12,12,8,.97),rgba(5,8,6,.94));
    backdrop-filter:blur(16px);
  }
  .sector-journey a{min-height:34px;padding-block:6px}
}

/* Pair the operational explanation with a page-specific visual, without
   introducing another full-height section. */
#sector-context .content-prose.has-sector-visual{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);
  grid-template-rows:auto auto 1fr;
  gap:16px 26px;
  padding:clamp(22px,2.5vw,34px);
}

#sector-context .content-prose.has-sector-visual > p,
#sector-context .content-prose.has-sector-visual > .content-note{grid-column:1;margin:0}

.sector-operations-visual{
  position:relative;
  grid-column:2;
  grid-row:1 / 4;
  min-width:0;
  min-height:330px;
  margin:0;
  overflow:hidden;
  border:1px solid rgba(243,179,36,.26);
  border-radius:18px;
  background:#070907;
  box-shadow:0 22px 48px rgba(0,0,0,.3);
}

.sector-operations-visual::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 48%,rgba(1,3,2,.82));
  pointer-events:none;
}

.sector-operations-visual img{
  width:100%;
  height:100%;
  min-height:330px;
  display:block;
  object-fit:cover;
  filter:brightness(.88) saturate(.94) contrast(1.04);
  transition:transform .8s cubic-bezier(.2,.75,.2,1),filter .5s ease;
}

.sector-operations-visual figcaption{
  position:absolute;
  z-index:2;
  left:18px;
  right:18px;
  bottom:16px;
  color:#fff;
  font-size:11px;
  font-weight:850;
  letter-spacing:.11em;
  line-height:1.45;
  text-transform:uppercase;
}

.sector-operations-visual:hover img{transform:scale(1.025);filter:brightness(.96) saturate(1)}

/* Repeated information is kept complete but presented as a concise scan grid. */
.benefit-grid,
#sector-needs .detail-grid,
#equipment .detail-grid{
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
}

.benefit-card,
#sector-needs .detail-card,
#equipment .detail-card{
  min-height:0;
  padding:clamp(20px,1.6vw,27px);
  overflow:clip;
  border-radius:18px;
}

.benefit-card h3,
#sector-needs .detail-card h3,
#equipment .detail-card h3,
#daily-workflow .detail-card h3,
.evidence-card h3{
  max-width:100%;
  margin-bottom:10px;
  font-family:Inter,ui-sans-serif,system-ui,sans-serif;
  font-size:clamp(20px,1.45vw,27px);
  font-style:normal;
  font-weight:820;
  line-height:1.07;
  letter-spacing:-.025em;
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:none;
  text-transform:none;
}

.benefit-card p,
#sector-needs .detail-card p,
#equipment .detail-card p,
#daily-workflow .detail-card p,
.evidence-card p,
.evidence-card li{font-size:14px;line-height:1.55}

.benefit-card small,
#sector-needs .detail-card small,
#equipment .detail-card small,
#daily-workflow .detail-card small,
.evidence-card small{margin-bottom:10px;font-size:9px;letter-spacing:.14em}

#daily-workflow .detail-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}

#daily-workflow .detail-card{
  min-height:0;
  padding:62px 20px 22px;
  overflow:clip;
  border-radius:18px;
}

#daily-workflow .detail-card::before{top:18px;left:20px;width:31px;height:31px}
#daily-workflow .detail-card::after{left:58px;top:34px}

#outcomes .trust-item{min-height:0;padding:24px 24px 22px}
#outcomes .trust-item strong{margin-top:18px;font-size:clamp(21px,1.55vw,29px)}
#implementation{padding-top:clamp(48px,4.5vw,72px)}
#implementation .why{grid-template-columns:minmax(0,1fr) minmax(280px,.7fr)}
#implementation .why > div{padding:clamp(26px,3vw,42px)}
#implementation .why h2{max-width:16ch;font-size:clamp(34px,3.3vw,54px)}
.evidence-card{padding:clamp(22px,2.2vw,32px)}
#faq .faq summary{min-height:58px;padding-top:17px;padding-bottom:17px}

html[data-theme="light"] .sector-operations-visual{border-color:rgba(157,104,0,.35);box-shadow:0 18px 38px rgba(56,46,24,.14)}

@media(max-width:1400px){
  #daily-workflow .detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #daily-workflow .detail-card:nth-child(2)::after{display:block}
  #daily-workflow .detail-card::after{display:none}
}

@media(max-width:1180px){
  #sector-context .section-copy,
  #benefits .section-copy,
  #sector-needs .section-copy,
  #daily-workflow .section-copy,
  #equipment .section-copy,
  #outcomes .section-copy,
  #evidence .section-copy,
  #faq .section-copy,
  #related .section-copy{grid-template-columns:1fr;gap:24px}
  .section-copy h2,.why h2{max-width:800px;font-size:clamp(32px,5vw,48px)}
  #implementation .why{grid-template-columns:1fr}
}

@media(max-width:760px){
  main > section{padding-top:46px;padding-bottom:46px}
  .section-copy h2,.why h2{font-size:clamp(30px,9.4vw,44px)}
  #sector-context .content-prose.has-sector-visual{grid-template-columns:1fr;padding:18px;gap:15px}
  #sector-context .content-prose.has-sector-visual > p,
  #sector-context .content-prose.has-sector-visual > .content-note,
  .sector-operations-visual{grid-column:1}
  .sector-operations-visual{grid-row:auto;min-height:230px;margin-top:3px}
  .sector-operations-visual img{min-height:230px}
  .benefit-grid,#sector-needs .detail-grid,#equipment .detail-grid,#daily-workflow .detail-grid{grid-template-columns:1fr}
  .benefit-card,#sector-needs .detail-card,#equipment .detail-card,#daily-workflow .detail-card{padding:20px}
  #daily-workflow .detail-card{padding-top:60px}
}

@media(prefers-reduced-motion:reduce){.sector-operations-visual img{transition:none!important;transform:none!important}}
