@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@500;600&display=swap');

:root {
    --ink: #102344;
    --ink-hover: #1c3561;
    --gold: #d3a045;
    --paper: #ffffff;
    --line: #e8e9ed;
    /* Matches the 107px desktop header shown in the approved reference. */
    --header-height: 85px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    min-width: 320px;
    color: var(--ink);
    background: var(--paper);
    font-family: 'DM Sans', Arial, sans-serif;
}

a { color: inherit; text-decoration: none; }

.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    min-height: var(--header-height);
    background: var(--paper);
    border-bottom: 1px solid var(--line);
}

.site-header__inner {
    width: min(100% - 64px, 1856px);
    min-height: var(--header-height);
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

.site-logo {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
}

.site-logo img {
    display: block;
    width: 158px;
    height: 56px;
}

.primary-nav {display: flex;align-items: center;justify-content: flex-end;gap: clamp(24px, 2.15vw, 43px);
}

.primary-nav > a:not(.button) {position: relative;padding: 12px 0;color: #26334b;font-family: 'Playfair Display', Georgia, serif;font-size: 14px;
    line-height: 1.2;white-space: nowrap;
}

.primary-nav > a:not(.button)::after {position: absolute;right: 0;bottom: 5px;left: 0;height: 2px;content: '';background: var(--gold);transform: scaleX(0);transform-origin: right;transition: transform .2s ease;
}

.primary-nav > a:not(.button):hover::after,
.primary-nav > a:not(.button):focus-visible::after,
.primary-nav > a[aria-current='page']::after {transform: scaleX(1);transform-origin: left;
}

.button {display: inline-flex;align-items: center;justify-content: center;padding: 15px 20px;border: 1px solid var(--ink);border-radius: 7px;font-size: 14px;font-weight: 600;line-height: 1.25;text-align: center;transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.button--header { color: #fff; background: var(--ink); }
.button--header:hover, .button--header:focus-visible { background: var(--ink-hover); border-color: var(--ink-hover); transform: translateY(-1px); }

.menu-toggle { display: none; }

.menu-toggle:focus-visible, .primary-nav a:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }

/* About page hero */
.about-hero {
    display: grid;
    min-height: 387px;
    place-items: center;
    overflow: hidden;
    color: #fff;
    text-align: center;
    background-image: linear-gradient(rgba(5, 22, 50, .79), rgba(5, 22, 50, .79)), url('../images/About%20Us%20Hero%20Image.webp');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.about-hero__content { width: min(100% - 48px, 1420px); padding: 30px 0; }
.about-hero__eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
    text-transform: uppercase;
}
.about-hero__eyebrow::before, .about-hero__eyebrow::after { width: 58px; height: 1px; content: ''; background: var(--gold); }
.about-hero h1 {
    margin: 30px 0 20px;
    color: #fff;
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 58px;
    font-weight: 600;
    letter-spacing: -.045em;
    line-height: 1.04;
}
.about-hero__lead { margin: 0; color: rgba(255, 255, 255, .77); font-size: 18px; font-weight: 500; line-height: 26px; }

/* Services page hero */
.services-hero {
    display: grid;
    min-height: 387px;
    place-items: center;
    overflow: hidden;
    color: #fff;
    text-align: center;
    background-image: linear-gradient(rgba(5, 22, 50, .79), rgba(5, 22, 50, .79)), url('../images/About%20Us%20Hero%20Image.webp');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.services-hero__content { width: min(100% - 48px, 1420px); padding: 30px 0; }
.services-hero__eyebrow { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 0; color: var(--gold); font-size: 13px; font-weight: 700; letter-spacing: .2em; line-height: 19px; text-transform: uppercase; }
.services-hero__eyebrow::before, .services-hero__eyebrow::after { width: 58px; height: 1px; content: ''; background: var(--gold); }
.services-hero h1 { margin: 30px 0 20px; color: #fff; font-family: 'Playfair Display', Georgia, serif; font-size: 58px; font-weight: 600; letter-spacing: -.045em; line-height: 1.04; }
.services-hero__lead { margin: 0; color: rgba(255, 255, 255, .77); font-size: 16px; font-weight: 500; line-height: 1.42857em; }

/* Services page detail */
.service-detail { padding: 84px 0 102px; scroll-margin-top: calc(var(--header-height) + 24px); background: #fff; }
.service-detail__inner { width: min(100% - 64px, 1140px); margin: 0 auto; display: grid; grid-template-columns: 542px minmax(0, 1fr); align-items: start; gap: 52px; }
.service-detail--reverse .service-detail__media { order: 2; }
.service-detail--reverse .service-detail__content { order: 1; }
.service-detail__media { width: 542px; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 4px; }
.service-detail__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.service-detail__content { padding-top: 35px; }
.service-detail__icon { display: grid; width: 50px; height: 50px; place-items: center; border-radius: 7px; background: var(--ink); }
.service-detail__icon img { width: 26px; height: 26px; filter: brightness(0) saturate(100%) invert(68%) sepia(36%) saturate(710%) hue-rotate(0deg) brightness(89%) contrast(88%); }
.service-detail__content h2 { margin: 44px 0 18px; color: var(--ink); font-size: 42px; font-weight: bold; letter-spacing: -.035em; line-height: 1.06; }
.service-detail__lead { margin: 0; color: #657086; font-size: 14px; line-height: 1.42857em; }
.service-detail__features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 24px; margin: 36px 0 0; padding: 0; list-style: none; }
.service-detail__features li { display: flex; align-items: center; gap: 12px; color: var(--ink); font-size: 14px; font-weight: 500; line-height: 1.42857em; white-space: nowrap; }
.service-detail__features img { width: 20px; height: 20px; flex: 0 0 20px; }
.service-detail__link { display: inline-flex; align-items: center; gap: 13px; margin-top: 30px; color: var(--ink); font-size: 15px; font-weight: 600; line-height: 22px; }
.service-detail__link span { font-size: 25px; font-weight: 400; line-height: 15px; transition: transform .2s ease; }
.service-detail__link:hover { color: var(--gold); }
.service-detail__link:hover span { transform: translateX(4px); }

/* About page story */
.about-story { padding: 110px 0 92px; background: #fff; }
.about-story__inner {
    width: min(100% - 64px, 1120px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 520px minmax(0, 1fr);
    align-items: start;
    gap: 68px;
}
.about-story__media { width: 520px; aspect-ratio: 1; }
.about-story__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.about-story__eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 4px 0 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
    text-transform: uppercase;
}
.about-story__eyebrow::before { width: 64px; height: 1px; content: ''; background: var(--gold); }
.about-story__content h2 { margin: 42px 0 29px; color: var(--ink); font-size: 44px; font-weight: 700; letter-spacing: -.035em; line-height: 1.07; }
.about-story__copy { border: 0; }
.about-story__copy p { margin: 0; border: 0; color: #26334b; font-size: 15px; line-height: 25px; }
.about-story__copy p + p { margin-top: 15px; }
.about-story__features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 30px; margin: 42px 0 0; padding: 0; list-style: none; }
.about-story__features li { display: flex; align-items: center; gap: 12px; color: var(--ink); font-size: 14px; font-weight: 500; line-height: 20px; white-space: nowrap; }
.about-story__features img { width: 20px; height: 20px; flex: 0 0 20px; }

/* About page vision, mission, and values */
.vision-mission-values { padding: 80px 0; background: #f1f7fe; }
.vision-mission-values__inner { width: min(100% - 64px, 1140px); margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.vmv-card { min-height: 270px; padding: 32px; border: 1px solid #e5e0e1; border-radius: 4px; background: #fff; transition: border-color .2s ease, box-shadow .2s ease; }
.vmv-card:hover { border-color: var(--gold); box-shadow: 0 16px 28px rgba(16, 35, 68, .12); }
.vmv-card__icon { display: grid; width: 50px; height: 50px; place-items: center; border-radius: 4px; background: #faf5ed; }
.vmv-card__icon img { width: 27px; height: 27px; filter: brightness(0) saturate(100%) invert(68%) sepia(36%) saturate(710%) hue-rotate(0deg) brightness(89%) contrast(88%); }
.vmv-card h2 { margin: 40px 0 26px; color: var(--ink); font-size: 20px; font-weight: 600; letter-spacing: -.025em; line-height: 25px; }
.vmv-card p { margin: 0; color: #657086; font-size: 14px; font-weight:500; line-height: 1.42857em; }

/* About page outcomes */
.about-numbers { padding: 110px 0 100px; background: #fff; }
.about-numbers__inner { width: min(100% - 64px, 1140px); margin: 0 auto; }
.about-numbers__heading { text-align: center; }
.about-numbers__heading p { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 0; color: var(--gold); font-size: 13px; font-weight: 700; letter-spacing: .2em; line-height: 19px; text-transform: uppercase; }
.about-numbers__heading p::before { width: 58px; height: 1px; content: ''; background: var(--gold); }
.about-numbers__heading h2 { margin: 42px 0 0; color: var(--ink); font-size: 44px; font-weight: 700; letter-spacing: -.035em; line-height: 1.06; }
.about-numbers__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 68px; }
.about-stat { display: grid; min-height: 193px; padding: 32px 18px; place-items: center; align-content: start; border-radius: 4px; background: #f0f6fd; text-align: center; transition: box-shadow .2s ease; }
.about-stat:hover { box-shadow: 0 14px 24px rgba(16, 35, 68, .12); }
.about-stat img { width: 36px; height: 36px; margin-bottom: 23px; filter: brightness(0) saturate(100%) invert(68%) sepia(36%) saturate(710%) hue-rotate(0deg) brightness(89%) contrast(88%); }
.about-stat strong { color: #000; font-size: 36px; font-weight: 700; line-height: 42px; }
.about-stat span { margin-top: 8px; color: #657086; font-size: 14px; line-height: 20px; }

/* About page team */
.about-team { padding: 82px 0 100px; background: #f0f6fd; }
.about-team__inner { width: min(100% - 64px, 1120px); margin: 0 auto; display: grid; grid-template-columns: 520px minmax(0, 1fr); align-items: start; gap: 68px; }
.about-team__media { width: 520px; aspect-ratio: 1; }
.about-team__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.about-team__eyebrow { display: flex; align-items: center; gap: 10px; margin: 4px 0 0; color: var(--gold); font-size: 13px; font-weight: 700; letter-spacing: .2em; line-height: 19px; text-transform: uppercase; }
.about-team__eyebrow::before { width: 64px; height: 1px; content: ''; background: var(--gold); }
.about-team__content h2 { margin: 42px 0 18px; color: var(--ink); font-size: 44px; font-weight: 700; letter-spacing: -.035em; line-height: 1.07; }
.about-team__content > p:last-of-type { max-width: 530px; margin: 0; color: #657086; font-size: 15px; line-height: 23px; }
.about-team__cta { display: inline-flex; align-items: center; gap: 14px; min-height: 54px; margin-top: 36px; padding: 14px 28px; border-radius: 4px; color: #fff; background: var(--ink); font-size: 14px; font-weight: 600; line-height: 20px; transition: background .2s ease, transform .2s ease; }
.about-team__cta span { font-size: 23px; font-weight: 400; line-height: 15px; }
.about-team__cta:hover, .about-team__cta:focus-visible { color: #fff; background: var(--ink-hover); transform: translateY(-2px); }

.home-hero {
    overflow: hidden;
    padding: 106px 0 85px;
    background: #fff;
}

.home-hero__inner {
    width: min(100% - 64px, 1120px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 559px 490px;
    align-items: start;
    column-gap: 80px;
}

.hero-copy { padding-top: 15px; }

.hero-eyebrow {
    margin: 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
}

.hero-copy h1 {
    max-width: 559px;
    margin: 26px 0 27px;
    color: var(--ink);
    font-size: 64px;
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: 64px;
}

.hero-copy h1 span { display: block; color: var(--gold); }

.hero-lead {
    margin: 0;
    color: #41506a;
    font-size: 18px;
    font-weight: 500;
    line-height: 27px;
}

.hero-description {
    max-width: 550px;
    margin: 18px 0 0;
    color: #657086;
    font-size: 16px;
    font-weight: 400;
    line-height: 23px;
}

.hero-actions { display: flex; align-items: center; gap: 16px; margin-top: 40px; }

.hero-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    border: 1px solid var(--ink);
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.hero-button:hover, .hero-button:focus-visible { transform: translateY(-2px); }
.hero-button--primary { width: 201px; color: #fff; background: var(--ink); }
.hero-button--primary:hover, .hero-button--primary:focus-visible { background: var(--ink-hover); }
.hero-button--secondary { width: 171px; color: var(--ink); background: #fff; }
.hero-button--secondary:hover, .hero-button--secondary:focus-visible { color: #fff; background: var(--ink); }

.hero-stats {
    display: grid;
    grid-template-columns: 181px 163px 1fr;
    margin: 55px 0 0 8px;
}

.hero-stats div { min-width: 0; }
.hero-stats dt { color: #000; font-size: 28px; font-weight: 700; line-height: 34px; }
.hero-stats dd { margin: 4px 0 0; color: #687386; font-size: 14px; line-height: 20px; }

.hero-media {
    position: relative;
    z-index: 1;
    width: 490px;
    aspect-ratio: 1;
}

.hero-media::before, .hero-media::after { position: absolute; z-index: -1; content: ''; pointer-events: none; }
.hero-media::before { top: -21px; left: -18px; width: 80px; height: 80px; border-top: 4px solid var(--gold); border-left: 4px solid var(--gold); }
.hero-media::after { right: -19px; bottom: -21px; width: 80px; height: 80px; border-right: 4px solid var(--ink); border-bottom: 4px solid var(--ink); }

.hero-media img { display: block; width: 100%; height: 100%; object-fit: cover; }

.who-we-are {
    overflow: hidden;
    padding: 60px 0 103px;
    background: #fff;
}

.who-we-are__inner {
    width: min(100% - 64px, 1120px);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 520px minmax(0, 1fr);
    align-items: start;
    gap: 68px;
}

.who-we-are__media {
    position: relative;
    width: 520px;
    aspect-ratio: 1;
}

.who-we-are__media > img { display: block; width: 100%; height: 100%; object-fit: cover; }

.experience-card {
    position: absolute;
    z-index: 1;
    bottom: -67px;
    left: 244px;
    width: 329px;
    min-height: 146px;
    padding: 35px 32px 25px;
    border-radius: 4px;
    color: #d2d9e5;
    background: var(--ink);
}

.experience-card strong { display: block; color: var(--gold); font-size: 40px; font-weight: 700; line-height: 42px; }
.experience-card p { max-width: 250px; margin: 9px 0 0; font-size: 14px; line-height: 20px; }

.section-eyebrow {
    margin: -5px 0 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
    text-transform: uppercase;
}

.who-we-are__content h2 {
    margin: 18px 0 20px;
    color: var(--ink);
    font-size: 44px;
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 41px;
}

.who-we-are__content h2 span { display: block; }

.section-rule { display: block; width: 70px; height: 4px; background: var(--gold); }

.who-we-are__description {
    margin: 45px 0 0;
    color: #657086;
    font-size: 16px;
    line-height: 23px;
}

.who-we-are__features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 26px;
    margin: 35px 0 0;
    padding: 0;
    list-style: none;
}

.who-we-are__features li {
    display: flex;
    align-items: center;
    gap: 20px;
    color: var(--ink);
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    white-space: nowrap;
}

.who-we-are__features img { width: 20px; height: 20px; color: var(--gold); }

.core-services { padding: 64px 0 100px; background: #faf7f8; }

.core-services__inner { width: min(100% - 64px, 1140px); margin: 0 auto; }

.core-services__eyebrow {
    margin: 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
    text-transform: uppercase;
}

.core-services__heading h2 {
    margin: 14px 0 19px;
    color: var(--ink);
    font-size: 44px;
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 48px;
}

.core-services__rule { display: block; width: 64px; height: 4px; background: var(--gold); }

.core-services__heading > p:last-child {
    margin: 43px 0 0;
    color: #657086;
    font-size: 16px;
    line-height: 23px;
}

.service-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    margin-top: 40px;
}

.service-card {
    position: relative;
    display: block;
    min-height: 318px;
    padding: 28px;
    border: 1px solid #e5e0e1;
    border-radius: 4px;
    color: var(--ink);
    background: #fff;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.service-card:hover, .service-card:focus-visible {
    z-index: 1;
    border-color: var(--gold);
    box-shadow: 0 10px 25px rgba(16, 35, 68, .06);
    transform: scale(1.05);
    outline: none;
}

.service-icon-box {
    display: grid;
    width: 50px;
    height: 50px;
    border-radius: 4px;
    color: var(--ink);
    background: #f2f3f5;
    place-items: center;
    transition: background-color .2s ease, color .2s ease;
}

.service-icon-box img {
    width: 26px;
    height: 26px;
    filter: brightness(0) saturate(100%) invert(13%) sepia(36%) saturate(1352%) hue-rotate(183deg) brightness(94%) contrast(96%);
    transition: filter .2s ease;
}
.service-card:hover .service-icon-box, .service-card:focus-visible .service-icon-box { background: var(--ink); }
.service-card:hover .service-icon-box img, .service-card:focus-visible .service-icon-box img { filter: brightness(0) saturate(100%) invert(67%) sepia(35%) saturate(735%) hue-rotate(1deg) brightness(87%) contrast(88%); }

.service-card h3 {
    margin: 36px 0 20px;
    color: var(--ink);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -.025em;
    line-height: 25px;
}

.service-card p { margin: 0; color: #687386; font-size: 16px; line-height: 23px; }

.why-choose-us { padding: 105px 0 100px; background: #fff; }
.why-choose-us__inner { width: min(100% - 64px, 1140px); margin: 0 auto; }

.why-choose-us__heading { text-align: center; }
.why-choose-us__heading p {
    margin: 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
    text-transform: uppercase;
}

.why-choose-us__heading h2 {
    margin: 14px 0 19px;
    color: var(--ink);
    font-size: 44px;
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 48px;
}

.why-choose-us__heading > span { display: block; width: 64px; height: 4px; margin: 0 auto; background: var(--gold); }

.benefit-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    margin-top: 72px;
}

.benefit-card {
    min-height: 226px;
    padding: 32px 26px 26px;
    border: 1px solid #e5e0e1;
    border-radius: 4px;
    background: #fff;
    text-align: center;
    transition: box-shadow .2s ease;
}

.benefit-card:hover {
    box-shadow: 0 12px 26px rgba(16, 35, 68, .09);
}

.benefit-icon {
    display: grid;
    width: 50px;
    height: 50px;
    margin: 0 auto;
    border-radius: 50%;
    background: #faf5eb;
    place-items: center;
}

.benefit-icon img {
    width: 24px;
    height: 24px;
    filter: brightness(0) saturate(100%) invert(67%) sepia(35%) saturate(735%) hue-rotate(1deg) brightness(87%) contrast(88%);
}

.benefit-card h3 {
    margin: 36px 0 20px;
    color: var(--ink);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -.025em;
    line-height: 25px;
}

.benefit-card p { margin: 0; color: #687386; font-size: 14px; line-height: 20px; }

.software-expertise { padding: 105px 0 100px; background: #faf7f8; }
.software-expertise__inner { width: min(100% - 64px, 1140px); margin: 0 auto; }
.software-expertise__heading { text-align: center; }

.software-expertise__heading > p:first-child {
    margin: 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
    text-transform: uppercase;
}

.software-expertise__heading h2 {
    margin: 14px 0 19px;
    color: var(--ink);
    font-size: 44px;
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 48px;
}

.software-expertise__heading > span { display: block; width: 64px; height: 4px; margin: 0 auto; background: var(--gold); }

.software-expertise__heading > p:last-child {
    margin: 43px 0 0;
    color: #657086;
    font-size: 16px;
    line-height: 23px;
}

.software-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 16px;
    margin-top: 30px;
}

.software-card {
    display: grid;
    min-height: 122px;
    padding: 18px;
    border: 1px solid #e5e0e1;
    border-radius: 4px;
    background: #fff;
    place-items: center;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.software-card:hover, .software-card:focus-visible {
    border-color: var(--gold);
    box-shadow: 0 12px 26px rgba(16, 35, 68, .09);
    outline: none;
}

.software-card img { display: block; max-width: 120px; max-height: 76px; object-fit: contain; }

.workflow-section { padding: 105px 0 112px; background: #fff; }
.workflow-section__inner { width: min(100% - 64px, 1140px); margin: 0 auto; }
.workflow-section__heading { text-align: center; }

.workflow-section__heading > p {
    margin: 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
    text-transform: uppercase;
}

.workflow-section__heading h2 {
    margin: 14px 0 19px;
    color: var(--ink);
    font-size: 44px;
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 48px;
}

.workflow-section__heading > span { display: block; width: 64px; height: 4px; margin: 0 auto; background: var(--gold); }

.workflow-timeline {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    margin: 78px 0 0;
    padding: 0;
    list-style: none;
}

.workflow-timeline::before {
    position: absolute;
    top: 29px;
    right: 12.5%;
    left: 12.5%;
    height: 2px;
    content: '';
    background: linear-gradient(90deg, var(--ink), var(--gold), var(--ink));
}

.workflow-step { position: relative; text-align: center; }

.workflow-step__icon {
    position: relative;
    z-index: 1;
    display: grid;
    width: 60px;
    height: 60px;
    margin: 0 auto;
    border: 5px solid #fff;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 7px 20px rgba(16, 35, 68, .1);
    place-items: center;
    transition: background-color .2s ease, box-shadow .2s ease;
}

.workflow-step__icon img {
    width: 25px;
    height: 25px;
    filter: brightness(0) saturate(100%) invert(13%) sepia(36%) saturate(1352%) hue-rotate(183deg) brightness(94%) contrast(96%);
    transition: filter .2s ease;
}

.workflow-step__content {
    position: relative;
    min-height: 175px;
    margin-top: 22px;
    padding: 28px 24px 24px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(16, 35, 68, .055);
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.workflow-step__number {
    position: absolute;
    top: 13px;
    right: 16px;
    color: rgba(16, 35, 68, .14);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .12em;
}

.workflow-step h3 { margin: 0 0 24px; color: var(--ink); font-size: 18px; font-weight: 600; letter-spacing: -.025em; line-height: 25px; }
.workflow-step p { margin: 0; color: #687386; font-size: 14px; line-height: 20px; }

.workflow-step:hover .workflow-step__content { border-color: var(--gold); box-shadow: 0 16px 34px rgba(16, 35, 68, .12); transform: translateY(-5px); }
.workflow-step:hover .workflow-step__icon { background: var(--ink); box-shadow: 0 9px 22px rgba(16, 35, 68, .2); }
.workflow-step:hover .workflow-step__icon img { filter: brightness(0) saturate(100%) invert(67%) sepia(35%) saturate(735%) hue-rotate(1deg) brightness(87%) contrast(88%); }

.testimonials { padding: 105px 0 100px; background: #faf7f8; }
.testimonials__inner { width: min(100% - 64px, 1140px); margin: 0 auto; }
.testimonials__heading { text-align: center; }

.testimonials__heading > p {
    margin: 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
    text-transform: uppercase;
}

.testimonials__heading h2 {
    margin: 14px 0 19px;
    color: var(--ink);
    font-size: 44px;
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 48px;
}

.testimonials__heading > span { display: block; width: 64px; height: 4px; margin: 0 auto; background: var(--gold); }

.testimonial-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    margin-top: 72px;
}

.testimonial-card {
    position: relative;
    height: 342px;
    margin: 0;
    padding: 55px 32px 35px;
    border: 1px solid #e5e0e1;
    border-radius: 4px;
    background: #fff;
    transition: box-shadow .2s ease;
}

.testimonial-card:hover { box-shadow: 0 12px 26px rgba(16, 35, 68, .11); }
.testimonial-card blockquote { margin: 0; }

.testimonial-quote {
    display: block;
    position: relative;
    width: 28px;
    height: 20px;
}

.testimonial-quote::before {
    position: absolute;
    top: -2px;
    left: 0;
    content: '“';
    color: var(--gold);
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 42px;
    font-weight: 700;
    line-height: .7;
}

.testimonial-card blockquote p {
    margin: 20px 0 0;
    color: #657086;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}

.testimonial-card figcaption {
    position: absolute;
    right: 32px;
    bottom: 35px;
    left: 32px;
    display: flex;
    align-items: center;
    gap: 16px;
    padding-top: 35px;
    border-top: 1px solid #e5e0e1;
}

.testimonial-card figcaption img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }
.testimonial-card figcaption div { display: grid; gap: 2px; min-width: 0; }
.testimonial-card figcaption strong { color: var(--ink); font-size: 16px; font-weight: 600; line-height: 20px; }
.testimonial-card figcaption span { color: #657086; font-size: 12px; line-height: 1.42857em; font-weight: 500; white-space: normal; }

/* More services */
.more-services { padding: 105px 0 126px; background: #faf7f8; }
.more-services__inner { width: min(100% - 64px, 1140px); margin: 0 auto; }
.more-services__heading { text-align: center; }

.more-services__heading p {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
    text-transform: uppercase;
}

.more-services__heading p::before {
    width: 70px;
    height: 1px;
    content: '';
    background: var(--gold);
}

.more-services__heading h2 {
    margin: 28px 0 19px;
    color: var(--ink);
    font-size: 44px;
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 48px;
}

.more-services__heading > span { display: block; width: 64px; height: 4px; margin: 0 auto; background: var(--gold); }

.more-services__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    margin-top: 92px;
}

.more-service-card {
    display: block;
    min-height: 322px;
    padding: 36px 34px;
    border: 1px solid #e5e0e1;
    border-radius: 4px;
    color: var(--ink);
    background: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.more-service-card:hover,
.more-service-card:focus-visible {
    position: relative;
    z-index: 1;
    border-color: var(--gold);
    box-shadow: 0 11px 25px rgba(16, 35, 68, .10);
    outline: none;
}

.more-service-card__icon {
    display: grid;
    width: 56px;
    height: 56px;
    border-radius: 4px;
    background: #faf5ed;
    place-items: center;
}

.more-service-card__icon img {
    width: 28px;
    height: 28px;
    filter: brightness(0) saturate(100%) invert(67%) sepia(35%) saturate(735%) hue-rotate(1deg) brightness(87%) contrast(88%);
}

.more-service-card h3 {
    margin: 42px 0 20px;
    color: var(--ink);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -.025em;
    line-height: 25px;
}

.more-service-card p { margin: 0; color: #687386; font-size: 14px; line-height: 23px; }

/* Services call to action */
.services-cta { padding: 124px 0; background: #fff; }
.services-cta__inner {
    display: flex;
    width: min(100% - 64px, 1200px);
    height: auto;
    margin: 0 auto;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 54px 32px;
    text-align: center;
    background: var(--ink);
}

.services-cta h2 {
    margin: 0;
    color: #fff;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 44px;
    font-weight: 600;
    letter-spacing: -.04em;
    line-height: 1.1;
}

.services-cta p {
    margin: 22px 0 26px;
    color: #c2cad8;
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
}

.services-cta a {
    display: inline-flex;
    height: auto;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px 25px;
    border-radius: 7px;
    color: var(--ink);
    background: #d3a045;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    transition: background-color .2s ease, transform .2s ease;
}

.services-cta a:hover,
.services-cta a:focus-visible { color: var(--ink); background: #e1b25c; transform: translateY(-2px); }
.services-cta a span { font-size: 26px; font-weight: 400; line-height: .6; }

/* Software platforms */
.platforms-section { padding: 126px 0 118px; background: #fff; }
.platforms-section__inner { width: min(100% - 64px, 1140px); margin: 0 auto; }
.platforms-section__heading { text-align: center; }

.platforms-section__heading p {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
    text-transform: uppercase;
}

.platforms-section__heading p::before {
    width: 70px;
    height: 1px;
    content: '';
    background: var(--gold);
}

.platforms-section__heading h2 {
    margin: 30px 0 17px;
    color: var(--ink);
    font-size: 44px;
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 48px;
}

.platforms-section__heading > span {
    display: block;
    color: #657086;
    font-size: 16px;
    font-weight: 500;
    line-height: 26px;
}

.platforms-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
    margin-top: 72px;
}

.platform-card {
    min-height: 251px;
    padding: 35px;
    border: 1px solid #e1e6ed;
    border-radius: 4px;
    background: #f0f6fd;
    transition: transform 0.25s ease, border-color .25s ease, box-shadow .25s ease;
}

.platform-card:hover {
    transform: scale(1.05);
    position: relative;
    z-index: 1;
    border-color: var(--gold);
    box-shadow: 0 11px 25px rgba(16, 35, 68, .10);
}
.platform-card:focus-within {
    position: relative;
    z-index: 1;
    border-color: var(--gold);
    box-shadow: 0 11px 25px rgba(16, 35, 68, .10);
}

.platform-card__title { display: flex; align-items: center; gap: 20px; }

.platform-card__icon {
    display: grid;
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    border-radius: 4px;
    background: var(--ink);
    place-items: center;
}

.platform-card__icon img {
    width: 28px;
    height: 28px;
    filter: brightness(0) saturate(100%) invert(67%) sepia(35%) saturate(735%) hue-rotate(1deg) brightness(87%) contrast(88%);
}

.platform-card h3 {
    margin: 0;
    color: var(--ink);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -.025em;
    line-height: 25px;
}

.platform-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 10px;
    margin: 28px 0 0;
    padding: 0;
    list-style: none;
}

.platform-card__tags li {
    min-height: 25px;
    padding: 3px 15px;
    border: 1px solid #dbe2eb;
    border-radius: 999px;
    color: var(--ink);
    background: #fff;
    font-size: 13px;
    font-weight: 600;
    line-height: 17px;
    white-space: nowrap;
}

/* Software tool CTA */
.tool-cta { padding: 130px 0 125px; background: #f0f6fd; }
.tool-cta__inner {
    width: min(100% - 64px, 1140px);
    margin: 0 auto;
    text-align: center;
}

.tool-cta p {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 0;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .2em;
    line-height: 19px;
    text-transform: uppercase;
}

.tool-cta p::before {
    width: 70px;
    height: 1px;
    content: '';
    background: var(--gold);
}

.tool-cta h2 {
    margin: 32px 0 18px;
    color: var(--ink);
    font-size: 44px;
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 48px;
}

.tool-cta > .tool-cta__inner > span {
    display: block;
    color: #657086;
    font-size: 16px;
    font-weight: 500;
    line-height: 26px;
}

.tool-cta a {
    display: inline-flex;
    height: auto;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-top: 42px;
    padding: 15px 25px;
    border-radius: 7px;
    color: #fff;
    background: var(--ink);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.42857em;
    transition: background-color .2s ease, transform .2s ease;
}

.tool-cta a:hover,
.tool-cta a:focus-visible { color: #fff; background: var(--ink-hover); transform: translateY(-2px); }
.tool-cta a b { font-size: 26px; font-weight: 400; line-height: .6; }

/* Privacy Policy */
.policy-content { padding: 90px 0 128px; background: #fff; }
.policy-content__inner { width: min(100% - 64px, 1140px); margin: 0 auto; }

.policy-intro {
    max-width: 1000px;
    margin: 0 0 68px;
    padding: 30px 34px;
    border-left: 4px solid var(--gold);
    color: #526177;
    background: #f0f6fd;
    font-size: 16px;
    font-weight: 500;
    line-height: 28px;
}

.policy-layout {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    align-items: start;
    gap: 70px;
}

.policy-toc {
    position: sticky;
    top: calc(var(--header-height) + 28px);
    padding: 24px;
    border: 1px solid #e1e6ed;
    border-radius: 4px;
    background: #fafcff;
}

.policy-toc > p {
    margin: 0 0 16px;
    color: var(--gold);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .18em;
    line-height: 17px;
    text-transform: uppercase;
}

.policy-toc nav { display: grid; }

.policy-toc a {
    padding: 9px 0;
    border-top: 1px solid #e7ebf0;
    color: #5d6a7e;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
    transition: color .2s ease;
}

.policy-toc a:hover,
.policy-toc a:focus-visible { color: var(--gold); }

.policy-articles article {
    padding: 33px 0 36px;
    border-top: 1px solid #e1e6ed;
    scroll-margin-top: calc(var(--header-height) + 24px);
}

.policy-articles article:first-child { padding-top: 0; border-top: 0; }

.policy-articles article > span {
    display: block;
    color: var(--gold);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .18em;
    line-height: 19px;
}

.policy-articles h2 {
    margin: 9px 0 15px;
    color: var(--ink);
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -.03em;
    line-height: 34px;
}

.policy-articles article > p {
    max-width: 785px;
    margin: 0;
    color: #5f6d81;
    font-size: 16px;
    font-weight: 500;
    line-height: 26px;
}

.policy-contact-card {
    margin-top: 16px;
    padding: 38px 40px !important;
    border: 0 !important;
    border-radius: 4px;
    background: var(--ink);
}

.policy-contact-card h2 { color: #fff; }
.policy-contact-card > p { color: #c2cad8 !important; }
.policy-contact-card a { color: #e1b25c; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* Contact page */
.contact-section { padding: 84px 0 100px; background: #fff; scroll-margin-top: calc(var(--header-height) + 24px); }
.contact-section__inner { width: min(100% - 64px, 1140px); margin: 0 auto; }
.contact-page-section { padding: 206px 0 120px; }
.contact-page-section .contact-layout { margin-top: 0; }
.contact-section__heading { text-align: center; }
.contact-section__heading > p { margin: 0; color: var(--gold); font-size: 13px; font-weight: 700; letter-spacing: .2em; line-height: 19px; text-transform: uppercase; }
.contact-section__heading h1, .contact-section__heading h2 { margin: 14px 0 19px; color: var(--ink); font-size: 44px; font-weight: 700; letter-spacing: -.035em; line-height: 48px; }
.contact-section__heading > span { display: block; width: 64px; height: 4px; margin: 0 auto; background: var(--gold); }

.contact-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 42px; margin-top: 82px; }
.contact-details { display: flex; flex-direction: column; gap: 24px; }
.contact-detail { display: flex; align-items: center; gap: 16px; min-height: 94px; padding: 20px 24px; border: 1px solid #e5e0e1; border-radius: 4px; color: var(--ink); transition: border-color .2s ease, box-shadow .2s ease; }
.contact-detail:hover { border-color: var(--gold); box-shadow: 0 10px 22px rgba(16, 35, 68, .08); }
.contact-detail__icon { display: grid; width: 40px; height: 40px; flex: 0 0 40px; place-items: center; border-radius: 4px; background: var(--ink); }
.contact-detail__icon img { width: 21px; height: 21px; filter: brightness(0) saturate(100%) invert(68%) sepia(36%) saturate(710%) hue-rotate(0deg) brightness(89%) contrast(88%); }
.contact-detail > span:last-child { display: grid; gap: 5px; min-width: 0; }
.contact-detail small { color: #687386; font-size: 14px; line-height: 18px; }
.contact-detail strong { color: var(--ink); font-size: 14px; font-weight: 600; line-height: 20px; }
.contact-map { height: 300px; overflow: hidden; border: 1px solid #e5e0e1; border-radius: 4px; }
.contact-map iframe { display: block; width: 100%; height: 100%; border: 0; }

.contact-form { min-height: 476px; padding: 17px 12px 24px; border: 2px solid #e5e0e1; background: #fff; }
.contact-form__notice { margin: 0 0 16px; padding: 12px 14px; border: 1px solid; border-radius: 4px; font-size: 14px; line-height: 20px; }
.contact-form__submit + .contact-form__notice { margin: 16px 0 0; }
.contact-form__notice--success { border-color: #9cc9a9; color: #155724; background: #edf8ef; }
.contact-form__notice--error { border-color: #e6aaaa; color: #8a1f1f; background: #fff1f1; }
.contact-form__honeypot { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.contact-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 38px; }
.contact-form label { display: grid; gap: 5px; color: var(--ink); font-size: 16px; line-height: 20px; }
.contact-form label b { color: #e14343; font-weight: 500; }
.contact-form input, .contact-form select, .contact-form textarea { width: 100%; border: 1px solid #e1dfe0; border-radius: 4px; outline: 0; color: #101010; background: #fbfafb; font: inherit; font-size: 14px; line-height: 20px; }
.contact-form input, .contact-form select { height: 38px; padding: 8px 10px; }
.contact-form select { appearance: auto; background: #fff; }
.contact-form textarea { height: 126px; padding: 10px; resize: vertical; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: #687386; opacity: 1; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(211, 160, 69, .14); }
.contact-form__full { margin-top: 38px; }
.contact-form__submit { margin-top: 38px; padding: 12px; border: 0; border-radius: 2px; color: #fff; background: var(--ink); font-size: 14px; font-weight: 600; line-height: 20px; cursor: pointer; transition: background .2s ease, transform .2s ease; }
.contact-form__submit:hover, .contact-form__submit:focus-visible { background: var(--ink-hover); transform: translateY(-1px); }

.site-footer {margin-top: auto; padding-bottom: 24px; color: #c2cad8;background: var(--ink);
}

.site-footer__inner {width: min(100% - 64px, 1856px);margin: 0 auto;padding: 84px 0 55px;
}

.footer-grid {display: grid;grid-template-columns: 1.05fr 1fr 1.05fr 1.03fr;gap: clamp(36px, 4.35vw, 84px);
}

.footer-logo { display: inline-flex; }

.footer-logo img {display: cover;width: 150px;height: 56px;
}

.footer-about p {
    max-width: 390px;
    margin: 24px 0 0;
    color: #b8c2d1;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.42857em;
}

.footer-grid h2 {
    margin: 0 0 4px;
    color: #c9ced7;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.42857em;
    text-transform: uppercase;
}

.footer-nav { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }

.footer-nav a, .footer-contact a {
    color: #bdc6d4;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.42857em;
    transition: color .2s ease;
}

.footer-nav a:hover, .footer-nav a:focus-visible { color: var(--gold); }
.footer-contact a:hover, .footer-contact a:focus-visible { color: #fff; }

.footer-contact { display: flex; flex-direction: column; gap: 14px; font-style: normal; }
.footer-contact a { display: flex; align-items: flex-start; gap: 12px; }
.footer-contact img { width: 20px; height: 20px; margin-top: 1px; filter: brightness(0) invert(1); opacity: .88; }
.footer-contact span { margin: 0 2px; }
.footer-address { max-width: 380px; line-height: 24px !important; }

.footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid rgba(197, 207, 222, .17);
    color: #aeb9c9;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.42857em;
}

.footer-bottom p { margin: 0; }
.footer-bottom div { display: flex; align-items: center; gap: 10px; }
.footer-bottom a:hover, .footer-bottom a:focus-visible { color: #fff; }

.whatsapp-chat {
    position: fixed;
    z-index: 90;
    right: 26px;
    bottom: 27px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    min-width: 0;
    padding: 9px 18px;
    border-radius: 999px;
    color: #fff;
    background: #25d366;
    box-shadow: 0 12px 28px rgba(19, 79, 47, .2);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2;
    transition: background-color .2s ease, transform .2s ease;
}

.whatsapp-chat:hover, .whatsapp-chat:focus-visible { background: #1dbb58; transform: translateY(-2px); }
.whatsapp-chat img { width: 20px; height: 20px; filter: brightness(0) invert(1); }

/* Reference desktop: 32px outer gutter and the exact four footer column starts. */
@media (min-width: 1600px) {
    .footer-grid {
        grid-template-columns: 390px 388px 389px minmax(0, 1fr);
        gap: 83px;
    }
}
