/* Original TAEWON FLANGE logo and homepage photograph, used unchanged. */
:root {
  --ink: #192b43;
  --navy: #102744;
  --navy-deep: #081a30;
  --blue: #285b8f;
  --canvas: #f5f7fa;
  --soft: #eef2f7;
  --brand-red: #dd0000;
}
.site-header .brand { display: block; flex-shrink: 0; }
.site-header .brand-logo { width: 280px; height: auto; }
.site-footer .brand-logo { width: 250px; max-width: 100%; height: auto; }
.site-header nav > a { color: #192b43; }
.site-header nav > a:not(.store-nav):hover,
.site-header nav > a[aria-current="page"] { color: #b5141c; }
.site-header nav > a:not(.store-nav):hover::after { background: #edb0b4; }
.site-header nav > a:not(.store-nav)[aria-current="page"]::after { background: var(--brand-red); }
.site-header #nav-count { background: var(--brand-red); }
.site-header .store-nav { color: #176235; }
.store-name-short { display: none; }
.section-nav a[aria-current="page"] { color: #b5141c; border-bottom-color: var(--brand-red); }

.brand-hero {
  background-color: #142e50;
  background-image: linear-gradient(90deg, rgba(4,16,33,.86) 0%, rgba(6,22,44,.64) 38%, rgba(6,22,44,.18) 75%, rgba(6,22,44,.06) 100%), url('/wp-content/uploads/2023/06/34545.jpg');
  background-size: cover;
  background-position: center 52%;
}
.hero-content { display: flex; align-items: center; min-height: 640px; padding-block: 88px; }
.brand-hero .hero-copy { max-width: 830px; }
.brand-hero .eyebrow { color: #e3ebf6; font-size: 14px; letter-spacing: .18em; margin-bottom: 25px; }
.brand-hero .eyebrow::before { content: ''; display: inline-block; width: 34px; height: 3px; margin-right: 14px; vertical-align: middle; background: #f24148; }
.brand-hero h1 { font-size: clamp(38px, 4.5vw, 64px); line-height: 1.27; text-shadow: 0 2px 18px #04102024; }
.brand-hero h1 em { color: #fff; }
.brand-hero .hero-description { font-size: 18px; color: #e0e9f3; line-height: 1.85; margin-top: 28px; }
.brand-hero .actions { margin-top: 34px; gap: 14px; }
.brand-hero .button { min-height: 56px; padding: 16px 23px; font-size: 17px; gap: 24px; }
.brand-primary { background: var(--brand-red); color: #fff; border-color: var(--brand-red); }
.brand-primary:hover { background: #b90000; border-color: #b90000; }
.hero-outline { background: #0c20314d; border-color: #d6e5f399; color: #fff; }
.hero-outline:hover { background: #ffffff20; border-color: #fff; }
.brand-hero .hero-caption { color: #bacce0; margin-top: 48px; font-size: 11px; letter-spacing: .1em; gap: 18px; }
.brand-hero .hero-caption span { border-left: 1px solid #bacce066; padding-left: 18px; letter-spacing: 0; }
.industries { background: #f0f3f8; border-color: #dce3ec; }
.industries .container { color: #51657c; font-size: 14px; }
.company-masthead, .quote-heading {
  background-color: var(--navy);
  background-image: linear-gradient(90deg, rgba(7,23,46,.95), rgba(7,23,46,.78)), url('/wp-content/uploads/2023/06/34545.jpg');
  background-size: cover;
  background-position: center 52%;
}
.company-masthead .eyebrow, .quote-heading .eyebrow { color: #b5cce6; }

@media (max-width: 1150px) {
  .site-header .brand-logo { width: 270px; }
  .hero-content { min-height: 600px; padding-block: 76px; }
}
@media (max-width: 820px) {
  .site-header .brand { min-height: 45px; display: flex; align-items: center; }
  .site-header .brand-logo { width: 240px; }
  .brand-hero { background-position: 62% center; }
  .hero-content { min-height: 560px; padding-block: 62px; }
  .brand-hero h1 { font-size: 43px; max-width: 650px; }
  .brand-hero .hero-description { font-size: 16px; }
  .brand-hero .hero-caption { margin-top: 38px; }
}
@media (max-width: 480px) {
  .site-header .brand-logo { width: 210px; }
  .site-header .store-name-full { display: none; }
  .site-header .store-name-short { display: inline; }
  .site-header .store-nav { padding-inline: 11px; }
  .brand-hero {
    background-image: linear-gradient(90deg, rgba(4,16,33,.84), rgba(6,22,44,.54)), url('/wp-content/uploads/2023/06/34545.jpg');
    background-position: 59% center;
  }
  .hero-content { min-height: 550px; padding-block: 58px; }
  .brand-hero .eyebrow { font-size: 12px; margin-bottom: 23px; }
  .brand-hero h1 { font-size: 38px; line-height: 1.35; }
  .brand-hero .hero-description { font-size: 15px; margin-top: 22px; }
  .brand-hero .actions { gap: 10px; margin-top: 28px; }
  .brand-hero .button { padding: 13px 15px; font-size: 15px; min-height: 50px; gap: 12px; }
  .brand-hero .hero-caption { gap: 8px; font-size: 10px; margin-top: 34px; }
  .brand-hero .hero-caption span { padding-left: 8px; }
  .industries .container { font-size: 12px; }
}
@media (max-width: 360px) {
  .site-header .brand-logo { width: 178px; }
  .site-header .store-nav { top: 19px; padding-inline: 9px; }
  .brand-hero h1 { font-size: 34px; }
  .brand-hero .button { padding-inline: 13px; font-size: 14px; gap: 8px; }
}