/* ==========================================================================
   Freeport Launch — site styles
   Design tokens and section styling matched to _source/freeport-launch-ui.png
   ========================================================================== */

:root {
  --navy: #08172d;
  --navy-panel: #08172d;
  --charcoal: #33322f;
  --blue: #005edc;
  --blue-dark: #0b4fb0;
  --red: #c11a1e;
  --ink: #17232e;
  --paper: #fff;
  --paper-tint: #f5f7fb;
  --hairline: #d9dee5;
  --muted-on-dark: #9aa7b3;
  --muted-on-light: #5b6672;
  --font-display: 'Anton', 'Arial Narrow', 'Haettenschweiler', impact, sans-serif;
  --font-brand: 'Bebas Neue', 'Arial Narrow', impact, sans-serif;
  --font-ui: 'Barlow Condensed', 'Arial Narrow', system-ui, sans-serif;
  --font-body: 'Roboto Condensed', 'Arial Narrow', system-ui, sans-serif;
  --container: 1200px;
  --gutter: 24px;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

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

html {
  scroll-behavior: smooth;
  scroll-padding-top: 124px;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 18px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

picture {
  display: contents;
}

a {
  color: var(--blue);
}

a:hover {
  color: var(--blue-dark);
}

:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 2px;
}

.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* --------------------------------------------------------------------------
   Typography helpers
   -------------------------------------------------------------------------- */

.display-title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2.7rem, 6.2vw, 4.2rem);
  line-height: 1;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  color: var(--navy);
}

.display-title--accent {
  color: var(--blue);
}

.eyebrow {
  margin: 0 0 0.75rem;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 1.18rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--blue);
}

.eyebrow::before {
  content: '-';
}

.eyebrow--on-dark {
  color: #6ea8ff;
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.btn-fl {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  padding: 0.85rem 1.6rem;
  border: 2px solid transparent;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 0.9rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    color 0.15s ease;
  border-radius: 5px;
}

.btn-fl--blue {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}

.btn-fl--blue:hover {
  background: var(--blue-dark);
  border-color: var(--blue-dark);
  color: #fff;
}

.btn-fl--ink {
  background: var(--navy);
  border-color: var(--navy);
  color: #fff;
}

.btn-fl--ink:hover {
  background: #0c141c;
  color: #fff;
}

.btn-fl--lg {
  padding: 1rem 2rem;
  font-size: 1rem;
}

/* --------------------------------------------------------------------------
   Skip link
   -------------------------------------------------------------------------- */

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 1200;
  padding: 0.6rem 1rem;
  background: #fff;
  color: var(--navy);
  font-weight: 600;
}

.skip-link:focus {
  left: 1rem;
  top: 1rem;
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */

.site-header {
  background: var(--paper);
}

/* Left: brand logo. Right: topbar row stacked above the nav row. */
.site-header__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: clamp(1rem, 4vw, 2.5rem);
}

.site-header__stack {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.topbar {
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 1rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.topbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 40px;
}

.topbar__dispatch {
  margin: 0;
  display: flex;
  gap: 0.5rem;
  color: var(--blue);
  font-weight: 500;
}

.topbar__dispatch i {
  font-size: 0.7rem;
  margin-top: 7px;
}

.topbar__dispatch a {
  color: var(--navy);
  text-decoration: none;
}

.topbar__dispatch a:hover {
  color: var(--blue);
}

.topbar__location {
  margin: 0;
  color: var(--blue);
  font-weight: 500;
}

.main-nav {
  padding: 10px 0 0;
  width: 100%;
  min-height: 60px;
  align-items: center;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  flex: none;
  text-decoration: none;
  color: var(--navy);
}

.brand__mark {
  flex: none;
  width: auto;
  height: clamp(84px, 10vw, 112px);
  object-fit: contain;
}

.brand__word {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.brand__name {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 1.6rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.brand__sub {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.15rem;
  font-family: var(--font-brand);
  font-weight: 400;
  font-size: 0.75rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: var(--navy);
}

.brand__sub::before,
.brand__sub::after {
  content: '';
  width: 14px;
  height: 2px;
  background: var(--red);
}

.main-nav__collapse {
  flex-grow: 1;
  align-items: center;
  justify-content: flex-end;
  gap: 2rem;
}

.main-nav__list {
  flex-direction: row;
  gap: 1.75rem;
  margin: 0;
}

.main-nav__list .nav-link {
  padding: 0.6rem 0;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 1.3rem;
  color: var(--navy);
  border-bottom: 2px solid transparent;
}

.main-nav__list .nav-link:hover,
.main-nav__list .nav-link.is-active {
  color: var(--blue);
  border-bottom-color: var(--blue);
}

.main-nav__cta {
  flex: none;
  font-size: 1.2rem;
  padding: 7px 35px;
}

.navbar-toggler {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.6rem;
  border: 1px solid var(--hairline);
  border-radius: 2px;
}

.navbar-toggler:focus {
  box-shadow: none;
}

.navbar-toggler-icon {
  width: 1.6rem;
  height: 1.6rem;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%2317232e' stroke-width='2.5' stroke-linecap='round' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

@media (width >= 992px) {
  .navbar-toggler {
    display: none;
  }
}

/* --------------------------------------------------------------------------
   Section rhythm
   -------------------------------------------------------------------------- */

.section {
  padding-block: clamp(3.5rem, 7vw, 5rem);
}

.section-head {
  display: grid;
  grid-template-columns: minmax(0, 1.17fr) minmax(0, 1fr);
  gap: 2.5rem;
  align-items: start;
  margin-bottom: 3rem;
}

.section-head--stack {
  display: block;
  margin-bottom: 2.5rem;
}

.section-head__intro {
  margin: 0;
  align-self: center;
  color: var(--ink);
  margin-top: 35px;
  text-align: justify;
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, var(--paper-tint), var(--paper) 60%);
}

.hero__inner {
  position: relative;
  z-index: 2;
  padding-block: clamp(2.25rem, 5vw, 3.75rem) clamp(2.5rem, 6vw, 4.5rem);
}

.hero__copy {
  max-width: 620px;
}

.hero__headline {
  margin: 0.5rem 0 1.5rem;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2.9rem, 7.5vw, 5.25rem);
  line-height: 0.9;
  letter-spacing: 0.005em;
  text-transform: uppercase;
}

.hero__line {
  display: block;
  color: #fff;
  -webkit-text-stroke: 2px var(--navy);
}

.hero__line--accent {
  color: var(--blue);
  -webkit-text-stroke: 0;
}

.hero__lead {
  max-width: 30rem;
  margin: 0 0 2rem;
  color: var(--ink);
}

.hero__lead em {
  font-style: italic;
  text-decoration: underline;
  color: var(--navy);
}

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.hero__media {
  position: absolute;
  top: 0;
  right: calc(50% - var(--container) / 2);
  z-index: 1;
}

.hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center right;
  mask-image: linear-gradient(90deg, transparent 0%, #000 32%);
}

/* --------------------------------------------------------------------------
   Services
   -------------------------------------------------------------------------- */

.card-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--gutter);
}

