@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap");
:root { --navy: #092a49; --deep: #071d33; --blue: #1754b8; --cyan: #16a9b7; --ink: #193449; --muted: #526677; --line: #dbe5e8; --soft: #f3f8f9; --white: #fff; color-scheme: light; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0px; background: rgb(255, 255, 255); color: var(--ink); font: 16px / 1.65 "DM Sans", system-ui, sans-serif; }
a { color: inherit; }
a:focus-visible { outline: 3px solid var(--cyan); outline-offset: 4px; }
img { max-width: 100%; }
.container { width: min(1180px, 100% - 48px); margin-inline: auto; }
.skip { position: absolute; left: -100vw; top: 8px; background: rgb(255, 255, 255); padding: 8px; z-index: 100; }
.skip:focus { left: 8px; }
h1, h2, h3, p { margin-top: 0px; }
h1, h2, h3 { font-family: Manrope, system-ui, sans-serif; letter-spacing: -0.045em; line-height: 1.18; }
h1 { font-size: clamp(2.6rem, 5.7vw, 5.8rem); font-weight: 800; }
h2 { font-size: clamp(2rem, 3.5vw, 3.15rem); font-weight: 800; }
h3 { font-size: 1.35rem; font-weight: 800; }
p { max-width: 68ch; }
.eyebrow { font: 800 1rem / 1.45 Manrope, system-ui, sans-serif; text-transform: uppercase; letter-spacing: 0.1em; color: rgb(101, 217, 221); margin-bottom: 20px; }
.eyebrow.dark { color: rgb(12, 120, 145); }
.fineprint { font-size: 0.91rem; color: rgb(91, 110, 123); margin-top: 28px; }
.site-header { background: rgb(255, 255, 255); border-bottom: 1px solid var(--line); }
.topbar { display: flex; justify-content: space-between; align-items: center; gap: 24px; min-height: 100px; }
.brand { display: inline-flex; align-items: center; max-width: 255px; }
.brand img { width: 252px; height: auto; display: block; }
.header-actions { display: flex; gap: 26px; align-items: center; font-weight: 700; color: var(--navy); }
.header-actions a { text-decoration: none; }
.header-actions a:hover { color: var(--blue); }
.header-email { border: 1px solid var(--line); padding: 10px 16px; border-radius: 5px; }
.site-nav { display: flex; align-items: center; gap: 27px; min-height: 52px; border-top: 1px solid var(--line); }
.site-nav a { text-decoration: none; font-size: 0.91rem; font-weight: 700; white-space: nowrap; }
.site-nav a:hover, .site-nav a[aria-current] { color: var(--blue); }
.site-nav .nav-contact { margin-left: auto; color: var(--blue); }
.hero, .page-hero { color: rgb(255, 255, 255); background: var(--navy); }
.hero { padding: 96px 0px 108px; }
.hero-grid { display: grid; grid-template-columns: 1.45fr 0.65fr; gap: 70px; align-items: center; }
.hero h1 { max-width: 880px; margin-bottom: 30px; }
.hero h1 em { font-style: normal; color: rgb(131, 220, 226); }
.hero-lead { font-size: clamp(1.1rem, 1.9vw, 1.28rem); line-height: 1.65; color: rgb(212, 231, 237); max-width: 690px; margin-bottom: 30px; }
.hero-contact { font-size: 0.94rem; color: rgb(186, 211, 223); margin: 34px 0px 0px; }
.hero-contact a { text-decoration-color: rgb(128, 201, 215); text-underline-offset: 4px; }
.hero-panel { padding: 32px; border: 1px solid rgb(90, 136, 159); border-radius: 9px; background: rgba(255, 255, 255, 0.043); box-shadow: rgba(255, 255, 255, 0.024) 24px 24px 0px; }
.hero-panel h2 { font-size: 1.8rem; margin-bottom: 16px; }
.hero-panel p { color: rgb(215, 234, 240); }
.hero-panel p:last-child { margin: 0px; }
.panel-rule { height: 1px; background: rgb(102, 139, 156); margin: 25px 0px; }
.page-hero { padding: 83px 0px 91px; }
.page-hero .narrow { max-width: 1180px; }
.page-hero h1 { max-width: 900px; }
.page-hero .hero-lead { max-width: 790px; }
.button-row, .cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 22px; padding: 13px 18px; border-radius: 5px; background: rgb(86, 202, 210); color: rgb(6, 39, 66); font: 800 0.94rem / 1.4 Manrope, system-ui, sans-serif; text-decoration: none; min-height: 52px; transition: transform 0.16s, background 0.16s; }
.button:hover { background: rgb(131, 225, 229); transform: translateY(-2px); }
.button-outline { background: transparent; color: rgb(255, 255, 255); border: 1px solid rgb(132, 169, 186); }
.button-outline:hover { background: rgba(255, 255, 255, 0.075); color: rgb(255, 255, 255); }
.button span { font-size: 1.15rem; font-weight: 500; }
.section { padding: 98px 0px; }
.section.soft { background: var(--soft); }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 45px; margin-bottom: 34px; }
.section-head h2 { margin: 0px; }
.section-head > p { max-width: 450px; color: var(--muted); margin-bottom: 5px; }
.section-intro { font-size: 1.12rem; color: var(--muted); max-width: 800px; }
.service-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.service-card { background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 7px; padding: 32px 34px; text-decoration: none; display: flex; flex-direction: column; min-height: 285px; transition: box-shadow 0.18s, transform 0.18s, border-color 0.18s; }
.service-card-wide { grid-column: 1 / -1; min-height: 230px; }
.service-card:hover { border-color: rgb(122, 182, 203); box-shadow: rgba(12, 52, 80, 0.082) 0px 16px 40px; transform: translateY(-3px); }
.card-index { font: 800 0.95rem / 1.45 Manrope, system-ui, sans-serif; letter-spacing: 0.08em; color: rgb(8, 121, 150); }
.service-card h3 { font-size: 1.7rem; margin: 25px 0px 12px; }
.service-card p { color: var(--muted); margin: 0px; }
.card-arrow { margin-top: auto; padding-top: 24px; color: var(--blue); font-weight: 800; font-size: 0.91rem; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: start; }
.split > div > p:not(.eyebrow) { color: var(--muted); font-size: 1.07rem; }
.split .button { margin-top: 12px; }
.principles { border-top: 1px solid rgb(189, 208, 214); }
.principles > div { display: grid; grid-template-columns: 52px 1fr; gap: 18px; padding: 23px 0px; border-bottom: 1px solid rgb(189, 208, 214); }
.principles strong { color: var(--blue); font-family: Manrope, sans-serif; }
.principles span { font-weight: 600; line-height: 1.5; }
.evidence-grid, .three-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.evidence-grid article { border-top: 3px solid var(--cyan); padding: 23px 6px 12px; }
.evidence-grid span, .experience-list span, .profile-top span { font: 800 0.95rem / 1.45 Manrope, sans-serif; letter-spacing: 0.08em; color: rgb(19, 123, 148); }
.evidence-grid h3 { margin: 18px 0px 12px; }
.evidence-grid p, .detail-card p { color: var(--muted); }
.text-link { display: inline-flex; color: var(--blue); font-weight: 800; text-underline-offset: 5px; margin-top: 20px; }
.stack-list { border-top: 1px solid var(--line); }
.stack-list article { border-bottom: 1px solid var(--line); padding: 18px 0px; }
.stack-list h3 { font-size: 1.22rem; margin: 0px 0px 7px; }
.stack-list p { color: var(--muted); margin: 0px; }
.detail-card { background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 6px; padding: 29px; }
.detail-card h3 { margin-bottom: 10px; }
.detail-card p { margin-bottom: 0px; }
.people-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.profile { border: 1px solid var(--line); border-radius: 7px; overflow: hidden; }
.profile-top { background: var(--deep); color: rgb(255, 255, 255); padding: 37px; }
.profile-top span { color: rgb(112, 215, 225); }
.profile-top h2 { font-size: 2rem; margin: 16px 0px 10px; }
.profile-top p { color: rgb(201, 226, 235); margin: 0px; }
.profile-body { padding: 35px; }
.profile-body p, .profile-body li { color: var(--muted); }
.profile-body h3 { font-size: 1.06rem; margin: 28px 0px 12px; }
.profile-body ul { padding-left: 20px; }
.profile-body li { margin: 8px 0px; }
.profile-body .fineprint { font-size: 0.89rem; }
.experience-list { border-top: 1px solid var(--line); }
.experience-list article { display: grid; grid-template-columns: 220px 1fr; gap: 40px; padding: 30px 4px; border-bottom: 1px solid var(--line); }
.experience-list h3 { margin: 0px 0px 8px; }
.experience-list p { color: var(--muted); margin: 0px; }
.contact-layout { display: grid; grid-template-columns: 1fr 0.85fr; gap: 110px; }
.contact-layout > div > p:not(.eyebrow) { color: var(--muted); font-size: 1.08rem; }
.contact-method { border-top: 1px solid var(--line); padding: 20px 0px; display: grid; gap: 4px; }
.contact-method span { color: var(--muted); font-size: 0.87rem; }
.contact-method a { color: var(--blue); font: 800 clamp(1.25rem, 2.5vw, 1.7rem) Manrope, sans-serif; overflow-wrap: anywhere; }
.brief-card { background: var(--soft); border-radius: 7px; padding: 36px; }
.brief-card ol { padding-left: 22px; }
.brief-card li { margin: 12px 0px; }
.brief-card p { color: var(--muted); }
.brief-card .button { margin-top: 12px; }
.cta-band { background: rgb(11, 56, 88); color: rgb(255, 255, 255); padding: 70px 0px; }
.cta-grid { display: grid; grid-template-columns: 1.3fr 0.7fr; align-items: center; gap: 50px; }
.cta-band h2 { margin-bottom: 15px; }
.cta-band p:not(.eyebrow) { color: rgb(210, 228, 235); margin: 0px; }
.cta-actions { justify-content: end; }
.cta-actions .button { width: 235px; }
.site-footer { background: var(--deep); color: rgb(226, 237, 241); }
.footer-main { display: grid; grid-template-columns: 1.3fr 0.8fr 0.8fr; gap: 55px; padding: 68px 0px 53px; }
.footer-name { font: 800 1.35rem Manrope, sans-serif; text-decoration: none; }
.footer-main p { color: rgb(173, 191, 203); margin-top: 17px; }
.footer-main h2 { font: 800 0.82rem Manrope, sans-serif; letter-spacing: 0.12em; text-transform: uppercase; color: rgb(143, 212, 217); margin-bottom: 19px; }
.footer-main div:not(:first-child) { display: flex; flex-direction: column; gap: 10px; }
.footer-main a { text-decoration: none; }
.footer-main a:hover { text-decoration: underline; }
.footer-main span { color: rgb(173, 191, 203); }
.footer-bottom { border-top: 1px solid rgb(56, 96, 117); padding: 24px 0px; display: flex; justify-content: space-between; gap: 20px; color: rgb(168, 192, 202); font-size: 0.84rem; }
.mobile-actions { display: none; }
@media (max-width: 1050px) {
  .site-nav { gap: 17px; flex-wrap: wrap; padding: 12px 0px; }
  .header-actions { gap: 14px; }
  .hero-grid { gap: 34px; }
  .split { gap: 48px; }
  .contact-layout { gap: 55px; }
}
@media (max-width: 760px) {
  body { padding-bottom: 70px; }
  .container { width: min(100% - 34px, 1180px); }
  .topbar { min-height: 78px; }
  .brand img { width: 215px; }
  .header-actions { display: none; }
  .site-nav { gap: 12px 19px; min-height: unset; padding: 12px 0px 16px; overflow-x: auto; flex-wrap: nowrap; }
  .site-nav a { font-size: 0.84rem; }
  .site-nav .nav-contact { display: none; }
  .hero, .page-hero { padding: 62px 0px 72px; }
  .hero-grid, .split, .people-grid, .contact-layout, .cta-grid { grid-template-columns: 1fr; gap: 32px; }
  .hero-panel { box-shadow: none; }
  .hero h1 { font-size: clamp(2.6rem, 10vw, 4.2rem); }
  .section { padding: 67px 0px; }
  .section-head { display: block; }
  .section-head > p { margin-top: 16px; }
  .service-grid, .evidence-grid, .three-grid { grid-template-columns: 1fr; }
  .service-card, .service-card-wide { min-height: 0px; grid-column: auto; }
  .experience-list article { grid-template-columns: 1fr; gap: 10px; }
  .cta-actions { justify-content: start; }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 30px; }
  .footer-main div:first-child { grid-column: 1 / -1; }
  .mobile-actions { position: fixed; bottom: 0px; left: 0px; right: 0px; z-index: 20; display: flex; gap: 8px; padding: 9px 12px; background: rgb(255, 255, 255); border-top: 1px solid var(--line); box-shadow: rgba(9, 42, 73, 0.11) 0px -4px 18px; }
  .mobile-actions a { flex: 1 1 0%; text-align: center; border-radius: 4px; background: var(--navy); color: rgb(255, 255, 255); padding: 10px 6px; text-decoration: none; font-weight: 800; font-size: 0.86rem; }
  .mobile-actions a:last-child { background: var(--cyan); color: rgb(7, 38, 62); }
}
@media (max-width: 450px) {
  h1 { font-size: 2.5rem; }
  .profile-top, .profile-body, .brief-card { padding: 25px; }
  .footer-main { grid-template-columns: 1fr; }
  .footer-main div:first-child { grid-column: auto; }
  .footer-bottom { display: block; }
  .footer-bottom span { display: block; margin-bottom: 6px; }
  .hero-contact a { display: inline-block; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .button, .service-card { transition: none; }
}
.faq-jump { background: rgb(234, 243, 246); border-bottom: 1px solid var(--line); }
.faq-jump .container { display: flex; gap: 20px 30px; flex-wrap: wrap; padding-block: 19px; }
.faq-jump a { font-weight: 700; font-size: 0.9rem; text-decoration: none; color: var(--blue); }
.faq-jump a:hover { text-decoration: underline; }
.faq-section { scroll-margin-top: 16px; }
.faq-section:nth-of-type(2n) { background: var(--soft); }
.faq-layout { display: grid; grid-template-columns: minmax(240px, 0.8fr) minmax(0px, 1.4fr); gap: 75px; }
.faq-layout h2 { max-width: 430px; }
.faq-list { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item summary { cursor: pointer; display: list-item; list-style: none; position: relative; padding: 22px 45px 22px 0px; font: 700 1.08rem / 1.5 Manrope, sans-serif; color: var(--navy); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; position: absolute; right: 5px; top: 17px; color: var(--blue); font-size: 1.45rem; }
.faq-item[open] summary::after { content: "−"; }
.faq-item summary:focus-visible { outline: 3px solid var(--cyan); }
.faq-answer { padding: 0px 34px 21px 0px; color: var(--muted); }
.faq-answer p { margin: 0px; }
.faq-answer a { color: var(--blue); text-underline-offset: 3px; }
.enquiry-layout { display: grid; grid-template-columns: 0.82fr 1.18fr; gap: 80px; align-items: start; }
.enquiry-layout > div > p:not(.eyebrow) { color: var(--muted); }
.enquiry-form { display: grid; gap: 9px; background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 7px; padding: 36px; box-shadow: rgba(9, 42, 73, 0.043) 0px 12px 32px; }
.enquiry-form label { font-weight: 700; color: var(--navy); font-size: 0.93rem; }
.enquiry-form input, .enquiry-form select, .enquiry-form textarea { display: block; width: 100%; font: inherit; color: var(--ink); background: rgb(255, 255, 255); border: 1px solid rgb(181, 201, 208); border-radius: 4px; padding: 12px 13px; margin-bottom: 11px; min-height: 48px; }
.enquiry-form textarea { min-height: 120px; resize: vertical; }
.enquiry-form :is(input, select, textarea):focus-visible { outline: 3px solid var(--cyan); outline-offset: 2px; }
.form-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.form-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.enquiry-form .button { border: 0px; cursor: pointer; width: max-content; }
.enquiry-form .form-small { font-size: 0.82rem; color: var(--muted); margin: 0px; }
.enquiry-layout .privacy-note { font-size: 0.9rem; border-top: 1px solid var(--line); padding-top: 20px; margin-top: 28px; }
.privacy-note a { color: var(--blue); }
.enquiry-layout .enquiry-success, .enquiry-layout .enquiry-error { padding: 16px; border-radius: 5px; border: 1px solid rgb(61, 156, 137); background: rgb(232, 248, 243); color: rgb(21, 63, 53) !important; }
.enquiry-layout .enquiry-error { border-color: rgb(183, 103, 100); background: rgb(255, 241, 239); color: rgb(125, 41, 36) !important; }
@media (max-width: 760px) {
  .faq-layout, .enquiry-layout { grid-template-columns: 1fr; gap: 28px; }
  .faq-jump .container { gap: 10px 18px; }
  .faq-jump a { font-size: 0.82rem; }
  .enquiry-form { padding: 24px; }
}
@media (max-width: 450px) {
  .form-columns { grid-template-columns: 1fr; gap: 0px; }
}
.home-hero .hero-secondary { font-size: 0.89rem; color: rgb(182, 208, 219); margin: 18px 0px 0px; max-width: 610px; }
.home-hero .hero-lead { max-width: 740px; }
.panel-link { display: inline-block; color: rgb(140, 226, 230); font-weight: 800; text-underline-offset: 5px; margin-top: 14px; }
.sme-entry { background: rgb(247, 250, 251); }
.sme-entry .detail-card { border-top: 3px solid var(--cyan); }
.sme-entry .detail-card h3 { margin: 17px 0px 10px; }
.sme-entry .text-link { margin-top: 29px; }
.stack-list h3 a { color: var(--navy); text-decoration-thickness: 1px; text-underline-offset: 4px; }
.stack-list h3 a:hover { color: var(--blue); }
.page-hero .hero-support { margin: -12px 0px 23px; }
.page-hero .hero-support a { font-size: 0.95rem; font-weight: 700; color: rgb(132, 220, 228); text-underline-offset: 4px; }
.industry-section { background: rgb(247, 250, 251); scroll-margin-top: 18px; }
.industry-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 14px; align-items: start; }
.industry-card { background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 7px; overflow: hidden; min-width: 0px; }
.industry-card[open] { border-color: rgb(135, 184, 197); box-shadow: rgba(9, 42, 73, 0.07) 0px 12px 28px; grid-column: 1 / -1; }
.industry-card[open] summary { min-height: 0px; }
.industry-card[open] .industry-detail { max-width: 850px; }
.industry-card summary { position: relative; cursor: pointer; list-style: none; min-height: 158px; padding: 24px 42px 23px 24px; }
.industry-card summary::-webkit-details-marker { display: none; }
.industry-card summary:focus-visible { outline: 3px solid var(--cyan); outline-offset: -4px; }
.industry-name { display: block; color: var(--navy); font: 800 1.15rem / 1.3 Manrope, system-ui, sans-serif; letter-spacing: -0.025em; }
.industry-hook { display: block; color: var(--muted); font-size: 0.92rem; line-height: 1.5; margin-top: 11px; }
.industry-open { position: absolute; right: 18px; top: 20px; color: var(--blue); font: 600 1.45rem / 1 Manrope, sans-serif; }
.industry-card[open] .industry-open { font-size: 0px; }
.industry-card[open] .industry-open::after { content: "−"; font-size: 1.45rem; }
.industry-detail { padding: 22px 24px 27px; border-top: 1px solid var(--line); color: var(--muted); font-size: 0.92rem; }
.industry-detail h3 { color: var(--navy); font-size: 1rem; letter-spacing: 0px; margin: 0px 0px 12px; }
.industry-detail ul { padding-left: 19px; margin: 0px 0px 20px; }
.industry-detail li { margin: 0px 0px 12px; }
.industry-detail strong { color: var(--ink); }
.industry-detail p { margin: 0px 0px 14px; }
.industry-detail .text-link { margin-top: 6px; }
.industry-section .fineprint { max-width: 900px; }
.industry-section .section-head h2 { max-width: 700px; }
@media (max-width: 900px) {
  .industry-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 600px) {
  .industry-grid { grid-template-columns: 1fr; }
  .industry-card summary { min-height: 0px; padding: 20px 42px 20px 20px; }
  .industry-detail { padding: 20px; }
}
.four-grid { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 14px; }
.four-grid .detail-card { padding: 24px; }
.four-grid .detail-card h3 { font-size: 1.18rem; margin: 15px 0px 10px; }
.four-grid .detail-card p { font-size: 0.94rem; }
@media (max-width: 1000px) {
  .four-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 600px) {
  .four-grid { grid-template-columns: 1fr; }
}
.profile-body h4 { font: 800 1.05rem / 1.4 Manrope, system-ui, sans-serif; color: var(--navy); letter-spacing: 0px; margin: 23px 0px 8px; }
.profile-body h4 + ul { margin-top: 0px; }
/* Focused editorial imagery */
.editorial-visual{margin:0 0 34px;background:#e9eef0;border:1px solid var(--line);border-radius:7px;overflow:hidden}
.editorial-visual img{display:block;width:100%;height:auto}
.editorial-visual figcaption{padding:9px 15px;color:var(--muted);font-size:.78rem;line-height:1.4}
.process-visual img{max-height:365px;object-fit:cover;object-position:center}
.profile-photo{height:390px;background:#e8e4e1;overflow:hidden;display:flex;align-items:center;justify-content:center}
.profile-photo img{height:100%;width:100%;object-fit:contain;display:block}
.ai-visual{margin:0 auto 55px;max-width:1180px}
.ai-visual img{max-height:430px;object-fit:cover}
@media(max-width:760px){.process-visual img{height:225px;object-fit:cover}.profile-photo{height:320px}.ai-visual{margin-bottom:34px}.ai-visual img{height:210px;object-fit:cover;object-position:center}}
