/* Campbell Companies — static site styles */
:root{
  --navy:#1B5793;
  --link:#2B6CB0;
  --ink:#333333;
  --ink-soft:#4A5560;
  --slate:#3E4A5B;
  --rule:#E3E7EB;
  --green:#4E9A51;
  --green-dark:#417F44;
  --gold:#F0C042;
  --page:#FFFFFF;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--page);color:var(--ink);
  font-family:"Helvetica Neue",Helvetica,Arial,-apple-system,BlinkMacSystemFont,sans-serif;
  font-size:16px;line-height:1.6;
}
img{max-width:100%;display:block;border:0}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:#fff;padding:10px 14px;z-index:60}

/* ---------- utility top bar ---------- */
.topbar{background:var(--navy);color:#fff;font-size:13.5px}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;flex-wrap:wrap}
.topbar a{color:#fff}
.topbar .contact{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.topbar .sep{opacity:.5}
.topbar .right{display:flex;align-items:center;gap:14px}
.btn-credit{background:var(--green);color:#fff;font-size:11.5px;font-weight:700;line-height:1.15;
  padding:5px 9px;border-radius:3px;text-align:center;display:inline-block}
.btn-credit:hover{background:var(--green-dark);text-decoration:none}
.li-icon{width:18px;height:18px;fill:#fff;display:block}

/* ---------- masthead + nav ---------- */
.masthead{background:#fff;border-bottom:1px solid var(--rule);position:relative;z-index:40}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:104px;flex-wrap:wrap}
.brand img{height:64px;width:auto}
nav>ul{display:flex;gap:44px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
nav>ul>li{position:relative}
nav>ul>li>a,nav>ul>li>span.navtop{
  display:block;padding:18px 0;color:var(--slate);font-size:14px;font-weight:700;
  letter-spacing:.09em;text-transform:uppercase;cursor:pointer;
}
nav>ul>li>a:hover,nav>ul>li:hover>a,nav>ul>li:hover>span.navtop{color:var(--link);text-decoration:none}
nav>ul>li>a[aria-current="page"]{color:var(--link)}

/* dropdowns */
.submenu{
  position:absolute;top:100%;left:50%;transform:translateX(-50%);
  min-width:300px;margin:0;padding:0;list-style:none;
  background:#F4F4F4;border:1px solid #E6E6E6;box-shadow:0 6px 18px rgba(0,0,0,.10);
  opacity:0;visibility:hidden;transition:opacity .16s ease;z-index:50;
}
.submenu::before{
  content:"";position:absolute;top:-9px;left:50%;transform:translateX(-50%);
  border-left:9px solid transparent;border-right:9px solid transparent;border-bottom:9px solid #F4F4F4;
}
nav li:hover>.submenu,nav li:focus-within>.submenu{opacity:1;visibility:visible}
.submenu li+li{border-top:1px solid #E6E6E6}
.submenu a{
  display:block;padding:15px 22px;color:var(--slate);font-size:16px;font-weight:400;
  letter-spacing:0;text-transform:none;white-space:nowrap;
}
.submenu a:hover{background:#EDEDED;color:var(--slate);text-decoration:none}
@media(max-width:900px){
  .submenu{position:static;transform:none;opacity:1;visibility:visible;box-shadow:none;
    min-width:0;border:0;background:transparent;display:none}
  nav li:hover>.submenu,nav li:focus-within>.submenu{display:block}
  .submenu::before{display:none}
  .submenu a{padding:9px 0 9px 14px;font-size:15px}
  nav>ul{gap:6px;flex-direction:column;width:100%}
  nav>ul>li>a,nav>ul>li>span.navtop{padding:10px 0}
}

/* ---------- hero ---------- */
.hero{position:relative;background:#4a5a68}
.hero img{width:100%;height:min(66vh,620px);object-fit:cover;object-position:center 60%}
.hero .overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center}
.hero h1{margin:0;color:#fff;font-size:clamp(26px,4.6vw,58px);font-weight:800;line-height:1.22;
  letter-spacing:-.01em;text-shadow:0 2px 18px rgba(0,0,0,.42);max-width:100%}
.hero h1 br{display:inline}
@media(max-width:520px){.hero h1 br{display:none}}
/* shorter banner used on interior pages */
.hero.page-banner img{height:min(42vh,380px);object-position:center 55%}
.hero.page-banner h1{font-size:clamp(32px,5vw,60px)}

/* ---------- homepage values strip + tiles ---------- */
.values{padding:44px 24px 40px;text-align:center}
.values img{margin:0 auto;max-width:760px;width:100%;height:auto}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:0 0 56px}
@media(max-width:900px){.tiles{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.tiles{grid-template-columns:1fr}}
.tile{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:#0e1519}
.tile img.bg{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.tile:hover img.bg{transform:scale(1.045)}
.tile .band{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);
  background:rgba(255,255,255,.86);padding:22px 18px;display:flex;align-items:center;justify-content:center;
  min-height:118px;transition:background .25s ease}
.tile:hover .band{background:rgba(255,255,255,.95)}
.tile .band img{max-height:56px;width:auto;max-width:78%}

/* ---------- interior article ---------- */
.article{max-width:1160px;margin:0 auto;padding:56px 24px 24px}
.article .crest{margin:0 auto 34px;width:132px}
.article video{width:100%;height:auto;display:block;background:#000;margin:0 0 40px}
.article p{margin:0 0 20px;font-size:17px;color:var(--ink)}
.article h2{
  font-family:inherit;font-size:31px;font-weight:700;color:var(--slate);
  letter-spacing:-.01em;margin:44px 0 26px;
}
.article .icon{width:132px;margin:0 0 26px}
.article ul{margin:0 0 20px;padding-left:22px}
.article li{margin-bottom:7px;font-size:17px}
.rule-gold{border:0;border-top:4px solid var(--gold);width:340px;max-width:60%;margin:34px 0 0}
.valblock{margin:0 0 26px}
.valblock h3{font-size:16px;font-weight:800;letter-spacing:.02em;color:#111;margin:0 0 4px;text-transform:uppercase}
.valblock p{margin:0}
.cta-row{padding:44px 24px 64px;display:flex;justify-content:center}
.btn-primary{
  display:inline-block;background:#1F5590;color:#fff;font-size:15px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;padding:19px 64px;text-align:center;
}
.btn-primary:hover{background:#17456F;text-decoration:none}

/* ---------- footer ---------- */
.site-footer{position:relative;background:#fff;overflow:hidden;border-top:1px solid var(--rule)}
.site-footer .deco{position:absolute;right:0;top:0;width:62%;height:100%;object-fit:cover;object-position:left center;
  pointer-events:none;opacity:.85}
.site-footer .wrap{position:relative;display:grid;grid-template-columns:1.05fr 1fr 1fr;gap:44px;padding:56px 24px 40px}
@media(max-width:900px){.site-footer .wrap{grid-template-columns:1fr;gap:32px}}
.site-footer h2{font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);margin:0 0 22px}
.contact-row{display:flex;gap:14px;align-items:flex-start;margin-bottom:18px;color:var(--ink-soft)}
.contact-row svg{flex:none;width:19px;height:19px;fill:#8C97A2;margin-top:3px}
.contact-row a{color:var(--ink-soft)}
ul.linklist{list-style:none;margin:0;padding:0}
ul.linklist li{border-bottom:1px solid var(--rule)}
ul.linklist li:first-child{border-top:1px solid var(--rule)}
ul.linklist a{display:flex;align-items:center;gap:11px;padding:13px 2px;color:var(--ink-soft);font-size:15.5px}
ul.linklist a::before{content:"›";color:#9AA5AF;font-size:17px;line-height:1}
ul.linklist a:hover{color:var(--link);text-decoration:none}
ul.phones{list-style:none;margin:0;padding:0}
ul.phones li{padding:13px 0;color:var(--ink-soft);font-size:15.5px}
ul.phones a{color:var(--ink-soft)}
.legal{position:relative;border-top:1px solid var(--rule);background:#fff}
.legal .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;
  font-size:13.5px;color:#7A848E;flex-wrap:wrap}
.legal a{color:#7A848E}
.legal .items{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.legal .items .sep{color:#C3CAD1}
.legal .li-icon{fill:#7A848E;width:19px;height:19px}

/* ---------- back to top ---------- */
.totop{position:fixed;right:18px;bottom:18px;width:44px;height:44px;background:#4A5560;color:#fff;
  display:flex;align-items:center;justify-content:center;z-index:45;opacity:.92}
.totop:hover{background:#3A434C;text-decoration:none}
.totop svg{width:18px;height:18px;fill:#fff}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.tile img.bg{transition:none}}

/* ---------- credit page ---------- */
.article .lede{font-size:19px;color:var(--slate);margin:0 0 34px}
.credit-grid{display:grid;gap:0;margin:0 0 12px;max-width:820px}
.credit-card{
  display:grid;grid-template-columns:300px 1fr;gap:32px;align-items:center;
  padding:30px 0;border-bottom:1px solid var(--rule);
}
.credit-card:first-child{border-top:1px solid var(--rule)}
.credit-card>img{max-height:78px;width:auto;max-width:100%}
.credit-actions{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.btn-primary.small{padding:13px 40px;font-size:14px}
.credit-actions .cash{margin:0;font-size:15px;color:var(--ink-soft)}
@media(max-width:700px){
  .credit-card{grid-template-columns:1fr;gap:18px;text-align:left}
  .credit-card>img{max-height:64px}
}
.credit-contact{margin:48px 0 8px;max-width:820px}
.credit-contact h2{margin-top:0}
ul.contacts{list-style:none;margin:18px 0 0;padding:0}
ul.contacts li{padding:12px 0;border-bottom:1px solid var(--rule);font-size:16px;color:var(--ink-soft)}
ul.contacts li:first-child{border-top:1px solid var(--rule)}
ul.contacts strong{color:var(--ink)}

/* ---------- nested submenu (About › Accolades) ---------- */
.submenu li{position:relative}
.submenu li.has-sub>a::after{content:"›";float:right;margin-left:18px;color:#9AA5AF}
.submenu .submenu{
  /* opens leftward: the About menu sits near the right edge, so left:100% clipped */
  top:0;left:auto;right:100%;transform:none;min-width:250px;
  border-right:1px solid #E6E6E6;box-shadow:-6px 6px 18px rgba(0,0,0,.10);
}
.submenu .submenu::before{display:none}
@media(max-width:900px){
  .submenu .submenu{left:0;right:auto;border-right:0;box-shadow:none}
  .submenu li.has-sub>a::after{float:none;margin-left:6px}
  .submenu .submenu a{padding-left:28px}
}

/* ---------- accolade / article extras ---------- */
.article.narrow{max-width:900px}
.award-row{display:flex;align-items:center;gap:36px;flex-wrap:wrap;margin:0 0 34px}
.award-row img{max-height:190px;width:auto}
.award-badge{margin:6px 0 34px;width:min(460px,100%);height:auto}
.montage{margin:30px 0;width:100%;height:auto}
.video-embed{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;margin:0 0 26px;background:#000}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