.svc-card {
  position: relative;
  padding: 3.25rem 1.5rem 1.75rem;
  background: var(--navy-panel);
  color: #fff;
  min-height: 260px;
}

.svc-card__num {
  position: absolute;
  top: 0.85rem;
  right: 1rem;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 0.8rem;
  letter-spacing: 0.1em;

  /* Lighter blue than --blue: needs >= 4.5:1 on the navy card (WCAG AA). */
  color: #6ea8ff;
}

.svc-card__title {
  margin: 0 0 1rem;
  font-family: var(--font-brand);
  font-weight: 400;
  font-size: 1.2rem;
  line-height: 1.1;
  text-transform: uppercase;
}

.svc-card__body {
  margin: 0;
  color: var(--muted-on-dark);
  font-size: 1rem;
}

/* --------------------------------------------------------------------------
   Facility
   -------------------------------------------------------------------------- */

.facility__media {
  position: relative;
}

.facility__map {
  width: 100%;
  height: clamp(300px, 34vw, 400px);
  object-fit: cover;

  /* Keep the location pin (~62% across the map) in frame when cropped. */
  object-position: 62% center;
}

.info-card {
  position: absolute;
  left: 1.5rem;
  bottom: 1.5rem;
  width: 288px;
  max-width: calc(100% - 3rem);
  padding: 1.5rem;
  background: var(--navy-panel);
  color: #fff;
}

.info-card__name {
  margin: 0 0 0.75rem;
  font-family: var(--font-brand);
  font-weight: 400;
  font-size: 1.15rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.info-card__address {
  margin: 0 0 1rem;
  font-style: normal;
  line-height: 1.6;
  color: var(--muted-on-dark);
}

.info-card__address a {
  color: var(--muted-on-dark);
  text-decoration: none;
}

.info-card__address a:hover {
  color: #fff;
}

.info-card__link {
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 0.85rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  color: #6ea8ff;
}

.info-card__link:hover {
  color: #fff;
}

/* --------------------------------------------------------------------------
   Fleet
   -------------------------------------------------------------------------- */

.fleet-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--gutter);
}

.vessel-card {
  background: var(--navy-panel);
  color: #fff;
  display: flex;
  flex-direction: column;
}

.vessel-card__figure {
  position: relative;
  margin: 0;
}

.vessel-card__figure img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.vessel-card__badge {
  position: absolute;
  left: 0;
  bottom: -12px;
  padding: 0.4rem 0.9rem;
  background: var(--blue);
  color: #fff;
  font-family: var(--font-brand);
  font-weight: 400;
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.vessel-card__body {
  padding: 1.75rem 1.5rem 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  flex-grow: 1;
}

.vessel-card__name {
  margin: 0;
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: 1.5rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.vessel-card__type {
  margin: 0 0 1rem;
  font-family: var(--font-brand);
  font-weight: 400;
  font-size: 0.8rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #6ea8ff;
}

.spec-grid {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem 1rem;
}

.spec-grid__item dt {
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted-on-dark);
}

.spec-grid__item dd {
  margin: 0.15rem 0 0;
  font-weight: 700;
  font-size: 1.2rem;
}

.vessel-card__link {
  margin-top: auto;
  padding: 1.5rem 0 0;
  border: 0;
  background: none;
  text-align: left;
  font-family: var(--font-brand);
  font-weight: 400;
  font-size: 0.82rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  color: #6ea8ff;
  cursor: pointer;
}

.vessel-card__link:hover {
  color: #fff;
}

/* --------------------------------------------------------------------------
   Waterfront / dock space
   -------------------------------------------------------------------------- */

.waterfront {
  background-color: var(--paper-tint);
  background-image: repeating-linear-gradient(
    -45deg,
    rgb(23 35 46 / 4%) 0,
    rgb(23 35 46 / 4%) 1px,
    transparent 1px,
    transparent 7px
  );
}

.waterfront__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 3rem;
  align-items: start;
}

