@font-face {
  font-family: Montserrat;
  src: url('/montserrat-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
}

:root {
  color-scheme: light;
  --navy: #091024;
  --deep-navy: #050b1c;
  --paper: #fcfcfc;
  --ink: #091024;
  --muted: #4e5769;
  --teal: #0db8c8;
  --aqua: #29c3d1;
  --mist: #bfdbdf;
  --gold: #e7bf7a;
  --bronze: #72511e;
  --line: #d7e2e7;
  --mono: 'Cascadia Mono', Consolas, monospace;
  font-family: Montserrat, 'Segoe UI', system-ui, sans-serif;
  line-height: 1.55;
  color: var(--ink);
  background: var(--navy);
}

*, *::before, *::after { box-sizing: border-box; }
body, h1, h2, h3, p, figure, ul, ol { margin: 0; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
button, select { cursor: pointer; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid #b37e32; outline-offset: 4px; }
section[id] { scroll-margin-top: 88px; }
html { scroll-behavior: smooth; }

.wrap { width: min(1200px, calc(100% - 112px)); margin-inline: auto; }
.skip { position: fixed; top: 12px; left: 12px; z-index: 8; padding: 10px 18px; background: var(--paper); transform: translateY(-150%); }
.skip:focus { transform: translateY(0); }
.header { position: sticky; top: 0; z-index: 5; color: var(--paper); background: var(--navy); border-bottom: 1px solid #ffffff15; }
.nav { min-height: 79px; display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.nav nav { display: flex; gap: clamp(16px, 3.15vw, 48px); align-items: center; }
.nav nav a { color: #d3d8e2; text-decoration: none; font-size: .9rem; font-weight: 550; }
.nav nav a:hover, .footer a:hover { color: var(--gold); }
.brand { display: inline-block; flex-shrink: 0; }
.brand img { display: block; width: 188px; height: auto; }

.button { display: inline-flex; justify-content: center; align-items: center; gap: 14px; min-height: 48px; padding: 10px 17px; border: 1px solid transparent; border-radius: 6px; text-decoration: none; font-size: .88rem; font-weight: 700; line-height: 1.25; transition: background-color .16s, border-color .16s; }
.button span { font-size: 1.05em; }
.button-outline { min-height: 41px; color: var(--paper); border-color: #b4c8d885; background: transparent; }
.button-outline span { color: var(--gold); }
.button-outline:hover { background: #29c3d115; border-color: var(--aqua); }
.button-primary { background: var(--aqua); color: var(--deep-navy); }
.button-primary:hover { background: #5fd6df; }
.button:disabled { cursor: wait; opacity: .72; }
.text-link { display: inline-flex; align-items: baseline; gap: 8px; color: #0c6174; text-underline-offset: 5px; font-size: .87rem; font-weight: 700; text-decoration-color: #a57c39; }
.text-link:hover { text-decoration-thickness: 2px; }
.light-link { color: #f1eee7; text-decoration-color: #e7bf7a95; }

.hero { position: relative; isolation: isolate; overflow: hidden; color: var(--paper); background: radial-gradient(ellipse at 83% 32%, #13335c 0%, #102445 36%, var(--navy) 71%); }
.hero::before { position: absolute; z-index: -1; inset: 0; content: ''; background: linear-gradient(#cfdbf00f 1px, transparent 1px), linear-gradient(90deg, #cfdbf00f 1px, transparent 1px); background-size: 46px 46px; mask-image: linear-gradient(90deg, transparent 19%, #000 90%); }
.hero-layout { display: grid; grid-template-columns: 1.12fr 1fr; gap: clamp(28px, 5vw, 76px); align-items: center; padding-block: clamp(76px, 8vw, 116px) clamp(70px, 7.3vw, 104px); }
.eyebrow, .mono { display: flex; align-items: center; gap: 10px; color: var(--aqua); font: 650 .71rem/1.5 var(--mono); letter-spacing: .09em; }
.marker { display: inline-block; flex: 0 0 auto; width: 8px; height: 8px; background: var(--gold); clip-path: polygon(0 0, 100% 50%, 0 100%); }
h1, .section h2 { font-weight: 800; letter-spacing: -.058em; line-height: 1.035; }
h1 { margin-block: 20px 24px; font-size: clamp(2.8rem, 5.2vw, 4.85rem); }
h1 em, .contact h2 em { font-style: normal; color: var(--aqua); }
.hero-intro { max-width: 44ch; color: var(--mist); font-size: clamp(1rem, 1.32vw, 1.14rem); line-height: 1.67; }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: 19px; margin-top: 30px; }
.finance-visual { position: relative; min-width: 0; }
.report { padding: clamp(15px, 2vw, 26px); border: 1px solid #5695cf75; border-radius: 14px; background: linear-gradient(153deg, #17345b, #101d35 70%); box-shadow: 0 23px 55px #050c1880; }
.report-header { display: flex; align-items: start; justify-content: space-between; gap: 8px; }
.report .mono { color: var(--mist); font-size: .63rem; }
.report h2 { margin-top: 8px; font-size: clamp(1.02rem, 2vw, 1.39rem); font-weight: 550; letter-spacing: -.025em; }
.report-chip { flex-shrink: 0; border: 1px solid #a88d5c80; border-radius: 4px; padding: 4px 7px; color: #f0d7af; font: .56rem/1.35 var(--mono); letter-spacing: .07em; }
.chart { display: block; width: 100%; margin-top: 16px; overflow: visible; }
.grid-lines { stroke: #9aacbf35; stroke-width: 1; fill: none; }
.chart-labels { fill: #bac7d6; font: 10.5px var(--mono); }
.report-footer, .finance-visual figcaption { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.report-footer { padding-top: 9px; border-top: 1px solid #ffffff16; color: #bdc8d7; font-size: .7rem; }
.report-footer i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 5px; background: var(--aqua); }
.report-footer span:last-child, .finance-visual figcaption { font: .62rem/1.5 var(--mono); letter-spacing: .075em; }
.finance-visual figcaption { margin-top: 12px; color: #bfc8d6; }

.signal-strip { color: #e3e8ef; background: #101e36; border-block: 1px solid #ffffff16; }
.signal-strip ul { display: flex; align-items: center; justify-content: space-around; gap: 15px; list-style: none; padding: 18px 0; font-size: .86rem; }
.signal-strip li { display: flex; align-items: center; gap: 8px; }
.signal-strip li span { color: var(--gold); font-size: 1.15em; }

.section { padding-block: clamp(66px, 8vw, 110px); }
.services { background: var(--paper); }
.section-label { color: var(--bronze); }
.section h2 { font-size: clamp(2.3rem, 4.35vw, 3.8rem); margin-top: 14px; }
.section-intro { display: flex; justify-content: space-between; gap: 26px; align-items: end; margin-bottom: 30px; }
.section-intro > p, .section-body { max-width: 34ch; color: var(--muted); font-size: 1.02rem; line-height: 1.65; }
.section-intro > p { margin-bottom: 3px; }
.tabs { display: flex; flex-wrap: wrap; gap: 8px; padding: 5px; margin-bottom: 16px; background: #e9f1f4; width: fit-content; border: 1px solid var(--line); border-radius: 8px; }
.tabs button { border: 1px solid transparent; border-radius: 5px; background: transparent; padding: 9px 13px; color: #464a52; font-size: .84rem; font-weight: 650; text-align: start; }
.tabs button:hover { background: #f6fcfd; }
.tabs button[aria-selected="true"] { color: #0c6174; background: var(--paper); border-color: #a3c8d4; box-shadow: 0 1px 2px #13212e16; }
.service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.service-grid + .service-grid { margin-top: 16px; }
.tabs[role="tablist"] ~ .service-grid { margin-top: 0; }
.service-card { min-height: 256px; display: flex; flex-direction: column; align-items: start; padding: clamp(20px, 2.4vw, 31px); border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.service-card.featured { border-color: #9abdc9; background: linear-gradient(145deg, #e9f5f7, #fff 75%); }
.card-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 7px 10px; color: var(--bronze); font: 650 .64rem/1.35 var(--mono); letter-spacing: .06em; }
.tag { color: #644718; background: #efdfbf; padding: 4px 6px; border-radius: 4px; font-size: .55rem; }
.service-card h3 { font-size: clamp(1.2rem, 1.85vw, 1.5rem); font-weight: 750; line-height: 1.19; letter-spacing: -.042em; margin-block: 17px 9px; }
.service-card p { color: var(--muted); margin-bottom: 17px; font-size: .94rem; }
.service-card a { margin-top: auto; }

.approach { background: #eef5f6; border-block: 1px solid var(--line); }
.approach-layout, .contact-layout { display: grid; grid-template-columns: .9fr 1fr; gap: clamp(28px, 7vw, 100px); }
.section-body { margin-block: 18px 21px; }
.steps { list-style: none; padding: 0; border-top: 1px solid #c3d8df; }
.steps li { display: grid; grid-template-columns: 39px 1fr; gap: 11px; padding-block: 19px; border-bottom: 1px solid #c3d8df; }
.steps li > span { padding-top: 4px; color: var(--bronze); font: 650 .75rem/1.5 var(--mono); }
.steps h3 { font-size: 1.04rem; }
.steps p { margin-top: 5px; color: var(--muted); font-size: .94rem; }

.founder { background: var(--paper); }
.founder-layout { display: grid; grid-template-columns: minmax(190px, 300px) 1fr; align-items: center; gap: clamp(30px, 7vw, 96px); }
.founder-photo { width: 100%; height: auto; border-radius: 12px; border: 1px solid var(--line); }
.founder-role { margin-top: 13px; color: #0c6174; font-size: .88rem; font-weight: 650; }
.founder .section-body { max-width: 49ch; }
.contact { color: var(--paper); background: radial-gradient(ellipse at 20% 0%, #122b4f, var(--navy) 65%); }
.contact .section-body { color: var(--mist); }
.contact-detail { display: flex; gap: 12px; align-items: center; margin-top: 26px; }
.contact-detail a { text-underline-offset: 4px; text-decoration-color: #e7bf7a80; }
.contact-detail a:hover { color: var(--gold); }
.mail-icon { display: grid; place-items: center; width: 41px; height: 41px; border: 1px solid #c29d626e; border-radius: 7px; color: var(--gold); }
.mail-icon svg { width: 19px; height: 19px; stroke: currentColor; stroke-width: 1.45; }
.enquiry-form { position: relative; min-width: 0; display: grid; gap: 13px; padding: clamp(21px, 3vw, 33px); border: 1px solid #598bb173; border-radius: 10px; background: #101e36; }
.enquiry-form h3 { font-size: 1.4rem; font-weight: 750; letter-spacing: -.035em; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.enquiry-form label { display: grid; min-width: 0; gap: 5px; color: #e2e7ee; font-size: .85rem; font-weight: 600; }
.enquiry-form input, .enquiry-form select, .enquiry-form textarea { width: 100%; padding: 9px 10px; border: 1px solid #566477; border-radius: 5px; background: #0d1728; color: #faf6ef; color-scheme: dark; font-size: .94rem; font-weight: 400; }
.enquiry-form textarea { resize: vertical; }
.enquiry-form .button { justify-self: start; }
.form-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.form-note, .form-status { color: #c6d0dd; font-size: .82rem; }
.form-status:empty { display: none; }
.form-status { color: #f0cf98; }
.footer { color: #c8d0dd; background: var(--deep-navy); border-top: 1px solid #ffffff17; }
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding-block: 23px; font-size: .82rem; }
.footer .brand img { width: 144px; }
.footer-contact { display: flex; flex-wrap: wrap; gap: 7px 15px; }
.footer a { text-underline-offset: 4px; }

@media (max-width: 960px) {
  .wrap { width: calc(100% - 64px); }
  .hero-layout { grid-template-columns: 1.05fr 1fr; gap: 25px; }
  .actions { gap: 14px; }
  .report-footer span:last-child, .finance-visual figcaption { letter-spacing: 0; }
}
@media (max-width: 750px) {
  .wrap { width: calc(100% - 40px); }
  .nav { min-height: 64px; gap: 13px; }
  .nav-cta { display: none; }
  .hero-layout { grid-template-columns: 1fr; gap: 34px; padding-block: 58px 45px; }
  h1 { font-size: clamp(2.55rem, 8.6vw, 4.2rem); }
  .finance-visual { max-width: 510px; }
  .signal-strip ul { justify-content: start; flex-wrap: wrap; gap: 6px 18px; }
  .section-intro { display: block; }
  .section-intro > p { margin-top: 11px; }
  .service-grid { grid-template-columns: 1fr; gap: 10px; }
  .service-card { min-height: 0; }
  .approach-layout, .contact-layout { grid-template-columns: 1fr; }
  .founder-layout { grid-template-columns: minmax(130px, 225px) 1fr; gap: 23px; }
  .founder h2 { font-size: clamp(1.7rem, 5vw, 2.45rem); }
}
@media (max-width: 420px) {
  .wrap { width: calc(100% - 32px); }
  .nav nav { gap: 9px; }
  .nav nav a { font-size: .71rem; }
  .nav .brand img { width: 117px; }
  .hero .eyebrow { font-size: .61rem; }
  .tabs { width: 100%; gap: 4px; }
  .tabs button { flex: 1 1 min-content; padding: 7px 6px; font-size: .75rem; }
  .form-row { grid-template-columns: 1fr; }
  .founder-layout { grid-template-columns: 1fr; }
  .founder-photo { max-width: 210px; }
  .footer-inner { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}
