/* ==========================================================================
   Red Cedar USA: static site styles
   Breakpoints match the original: tablet <= 980px, phone <= 767px.
   ========================================================================== */

/* ---------- Base ---------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.7em;
  color: #666;
  background-color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding-bottom: 10px;
  font-weight: 500;
  line-height: 1em;
  color: #333;
}
h1 { font-size: 30px; }
h2 { font-size: 26px; }
h3 { font-size: 22px; }
h4 { font-size: 18px; }

p { margin: 0; padding-bottom: 1em; }
p:last-of-type { padding-bottom: 0; }

a { color: #000; text-decoration: none; }
strong { font-weight: 700; }
img { max-width: 100%; height: auto; vertical-align: top; border: 0; }
ul { margin: 0; padding: 0; }

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.skip-link {
  position: absolute;
  left: 8px;
  top: -100px;
  z-index: 100000;
  padding: 8px 16px;
  background: #fff;
  color: #000;
}
.skip-link:focus { top: 8px; }

/* ---------- Layout: sections, rows, columns ---------- */
.section {
  position: relative;
  padding: 4% 0;
  background-color: #fff;
}

.row {
  position: relative;
  width: 80%;
  max-width: 1500px;
  margin: 0 auto;
  padding: 2% 0;
}

/* Rows with more than one column */
.cols { display: flex; align-items: stretch; }
.cols > .col { margin-right: 5.5%; }
.cols > .col:last-child { margin-right: 0; }
.col { position: relative; min-width: 0; }
.col-1-4 { width: 20.875%; }
.col-1-3 { width: 29.6667%; }
.col-1-2 { width: 47.25%; }
.col-2-3 { width: 64.833%; }

/* Space between stacked blocks inside a column */
.mod { margin-bottom: 2.75%; }
.col-1-2 > .mod { margin-bottom: 5.82%; }
.mod:last-child { margin-bottom: 0; }

/* Empty vertical spacer */
.spacer { height: 23px; }