.waterfront .display-title {
  font-size: clamp(2.3rem, 4.8vw, 3.85rem);
}

.feature-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.feature {
  padding: 1.5rem 1.5rem 1.75rem;
  margin-bottom: 2px;
  background-color: var(--navy);
}

.feature:nth-child(odd) {
  margin-right: 2px;
}

.feature:nth-child(even) {
  padding-left: 1.5rem;
}

.feature__title {
  color: var(--paper) !important;
  margin: 0 0 0.5rem;
  font-family: var(--font-brand);
  font-weight: 400;
  font-size: 1.5rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.feature__body {
  margin: 0;
  font-size: 1rem;
  color: var(--muted-on-dark);
}

.facility-diagram {
  margin: 0;
  margin-top: 1.4rem;
}

.facility-diagram img {
  width: 100%;
  height: auto;
}

/* --------------------------------------------------------------------------
   CTA band
   -------------------------------------------------------------------------- */

.cta-band {
  background: var(--blue);
  color: #fff;
  padding-block: clamp(2.5rem, 5vw, 3.5rem);
}

.cta-band__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.5rem 3rem;
}

.cta-band__lead {
  flex: 1 1 320px;
}

.cta-band__title {
  color: #fff;
}

.cta-band__copy {
  margin: 0.75rem 0 0;
  max-width: 34ch;
}

.cta-band__disp-label {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 0.85rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.cta-band__disp-phone {
  margin: 0.25rem 0 0;
  font-family: var(--font-brand);
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  line-height: 1;
}

.cta-band__disp-phone i {
  font-size: 1.8rem;
  margin-bottom: 3px;
}

.cta-band__disp-phone a {
  color: #fff;
  text-decoration: none;
}

/* --------------------------------------------------------------------------
   Contact modal
   -------------------------------------------------------------------------- */

.contact-modal .modal-content {
  border: 0;
  border-radius: 2px;
  background: var(--navy);
  color: #fff;
}

.contact-modal .modal-header {
  align-items: flex-start;
  gap: 1rem;
  padding: 1.75rem 1.75rem 1rem;
  border-bottom: 1px solid #26333f;
}

.contact-modal .modal-title.display-title {
  color: #fff;
  font-size: clamp(1.9rem, 4vw, 2.6rem);
}

.contact-modal .modal-body {
  padding: 1.5rem 1.75rem 1.75rem;
  background: var(--paper);
}

.contact-modal .btn-close {
  margin: 0 0 0 auto;
  flex: none;
  opacity: 0.85;
}

.contact-modal .btn-close:hover {
  opacity: 1;
}

.contact-modal__copy {
  margin: 0 0 1.5rem;
  color: var(--muted-on-dark);
}

.contact-modal__copy a {
  color: #6ea8ff;
}

.contact-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.contact-form__row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.field label {
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 0.8rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted-on-dark);
}

.field__opt {
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: none;
}

.contact-form .form-control {
  border: 1px solid #33414f;
  border-radius: 2px;
  background: var(--paper);
  color: var(--navy);
  padding: 0.7rem 0.85rem;
}

.contact-form .form-control:focus {
  border-color: var(--blue);
  box-shadow: none;
  background: var(--paper);
  color: var(--navy);
}

.contact-form button[type='submit'] {
  align-self: flex-start;
  margin-top: 0.5rem;
}

