/* Shared finishing rules and the static photographic opening. */
:root { --ink: #14283e; --blue: #255fd8; --orange: #ff794b; --muted: #5e7182; }
html { scroll-padding-top: 110px; }
.container { width: min(1320px, calc(100% - 112px)); }
.site-header { position: sticky; top: 0; background: #fff; }
.site-header::after { position: absolute; bottom: 0; left: 0; width: var(--reading-progress, 0%); height: 2px; content: ""; background: var(--orange); pointer-events: none; }
.header-inner { height: 96px; }
.navigation-link { font-size: 12px; }
.navigation-link.is-section-active::after { transform: scaleX(1); }
.navigation-link.is-section-active { color: var(--ink); }
.ocean-home .site-header { position: fixed; inset: 0 0 auto; z-index: 20; color: #fff; background: transparent; transition: background .25s ease, color .25s ease; }
.ocean-home .header-inner { height: 98px; border-bottom-color: rgba(255,255,255,.26); transition: height .25s ease; }
.ocean-home .brand { gap: 13px; }
.brand-ocean-mark { display: block; flex-shrink: 0; width: 62px; height: 24px; color: inherit; overflow: hidden; mix-blend-mode: normal; }
/* Explicit filter colors keep the original mark visible when mobile browsers repaint the sticky header. */
.ocean-home .site-header .brand { color: #fff; }
.ocean-home .site-header .brand-ocean-mark feFlood { flood-color: #fff; }
.ocean-home .brand-name strong { font-size: 21px; }
.ocean-home .navigation-link { color: #e5edf2; }
.ocean-home .navigation-link.is-current, .ocean-home .navigation-link:hover, .ocean-home .navigation-link.is-section-active, .ocean-home .header-contact { color: #fff; }
.ocean-home .navigation-link::after { background: currentColor; }
.ocean-home .header-contact { padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.45); }
.ocean-home .site-header.is-scrolled { color: #14283e; background: #fff; box-shadow: 0 1px 0 #dbe4ea; }
.ocean-home .site-header.is-scrolled .brand { color: #142238; }
.ocean-home .site-header.is-scrolled .brand-ocean-mark feFlood { flood-color: #142238; }
.ocean-home .site-header.is-scrolled .header-inner { height: 80px; border-bottom: 0; }
.ocean-home .site-header.is-scrolled .navigation-link { color: #5f7181; }
.ocean-home .site-header.is-scrolled .navigation-link:hover, .ocean-home .site-header.is-scrolled .navigation-link.is-section-active, .ocean-home .site-header.is-scrolled .header-contact { color: #14283e; }
.ocean-home .site-header.is-scrolled .header-contact { border-bottom-color: #bac8d4; }
.ocean-home .skip-link:focus { background: #fff; color: #14283e; }
.hero.ocean-hero { position: relative; isolation: isolate; display: flex; flex-direction: column; min-height: clamp(700px, 100svh, 980px); padding: 0; overflow: hidden; color: #fff; background: #061b2e; }
.ocean-media { position: absolute; z-index: -3; inset: 0; }
.ocean-photo { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; animation: none; transform: none; filter: none; }
.ocean-shade { position: absolute; z-index: -2; inset: 0; background: linear-gradient(90deg, rgba(2,15,29,.62), rgba(2,16,30,.38) 47%, rgba(3,21,37,.09)), linear-gradient(180deg, rgba(3,16,29,.38), transparent 34%, transparent 68%, rgba(3,17,30,.3)); }
.ocean-content { position: relative; display: flex; flex: 1; align-items: center; padding: 155px 0 135px; }
.ocean-copy { width: 100%; }
.ocean-eyebrow { display: flex; align-items: center; gap: 13px; margin: 0 0 30px; color: #dbe8f2; font-size: 10px; font-weight: 600; letter-spacing: .14em; line-height: 1.7; }
.ocean-eyebrow > span { flex: 0 0 27px; height: 2px; background: #ff9164; }
.hero.ocean-hero h1 { margin: 0; max-width: 1160px; color: #fff; font-size: clamp(60px, 6.2vw, 94px); line-height: 1.09; font-weight: 460; letter-spacing: -.059em; }
.ocean-title-line { display: block; }
.ocean-title-brand { font-weight: 730; }
.ocean-title-brand > span { color: #ff9164; }
.ocean-copy-bottom { margin-top: 29px; }
.ocean-description { max-width: 470px; margin: 0; color: #e3ecf4; font-size: 15px; line-height: 1.85; letter-spacing: -.013em; }
.ocean-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 28px; margin-top: 28px; }
.ocean-cta { min-height: 59px; padding: 0 0 0 23px; border-radius: 2px; gap: 29px; color: #12283e; background: #fff; font-size: 12px; }
.ocean-cta > span { display: grid; place-items: center; width: 57px; height: 57px; border-left: 1px solid #d5e0e9; }
.ocean-cta svg, .ocean-work-link svg { width: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.4; transition: transform .25s ease; }
.ocean-cta:hover { background: #e9f1fc; }
.ocean-cta:hover svg { transform: translateX(3px); }
.ocean-work-link { display: inline-flex; align-items: center; min-height: 45px; gap: 11px; border-bottom: 1px solid #acbac6; color: #fff; font-size: 12px; }
.ocean-work-link svg { width: 15px; }
.ocean-work-link:hover svg { transform: translate(2px,-2px); }
.ocean-hero :focus-visible, .ocean-home .site-header :focus-visible { outline-color: #ffae86; }

/* The original mark has a role here: it anchors the story behind the name. */
.brand-chapter { padding: 120px 0; background: #fff; scroll-margin-top: 100px; }
.brand-chapter-layout { display: grid; grid-template-columns: 1fr .95fr; gap: clamp(65px, 7vw, 115px); align-items: center; }
.brand-board { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 28px; aspect-ratio: 1 / .9; margin: 0; padding: 34px; color: #fff; background: #102a47; overflow: hidden; }
.brand-board-lines { position: absolute; inset: 8% -8% auto; width: 116%; height: auto; fill: none; stroke: #5b7690; stroke-width: .8; opacity: .28; }
.brand-board-mark { position: relative; width: 82%; height: auto; overflow: hidden; }
.brand-board figcaption { position: relative; color: #fff; font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; text-align: center; }
.brand-chapter-copy .section-kicker { margin: 0 0 27px; color: #5d748c; font-size: 10px; }
.brand-chapter-copy h2 { margin: 0; color: #14283e; font-size: clamp(40px, 4vw, 58px); font-weight: 530; line-height: 1.1; letter-spacing: -.054em; }
.brand-chapter-copy h2 > span { color: var(--blue); }
.brand-chapter-copy > p:not(.section-kicker) { max-width: 48ch; margin: 20px 0 0; color: #627486; font-size: 14px; line-height: 1.9; text-wrap: pretty; }
.brand-chapter-copy > .brand-chapter-lead { margin-top: 29px !important; color: #29465f !important; font-size: 18px !important; line-height: 1.75 !important; }

.quality-chapter { padding: 85px 0 96px; color: #14283e; background: #f1f5f8; }
.quality-heading { padding-bottom: 35px; border-bottom: 1px solid #d4dfe8; }
.quality-heading .section-kicker { margin: 0 0 20px; font-size: 10px; letter-spacing: .13em; color: #59718a; }
.quality-heading h2 { margin: 0; font-size: clamp(32px, 3.15vw, 45px); line-height: 1.2; font-weight: 520; letter-spacing: -.043em; }
.quality-heading h2 > span { color: var(--orange); }
.quality-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 60px; margin-top: 42px; }
.quality-item { min-width: 0; }
.quality-item h3 { margin: 0 0 17px; font-size: clamp(21px, 2.15vw, 29px); line-height: 1.25; font-weight: 520; letter-spacing: -.038em; }
.quality-item > p { margin: 0; color: #5e7286; font-size: 14px; line-height: 1.85; text-wrap: pretty; }

.process-refined { padding: 112px 0 106px; background: #fff; scroll-margin-top: 100px; }
.process-refined-layout { display: block; }
.process-refined-intro { max-width: 900px; margin-bottom: 38px; }
.process-refined-intro .section-kicker { margin: 0 0 27px; color: #5e748a; font-size: 10px; }
.process-refined-intro h2 { margin: 0; font-size: clamp(39px,4vw,59px); line-height: 1.12; font-weight: 520; letter-spacing: -.048em; }
.process-refined-intro h2 > span { color: var(--orange); }
.process-refined-intro > p:not(.section-kicker) { margin: 22px 0 0; color: #607487; font-size: 16px; line-height: 1.85; }
.process-refined-intro .section-text-link { min-height: 44px; font-size: 12px; }
.process-refined-steps { border-top: 1px solid #cbd8e3; }
.process-disclosure { border-bottom: 1px solid #cbd8e3; }
.process-disclosure summary { display: grid; grid-template-columns: 34px 1fr 22px; align-items: center; gap: 21px; padding: 24px 0; min-height: 88px; list-style: none; cursor: pointer; }
.process-disclosure summary::-webkit-details-marker { display: none; }
.process-disclosure summary::marker { content: ""; }
.process-disclosure-number { color: #668098; font-size: 12px; font-variant-numeric: tabular-nums; }
.process-disclosure-title strong { display: block; color: #1b354d; font-size: 22px; font-weight: 540; line-height: 1.4; letter-spacing: -.035em; }
.process-disclosure[open] .process-disclosure-title strong { color: #255fd8; }
.process-disclosure-toggle { position: relative; width: 22px; height: 22px; }
.process-disclosure-toggle::before, .process-disclosure-toggle::after { position: absolute; top: 10px; left: 4px; width: 14px; height: 1px; background: #5b748a; content: ""; }
.process-disclosure-toggle::after { rotate: 90deg; transition: rotate .25s ease; }
.process-disclosure[open] .process-disclosure-toggle::after { rotate: 0deg; }
.process-disclosure-content { max-width: 800px; padding: 0 30px 28px 55px; }
.process-disclosure-content > p { margin: 0; color: #607487; font-size: 15px; line-height: 1.9; }

.faq-section { padding: 70px 0 88px; background: #f7f9fb; }
.faq-layout { display: block; padding-top: 0; border-top: 0; }
.faq-heading { margin-bottom: 38px; }
.faq-heading h2 { font-size: clamp(38px,3.65vw,54px); }
.faq-heading .section-kicker { font-size: 10px; }
.faq-list { background: transparent; }
.faq-item[open] { background: #fff; }
.faq-item summary { padding: 23px 18px; font-size: 15px; }
.faq-item:first-child { border-top-color: #ccd8e4; }
.faq-answer p { padding: 0 24px 25px 18px; font-size: 14px; }
.contact-section-navy { padding-block: 108px; background: #0c223b; }
.contact-section-navy .contact-section-layout { display: block; }
.contact-section-navy .contact-section-copy { max-width: 880px; margin-bottom: 35px; }
.contact-section-navy .contact-section-copy > p:not(.section-kicker) { max-width: 65ch; }
.contact-section-navy .contact-section-form { max-width: 920px; }
.contact-section-navy .contact-section-copy h2 { font-size: clamp(43px,4.2vw,61px); }
.contact-section-navy .contact-section-form { padding: 44px; border-radius: 2px; }
.contact-section-navy .institutional-form input, .contact-section-navy .institutional-form select, .contact-section-navy .institutional-form textarea { min-height: 48px; background: #fbfcfe; }
.contact-section-navy .institutional-form input:focus, .contact-section-navy .institutional-form select:focus, .contact-section-navy .institutional-form textarea:focus { border-color: var(--blue); }
.contact-section-navy .institutional-form [aria-invalid="true"], .contact-section-navy .institutional-form [aria-invalid="true"]:focus { border-color: #a14236; }
.institutional-form label { color: #2d465d; }
.institutional-form textarea { line-height: 1.7; }
.institutional-form .button { border-radius: 2px; }
.contact-page { gap: 105px; padding-block: 80px 108px; align-items: start; }
.contact-page-copy h1 { font-size: clamp(48px,5vw,72px); font-weight: 550; letter-spacing: -.055em; }
.contact-page .contact-form-panel { padding: 40px; border: 1px solid #d7e1ea; border-top: 3px solid #ff794b; background: #f7f9fc; border-radius: 2px; }
.contact-page .form-panel-heading h2 { font-size: 29px; }
.contact-page .form-panel-heading p { font-size: 13px; }
.site-footer .footer-main { padding-block: 65px; }
.footer-brand-column > p { font-size: 18px; line-height: 1.6; }
.footer-main h2 { font-size: 12px; }
.footer-links a { font-size: 12px; }

@media (max-width: 1190px) {
  .container { width: calc(100% - 80px); }
  .ocean-home .navigation { gap: 30px; }
  .ocean-home .navigation-links { gap: 17px; }
  .brand-chapter-layout { gap: 60px; }
  .brand-board { padding: 26px; }
  .quality-grid { gap: 40px; }
  .process-disclosure-title strong { font-size: 20px; }
  .contact-section-navy .contact-section-layout { gap: 60px; }
  .contact-section-navy .contact-section-form { padding: 33px; }
  .contact-page { gap: 60px; }
}
@media (max-width: 1020px) {
  .navigation { max-height: calc(100dvh - 112px); overflow-y: auto; overscroll-behavior: contain; }
  .ocean-home .menu-toggle { border-color: rgba(255,255,255,.45); color: #fff; background: transparent; }
  .ocean-home .menu-toggle span { background: currentColor; }
  .ocean-home .navigation { top: 87px; background: #102a47; border-color: #42607d; }
  .ocean-home .navigation-link, .ocean-home .site-header.is-scrolled .navigation-link { color: #e7eff7; font-size: 15px; }
  .ocean-home .navigation-link:hover, .ocean-home .site-header.is-scrolled .navigation-link:hover, .ocean-home .site-header.is-scrolled .navigation-link.is-section-active, .ocean-home .site-header.is-scrolled .header-contact { color: #fff; }
  .ocean-home .header-contact { border-bottom: 0; border-top-color: #4d6580; }
  .ocean-home .site-header.is-scrolled .menu-toggle { border-color: #b5c7d7; color: #14283e; }
  .ocean-home .site-header.is-scrolled .navigation { top: 72px; }
  .brand-chapter { padding-block: 90px; }
  .brand-chapter-layout { gap: 44px; }
  .brand-chapter-copy h2 { font-size: 40px; }
  .brand-chapter-copy > .brand-chapter-lead { font-size: 16px !important; }
  .brand-board { aspect-ratio: 1 / 1.15; }
  .quality-heading h2 { font-size: 34px; }
  .quality-grid { gap: 30px; }
  .quality-item h3 { font-size: 23px; }
  .process-refined { padding-block: 90px; }
  .process-refined-intro h2 { font-size: 40px; }
  .process-disclosure summary { gap: 14px; grid-template-columns: 26px 1fr 20px; }
  .process-disclosure-content { padding-left: 40px; padding-right: 15px; }
  .faq-layout { gap: 45px; }
  .contact-section-navy .contact-section-layout { gap: 40px; }
  .contact-section-navy .contact-section-copy h2 { font-size: 40px; }
  .contact-page { gap: 40px; }
  .contact-page .contact-form-panel { padding: 28px; }
}
@media (max-width: 760px) {
  html { scroll-padding-top: 94px; }
  .container { width: calc(100% - 40px); }
  .header-inner, .ocean-home .header-inner { height: 84px; }
  .ocean-home .site-header.is-scrolled .header-inner { height: 72px; }
  .brand-ocean-mark { width: 54px; height: 21px; }
  .ocean-home .brand-name strong { font-size: 18px; }
  .ocean-home .navigation { top: 74px; }
  .ocean-home .site-header.is-scrolled .navigation { top: 66px; }
  .hero.ocean-hero { min-height: max(740px, 100svh); }
  .ocean-photo { object-position: 50% 50%; }
  .ocean-shade { background: linear-gradient(90deg,rgba(4,20,37,.73),rgba(5,24,42,.35)), linear-gradient(180deg,rgba(3,17,30,.27),rgba(3,17,30,.08) 40%,rgba(3,17,30,.77)); }
  .ocean-content { align-items: center; padding-top: 146px; padding-bottom: 155px; }
  .ocean-eyebrow { font-size: 8px; letter-spacing: .11em; gap: 11px; margin-bottom: 30px; }
  .ocean-eyebrow > span { flex-basis: 20px; }
  .hero.ocean-hero h1 { font-size: clamp(43px, 8.3vw, 63px); line-height: 1.1; letter-spacing: -.058em; }
  .ocean-title-line:last-child { max-width: 100%; }
  .ocean-copy-bottom { margin-top: 29px; }
  .ocean-description { max-width: 42ch; font-size: 14px; }
  .ocean-actions { gap: 24px; margin-top: 30px; }
  .brand-chapter { padding-block: 72px; }
  .brand-chapter-layout { grid-template-columns: 1fr; gap: 44px; }
  .brand-board { aspect-ratio: 1 / .95; padding: 28px; }
  .brand-chapter-copy h2 { font-size: clamp(38px,8.5vw,52px); }
  .brand-chapter-copy > p:not(.section-kicker) { max-width: 55ch; font-size: 15px; }
  .brand-chapter-copy > .brand-chapter-lead { font-size: 18px !important; }
  .quality-chapter { padding-block: 62px 70px; }
  .quality-heading .section-kicker { margin-top: 0; }
  .quality-heading h2 { font-size: clamp(28px,6.6vw,39px); }
  .quality-grid { grid-template-columns: 1fr; gap: 38px; margin-top: 35px; }
  .quality-item { display: block; }
  .quality-item h3 { margin: 0 0 15px; font-size: 24px; }
  .quality-item > p { font-size: 14px; }
  .process-refined { padding-block: 72px; }
  .process-refined-intro { position: static; }
  .process-refined-intro h2 { font-size: clamp(38px,8.3vw,48px); }
  .process-refined-intro > p:not(.section-kicker) { max-width: 45ch; }
  .process-disclosure-title strong { font-size: 21px; }
  .process-disclosure-content > p { font-size: 14px; }
  .faq-section { padding-block: 64px 67px; }
  .faq-layout { grid-template-columns: 1fr; gap: 35px; }
  .faq-heading h2 { font-size: clamp(36px,8vw,48px); }
  .faq-item summary { padding-inline: 9px; font-size: 14px; }
  .faq-answer p { padding-left: 9px; }
  .contact-section-navy { padding-block: 72px; }
  .contact-section-navy .contact-section-layout { grid-template-columns: 1fr; gap: 37px; }
  .contact-section-navy .contact-section-copy h2 { font-size: clamp(36px,8vw,48px); }
  .contact-section-navy .contact-section-form { padding: 29px 24px; }
  .contact-page { grid-template-columns: 1fr; gap: 38px; padding-block: 40px 72px; }
  .contact-page-copy h1 { font-size: clamp(43px,10vw,58px); }
  .contact-page .contact-form-panel { padding: 29px 24px; }
  .site-footer .footer-main { padding-block: 48px 36px; }
  .footer-brand-column > p { font-size: 17px; }
}
@media (max-width: 430px) {
  .hero.ocean-hero { min-height: max(740px,100svh); }
  .hero.ocean-hero h1 { font-size: clamp(39px,11.2vw,48px); }
  .ocean-content { padding-top: 139px; padding-bottom: 145px; }
  .ocean-eyebrow { font-size: 7px; }
  .ocean-description { font-size: 13px; }
  .ocean-actions { flex-direction: column; align-items: flex-start; gap: 18px; }
  .ocean-cta { font-size: 11px; min-height: 57px; gap: 27px; }
  .ocean-cta > span { width: 54px; height: 55px; }
  .ocean-work-link { font-size: 11px; min-height: 37px; }
  .brand-board { padding: 24px; }
  .quality-item h3 { font-size: 22px; }
  .quality-item > p { font-size: 14px; }
  .process-disclosure summary { grid-template-columns: 24px 1fr 20px; gap: 12px; }
  .process-disclosure-title strong { font-size: 19px; }
  .process-disclosure-content { padding-left: 36px; padding-right: 0; }
  .contact-section-navy .contact-section-form, .contact-page .contact-form-panel { padding: 28px 21px; }
}
@media (prefers-reduced-motion: reduce) { .ocean-home .site-header, .ocean-home .header-inner, .process-disclosure-toggle::after { transition: none; } }
