:root {
  --ink:#101d2e;
  --ink-soft:#24374f;
  --blue:#0a396a;
  --orange:#ef6c22;
  --sand:#f6f2eb;
  --line:#d9dfe3;
  --white:#fff;
  --container:1160px
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  background:#fff;
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  font-size:16px;
  line-height:1.6
}
a {
  color:inherit;
  text-decoration:none
}
img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover
}
.container {
  width:min(calc(100% - 48px),var(--container));
  margin:auto
}
.skip-link {
  position:absolute;
  top:-4rem;
  left:1rem;
  z-index:20;
  padding:.5rem 1rem;
  background:var(--white);
  color:var(--blue)
}
.skip-link:focus {
  top:1rem
}
.site-header {
  height:82px;
  background:rgba(255,255,255,.97);
  position:sticky;
  top:0;
  z-index:10;
  border-bottom:1px solid rgba(16,29,46,.08)
}
.nav-wrap {
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between
}
.brand {
  display:inline-flex;
  align-items:center;
  gap:0;
  font-size:17px;
  font-weight:700;
  letter-spacing:.06em;
  line-height:1.05
}
.brand b {
  color:var(--orange)
}
.brand small {
  display:block;
  margin-top:4px;
  color:#778494;
  font-size:8px;
  font-weight:700;
  letter-spacing:.22em
}
.brand > span {
  display:none
}
.brand-logo {
  width:190px;
  height:auto;
  object-fit:contain
}
.brand-mark {
  align-items:center;
  background:var(--orange);
  color:#fff;
  display:inline-flex;
  font-size:12px;
  font-style:italic;
  height:35px;
  justify-content:center;
  letter-spacing:-.05em;
  width:35px
}
.site-nav {
  display:flex;
  align-items:center;
  gap:32px
}
.site-nav a {
  color:#405064;
  font-size:14px;
  font-weight:700;
  position:relative
}
.site-nav a:after {
  background:var(--orange);
  bottom:-10px;
  content:"";
  height:2px;
  left:0;
  position:absolute;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .2s;
  width:100%
}
.site-nav a:hover:after,.site-nav a.active:after {
  transform:scaleX(1)
}
.site-nav a.active {
  color:var(--ink)
}
.menu-button {
  background:transparent;
  border:0;
  display:none;
  padding:8px
}
.menu-button span:not(.sr-only) {
  background:var(--ink);
  display:block;
  height:2px;
  margin:4px;
  width:23px
}
.sr-only {
  clip:rect(0,0,0,0);
  clip-path:inset(50%);
  height:1px;
  overflow:hidden;
  position:absolute;
  white-space:nowrap;
  width:1px
}
.hero {
  min-height:650px;
  position:relative;
  color:#fff;
  background-image:linear-gradient(90deg,rgba(4,21,40,.86) 0%,rgba(4,21,40,.58) 40%,rgba(4,21,40,.03) 78%),url('assets/hero-facility.jpg');
  background-position:center;
  background-size:cover
}
.hero-content {
  padding-top:132px
}
.eyebrow {
  color:var(--orange);
  font-size:11px;
  font-weight:700;
  letter-spacing:.16em;
  margin:0 0 16px;
  text-transform:uppercase
}
.hero h1,.page-hero h1,.contact-hero h1 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(48px,6vw,82px);
  font-weight:400;
  letter-spacing:-.055em;
  line-height:1.01;
  margin:0;
  max-width:800px
}
.hero-copy {
  font-size:18px;
  line-height:1.65;
  margin:26px 0 31px;
  max-width:570px
}
.hero-actions {
  display:flex;
  gap:12px
}
.button {
  align-items:center;
  display:inline-flex;
  font-size:13px;
  font-weight:700;
  gap:18px;
  justify-content:center;
  padding:14px 21px;
  transition:background .2s,color .2s,transform .2s
}
.button:hover {
  transform:translateY(-2px)
}
.button-primary {
  background:var(--orange);
  color:#fff
}
.button-primary:hover {
  background:#ce5514
}
.button-ghost {
  border:1px solid rgba(255,255,255,.7);
  color:#fff
}
.button-ghost:hover {
  background:#fff;
  color:var(--ink)
}
.button-light {
  background:#fff;
  color:var(--ink)
}
.scroll-cue {
  align-items:center;
  bottom:25px;
  color:#fff;
  display:flex;
  font-size:10px;
  font-weight:700;
  gap:9px;
  left:50%;
  letter-spacing:.12em;
  position:absolute;
  text-transform:uppercase;
  transform:translateX(-50%)
}
.scroll-cue span {
  border:1px solid rgba(255,255,255,.7);
  border-radius:20px;
  height:26px;
  position:relative;
  width:15px
}
.scroll-cue span:after {
  animation:scroll 1.8s infinite;
  background:#fff;
  border-radius:20px;
  content:"";
  height:5px;
  left:4px;
  position:absolute;
  top:5px;
  width:5px
}
@keyframes scroll {
  50% {
    transform:translateY(8px)
  }
}
.section {
  padding:105px 0
}
.intro {
  background:var(--sand)
}
.intro-grid,.commitment-grid,.about-grid {
  display:grid;
  gap:9%;
  grid-template-columns:1fr 1fr
}
.section-heading h2,.section-top h2,.commitment-copy h2,.about-grid h2,.values-grid h2 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(33px,4vw,54px);
  font-weight:400;
  letter-spacing:-.05em;
  line-height:1.08;
  margin:0
}
.intro-copy {
  font-size:17px;
  line-height:1.75;
  padding-top:30px
}
.intro-copy p {
  margin:0 0 18px
}
.text-link {
  border-bottom:1px solid currentColor;
  display:inline-flex;
  font-size:13px;
  font-weight:700;
  gap:16px;
  margin-top:14px;
  padding-bottom:5px
}
.text-link span {
  color:var(--orange);
  font-size:18px;
  line-height:.8
}
.stats-band {
  background:var(--blue);
  color:#fff;
  padding:44px 0
}
.stats-grid {
  display:grid;
  gap:32px;
  grid-template-columns:repeat(3,1fr)
}
.stat {
  align-items:flex-start;
  border-right:1px solid rgba(255,255,255,.2);
  display:flex;
  gap:17px;
  padding-right:25px
}
.stat:last-child {
  border:0
}
.stat strong {
  color:#fff;
  font-family:Georgia,'Times New Roman',serif;
  font-size:35px;
  font-weight:400;
  letter-spacing:-.06em;
  line-height:1
}
.stat strong span {
  color:var(--orange)
}
.stat h3 {
  font-size:13px;
  margin:0 0 2px
}
.stat p {
  color:#cbd5e0;
  font-size:12px;
  line-height:1.45;
  margin:0
}
.section-top {
  align-items:flex-end;
  display:flex;
  justify-content:space-between;
  margin-bottom:45px
}
.service-grid {
  display:grid;
  gap:18px;
  grid-template-columns:repeat(3,1fr)
}
.service-card {
  background:#f1f4f5;
  min-height:278px;
  padding:30px;
  position:relative;
  transition:background .25s,color .25s,transform .25s
}
.service-card:hover {
  background:var(--ink);
  color:#fff;
  transform:translateY(-5px)
}
.card-number {
  color:var(--orange);
  font-size:12px;
  font-weight:bold
}
.service-card h3 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:28px;
  font-weight:400;
  letter-spacing:-.04em;
  margin:52px 0 11px
}
.service-card p {
  color:#526074;
  font-size:14px;
  line-height:1.6;
  margin:0;
  transition:color .25s
}
.service-card:hover p {
  color:#dce5ec
}
.card-arrow {
  bottom:27px;
  color:var(--orange);
  font-size:23px;
  position:absolute;
  right:30px
}
.image-feature {
  height:540px;
  position:relative
}
.image-feature:after {
  background:linear-gradient(90deg,rgba(5,20,37,.8),rgba(5,20,37,.12));
  content:"";
  inset:0;
  position:absolute
}
.image-feature-overlay {
  color:#fff;
  inset:0;
  position:absolute;
  z-index:1
}
.image-feature-overlay .container {
  padding-top:160px
}
.image-feature h2 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(40px,5vw,65px);
  font-weight:400;
  letter-spacing:-.055em;
  line-height:1.03;
  margin:0
}
.commitment-grid {
  align-items:center
}
.commitment-image {
  height:520px
}
.commitment-copy {
  padding:30px 0
}
.commitment-copy>p:not(.eyebrow) {
  color:#4b596a;
  font-size:16px;
  line-height:1.75;
  margin:25px 0
}
.check-list {
  list-style:none;
  margin:27px 0 0;
  padding:0
}
.check-list li {
  border-top:1px solid var(--line);
  font-size:14px;
  padding:12px 0 12px 27px;
  position:relative
}
.check-list li:before {
  color:var(--orange);
  content:'✓';
  left:0;
  position:absolute
}
.cta-section {
  background:var(--orange);
  color:#fff;
  padding:90px 0
}
.cta-inner {
  text-align:center
}
.cta-inner .eyebrow {
  color:#fff
}
.cta-inner h2 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(40px,5vw,63px);
  font-weight:400;
  letter-spacing:-.055em;
  line-height:1.05;
  margin:0 0 28px
}
.site-footer {
  background:var(--ink);
  color:#fff;
  padding:49px 0 20px
}
.footer-grid {
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  padding-bottom:45px
}
.brand-footer .brand-mark {
  background:var(--orange)
}
.footer-label {
  color:var(--orange);
  font-size:10px;
  font-weight:700;
  letter-spacing:.13em;
  margin:0 0 5px;
  text-transform:uppercase
}
.footer-grid p:not(.footer-label),.footer-grid a {
  color:#c8d0d9;
  font-size:13px;
  line-height:1.7;
  margin:0
}
.footer-grid a:hover {
  color:#fff
}
.footer-bottom {
  border-top:1px solid rgba(255,255,255,.15);
  color:#8390a0;
  display:flex;
  font-size:10px;
  justify-content:space-between;
  padding-top:18px
}
.page-hero,.contact-hero {
  color:#fff;
  min-height:440px;
  position:relative
}
.page-hero:before,.contact-hero:before {
  background:linear-gradient(90deg,rgba(5,20,37,.83),rgba(5,20,37,.3));
  content:"";
  inset:0;
  position:absolute
}
.page-hero-content,.contact-hero .container {
  padding-top:100px;
  position:relative
}
.page-hero-content>p:last-child,.contact-hero .container>p:last-child {
  font-size:17px;
  line-height:1.65;
  margin:22px 0;
  max-width:540px
}
.services-hero {
  background:url('assets/procurement-logistics.jpg') center 48%/cover
}
.about-hero {
  background:url('assets/hero-facility.jpg') center/cover
}
.section-heading.wide {
  max-width:720px
}
.service-detail-list {
  margin-top:65px
}
.service-detail {
  border-top:1px solid var(--line);
  display:grid;
  gap:34px;
  grid-template-columns:60px 1fr 220px;
  padding:43px 0
}
.service-detail>span {
  color:var(--orange);
  font-size:12px;
  font-weight:bold
}
.service-detail h2 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:37px;
  font-weight:400;
  letter-spacing:-.045em;
  line-height:1.1;
  margin:0
}
.service-detail p {
  color:#526074;
  font-size:15px;
  line-height:1.65;
  margin:13px 0
}
.service-detail ul {
  color:var(--ink-soft);
  font-size:13px;
  line-height:1.8;
  margin:14px 0 0;
  padding-left:18px
}
.service-detail img {
  height:170px
}
.dark-panel {
  background:var(--blue);
  color:#fff;
  padding:88px 0
}
.panel-grid {
  align-items:end;
  display:grid;
  gap:10%;
  grid-template-columns:1.15fr .85fr
}
.panel-grid h2 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(34px,4vw,52px);
  font-weight:400;
  letter-spacing:-.05em;
  line-height:1.08;
  margin:0
}
.panel-grid>p {
  color:#d5e0ed;
  font-size:16px;
  line-height:1.7;
  margin:0
}
.about-intro {
  padding-bottom:80px
}
.about-grid>div:last-child {
  font-size:17px;
  line-height:1.75;
  padding-top:30px
}
.about-grid p {
  margin:0 0 18px
}
.image-statement {
  height:560px;
  position:relative;
  overflow:hidden
}
.image-statement > img {
  inset:0;
  position:absolute
}
.image-statement:after {
  background:linear-gradient(90deg,rgba(5,20,37,.78),transparent);
  content:"";
  inset:0;
  position:absolute
}
.image-statement>.container {
  height:100%;
  inset:0;
  position:absolute;
  z-index:1
}
.statement-card {
  color:#fff;
  max-width:520px;
  padding-top:180px
}
.statement-card>p:last-child {
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(30px,4vw,46px);
  letter-spacing:-.045em;
  line-height:1.15;
  margin:0
}
.values-grid {
  display:grid;
  gap:18px;
  grid-template-columns:1fr 1fr
}
.value-card {
  background:var(--sand);
  min-height:310px;
  padding:44px
}
.value-card h2 {
  font-size:37px;
  margin-bottom:17px
}
.value-card>p:last-child {
  color:#526074;
  font-size:15px;
  line-height:1.65
}
.principles {
  background:#f3f5f6
}
.principle-grid {
  display:grid;
  gap:25px;
  grid-template-columns:repeat(4,1fr)
}
.principle-grid strong {
  color:var(--orange);
  font-size:12px
}
.principle-grid h3 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:26px;
  font-weight:400;
  letter-spacing:-.04em;
  margin:27px 0 5px
}
.principle-grid p {
  color:#526074;
  font-size:14px;
  line-height:1.6;
  margin:0
}
.contact-hero {
  background:var(--ink);
  min-height:390px
}
.contact-hero:after {
  background:radial-gradient(circle at 85% 35%,rgba(239,108,34,.8),transparent 22%);
  content:"";
  inset:0;
  position:absolute
}
.contact-hero .container {
  position:relative;
  z-index:1
}
.contact-section {
  padding:90px 0
}
.contact-grid {
  align-items:stretch;
  display:grid;
  grid-template-columns:1fr 1fr
}
.contact-image {
  height:auto;
  min-height:540px
}
.contact-details {
  background:var(--sand);
  padding:60px
}
.contact-details h2 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:42px;
  font-weight:400;
  letter-spacing:-.045em;
  line-height:1.1;
  margin:0 0 42px
}
.detail-block {
  border-top:1px solid #d6d0c5;
  padding:17px 0
}
.detail-block span {
  color:#7c6e5f;
  font-size:10px;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase
}
.detail-block p {
  font-size:15px;
  line-height:1.7;
  margin:5px 0
}
.email-link {
  display:inline-flex;
  font-size:17px;
  font-weight:700;
  margin-top:4px
}
.email-link b {
  color:var(--orange);
  margin-left:15px
}
.contact-details .button {
  margin-top:26px
}
.location-band {
  background:var(--blue);
  color:#fff;
  padding:68px 0
}
.location-inner {
  align-items:flex-end;
  display:flex;
  justify-content:space-between
}
.location-inner h2 {
  font-family:Georgia,'Times New Roman',serif;
  font-size:46px;
  font-weight:400;
  letter-spacing:-.05em;
  line-height:1.1;
  margin:0
}
.location-inner p:not(.eyebrow) {
  color:#cbd7e3;
  font-size:14px;
  margin:10px 0 0
}
.location-inner .text-link {
  color:#fff;
  white-space:nowrap
}
.reveal {
  opacity:0;
  transform:translateY(18px);
  transition:opacity .65s ease,transform .65s ease
}
.reveal.is-visible {
  opacity:1;
  transform:none
}
@media(max-width:760px) {
  .brand-logo {
    width:160px
  }
  .container {
    width:min(calc(100% - 36px),var(--container))
  }
  .site-header {
    height:70px
  }
  .menu-button {
    display:block
  }
  .site-nav {
    background:#fff;
    border-top:1px solid var(--line);
    box-shadow:0 12px 18px rgba(0,0,0,.08);
    display:none;
    left:0;
    padding:12px 18px 22px;
    position:absolute;
    right:0;
    top:70px
  }
  .site-nav.open {
    display:grid;
    gap:4px
  }
  .site-nav a {
    padding:9px 0
  }
  .site-nav a:after {
    bottom:4px;
    width:35px
  }
  .hero {
    min-height:600px
  }
  .hero-content {
    padding-top:105px
  }
  .hero h1,.page-hero h1,.contact-hero h1 {
    font-size:48px
  }
  .hero-copy {
    font-size:16px
  }
  .hero-actions {
    align-items:stretch;
    flex-direction:column;
    max-width:225px
  }
  .button {
    padding:13px 16px
  }
  .section {
    padding:68px 0
  }
  .intro-grid,.commitment-grid,.about-grid {
    gap:18px;
    grid-template-columns:1fr
  }
  .intro-copy,.about-grid>div:last-child {
    padding-top:0
  }
  .stats-grid {
    gap:18px;
    grid-template-columns:1fr
  }
  .stat {
    border-bottom:1px solid rgba(255,255,255,.2);
    border-right:0;
    padding:0 0 18px
  }
  .stat:last-child {
    border:0;
    padding-bottom:0
  }
  .section-top {
    align-items:flex-start;
    gap:18px;
    flex-direction:column
  }
  .service-grid {
    grid-template-columns:1fr
  }
  .service-card {
    min-height:235px
  }
  .image-feature {
    height:410px
  }
  .image-feature-overlay .container {
    padding-top:115px
  }
  .commitment-image {
    height:355px
  }
  .footer-grid {
    gap:27px;
    grid-template-columns:1fr
  }
  .footer-bottom {
    flex-direction:column;
    gap:5px
  }
  .page-hero {
    min-height:410px
  }
  .page-hero-content,.contact-hero .container {
    padding-top:80px
  }
  .service-detail {
    gap:20px;
    grid-template-columns:35px 1fr;
    padding:32px 0
  }
  .service-detail img {
    grid-column:2;
    height:190px
  }
  .service-detail h2 {
    font-size:32px
  }
  .panel-grid {
    gap:24px;
    grid-template-columns:1fr
  }
  .image-statement {
    height:460px
  }
  .statement-card {
    padding-top:115px
  }
  .values-grid {
    grid-template-columns:1fr
  }
  .value-card {
    min-height:260px;
    padding:34px
  }
  .principle-grid {
    gap:35px 20px;
    grid-template-columns:1fr 1fr
  }
  .contact-grid {
    grid-template-columns:1fr
  }
  .contact-image {
    height:300px;
    min-height:0
  }
  .contact-details {
    padding:40px 30px
  }
  .location-inner {
    align-items:flex-start;
    flex-direction:column;
    gap:24px
  }
  .scroll-cue {
    display:none
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  .reveal {
    opacity:1!important;
    transform:none!important;
    transition:none!important
  }
  .scroll-cue span:after {
    animation:none
  }
}