.field--honeypot {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* --------------------------------------------------------------------------
   Toasts
   -------------------------------------------------------------------------- */

.fl-toasts {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 1090;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: min(360px, calc(100vw - 2.5rem));
}

.fl-toast {
  border: 0;
  border-left: 4px solid var(--blue);
  border-radius: 2px;
  background: var(--navy);
  color: #fff;
  box-shadow: 0 0.75rem 2rem rgb(14 27 42 / 35%);
}

.fl-toast--error {
  border-left-color: var(--red);
}

.fl-toast__inner {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.9rem 1rem;
}

.fl-toast__icon {
  flex: none;
  display: flex;
  font-size: 1.25rem;
  color: #6ea8ff;
}

.fl-toast--error .fl-toast__icon {
  color: #ff8a8c;
}

.fl-toast__msg {
  margin: 0;
  flex-grow: 1;
  font-size: 0.95rem;
  line-height: 1.4;
}

.fl-toast__close {
  flex: none;
  padding: 0;
  border: 0;
  background: none;
  color: var(--muted-on-dark);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
}

.fl-toast__close:hover {
  color: #fff;
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.site-footer {
  background: var(--navy);
  color: #fff;
  padding-block: 3.5rem 2rem;
  border-top: 1px solid #26333f;
}

.site-footer__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: 2.5rem;
}

.site-footer__brand {
  display: flex;
  align-items: start;
  gap: 0.85rem;
  color: #fff;
}

.site-footer__brand .brand__mark {
  padding: 3px;

  /* background: #fff;
  border-radius: 50%; */
}

.site-footer__brand .brand__name,
.site-footer__brand .brand__sub {
  color: #fff;
}

.site-footer__heading {
  margin: 0 0 1rem;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 0.85rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.cta-band-email {
  font-size: 1.2rem;
  padding: 9px 35px;
}

.site-footer__col ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.site-footer__col a,
.site-footer__linkbtn {
  display: inline-block;
  padding: 0.7rem 0;
  color: var(--muted-on-dark);
  text-decoration: none;
  font-size: 0.95rem;
}

.site-footer__linkbtn {
  border: 0;
  background: none;
  font-family: var(--font-body);
  cursor: pointer;
}

.site-footer__col a:hover,
.site-footer__linkbtn:hover {
  color: #fff;
}

.site-footer__legal {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid #26333f;
  color: var(--muted-on-dark);
  font-size: 0.85rem;
}

.site-footer__legal p {
  margin: 0;
}

.site-footer__legal-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.7rem;
  margin-top: 0.5rem;
}

.site-footer__legal-nav a,
.site-footer__legal-nav .site-footer__linkbtn {
  color: var(--muted-on-dark);
  font-size: 0.85rem;
  text-decoration: none;
}

.site-footer__legal-nav .cookie-settings {
  color: #6ea8ff;
}

.site-footer__legal-nav .cookie-settings:hover {
  color: #fff;
}

.site-footer__legal-nav a:hover,
.site-footer__legal-nav .site-footer__linkbtn:hover {
  color: #fff;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (width <= 1100px) {
  .card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .waterfront__inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.5rem;
  }
}

@media (width <= 991px) {
  html {
    scroll-padding-top: 96px;
  }

  /* Row 1: brand + hamburger. Row 2: full-width topbar, then the nav drawer. */
  .navbar-toggler {
    order: 1;
    margin-left: auto;
  }

  .site-header__stack {
    order: 2;
    flex-basis: 100%;
  }

  .main-nav {
    min-height: 0;
  }

  .main-nav__collapse {
    flex-basis: 100%;
    flex-direction: column;
    padding-block: 0.75rem 1.25rem;
    align-items: stretch;
    gap: 1rem;
  }

  .main-nav__list {
    flex-direction: column;
    gap: 0.25rem;
    margin: 0;
  }

  .main-nav__cta {
    align-self: flex-start;
  }

  .hero__media {
    position: relative;
    right: auto;
    width: 100%;
    height: 260px;
    margin-top: 2rem;
  }

  .hero__media img {
    mask-image: none;
  }

  .section-head {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
    margin-bottom: 2.25rem;
  }

  .section-head__intro {
    align-self: start;
    max-width: 46ch;
  }

  .fleet-grid {
    grid-template-columns: minmax(0, 1fr);
    max-width: 420px;
  }

  .contact-form__row {
    grid-template-columns: minmax(0, 1fr);
  }

  .info-card {
    position: static;
    width: 100%;
    max-width: none;
  }
}

@media (width <= 620px) {
  .brand__mark {
    height: 64px;
  }

  .facility__map {
    height: 200px;
  }

  .topbar {
    font-size: 0.82rem;
  }

  .topbar__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.1rem;
    padding-block: 0.35rem;
    min-height: 0;
  }

  .card-grid,
  .feature-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .svc-card {
    min-height: 0;
    padding-block: 2.75rem 1.5rem;
  }

  .feature:nth-child(odd) {
    border-right: 0;
  }

  .hero__headline {
    font-size: clamp(2.4rem, 11vw, 3rem);
  }

  .hero__line {
    padding-bottom: 3px;
  }

  .cta-band__inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .cta-band__lead {
    flex: 1 1 170px;
  }

  .site-footer__col a {
    padding: 0.4rem 0;
  }
}

/* --------------------------------------------------------------------------
   reCAPTCHA
   -------------------------------------------------------------------------- */

.grecaptcha-badge {
  visibility: hidden;
}

.contact-modal__legal {
  margin: 1.25rem 0 0;
  font-size: 0.8rem;
  line-height: 1.4;
  color: var(--muted-on-dark);
}

.contact-modal__legal a {
  color: #6ea8ff;
}

/* --------------------------------------------------------------------------
   Vessel specification modal
   -------------------------------------------------------------------------- */

.vessel-modal .modal-content {
  border: 0;
  border-radius: 2px;
  background: var(--paper);
  color: var(--ink);
}

.vessel-modal .modal-header {
  align-items: flex-start;
  gap: 1rem;
  padding: 1.5rem 1.5rem 1.25rem;
  border-bottom: 1px solid var(--hairline);
}