/* Text blocks used across pages */
.text-dark { color: #000; }
.text-16 { font-size: 16px; }
.text-center { text-align: center; }

.page-title { font-family: 'Albert Sans', Helvetica, Arial, sans-serif; color: #000; }

/* Background used under the main content of most inner pages */
.bg-waves {
  background-image: url(../img/subsystems-background-3.1.jpg);
  background-size: cover;
  background-position: center bottom 0;
  background-repeat: no-repeat;
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-block;
  padding: 0.3em 1em;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.7em;
  text-transform: uppercase;
  color: #fff;
  background-color: #709547;
  border: 0;
  border-radius: 0;
  transition: all 300ms ease 0ms;
}

/* ---------- Bullseye list (icon on the left) ---------- */
.icon-list { list-style: none; }
.icon-list li {
  position: relative;
  display: flex;
  align-items: flex-start;
  padding-left: 30px;
  margin-bottom: 10px;
  font-size: 16px;
  line-height: 1em;
  color: #000;
}
.icon-list li:last-child { margin-bottom: 0; }
.icon-list li::before {
  content: "\f140";
  flex: 0 0 auto;
  width: 32px;
  margin-right: 15px;
  font-family: 'FontAwesome';
  font-weight: 900;
  font-size: 20px;
  line-height: 20px;
  color: #709547;
}
.icon-list li span { display: block; padding-bottom: 10px; line-height: 1em; }

/* ---------- Social icon (LinkedIn square) ---------- */
.social-icon {
  display: block;
  width: 32px;
  height: 32px;
  border-radius: 3px;
  background-color: #007bb6;
  text-align: center;
}
.social-icon::before {
  content: "\e09d";
  display: block;
  font-family: 'SiteIcons';
  font-size: 16px;
  line-height: 32px;
  color: #000;
  transition: color 300ms ease 0ms;
}
.social-icon:hover::before { color: #353535; }

/* ==========================================================================
   Header
   ========================================================================== */
.site-header {
  position: relative;
  z-index: 50;
  padding: 40px 0 30px;
  background-color: #ededed;
}

.header-row {
  display: flex;
  align-items: stretch;
  width: 90%;
  max-width: 1440px;
  margin: 0 auto;
}

.header-logo {
  flex: 0 0 17.6%;
  margin-right: 3%;
  padding-top: 10px;
}
.header-logo img { display: block; width: 100%; max-width: 400px; }

.header-nav {
  flex: 0 0 58.8%;
  margin-right: 3%;
  display: flex;
  justify-content: center;
}
.header-nav ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 -11px;
  list-style: none;
}
.header-nav li {
  margin-top: 8px;
  padding: 0 11px;
  font-size: 14px;
  line-height: 14px;
}
.header-nav a {
  display: block;
  padding-bottom: 8px;
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
  font-size: 15px;
  font-weight: 500;
  text-transform: uppercase;
  color: #000;
  transition: opacity 0.4s ease-in-out;
}
.header-nav a:hover { opacity: 0.7; }
.header-nav .nav-linkedin { display: none; }

.header-social {
  flex: 1 1 auto;
  display: flex;
  justify-content: flex-end;
}
.header-social .social-icon { margin-bottom: 8px; }

/* Mobile menu (a <details> element, so no JavaScript is needed) */
.mobile-nav { display: none; }

@media (max-width: 980px) {
  .header-logo { flex-basis: auto; width: 350px; max-width: 350px; }
  .header-nav { display: none; }
  .mobile-nav { display: block; position: relative; flex: 1 1 auto; }
}

@media (max-width: 767px) {
  .site-header { padding-bottom: 0; }
  .header-row { width: 90%; max-width: 90%; }
  .header-logo {
    width: 265px;
    max-width: 265px;
    margin: 0 0 30px;
  }
  .header-row { position: relative; min-height: 61.5px; }
  .header-social { display: none; }
}

.mobile-nav summary {
  display: flex;
  justify-content: flex-end;
  list-style: none;
  cursor: pointer;
}
.mobile-nav summary::-webkit-details-marker { display: none; }
.mobile-nav summary::before {
  content: "a";
  font-family: 'SiteIcons';
  font-size: 32px;
  line-height: 32px;
  color: #000;
}

.mobile-menu {
  position: absolute;
  top: 31px;
  left: 30px;
  right: 0;
  z-index: 9999;
  padding: 5%;
  list-style: none;
  background-color: #fff;
  border-top: 3px solid #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.mobile-menu li { padding: 0; }
.mobile-menu a {
  display: block;
  padding: 10px 5%;
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
  font-size: 15px;
  font-weight: 500;
  line-height: 26px;
  text-transform: uppercase;
  color: #000;
  border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}
.mobile-menu .nav-linkedin img { vertical-align: baseline; }
@media (min-width: 768px) {
  .mobile-menu .nav-linkedin { display: none; }
}
@media (min-width: 768px) and (max-width: 980px) {
  .mobile-menu { left: auto; width: 320px; top: 40px; }
}
/* Phone: the menu button sits over the right side of the logo row and the
   dropdown spans the row (minus a 30px left inset), as on the original. */
@media (max-width: 767px) {
  .mobile-nav {
    position: absolute;
    top: 1.5px;
    left: 30px;
    right: 0;
    padding: 0;
  }
  .mobile-nav summary { padding: 0 19.5px; }
  .mobile-nav summary::before { position: relative; top: 2px; }
  .mobile-menu { top: 31px; left: 0; right: 0; }
}

/* ==========================================================================
   Page header slider (About, Capabilities, Customers)
   Three photos that cross-fade: 4s each with a 2s fade, like the original.
   ========================================================================== */
.page-slider {
  position: relative;
  z-index: 10;
  aspect-ratio: 1920 / 447;
  overflow: hidden;
  background-color: #fff;
  box-shadow: 0 12px 18px -6px rgba(0, 0, 0, 0.3);
}
.page-slider img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  animation: slide-fade 18s linear infinite;
}
.page-slider img:nth-child(1) { animation-delay: -2s; }
.page-slider img:nth-child(2) { animation-delay: 4s; }
.page-slider img:nth-child(3) { animation-delay: 10s; }

@keyframes slide-fade {
  0%      { opacity: 0; animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); }
  11.111% { opacity: 1; }
  33.333% { opacity: 1; animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); }
  44.444% { opacity: 0; }
  100%    { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .page-slider img { animation: none; }
  .page-slider img:first-child { opacity: 1; }
}

/* Static photo banner (Government, Research & Development) */
.page-banner {
  position: relative;
  z-index: 10;
  padding: 100px 0;
  background-size: cover;
  background-position: center;
  box-shadow: 0 12px 18px -6px rgba(0, 0, 0, 0.3);
}
.spacer-75 { height: 75px; }
.banner-submarine { background-image: url(../img/trc-header-06.jpg); }
.banner-carrier { background-image: url(../img/trc-header-01.jpg); }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer {
  padding: 4% 0 0;
  background-image:
    linear-gradient(180deg, rgba(0, 0, 0, 0.74) 0%, rgba(12, 113, 195, 0.77) 98%),
    url(../img/trc-header-03.jpg);
  background-size: cover;
  background-position: center bottom 33%;
  background-repeat: no-repeat;
  font-family: 'Roboto Flex', Helvetica, Arial, sans-serif;
  line-height: 1.6em;
  color: #fff;
}
.site-footer h3 {
  font-family: sans-serif;
  color: #fff;
}
.site-footer .col-1-4 h3 { font-size: 20px; }
.site-footer a { color: #fff; }

.footer-text { margin-bottom: 18px; }
.footer-links { color: #b7b7b7; }
.footer-social { margin-bottom: 0; }
.footer-social .social-icon { margin-bottom: 8px; }

.footer-bottom {
  padding: 15px 0;
  background-color: rgba(0, 0, 0, 0.68);
  text-align: center;
}
.footer-bottom p { padding: 0; }

/* ==========================================================================
   Tablet and phone layout (matches the original theme)
   ========================================================================== */
@media (max-width: 980px) {
  .section { padding: 50px 0; }
  .row { padding: 30px 0; }
  .cols { flex-direction: column; }
  .cols > .col { width: 100%; margin-right: 0; margin-bottom: 30px; }
  .cols > .col:last-child { margin-bottom: 0; }
  .mod, .col-1-2 > .mod { margin-bottom: 30px; }
  .mod:last-child { margin-bottom: 0; }

  .site-footer { padding-top: 50px; }
  .footer-social { padding-top: 23px; }
}

/* ==========================================================================
   Shared inner-page pieces
   ========================================================================== */
.inner-main { padding: 80px 0; }

.intro { margin-bottom: 24px; }
.intro h1 { font-size: 34px; font-weight: 600; line-height: 1.2em; color: #000; }

.btn-wrap { margin-top: 40px; }

.row-spacer-150 { height: 150px; }

@media (min-width: 768px) and (max-width: 980px) {
  .intro { margin-bottom: 18px; }
}
@media (max-width: 980px) {
  .hide-below-981 { display: none; }
}
@media (max-width: 767px) {
  .intro { margin-bottom: 10px; }
}

/* ==========================================================================
   About
   ========================================================================== */
.about-main { padding: 80px 0; }
.about-block h2 {
  font-family: 'Albert Sans', Helvetica, Arial, sans-serif;
  font-weight: 500;
  line-height: 1.2em;
  color: #000;
}
.about-leadership h2 { line-height: 1.4em; }

@media (max-width: 767px) {
  .about-main { padding: 90px 0 150px; }
}

/* ==========================================================================
   Home
   ========================================================================== */
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }

/* Hero with background video */
.home-hero {
  position: relative;
  height: 60vh;
  overflow: hidden;
  padding: 170px 0 4%;
  background-color: #222; /* shown until the video starts, as on the original */
  animation: fade-in 1000ms ease both;
}
.home-hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.home-hero-row {
  position: relative;
  display: flex;
  width: 90%;
  max-width: 1300px;
  margin: 0 auto;
}
.home-hero-spacer { width: 60%; }
.home-hero-text { width: 40%; }
.home-hero-text h1 {
  font-family: 'Albert Sans', Helvetica, Arial, sans-serif;
  font-size: 70px;
  line-height: 1.1em;
  color: #fff;
  text-align: left;
  text-shadow: 0 0 0.3em #000;
}

/* Two-column text/photo bands */
.home-split { background-color: #f4f1ea; }
.split-row {
  display: flex;
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
}
.split-text, .split-photo { width: 50%; }
.split-text-intro { padding: 7vh 6vh; }
.split-text-naics { padding: 7vw 6vw; }
.split-photo {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.split-photo-carrier { background-image: url(../img/trc-header-01.jpg); }
.split-photo-submarine { background-image: url(../img/TRC-home-feature-3.jpg); }
.split-image-mobile { display: none; }
.split-image-mobile img { display: block; width: 100%; }

.home-intro-title { margin-bottom: 24px; }
.home-intro-title h2 {
  font-family: 'Albert Sans', Helvetica, Arial, sans-serif;
  font-size: 48px;
  line-height: 1.2em;
  color: #171717;
}
.naics-lead { font-size: 20px; font-weight: 600; }
.icon-list-spaced li:last-child { margin-bottom: 10px; }

/* Clearance statement, identifiers and logo strip */
.home-credentials {
  overflow: hidden;
  padding: 50px 0;
  background-color: #fff;
}
.home-credentials .row { padding: 0; }
.home-identifiers {
  width: 90%;
  max-width: 850px;
  font-family: sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #000;
}
@supports (animation-timeline: view()) {
  .home-identifiers {
    animation: fade-in linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 100%;
  }
}
.home-credentials .home-logos { width: 90%; padding: 2% 0; }

/* Logo carousel: shows 5 logos (3 on phones) and advances one logo every
   2 seconds (1s pause + 1s slide), looping through all 10 like the original. */
.logo-carousel {
  --n: 5;
  --gap: 30px;
  overflow: hidden;
  padding: 30px 0;
}
.logo-track {
  display: flex;
  width: 100%;
  list-style: none;
  animation: logo-scroll 20s linear infinite;
}
.logo-track li {
  flex: 0 0 calc((100% - (var(--n) - 1) * var(--gap)) / var(--n));
  margin-right: var(--gap);
}
.logo-track img { display: block; max-width: 100%; height: auto; }

@keyframes logo-scroll {
  0%    { transform: translateX(calc(0 * (100% + var(--gap)) / var(--n))); }
  5%     { transform: translateX(calc(0 * (100% + var(--gap)) / var(--n))); animation-timing-function: ease; }
  10%    { transform: translateX(calc(-1 * (100% + var(--gap)) / var(--n))); }
  15%    { transform: translateX(calc(-1 * (100% + var(--gap)) / var(--n))); animation-timing-function: ease; }
  20%    { transform: translateX(calc(-2 * (100% + var(--gap)) / var(--n))); }
  25%    { transform: translateX(calc(-2 * (100% + var(--gap)) / var(--n))); animation-timing-function: ease; }
  30%    { transform: translateX(calc(-3 * (100% + var(--gap)) / var(--n))); }
  35%    { transform: translateX(calc(-3 * (100% + var(--gap)) / var(--n))); animation-timing-function: ease; }
  40%    { transform: translateX(calc(-4 * (100% + var(--gap)) / var(--n))); }
  45%    { transform: translateX(calc(-4 * (100% + var(--gap)) / var(--n))); animation-timing-function: ease; }
  50%    { transform: translateX(calc(-5 * (100% + var(--gap)) / var(--n))); }
  55%    { transform: translateX(calc(-5 * (100% + var(--gap)) / var(--n))); animation-timing-function: ease; }
  60%    { transform: translateX(calc(-6 * (100% + var(--gap)) / var(--n))); }
  65%    { transform: translateX(calc(-6 * (100% + var(--gap)) / var(--n))); animation-timing-function: ease; }
  70%    { transform: translateX(calc(-7 * (100% + var(--gap)) / var(--n))); }
  75%    { transform: translateX(calc(-7 * (100% + var(--gap)) / var(--n))); animation-timing-function: ease; }
  80%    { transform: translateX(calc(-8 * (100% + var(--gap)) / var(--n))); }
  85%    { transform: translateX(calc(-8 * (100% + var(--gap)) / var(--n))); animation-timing-function: ease; }
  90%    { transform: translateX(calc(-9 * (100% + var(--gap)) / var(--n))); }
  95%    { transform: translateX(calc(-9 * (100% + var(--gap)) / var(--n))); animation-timing-function: ease; }
  100%   { transform: translateX(calc(-10 * (100% + var(--gap)) / var(--n))); }
}

@media (prefers-reduced-motion: reduce) {
  .home-hero, .logo-track { animation: none; }
}

@media (max-width: 980px) {
  .home-hero { height: 65vh; padding-top: 110px; padding-bottom: 50px; }
  .home-hero-row { flex-direction: column; }
  .home-hero-spacer, .home-hero-text { width: 100%; }
  .home-hero-text h1 { font-size: 60px; }

  .split-row { display: block; }
  .split-photo { display: none; }
  .split-text { width: 100%; }
  .split-text-intro, .split-text-naics { padding: 90px 40px 120px; }
  .split-image-mobile { display: block; }

  .home-intro-title { margin-bottom: 18px; }
  .home-intro-title h2 { font-size: 44px; }
  .home-credentials .home-logos { padding: 30px 0; }
}

@media (max-width: 767px) {
  .home-hero { height: 80vh; padding-top: 60px; }
  .home-hero-text h1 { font-size: 40px; text-align: center; }
  .split-text-intro, .split-text-naics { padding: 50px 20px 90px; }
  .home-intro-title { margin-bottom: 10px; }
  .home-intro-title h2 { font-size: 26px; }
  .logo-carousel { --n: 3; }
}

/* ==========================================================================
   Capabilities
   ========================================================================== */
.col-2-5 { width: 36.7%; }
.col-3-5 { width: 57.8%; }

.cap-row { padding-bottom: 80px; }
.cap-text { padding-top: 20px; margin-bottom: 24px; }
.cap-text h2 {
  font-family: 'Albert Sans', Helvetica, Arial, sans-serif;
  font-weight: 500;
  line-height: 1.2em;
  color: #171717;
  text-align: left;
}

/* Circular photos */
.round-photo {
  max-width: 350px;
  margin: 0 auto;
  border-radius: 50%;
  overflow: hidden;
}
.round-photo img { display: block; width: 100%; }

/* List variant with taller lines; every item keeps its bottom gap */
.icon-list-loose li span { line-height: 1.4em; }
.icon-list-loose li:last-child { margin-bottom: 10px; }

/* "Capabilities Statement" link with PDF icon (whole block is clickable) */
.doc-link {
  position: relative;
  display: flex;
  align-items: flex-start;
  font-size: 16px;
  line-height: 1em;
  color: #000;
}
.doc-link-centered { max-width: 550px; margin: 0 auto; }
.doc-link-icon {
  flex: 0 0 32px;
  margin-right: 15px;
  text-align: center;
}
.doc-link-icon::before {
  content: "\f1c1";
  font-family: 'FontAwesome';
  font-weight: 400;
  font-size: 32px;
  line-height: 32px;
  color: #709547;
}
.doc-link-body { flex: 1 1 auto; }
.doc-link h3 {
  font-family: 'Albert Sans', Helvetica, Arial, sans-serif;
  font-size: 22px;
  color: #000;
}
.doc-link h3 a { color: #000; }
.doc-link h3 a::after { content: ""; position: absolute; inset: 0; }

@media (max-width: 980px) {
  .cap-row { padding-bottom: 60px; }
  .cap-text { margin-bottom: 18px; }
  .round-photo { width: auto; }
}
@media (max-width: 767px) {
  .capabilities-main { padding: 90px 0 150px; }
  .phone-center, .phone-center h1,
  .cap-text, .cap-text h2 { text-align: center; }
  .cap-text { margin-bottom: 10px; }
  .cap-row { padding-bottom: 40px; }
  .cap-row-last { padding-bottom: 20px; }
}

/* ==========================================================================
   Customers
   ========================================================================== */
.col-3-4 { width: 73.625%; }

.customer-logo img { display: block; width: 100%; }
.customer-name {
  margin-top: -6px;
  text-align: center;
  color: #000;
}

.contract-vehicles { background-color: #f8f8f8; }

.section-heading h2 {
  font-size: 26px;
  font-weight: 600;
  color: #000;
}

.vehicle-row { padding-top: 0; }
.vehicle-logo img { display: block; }
.vehicle-logo-wide img { max-height: 200px; width: auto; }
.vehicle-text h4,
.consortium h4 {
  font-size: 20px;
  font-weight: 600;
  color: #000;
}

@media (max-width: 980px) {
  .vehicle-spacer { display: none; }
  .customer-logo img { width: auto; max-width: 100%; }
}
@media (max-width: 767px) {
  .customers-intro, .consortia { padding: 90px 0 150px; }
  .vehicle-logo img { margin: 0 auto; }
  .vehicle-text, .vehicle-text h4 { text-align: center; }
  .consortia-spacer { display: none; }
}

/* ==========================================================================
   Government, Research & Development
   ========================================================================== */
.identifiers h4 { font-size: 20px; font-weight: 600; color: #000; }
.doc-link-desc p { line-height: 1em; }

.rd-text { margin-bottom: 24px; }
.rd-text h2 {
  font-family: 'Albert Sans', Helvetica, Arial, sans-serif;
  font-size: 30px;
  line-height: 1.2em;
  color: #171717;
  text-align: left;
}
.rd-text h2.rd-tagline { font-style: italic; }

@media (max-width: 980px) {
  .rd-text { margin-bottom: 18px; }
}
@media (max-width: 767px) {
  .inner-main { padding: 90px 0 150px; }
  .rd-text { margin-bottom: 10px; }
}

/* ==========================================================================
   Contact
   ========================================================================== */
.contact-block { margin-bottom: 24px; }
.spacer-50 { height: 50px; }
.contact-email { color: blue; }

/* Form */
.form-fields { display: grid; row-gap: 40px; }
.form-field label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  line-height: 1.43;
  color: #112337;
}
.form-label-text { padding-right: 6px; }
.form-required {
  font-size: 12px;
  line-height: 1.43;
  color: #c02b0a;
}
.form-field input,
.form-field textarea {
  display: block;
  width: 100%;
  margin: 0;
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  color: #112337;
  background-color: #fff;
  border: 1px solid #686e77;
  border-radius: 3px;
  box-shadow: 0 1px 4px rgba(18, 25, 97, 0.08);
}
.form-field input { height: 38px; padding: 0 12px; line-height: 38px; }
.form-field textarea { height: 192px; padding: 12px; line-height: 1.5; resize: vertical; }
.form-field input:focus,
.form-field textarea:focus {
  outline: 2px solid #204ce5;
  outline-offset: 1px;
}
.form-description {
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.43;
  color: #585e6a;
}
.form-counter { margin: 8px 0 0; }
.form-footer { margin-top: 24px; }
.form-submit {
  height: 38px;
  padding: 0 16px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  color: #fff;
  background-color: #204ce5;
  border: 1px solid transparent;
  border-radius: 3px;
  box-shadow: 0 1px 4px rgba(18, 25, 97, 0.08);
  cursor: pointer;
}
.form-submit:hover { background-color: #1a3db8; }
.form-submit:focus-visible { outline: 2px solid #204ce5; outline-offset: 2px; }
.form-submit:disabled { opacity: 0.6; cursor: default; }

/* Hidden spam trap (see contact/send.php): people never see or fill it in. */
.form-hp {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Messages after submitting */
.form-notice {
  margin-bottom: 24px;
  padding: 12px 16px;
  font-size: 14px;
  line-height: 1.5;
  color: #c02b0a;
  background-color: #fff;
  border: 1px solid #c02b0a;
  border-radius: 3px;
}
.form-notice p { margin: 0; padding: 0; font-weight: 600; }
.form-notice ul { margin: 8px 0 0; padding-left: 20px; list-style: disc; }
.form-field [aria-invalid="true"] { border-color: #c02b0a; }
.form-confirmation { font-size: 16px; line-height: 1.7; }

@media (max-width: 767px) {
  .contact-main { padding: 50px 0; }
  .contact-block { margin-bottom: 10px; }
  .hide-below-768 { display: none; }
}

/* ==========================================================================
   Privacy Policy (set in Roboto, as on the original)
   ========================================================================== */
.privacy-title,
.privacy-text {
  margin-top: -6px;
  font-family: 'Roboto', Helvetica, Arial, sans-serif;
  font-weight: 300;
  line-height: 1.8em;
  color: #000;
}
.privacy-title { padding-bottom: 20px; }
.privacy-title h2 {
  font-size: 24px;
  font-weight: 600;
  line-height: 30px;
  text-transform: uppercase;
  color: #000;
}
.privacy-text h3 { color: #000; }

/* ==========================================================================
   Capability Statement: inline PDF viewer (see assets/js/pdf-viewer.mjs)
   ========================================================================== */
.statement-doc { max-width: 1200px; margin: 0 auto; }

.pdf-viewer {
  box-sizing: content-box; /* the 1px frame sits outside the column, like the original */
  width: 100%;
  position: relative;
  overflow: hidden;
  line-height: 0;
  background-color: #d3d3d3;
  border: 1px solid #000;
}
.pdf-pages {
  display: none;
  overflow: hidden;
  text-align: center;
}
.pdf-pages.is-zoomed { overflow: auto; text-align: left; }
.pdf-pages canvas { display: inline-block; background-color: #fff; }
.pdf-viewer.is-ready .pdf-pages { display: block; }
.pdf-viewer.is-ready .pdf-fallback { display: none; }
.pdf-fallback {
  display: block;
  padding: 16px;
  font-size: 16px;
  line-height: 1.5;
  color: #000;
  text-decoration: underline;
}

.pdf-toolbar {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 31px;
  padding-left: 2px;
  background-color: #808080;
  line-height: 14px;
}
.pdf-viewer.is-ready:hover .pdf-toolbar,
.pdf-viewer.is-ready:focus-within .pdf-toolbar { display: flex; align-items: flex-start; }

.pdf-btn {
  width: 30px;
  height: 23px;
  margin: 4px 2px 4px 0;
  padding: 2px 6px 0;
  line-height: 14px;
  background-color: rgba(0, 0, 0, 0.12);
  background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
  border: 1px solid rgba(0, 0, 0, 0.32);
  border-color: rgba(0, 0, 0, 0.32) rgba(0, 0, 0, 0.38) rgba(0, 0, 0, 0.42);
  border-radius: 2px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), inset 0 0 1px rgba(255, 255, 255, 0.15), 0 1px 0 rgba(255, 255, 255, 0.05);
  cursor: pointer;
}
.pdf-btn:first-child { margin-left: 2px; }
.pdf-btn img { display: inline-block; vertical-align: top; }
.pdf-btn:hover:not(:disabled) { background-color: rgba(0, 0, 0, 0.2); }
.pdf-btn:disabled { cursor: default; }
.pdf-btn:disabled img { opacity: 0.5; }
.pdf-btn:focus-visible { outline: 2px solid #fff; outline-offset: -2px; }
.pdf-label {
  margin: 6px 15px 6px 2px;
  padding: 2px;
  font-family: sans-serif;
  font-size: 12px;
  line-height: 14px;
  color: #d3d3d3;
}
.pdf-page-area + .pdf-btn { margin-left: 0; }

@media (max-width: 767px) {
  .statement-main { padding: 50px 0; }
  .statement-row { width: 92%; padding: 0 0 30px; }
}