*{box-sizing:border-box}html{overflow-x:clip}body{margin:0;color:#102343;font-family:Arial,Helvetica,sans-serif;font-size:16px;overflow-x:clip}a{text-decoration:none;color:inherit}img,svg{max-width:100%}.site-header{background:#fff;position:relative;z-index:10}.nav-wrap{max-width:1750px;margin:auto;min-height:90px;padding:8px 26px;display:flex;align-items:center;justify-content:space-between;gap:18px}.identity{display:flex;align-items:center;gap:12px;flex-shrink:0}.identity img{width:84px;height:71px;object-fit:contain}.brand-name{font:700 23px/1 Georgia,serif;color:#0051bf}.brand-name small{display:block;font:16px Arial,sans-serif;color:#253544;margin-top:5px}.site-nav{display:flex;align-items:center;gap:clamp(13px,1.8vw,28px);font-size:16px}.site-nav>a,.nav-dropdown>a{white-space:nowrap}.current{border-bottom:2px solid #c8880e;padding-bottom:7px}.nav-dropdown{position:relative}.dropdown-menu{display:none;position:absolute;top:100%;left:0;padding:12px;background:#fff;min-width:240px;box-shadow:0 6px 15px #0003}.dropdown-menu a{display:block;padding:8px}.nav-dropdown:hover .dropdown-menu,.nav-dropdown:focus-within .dropdown-menu{display:block}.btn{display:inline-flex;align-items:center;justify-content:center;background:#cb8a0a;color:white!important;border:0;border-radius:4px;padding:14px 25px;min-height:44px;font-weight:700;font-size:16px;white-space:nowrap}.mobile-toggle{display:none;font-size:16px;padding:8px;background:white;border:1px solid #ccc}.about-hero{position:relative;min-height:490px;background:#092443;color:#fff;overflow:hidden;display:flex;align-items:center}.hero-photo{position:absolute;inset:0 0 0 42%;background:url(assets/port-worker.jpg) right center/cover no-repeat}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#061b38 0%,#061b38f5 24%,#061b38bb 43%,#061b3824 72%,transparent)}.hero-inner{position:relative;padding:35px clamp(26px,5.2vw,82px);max-width:760px}.eyebrow{font-size:16px;font-weight:800;color:#087248;letter-spacing:.2px}.eyebrow.gold{color:#ffba22}.about-hero h1{font:700 clamp(45px,4.2vw,68px)/.97 Georgia,serif;margin:11px 0 12px}.about-hero h2{font:normal clamp(23px,2.25vw,32px)/1.12 Georgia,serif;margin:0 0 14px}.about-hero p{line-height:1.43;margin:0 0 20px;max-width:625px}.benefits{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:18px clamp(16px,2vw,36px);gap:0;background:#fafafa}.benefit{text-align:center;padding:0 18px;border-right:1px solid #d9dfe3;min-width:0}.benefit:last-child{border:0}.benefit svg{width:49px;height:49px;stroke:#00694b;stroke-width:2.1;fill:none;stroke-linecap:round;stroke-linejoin:round;margin-bottom:7px}.benefit b{display:block;color:#07358b;font-size:16px;line-height:1.15}.benefit p{font-size:16px;line-height:1.23;margin:6px 0 0;color:#17437e}.content-width{width:calc(100% - 48px);max-width:1640px;margin:0 auto}.who{display:grid;grid-template-columns:1.06fr 0.94fr;gap:28px;padding:22px 0 8px;align-items:stretch}.who-image{width:100%;height:100%;max-height:505px;min-height:370px;object-fit:cover;border-radius:5px}.who-copy{align-self:center}.who h2,.our-goods h2,.why h2{font:700 clamp(28px,2.8vw,40px)/1.03 Georgia,serif;color:#0c3078;margin:4px 0 7px}.who p{line-height:1.36;margin:0 0 18px}.who h3{font:700 clamp(23px,2.2vw,31px)/1.05 Georgia,serif;color:#0c3078;margin:4px 0 9px}.checks{list-style:none;padding:0;margin:0}.checks li{position:relative;padding:0 0 8px 35px;line-height:1.3;color:#153b78}.checks li:before{content:'✓';position:absolute;left:0;top:-1px;background:#c98a0d;color:white;width:23px;height:23px;border-radius:50%;display:grid;place-items:center;font-weight:700}.our-goods{text-align:center;padding:19px 0 8px}.our-goods h2{margin:4px 0}.our-goods>p{margin:3px 0 14px;color:#475675}.commodity-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.commodity{min-height:215px;border-radius:5px;background-position:center;background-size:cover;color:white;display:flex;flex-direction:column;text-align:left;justify-content:flex-end;padding:20px;position:relative;overflow:hidden}.commodity h3{font:700 27px/1 Georgia,serif;margin:0 0 7px}.commodity span{font-size:16px;max-width:80%}.commodity .round-arrow{position:absolute;right:18px;bottom:20px;border:1px solid #fff;border-radius:50%;width:37px;height:37px;display:grid;place-items:center;font-size:24px}.why{text-align:center;background:#f7f8f6;border-radius:5px;padding:15px 0 20px;margin-bottom:7px}.why h2{margin:3px 0 12px}.reasons{padding:5px 0;background:transparent}.closing{min-height:225px;background:#05254d url(assets/landscape.jpg) center/cover no-repeat;position:relative;color:white;display:flex;align-items:center}.closing:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#032448fa,#032448df 27%,#03244865 63%,transparent)}.closing-inner{position:relative;max-width:730px;padding:25px clamp(24px,5vw,80px)}.closing h2{font:700 clamp(29px,3vw,42px)/1 Georgia,serif;margin:3px 0 8px}.closing p{line-height:1.34;margin:0 0 14px}footer{text-align:center;padding:18px;background:#062242;color:white;font-size:16px}.placeholder{margin:7vh auto;padding:30px;max-width:730px}.placeholder h1{font:700 40px Georgia,serif;color:#123767}.placeholder p{line-height:1.5}@media(max-width:1200px){.nav-wrap{padding:8px 14px}.brand-name{font-size:19px}.identity img{width:65px}.site-nav{gap:14px}.site-nav,.site-nav .btn{font-size:16px}.about-hero{min-height:470px}}@media(max-width:950px){.nav-wrap{flex-wrap:wrap}.mobile-toggle{display:block}.site-nav{display:none;width:100%;flex-direction:column;align-items:stretch;padding:10px}.site-nav.open{display:flex}.dropdown-menu{position:static;display:block;box-shadow:none}.about-hero{min-height:480px}.hero-photo{left:30%}.benefits{grid-template-columns:repeat(3,1fr);gap:20px}.benefit{border:0}.who{grid-template-columns:1fr}.who-image{height:320px;min-height:0}.commodity-grid{gap:8px}}@media(max-width:640px){.nav-wrap{min-height:72px}.brand-name{font-size:16px}.brand-name small{font-size:16px}.identity img{width:56px;height:56px}.about-hero{min-height:560px}.hero-photo{left:0;background-position:63% center}.hero-shade{background:linear-gradient(90deg,#041a32f5,#041a32b8 60%,#041a326b)}.hero-inner{padding:25px 21px}.about-hero h1{font-size:43px}.about-hero h2{font-size:24px}.benefits{grid-template-columns:repeat(2,1fr);padding:18px 9px}.benefit{padding:0 8px}.content-width{width:calc(100% - 26px)}.who{gap:16px}.commodity-grid{grid-template-columns:1fr}.commodity{min-height:190px}.reasons{grid-template-columns:repeat(2,1fr)}.closing{min-height:280px}}
/* Targeted About Us hero repair: fade photo seamlessly into navy, no image replacement. */
@media(min-width:641px){.about-hero .hero-photo{left:28%;-webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.08) 7%,rgba(0,0,0,.45) 23%,#000 55%);mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.08) 7%,rgba(0,0,0,.45) 23%,#000 55%)}.about-hero .hero-shade{background:linear-gradient(90deg,#061b38 0%,rgba(6,27,56,.98) 24%,rgba(6,27,56,.70) 47%,rgba(6,27,56,.08) 80%,transparent 100%)}}


/* FINAL CORRECTIONS: uncrop About Us hero image and avoid button text clipping */
.btn{line-height:1.2;padding-top:15px;padding-bottom:15px}
.about-hero{min-height:520px}
.about-hero .hero-photo{background-position:right top}
@media(min-width:641px){.about-hero .hero-photo{left:24%;background-position:72% top;-webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.12) 10%,rgba(0,0,0,.52) 26%,#000 56%);mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.12) 10%,rgba(0,0,0,.52) 26%,#000 56%)}}
@media(max-width:640px){.about-hero .hero-photo{background-position:68% top}}

/* Verified framing: show the full work jacket and its existing IC lettering. */
@media(min-width:641px){.about-hero .hero-photo{inset:0 0 0 42%;background-size:auto 100%;background-position:right bottom;background-color:#092443;} .about-hero{min-height:540px;} .about-hero .hero-shade{background:linear-gradient(90deg,#061b38 0%,#061b38 25%,rgba(6,27,56,.9) 40%,rgba(6,27,56,.43) 58%,transparent 82%);}}

/* About Us — approved high-visibility jacket logo artwork; preserve original page structure. */
.about-hero{background:#061b38;min-height:540px}
.about-hero .hero-photo{background-image:url('assets/port-worker.jpg');background-repeat:no-repeat;background-size:auto 100%;background-position:right bottom}
@media(min-width:641px){.about-hero .hero-photo{inset:0 0 0 42%;background-size:auto 100%;background-position:right bottom;mask-image:none;-webkit-mask-image:none}.about-hero .hero-shade{background:linear-gradient(90deg,#061b38 0%,#061b38 25%,rgba(6,27,56,.95) 40%,rgba(6,27,56,.55) 58%,rgba(6,27,56,.07) 82%,transparent 100%)}}
@media(max-width:640px){.about-hero .hero-photo{inset:0;background-size:auto 100%;background-position:70% bottom}.about-hero .hero-shade{background:linear-gradient(90deg,rgba(6,27,56,.97),rgba(6,27,56,.88) 62%,rgba(6,27,56,.58) 100%)}}

/* Final About Us fade: image gradually dissolves leftwards into solid navy; jacket branding remains clear on right. */
@media(min-width:641px){
.about-hero .hero-photo{inset:0 0 0 34%;background-size:auto 100%;background-position:right bottom;-webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.12) 13%,rgba(0,0,0,.55) 30%,#000 53%);mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.12) 13%,rgba(0,0,0,.55) 30%,#000 53%)}
.about-hero .hero-shade{background:linear-gradient(90deg,#061b38 0%,rgba(6,27,56,.98) 23%,rgba(6,27,56,.78) 40%,rgba(6,27,56,.36) 55%,rgba(6,27,56,.05) 70%,transparent 82%)}
}


/* Visible image-to-navy dissolve: feather starts at the actual photo edge. */
.about-hero{background-color:#061b38 !important;overflow:hidden;}
@media(min-width:641px){
 .about-hero .hero-photo{
  inset:0 0 0 auto !important;
  width:min(68%,760px) !important;
  background-image:url('assets/port-worker.jpg') !important;
  background-size:cover !important;
  background-position:center center !important;
  -webkit-mask-image:linear-gradient(to right, transparent 0%,rgba(0,0,0,.07) 7%,rgba(0,0,0,.28) 20%,rgba(0,0,0,.62) 40%,#000 66%) !important;
  mask-image:linear-gradient(to right, transparent 0%,rgba(0,0,0,.07) 7%,rgba(0,0,0,.28) 20%,rgba(0,0,0,.62) 40%,#000 66%) !important;
 }
 .about-hero .hero-shade{background:none !important;}
}
@media(max-width:640px){
 .about-hero .hero-photo{inset:0 !important;background-size:cover !important;background-position:72% center !important;}
 .about-hero .hero-shade{background:linear-gradient(90deg,rgba(6,27,56,.98) 0%,rgba(6,27,56,.84) 58%,rgba(6,27,56,.36) 100%) !important;}
}

/* Approved About Us header: move text modestly inward, retain left alignment and fade. */
@media (min-width: 951px){.about-hero .hero-inner{padding-left:clamp(72px,7.5vw,150px);max-width:850px;text-align:left;}}
@media (min-width: 641px) and (max-width: 950px){.about-hero .hero-inner{padding-left:clamp(42px,6vw,76px);text-align:left;}}

/* Requested About Us alignment only: match the product page hero and footer proportions. */
@media(min-width:951px){.about-hero{height:440px;min-height:440px}.about-hero .hero-inner{padding-top:24px;padding-bottom:24px}}
@media(min-width:641px) and (max-width:950px){.about-hero{height:auto;min-height:470px}}
@media(max-width:640px){.about-hero{height:auto;min-height:560px}}
footer{box-sizing:border-box;min-height:60px;padding:12px 18px;display:flex;align-items:center;justify-content:center;line-height:1.35}


/* Unified page banner proportions — match approved About Us desktop header (440px). */
@media (min-width: 951px) {
  .about-hero { box-sizing:border-box!important; height:auto!important; min-height:440px!important; }
}
@media (min-width: 641px) and (max-width: 950px) {
  .about-hero { height:auto!important; min-height:470px!important; }
}
@media (max-width:640px) {
  .about-hero { height:auto!important; min-height:560px!important; }
}

/* Same lower-banner height as About Us; allow text to expand rather than clip. */
.closing { box-sizing:border-box!important; height:auto!important; min-height:280px!important; }
.closing > * { position:relative; z-index:1; }