.vessel-modal .modal-title.display-title {
  margin: 0.15rem 0;
  color: var(--navy);
  font-size: clamp(1.9rem, 4vw, 2.6rem);
}

.vessel-modal__type {
  margin: 0.35rem 0 0;
  color: var(--muted-on-light);
  font-size: 0.95rem;
}

.vessel-modal__badge {
  display: inline-block;
  margin-right: 0.4rem;
  padding: 0.15rem 0.55rem;
  background: var(--blue);
  color: #fff;
  font-family: var(--font-brand);
  font-size: 0.72rem;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.vessel-modal .modal-body {
  padding: 0.5rem 1.5rem;
}

.vessel-modal__body {
  display: grid;
  gap: 1.5rem;
  align-items: start;
}

.vessel-modal__body .container {
  padding: 0;
}

.vessel-modal__photo {
  width: 65%;
  height: auto;
  border-radius: 4px;
}

.vessel-modal__table {
  font-size: 0.8rem;
}

.vessel-modal__table tr td:first-child:nth-last-child(2) {
  background-color: #f8f9fa;
  width: 40%;
}

.vessel-spec {
  margin: 0;
}

.spec-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--hairline);
}

.spec-row:last-child {
  border-bottom: 0;
}

.spec-row dt {
  color: var(--muted-on-light);
  font-size: 0.9rem;
}

.spec-row dd {
  margin: 0;
  color: var(--navy);
  font-weight: 700;
  text-align: right;
}

.vessel-modal__footer {
  gap: 1rem;
  justify-content: end;
  padding: 1.25rem 1.5rem;
  border-top: 1px solid var(--hairline);
}

.vessel-modal__footer > * {
  margin: 0;
}

.vessel-modal__contact-copy {
  color: var(--muted-on-light);
  font-size: 0.9rem;
}

.who-we-are__list {
  list-style: none;
  margin: 0;
  padding: 0;
  padding-left: 1.5rem;
}

.who-we-are__list li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

.who-we-are__list i {
  margin-right: 0.65rem;
  color: var(--red);
}

@media (width <= 640px) {
  .vessel-modal__body {
    grid-template-columns: minmax(0, 1fr);
  }

  .vessel-modal__photo {
    width: 100%;
  }

  .vessel-modal__footer {
    flex-direction: column;
    align-items: stretch;
  }
}

/* --------------------------------------------------------------------------
   Icons (Bootstrap Icons v1.13.1, CSS mask — no font, no request)
   -------------------------------------------------------------------------- */

.bi {
  display: inline-block;
  width: 1em;
  height: 1em;
  background-color: currentcolor;
  -webkit-mask: var(--bi) no-repeat center / contain;
  mask: var(--bi) no-repeat center / contain;
  vertical-align: -0.125em;
  flex: none;
}

.svc-card__icon {
  display: block;
  margin-bottom: 0.75rem;
  font-size: 1.75rem;
  color: var(--blue);
}

.feature__title .bi {
  margin-right: 0.4em;
  color: var(--blue);
}

.bi-file-arrow-down {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M8 5a.5.5 0 0 1 .5.5v3.793l1.146-1.147a.5.5 0 0 1 .708.708l-2 2a.5.5 0 0 1-.708 0l-2-2a.5.5 0 1 1 .708-.708L7.5 9.293V5.5A.5.5 0 0 1 8 5'/%3E %3Cpath d='M4 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zm0 1h8a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1'/%3E %3C/svg%3E");
}

.bi-arrow-right {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8'/%3E %3C/svg%3E");
}

.bi-check-circle-fill {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z'/%3E %3C/svg%3E");
}

.bi-exclamation-triangle-fill {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5m.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2'/%3E %3C/svg%3E");
}

.bi-telephone-fill {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M1.885.511a1.745 1.745 0 0 1 2.61.163L6.29 2.98c.329.423.445.974.315 1.494l-.547 2.19a.68.68 0 0 0 .178.643l2.457 2.457a.68.68 0 0 0 .644.178l2.189-.547a1.75 1.75 0 0 1 1.494.315l2.306 1.794c.829.645.905 1.87.163 2.611l-1.034 1.034c-.74.74-1.846 1.065-2.877.702a18.6 18.6 0 0 1-7.01-4.42 18.6 18.6 0 0 1-4.42-7.009c-.362-1.03-.037-2.137.703-2.877z'/%3E %3C/svg%3E");
}

.bi-geo-alt-fill {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10m0-7a3 3 0 1 1 0-6 3 3 0 0 1 0 6'/%3E %3C/svg%3E");
}

.bi-envelope-fill {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414zM0 4.697v7.104l5.803-3.558zM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586zm3.436-.586L16 11.801V4.697z'/%3E %3C/svg%3E");
}

.bi-life-preserver {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m6.43-5.228a7.03 7.03 0 0 1-3.658 3.658l-1.115-2.788a4 4 0 0 0 1.985-1.985zM5.228 14.43a7.03 7.03 0 0 1-3.658-3.658l2.788-1.115a4 4 0 0 0 1.985 1.985zm9.202-9.202-2.788 1.115a4 4 0 0 0-1.985-1.985l1.115-2.788a7.03 7.03 0 0 1 3.658 3.658m-8.087-.87a4 4 0 0 0-1.985 1.985L1.57 5.228A7.03 7.03 0 0 1 5.228 1.57zM8 11a3 3 0 1 1 0-6 3 3 0 0 1 0 6'/%3E %3C/svg%3E");
}

