/* Office page - aligned with the calm, mobile-first contact page. */
.page { margin-top: 70px; padding: 24px 0 64px; background: #f4f6ff; }
.page > .office-container { width: min(100% - 32px, 1160px); padding: 0; }
.fs5 {
    --paper: #fff;
    --ink: var(--text-dark, #17202b);
    --muted: #566371;
    --muted2: #687583;
    --ok: #047857;
    max-width: none; margin: 0 auto; padding: clamp(18px, 4vw, 40px);
    border: 0; border-radius: 0;
    background: transparent; color: var(--ink);
    font-family: 'Inter', 'Manrope', sans-serif;
}
.fs5 h1 { margin: 0; max-width: 18ch; color: var(--ink); font: 800 clamp(2rem, 6vw, 3rem)/1.12 'Manrope', 'Inter', sans-serif; letter-spacing: -.045em; }
.fs5 p { margin: 0; }
.fs5 a { color: inherit; }
.office-hero { display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(340px, .94fr); align-items: stretch; gap: clamp(24px, 4vw, 48px); margin-bottom: 26px; }
.office-hero-copy { align-self: center; padding: 8px 0; }
.office-hero-media { min-height: 320px; overflow: hidden; border-radius: 20px; background: #dce9e7; box-shadow: 0 16px 38px rgba(24, 49, 57, .12); }
.office-hero-media img { display: block; width: 100%; height: 100%; min-height: 320px; object-fit: cover; object-position: 58% center; }
.fs5-kicker { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 14px; padding: 7px 12px; border: 1px solid rgba(4,120,87,.18); border-radius: 999px; background: #e7f3ed; color: #075b43; font-size: .8125rem; font-weight: 700; text-transform: none; }
.fs5-dot { width: 9px; height: 9px; border-radius: 50%; background: #07805c; box-shadow: 0 0 0 4px rgba(4,120,87,.11); }
.office-intro { max-width: 54ch; margin-top: 12px !important; color: var(--muted); font-size: 1rem; line-height: 1.65; }
.office-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.office-action { display: flex; min-height: 52px; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 16px; border: 1px solid rgba(23,32,43,.09); border-radius: 13px; background: #fff; color: var(--ink); font-size: .9375rem; font-weight: 650; line-height: 1.35; text-decoration: none; transition: transform 160ms ease, background-color 160ms ease; }
.fs5 a.office-action--primary { border-color: #047857; background: #047857; color: #fff; }
.office-action span { font-size: .8125rem; font-weight: 500; }
.fs5-two { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 14px; margin-top: 22px; }
.fs5-card, .fs5-metric, .fs5-step, .fs5-faq details { min-width: 0; padding: 20px; border: 1px solid rgba(23,32,43,.08); border-radius: 16px; background: #fff; box-shadow: none; }
.fs5-passport { border-color: rgba(4,120,87,.17); background: #f2f8f5; }
.fs5-cardTitle { margin: 0 0 14px; color: var(--ink); font: 700 1rem/1.4 'Manrope', 'Inter', sans-serif; letter-spacing: 0; text-transform: none; }
.fs5-field { grid-template-columns: minmax(88px, .55fr) minmax(0, 1fr); gap: 12px; padding: 12px 0; border-top: 1px solid rgba(23,32,43,.08); }
.fs5-field:first-of-type { border-top: 0; }
.fs5-key { color: var(--muted2); font-size: 13px; }
.fs5-val { min-width: 0; color: var(--ink); font-size: .9375rem; font-weight: 600; line-height: 1.55; overflow-wrap: anywhere; }
.fs5-links { gap: 8px; }
.fs5-link { align-items: center; min-width: 0; padding: 12px; border: 1px solid rgba(23,32,43,.08); border-radius: 12px; background: #fff; text-decoration: none; transition: transform 160ms ease, background-color 160ms ease; }
.fs5-ic { width: 42px; height: 42px; border: 0; border-radius: 11px; background: #f0f3f7; }
.fs5-link strong { font-size: .875rem; line-height: 1.4; }
.fs5-link small { color: var(--muted); font-size: 13px; line-height: 1.5; }
.fs5-arrow { flex: 0 0 auto; color: #687583; }
.fs5-divider { height: 1px; margin: 26px 0; background: rgba(23,32,43,.1); }
.fs5-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.fs5-metric { grid-column: auto; padding: 18px; }
.fs5-metric b { align-items: flex-start; font-size: .9375rem; line-height: 1.45; }
.fs5-ok { flex: 0 0 20px; width: 20px; height: 20px; border: 0; border-radius: 7px; background: #e7f3ed; color: #047857; }
.fs5-metric p, .fs5-step p { margin-top: 8px; color: var(--muted); font-size: .875rem; line-height: 1.65; }
.fs5-flow { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.fs5-step { grid-column: auto; min-height: 0; align-items: flex-start; padding: 12px 2px; border: 0; border-radius: 0; background: transparent; text-align: left; }
.fs5-n { width: 42px; height: 42px; margin: 0 0 14px; border: 0; border-radius: 12px; background-image: none; background-color: #e7f3ed; box-shadow: none; color: #075b43; }
.fs5-n::before { color: #075b43; font: 800 1rem/42px 'Manrope', sans-serif; }
.fs5-n--1::before { content: '01'; }
.fs5-n--2::before { content: '02'; }
.fs5-n--3::before { content: '03'; }
.fs5-n--4::before { content: '04'; }
.fs5-step b { font-size: .9375rem; line-height: 1.4; }
.fs5-faq details { padding: 15px 16px; box-shadow: none; }
.fs5-faq details+details { margin-top: 8px; }
.fs5-faq summary { font-size: .9375rem; line-height: 1.5; }
.fs5-faq p { margin-top: 10px; color: var(--muted); font-size: .875rem; line-height: 1.65; }
.fs5 :is(a, summary):focus-visible, .office-action:focus-visible { outline: 3px solid #047857; outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) {
    .office-action:hover, .fs5-link:hover { transform: translateY(-2px); background-color: #edf7f2; }
    .fs5 a.office-action--primary:hover { background: #065f46; }
}
@media (max-width: 820px) {
    .office-hero { grid-template-columns: 1fr; gap: 20px; }
    .office-hero-copy { padding: 0; }
    .office-hero-media, .office-hero-media img { min-height: 0; height: clamp(190px, 46vw, 320px); }
    .fs5-two { grid-template-columns: 1fr; }
    .fs5-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .page { margin-top: 58px; padding: 18px 0 40px; }
    .page > .office-container { width: min(100% - 24px, 1160px); }
    .fs5 { padding: 18px 14px; border-radius: 18px; }
    .office-hero { gap: 16px; margin-bottom: 18px; }
    .office-hero-media, .office-hero-media img { height: 190px; border-radius: 15px; }
    .office-actions { display: grid; grid-template-columns: 1fr; }
    .office-action { width: 100%; min-height: 54px; }
    .fs5-two { gap: 10px; margin-top: 18px; }
    .fs5-card, .fs5-metric, .fs5-step { padding: 16px; }
    .fs5-field { grid-template-columns: 1fr; gap: 3px; }
    .fs5-metrics { grid-template-columns: 1fr; gap: 10px; }
    .fs5-flow { grid-template-columns: 1fr; gap: 10px; }
    .fs5-step { display: grid; grid-template-columns: 42px minmax(0,1fr); column-gap: 12px; align-items: center; text-align: left; }
    .fs5-n { grid-row: span 2; margin: 0; }
    .fs5-step b { margin: 0; }
    .fs5-step p { margin-top: 3px; }
    .fs5-link { gap: 9px; padding: 11px 9px; }
    .fs5-ic { width: 36px; height: 36px; border-radius: 10px; }
    .fs5-link small { font-size: 13px; }
    .fs5-divider { margin: 20px 0; }
}
@media (prefers-reduced-motion: reduce) {
    .office-action, .fs5-link { transition: none; }
}



.fs5 { font-size: 16px; }


body.site-bg main.page { position: relative; z-index: 0; background-color: #f4f6ff !important; background-image: none !important; }