/* ═══════════════════════════════════════════════════════
   ASAS Contracting — Sectors & Fields (sectors.html) and the
   homepage "Sectors we serve" + "Made in our own factory" snippets
   Content from the 2027 company profile (15 Oct 2026)
═══════════════════════════════════════════════════════ */

/* page hero */
.asas-sec-hero{background:#243a76;color:#fff;padding:100px 0 90px;text-align:center;position:relative;overflow:hidden}
.asas-sec-hero:after{content:"";position:absolute;inset:auto -10% -60% auto;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(200,163,80,.22),transparent 70%)}
.asas-sec-hero__eyebrow{color:#c8a350;font-size:13px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;margin:0 0 14px}
.asas-sec-hero__title{color:#fff;font-size:clamp(36px,5vw,58px);margin:0 0 18px}
.asas-sec-hero__lead{color:rgba(255,255,255,.85);font-size:17px;line-height:1.7;max-width:680px;margin:0 auto}

/* sector cards (page + home) */
.asas-sectors-sec{padding:100px 0 60px}
.asas-sectors-sec .section-title__title,.asas-fields-sec .section-title__title{color:#243a76}
.asas-sectors-sec .section-title,.asas-fields-sec .section-title{margin-bottom:46px}
.asas-sectors{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;margin:0;padding:0}
.asas-sector{position:relative;display:block;height:100%;background:#fff;border:1px solid #ece6da;border-radius:14px;padding:34px 26px 30px;
  color:inherit;text-decoration:none;box-shadow:0 8px 24px rgba(26,22,18,.05);transition:transform .25s,box-shadow .25s,border-color .25s}
.asas-sector:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(26,22,18,.1);border-color:#c8a350;color:inherit}
.asas-sector__letter{position:absolute;top:18px;right:22px;font-family:"Libre Baskerville",serif;font-size:34px;line-height:1;color:#efe6d2}
.asas-sector i{display:inline-flex;align-items:center;justify-content:center;width:58px;height:58px;border-radius:12px;background:#243a76;color:#c8a350;font-size:24px;margin-bottom:20px}
.asas-sector h3{font-size:19px;line-height:1.35;margin:0 0 10px;color:#1a1612}
.asas-sector p{margin:0;font-size:14.5px;line-height:1.65;color:#5d5850}

/* fields */
.asas-fields-sec{padding:60px 0 110px}
.asas-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin:0;padding:0}
.asas-field{background:#fff;border-radius:14px;overflow:hidden;border:1px solid #ece6da;box-shadow:0 8px 24px rgba(26,22,18,.05)}
.asas-field__img{aspect-ratio:4/3;overflow:hidden;background:#efe9df}
.asas-field__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s}
.asas-field:hover .asas-field__img img{transform:scale(1.05)}
.asas-field__body{padding:22px 24px 26px}
.asas-field__eyebrow{display:block;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#96702a;margin-bottom:6px}
.asas-field__body h3{font-size:20px;margin:0 0 8px;color:#243a76}
.asas-field__body p{margin:0;font-size:14.5px;line-height:1.65;color:#5d5850}

/* closing CTA */
.asas-cta{background:#f7f5f0;border-top:1px solid #ece6da;padding:90px 0;text-align:center}
.asas-cta__title{color:#243a76;font-size:clamp(28px,3.4vw,40px);margin:0 0 16px}
.asas-cta__text{max-width:640px;margin:0 auto 30px;color:#5d5850;font-size:16px;line-height:1.7}

/* homepage: sectors strip */
.ah-sectors{padding:90px 0;background:#f7f5f0}
.ah-sectors .asas-sectors{margin-top:36px}
.ah-sectors__more{text-align:center;margin-top:34px}

/* homepage + factory page: factory crafts */
.asas-factory{padding:100px 0;background:#fff}
.asas-factory__head{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:end;margin-bottom:44px}
.asas-factory__eyebrow{color:#96702a;font-size:13px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;margin:0 0 12px}
.asas-factory__title{color:#243a76;font-size:clamp(28px,3.4vw,42px);line-height:1.2;margin:0}
.asas-factory__text{color:#5d5850;font-size:16px;line-height:1.7;margin:0 0 18px}
.asas-factory__facts{display:flex;gap:34px;margin:0;padding:0;list-style:none}
.asas-factory__facts b{display:block;font-family:"Libre Baskerville",serif;font-size:30px;color:#243a76;line-height:1.1}
.asas-factory__facts span{font-size:13px;font-weight:600;color:#96702a}
.asas-crafts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.asas-craft{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:3/4;background:#1a1612}
.asas-craft img{width:100%;height:100%;object-fit:cover;display:block;opacity:.92;transition:transform .6s}
.asas-craft:hover img{transform:scale(1.06)}
.asas-craft__body{position:absolute;inset:auto 0 0 0;padding:60px 16px 16px;background:linear-gradient(transparent,rgba(16,22,44,.92))}
.asas-craft__body h3{color:#fff;font-size:17px;margin:0 0 4px}
.asas-craft__body p{color:rgba(255,255,255,.82);font-size:13px;line-height:1.5;margin:0}
.asas-factory__more{margin-top:34px}

@media (max-width:1199px){
  .asas-sectors{grid-template-columns:repeat(2,minmax(0,1fr))}
  .asas-crafts{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:991px){
  .asas-fields{grid-template-columns:repeat(2,minmax(0,1fr))}
  .asas-factory__head{grid-template-columns:1fr;gap:20px}
}
@media (max-width:767px){
  .asas-sec-hero{padding:64px 0 56px}
  .asas-sec-hero__lead{font-size:15px}
  .asas-sectors-sec{padding:64px 0 30px}
  .asas-sectors{grid-template-columns:1fr;gap:14px}
  .asas-sector{padding:24px 20px}
  .asas-fields-sec{padding:40px 0 70px}
  .asas-fields{grid-template-columns:1fr;gap:18px}
  .asas-cta{padding:64px 0}
  .ah-sectors{padding:64px 0}
  .asas-factory{padding:64px 0}
  .asas-crafts{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .asas-craft__body p{display:none}
}

/* Operations & Maintenance page: Aramco Khafji (KJO) + MEP */
.asas-kjo{padding:100px 0;background:#f7f5f0;border-top:1px solid #ece6da}
.asas-kjo__intro,.asas-kjo__mep{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.asas-kjo__img{border-radius:14px;overflow:hidden;box-shadow:0 12px 30px rgba(26,22,18,.12)}
.asas-kjo__img img{width:100%;display:block;aspect-ratio:4/3;object-fit:cover}
.asas-kjo__sub{font-size:18px;color:#243a76;margin:18px 0 8px}
.asas-kjo__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin:56px 0}
.asas-kjo__grid li{background:#fff;border:1px solid #ece6da;border-radius:14px;padding:28px 22px}
.asas-kjo__grid i{display:inline-flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:10px;background:#243a76;color:#c8a350;font-size:20px;margin-bottom:16px}
.asas-kjo__grid h3{font-size:17px;margin:0 0 8px;color:#1a1612}
.asas-kjo__grid p{margin:0;font-size:14px;line-height:1.65;color:#5d5850}
@media (max-width:1199px){.asas-kjo__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:991px){.asas-kjo__intro,.asas-kjo__mep{grid-template-columns:1fr;gap:28px}.asas-kjo__mep .asas-kjo__img{order:-1}}
@media (max-width:767px){.asas-kjo{padding:64px 0}.asas-kjo__grid{grid-template-columns:1fr;gap:14px;margin:36px 0}}
@media (max-width:767px){
  .asas-factory__facts{gap:18px;flex-wrap:wrap}
  .asas-factory__facts b{font-size:24px;white-space:nowrap}
}