.bi-tools {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M1 0 0 1l2.2 3.081a1 1 0 0 0 .815.419h.07a1 1 0 0 1 .708.293l2.675 2.675-2.617 2.654A3.003 3.003 0 0 0 0 13a3 3 0 1 0 5.878-.851l2.654-2.617.968.968-.305.914a1 1 0 0 0 .242 1.023l3.27 3.27a.997.997 0 0 0 1.414 0l1.586-1.586a.997.997 0 0 0 0-1.414l-3.27-3.27a1 1 0 0 0-1.023-.242L10.5 9.5l-.96-.96 2.68-2.643A3.005 3.005 0 0 0 16 3q0-.405-.102-.777l-2.14 2.141L12 4l-.364-1.757L13.777.102a3 3 0 0 0-3.675 3.68L7.462 6.46 4.793 3.793a1 1 0 0 1-.293-.707v-.071a1 1 0 0 0-.419-.814zm9.646 10.646a.5.5 0 0 1 .708 0l2.914 2.915a.5.5 0 0 1-.707.707l-2.915-2.914a.5.5 0 0 1 0-.708M3 11l.471.242.529.026.287.445.445.287.026.529L5 13l-.242.471-.026.529-.445.287-.287.445-.529.026L3 15l-.471-.242L2 14.732l-.287-.445L1.268 14l-.026-.529L1 13l.242-.471.026-.529.445-.287.287-.445.529-.026z'/%3E %3C/svg%3E");
}

.bi-shield-check {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M5.338 1.59a61 61 0 0 0-2.837.856.48.48 0 0 0-.328.39c-.554 4.157.726 7.19 2.253 9.188a10.7 10.7 0 0 0 2.287 2.233c.346.244.652.42.893.533q.18.085.293.118a1 1 0 0 0 .101.025 1 1 0 0 0 .1-.025q.114-.034.294-.118c.24-.113.547-.29.893-.533a10.7 10.7 0 0 0 2.287-2.233c1.527-1.997 2.807-5.031 2.253-9.188a.48.48 0 0 0-.328-.39c-.651-.213-1.75-.56-2.837-.855C9.552 1.29 8.531 1.067 8 1.067c-.53 0-1.552.223-2.662.524zM5.072.56C6.157.265 7.31 0 8 0s1.843.265 2.928.56c1.11.3 2.229.655 2.887.87a1.54 1.54 0 0 1 1.044 1.262c.596 4.477-.787 7.795-2.465 9.99a11.8 11.8 0 0 1-2.517 2.453 7 7 0 0 1-1.048.625c-.28.132-.581.24-.829.24s-.548-.108-.829-.24a7 7 0 0 1-1.048-.625 11.8 11.8 0 0 1-2.517-2.453C1.928 10.487.545 7.169 1.141 2.692A1.54 1.54 0 0 1 2.185 1.43 63 63 0 0 1 5.072.56'/%3E %3Cpath d='M10.854 5.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 7.793l2.646-2.647a.5.5 0 0 1 .708 0'/%3E %3C/svg%3E");
}

.bi-clipboard-check {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M10.854 7.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 9.793l2.646-2.647a.5.5 0 0 1 .708 0'/%3E %3Cpath d='M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1z'/%3E %3Cpath d='M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0z'/%3E %3C/svg%3E");
}

.bi-water {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M.036 3.314a.5.5 0 0 1 .65-.278l1.757.703a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.757-.703a.5.5 0 1 1 .372.928l-1.758.703a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0L.314 3.964a.5.5 0 0 1-.278-.65m0 3a.5.5 0 0 1 .65-.278l1.757.703a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.757-.703a.5.5 0 1 1 .372.928l-1.758.703a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0L.314 6.964a.5.5 0 0 1-.278-.65m0 3a.5.5 0 0 1 .65-.278l1.757.703a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.757-.703a.5.5 0 1 1 .372.928l-1.758.703a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0L.314 9.964a.5.5 0 0 1-.278-.65m0 3a.5.5 0 0 1 .65-.278l1.757.703a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.014-.406a2.5 2.5 0 0 1 1.857 0l1.015.406a1.5 1.5 0 0 0 1.114 0l1.757-.703a.5.5 0 1 1 .372.928l-1.758.703a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0l-1.014-.406a1.5 1.5 0 0 0-1.114 0l-1.015.406a2.5 2.5 0 0 1-1.857 0l-1.757-.703a.5.5 0 0 1-.278-.65'/%3E %3C/svg%3E");
}

.bi-arrows-fullscreen {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath fill-rule='evenodd' d='M5.828 10.172a.5.5 0 0 0-.707 0l-4.096 4.096V11.5a.5.5 0 0 0-1 0v3.975a.5.5 0 0 0 .5.5H4.5a.5.5 0 0 0 0-1H1.732l4.096-4.096a.5.5 0 0 0 0-.707m4.344 0a.5.5 0 0 1 .707 0l4.096 4.096V11.5a.5.5 0 1 1 1 0v3.975a.5.5 0 0 1-.5.5H11.5a.5.5 0 0 1 0-1h2.768l-4.096-4.096a.5.5 0 0 1 0-.707m0-4.344a.5.5 0 0 0 .707 0l4.096-4.096V4.5a.5.5 0 1 0 1 0V.525a.5.5 0 0 0-.5-.5H11.5a.5.5 0 0 0 0 1h2.768l-4.096 4.096a.5.5 0 0 0 0 .707m-4.344 0a.5.5 0 0 1-.707 0L1.025 1.732V4.5a.5.5 0 0 1-1 0V.525a.5.5 0 0 1 .5-.5H4.5a.5.5 0 0 1 0 1H1.732l4.096 4.096a.5.5 0 0 1 0 .707'/%3E %3C/svg%3E");
}

.bi-shield-lock {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M5.338 1.59a61 61 0 0 0-2.837.856.48.48 0 0 0-.328.39c-.554 4.157.726 7.19 2.253 9.188a10.7 10.7 0 0 0 2.287 2.233c.346.244.652.42.893.533q.18.085.293.118a1 1 0 0 0 .101.025 1 1 0 0 0 .1-.025q.114-.034.294-.118c.24-.113.547-.29.893-.533a10.7 10.7 0 0 0 2.287-2.233c1.527-1.997 2.807-5.031 2.253-9.188a.48.48 0 0 0-.328-.39c-.651-.213-1.75-.56-2.837-.855C9.552 1.29 8.531 1.067 8 1.067c-.53 0-1.552.223-2.662.524zM5.072.56C6.157.265 7.31 0 8 0s1.843.265 2.928.56c1.11.3 2.229.655 2.887.87a1.54 1.54 0 0 1 1.044 1.262c.596 4.477-.787 7.795-2.465 9.99a11.8 11.8 0 0 1-2.517 2.453 7 7 0 0 1-1.048.625c-.28.132-.581.24-.829.24s-.548-.108-.829-.24a7 7 0 0 1-1.048-.625 11.8 11.8 0 0 1-2.517-2.453C1.928 10.487.545 7.169 1.141 2.692A1.54 1.54 0 0 1 2.185 1.43 63 63 0 0 1 5.072.56'/%3E %3Cpath d='M9.5 6.5a1.5 1.5 0 0 1-1 1.415l.385 1.99a.5.5 0 0 1-.491.595h-.788a.5.5 0 0 1-.49-.595l.384-1.99a1.5 1.5 0 1 1 2-1.415'/%3E %3C/svg%3E");
}

.bi-box-seam {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M8.186 1.113a.5.5 0 0 0-.372 0L1.846 3.5l2.404.961L10.404 2zm3.564 1.426L5.596 5 8 5.961 14.154 3.5zm3.25 1.7-6.5 2.6v7.922l6.5-2.6V4.24zM7.5 14.762V6.838L1 4.239v7.923zM7.443.184a1.5 1.5 0 0 1 1.114 0l7.129 2.852A.5.5 0 0 1 16 3.5v8.662a1 1 0 0 1-.629.928l-7.185 2.874a.5.5 0 0 1-.372 0L.63 13.09a1 1 0 0 1-.63-.928V3.5a.5.5 0 0 1 .314-.464z'/%3E %3C/svg%3E");
}

.bi-filetype-pdf {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M14 4.5V14a2 2 0 0 1-2 2h-1v-1h1a1 1 0 0 0 1-1V4.5h-2A1.5 1.5 0 0 1 9.5 3V1H4a1 1 0 0 0-1 1v9H2V2a2 2 0 0 1 2-2h5.5zM1.6 11.85H0v3.999h.791v-1.342h.803q.43 0 .732-.173.305-.175.463-.474a1.4 1.4 0 0 0 .161-.677q0-.375-.158-.677a1.2 1.2 0 0 0-.46-.477q-.3-.18-.732-.179m.545 1.333a.8.8 0 0 1-.085.38.57.57 0 0 1-.238.241.8.8 0 0 1-.375.082H.788V12.48h.66q.327 0 .512.181.185.183.185.522m1.217-1.333v3.999h1.46q.602 0 .998-.237a1.45 1.45 0 0 0 .595-.689q.196-.45.196-1.084 0-.63-.196-1.075a1.43 1.43 0 0 0-.589-.68q-.396-.234-1.005-.234zm.791.645h.563q.371 0 .609.152a.9.9 0 0 1 .354.454q.118.302.118.753a2.3 2.3 0 0 1-.068.592 1.1 1.1 0 0 1-.196.422.8.8 0 0 1-.334.252 1.3 1.3 0 0 1-.483.082h-.563zm3.743 1.763v1.591h-.79V11.85h2.548v.653H7.896v1.117h1.606v.638z'/%3E %3C/svg%3E");
}

.bi-pentagon-fill {
  --bi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E %3Cpath d='M7.685.256a.5.5 0 0 1 .63 0l7.421 6.03a.5.5 0 0 1 .162.538l-2.788 8.827a.5.5 0 0 1-.476.349H3.366a.5.5 0 0 1-.476-.35L.102 6.825a.5.5 0 0 1 .162-.538l7.42-6.03Z'/%3E %3C/svg%3E");
}

/* --------------------------------------------------------------------------
   Cookie consent banner
   -------------------------------------------------------------------------- */

.cc-banner {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1100;
  background: var(--navy);
  color: #fff;
  border-top: 3px solid var(--blue);
  box-shadow: 0 -0.5rem 1.5rem rgb(8 23 45 / 35%);
}

.cc-banner__inner {
  max-width: var(--container);
  margin-inline: auto;
  padding: 1.25rem var(--gutter);
  display: grid;
  gap: 0.75rem 2rem;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.cc-banner__title {
  grid-column: 1;
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.cc-banner__text {
  grid-column: 1;
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.45;
  color: var(--muted-on-dark);
}

.cc-banner__text a {
  color: #6ea8ff;
}

.cc-cats {
  grid-column: 1;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1.5rem;
  font-size: 0.9rem;
}

.cc-cats label {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  cursor: pointer;
}

.cc-cats input[disabled] {
  cursor: default;
}

.cc-cats em {
  font-style: normal;
  font-size: 0.78rem;
  color: var(--muted-on-dark);
}

.cc-actions {
  grid-column: 2;
  grid-row: 1 / span 3;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-self: center;
}

.cc-btn {
  white-space: nowrap;
}

.bordered {
  color: var(--muted-on-dark);
  border-color: var(--muted-on-dark);
}

.bordered:hover {
  border-color: var(--muted-on-light);
}

@media (width <= 720px) {
  .cc-banner__inner {
    grid-template-columns: minmax(0, 1fr);
  }

  .cc-actions {
    grid-column: 1;
    grid-row: auto;
    flex-flow: row wrap;
  }

  .cc-btn {
    flex: 1 1 auto;
  }
}

/* --------------------------------------------------------------------------
   Legal pages (Cookie Policy, Terms, Privacy)
   -------------------------------------------------------------------------- */

.legal-header {
  background: var(--paper);
  border-bottom: 1px solid var(--hairline);
  padding-block: 0.75rem;
}

.legal-header .brand__mark {
  height: 72px;
}

.legal {
  padding-block: clamp(0.7rem, 6vw, 1.5rem);
}

.legal__inner {
  max-width: 72ch;
}

.legal__draft {
  margin: 0 0 2rem;
  padding: 0.85rem 1rem;
  border-left: 4px solid var(--red);
  background: var(--paper-tint);
  font-size: 0.9rem;
  line-height: 1.5;
}

.legal h1 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2.7rem, 6.2vw, 4.2rem);
  line-height: 1;
  text-transform: uppercase;
  color: var(--navy);
  margin: 0 0 0.5rem;
}

.legal__updated {
  margin: 0 0 2.5rem;
  color: var(--muted-on-light);
  font-size: 0.9rem;
}

.legal h2 {
  margin: 2rem 0 1rem;
  font-family: var(--font-ui);
  font-weight: 600;
  font-size: 1.18rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--blue);
}

.legal h3 {
  font-family: var(--font-ui);
  font-weight: 600;
  font-size: 1.2rem;
  color: var(--navy);
  margin: 1.5rem 0 0.5rem;
}

.legal p,
.legal li {
  line-height: 1.15;
}

.legal ul,
.legal ol {
  padding-left: 1.25rem;
  margin-left: 2rem;
  margin-top: 2rem;
  margin-bottom: 3rem;
}

.legal li + li {
  margin-top: 0.35rem;
}

.legal a {
  color: var(--blue);
}

.legal__table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0 1.5rem;
  font-size: 0.9rem;
}

.legal__table caption {
  caption-side: top;
  text-align: left;
  font-weight: 600;
  margin-bottom: 0.5rem;
}

.legal__table th,
.legal__table td {
  border: 1px solid var(--hairline);
  padding: 0.5rem 0.65rem;
  text-align: left;
  vertical-align: top;
}

.legal__table th {
  background: var(--paper-tint);
}

.legal__contact {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--hairline);
}

/* ---- Legal modal ---- */
.legal-modal .modal-body .legal--modal {
  max-width: none;
  padding-block: 0;
}

.legal--modal > :first-child {
  margin-top: 0;
}

.legal-modal__loading {
  margin: 0;
  padding: 2rem 0;
  text-align: center;
  color: var(--muted-on-light);
  font-size: 0.9rem;
}

.legal-modal__fullpage {
  color: var(--blue);
  font-weight: 400;
  text-decoration: underline;
}

.legal-modal .modal-header .display-title {
  font-size: clamp(2.7rem, 6.2vw, 4.2rem);
}

.legal .hero__inner a {
  text-decoration: none;
}

.legal .hero__inner a:hover {
  text-decoration: underline;
}

.legal ul.cookie-choices {
  list-style-type: none;
  margin: 0;
  margin: 2rem 0;
  padding-left: 0;
}

.legal ul.cookie-choices li {
  line-height: 1.15;
  margin-bottom: 0.75rem;
}