/*
 * General Attestation public verification page (owner's design).
 * Measurements come from the owner's Redmi Note 10 Pro screenshots,
 * converted to CSS pixels (phone width = 393 px).
 */
* { box-sizing: border-box; }

body.ga {
    margin: 0;
    background: #f4f7f2;
    color: #3b4a41;
    font-family: Roboto, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* ---------- Header ---------- */
.ga-header {
    display: flex;
    align-items: center;
    height: 96px;
    padding: 0 16px;
    background: #fff;
    border-bottom: 3px solid #a3b98c;
}
.ga-logo {
    flex: 0 0 50px;
    width: 50px;
    height: 64px;
    margin-right: 11px;
}
.ga-logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ga-brand {
    color: #0f4a2b;
    font-size: 16.4px;
    font-weight: 500; /* first line: same weight as the breadcrumb (owner's request) */
    line-height: 21px;
}
.ga-brand div + div { font-weight: 400; } /* second line: regular, like the form labels */
.ga-menu {
    margin-left: auto;
    flex: 0 0 34px;
    width: 34px;
    height: 33px;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4.5px;
    background: #f1f5f0;
    border: 1px solid #d3ded5;
    border-radius: 7px;
    cursor: pointer;
}
.ga-menu span { display: block; width: 15px; height: 1.6px; border-radius: 1px; background: #6d8a78; }

/* ---------- Hero ---------- */
.ga-hero {
    position: relative;
    overflow: hidden;
    padding: 23px 16px 56px;
    background: linear-gradient(135deg, #033f1e 0%, #0a5631 45%, #237c50 100%);
    color: #fff;
}
.ga-hero > *:not(.ga-hero-ring) { position: relative; }
.ga-hero-ring {
    position: absolute;
    right: -116px;
    top: 219px;
    width: 344px;
    height: 344px;
    border: 46px solid rgba(255, 255, 255, .065);
    border-radius: 50%;
    pointer-events: none;
}
.ga-breadcrumb {
    font-size: 13.5px;
    font-weight: 500;
    line-height: 18px;
    color: #c3d6c9;
}
.ga-breadcrumb .sep { margin: 0 9px; color: #b4c9bb; }

.ga-badge {
    position: absolute !important;
    top: 90px;
    right: 18px;
    width: 79px;
    height: 79px;
    border-radius: 50%;
    background: #9dbfae; /* light outer ring (owner's picture) */
    display: flex;
    align-items: center;
    justify-content: center;
}
.ga-badge::before { /* darker inner ring */
    content: '';
    position: absolute;
    width: 61px;
    height: 61px;
    border-radius: 50%;
    background: #76a690;
}
.ga-badge-inner {
    position: relative;
    width: 49px;
    height: 49px;
    border-radius: 11px;
    background: #075f35;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ga-eyebrow {
    margin: 51px 0 0;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: .19em;
    text-transform: uppercase;
    color: #8ccf8e;
}
.ga-title {
    max-width: 262px;
    margin: 25px 0 0;
    font-size: 33px;
    font-weight: 700;
    line-height: 37px;
    letter-spacing: -.8px;
}
.ga-title span {
    display: block;
    font-family: "Noto Serif", Georgia, serif;
    font-size: 32px;
    font-weight: 400;
    letter-spacing: -.5px;
    color: #a9dc9f;
}
.ga-lead {
    max-width: 262px;
    margin: 23px 0 0;
    font-size: 16.4px;
    line-height: 30px;
    color: #d9e6dd;
}

/* ---------- Main ---------- */
.ga-main { padding: 41px 16px 0; }

.ga-match {
    padding: 25px 20px 18px;
    background: #f0f8f1;
    border: 1px solid #dde8de;
    border-left: 4px solid #3f7d57;
    border-radius: 8px;
}
.ga-match-label {
    margin: 0;
    font-size: 12.2px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: #3f7d57;
}
.ga-match-text {
    margin: 11px 0 0;
    font-size: 16px;
    line-height: 27px;
    color: #3b4a41;
}
.ga-match-text strong { color: #1d2b23; font-weight: 600; }

/* ---------- Part 2: cards ---------- */
.ga-card {
    margin-top: 34px;
    background: #fff;
    border: 1px solid #e3e8e4;
    border-radius: 8px;
    overflow: hidden;
}
.ga-card-label {
    margin: 0;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #5b8a6e;
}

/* Verification record */
.ga-card-head {
    padding: 27px 18px 20px;
    border-bottom: 1px solid #eceeec;
}
.ga-card-title {
    margin: 10px 0 0;
    font-size: 21.2px;
    font-weight: 700;
    line-height: 26px;
    color: #15402f;
}
.ga-cert {
    margin: 13px 12px 12px;
    padding: 14px 12px 13px;
    background: #fbfaf8;
    border: 1px solid #dddcd6;
}
.ga-cert-emblem {
    width: 57px;
    height: 65px;
    margin: 0 auto;
}
.ga-cert-emblem img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ga-cert-title {
    margin: 17px 0 0;
    font-family: "Noto Serif", Georgia, serif;
    font-size: 26px;
    font-weight: 700;
    line-height: 29px;
    letter-spacing: .03em;
    text-align: center;
    text-transform: uppercase;
    color: #1d4d33;
}
.ga-cert-sub {
    margin: 8px 0 0;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #555c58;
}
.ga-rows { margin: 22px 0 0; }
.ga-row {
    padding: 17px 12px 23px;
    border-top: 1px solid #c9d0cb;
}
.ga-row dt {
    font-size: 13.2px;
    line-height: 20px;
    color: #666b68;
}
.ga-row dd {
    margin: 7px 0 0;
    font-size: 16.3px;
    font-weight: 500;
    line-height: 24px;
    color: #1d3a29;
    overflow-wrap: anywhere;
}
.ga-row-officer { padding-bottom: 18px; }
.ga-row-officer dd {
    margin-top: 3.5px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 133px;
    align-items: center;
    column-gap: 8px;
}
.ga-officer-name { max-width: 150px; line-height: 25.7px; }
.ga-officer-sign {
    justify-self: center;
    max-width: 95px;
    max-height: 40px;
    display: block;
}
.ga-officer-role {
    grid-column: 1 / -1;
    margin-top: 8px;
    font-size: 13.2px;
    font-weight: 400;
    line-height: 20px;
    color: #666b68;
}
.ga-cert-note {
    margin: 0;
    padding: 16px 0 0 10px;
    border-top: 1px solid #c9d0cb;
    font-size: 13.8px;
    line-height: 21.5px;
    color: #3a3f3c;
}

/* Supporting document */
.ga-card.ga-doc { margin-top: 26px; }
.ga-doc-head { padding: 25px 18px 19px; }
.ga-doc-label { font-size: 11.2px; letter-spacing: .12em; color: #3f7d57; }
.ga-doc-title {
    margin: 9px 0 0;
    font-size: 21px;
    font-weight: 700;
    line-height: 28px;
    color: #1b3f2b;
}
.ga-doc-open {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 15px;
    height: 41px;
    padding: 0 12px;
    border: 1px solid #d5ddd7;
    border-radius: 7px;
    background: #fff;
    color: #17643c;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}
.ga-doc-open span { font-size: 13px; }
.ga-doc-missing { margin: 16px 0 0; color: #666b68; }
.ga-doc-frame {
    display: block;
    width: 100%;
    height: 760px;
    border: 0;
    background: #202125;
}

/* ---------- Part 3: verify another + help ---------- */
.ga-after {
    margin: 34px -3.5px 0;
    padding: 29px 0 40px;
    border-top: 1px solid #e3e7e0;
    text-align: center;
}
.ga-verify-another {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 290px;
    height: 55px;
    margin: 0 auto;
    background: #04401e;
    border-radius: 4px;
    color: #fff;
    font-size: 16.5px;
    font-weight: 500;
    text-decoration: none;
}
.ga-help {
    margin: 18px auto 0;
    max-width: 345px;
    font-size: 15px;
    line-height: 23.4px;
    color: #6b716d;
}

/* ---------- Part 3: footer ---------- */
.ga-footer {
    padding: 28px 12.5px 0;
    background: #063d1d;
    color: #c4d3c9;
}
.ga-footer a { color: inherit; text-decoration: none; }
.ga-foot-brand {
    display: flex;
    align-items: center;
    margin: 0;
    font-size: 15.5px;
    font-weight: 700;
    line-height: 22px;
    letter-spacing: .01em;
    text-transform: uppercase;
    color: #fff;
}
.ga-foot-brand span {
    width: 23px;
    height: 4.6px;
    margin-right: 9px;
    background: #fff;
}
.ga-foot-site {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    margin: 9px 0 0 32px;
    font-size: 10.2px;
    line-height: 20px;
    color: #a7bcae !important;
}
.ga-foot-org {
    display: flex;
    align-items: center;
    margin-top: 24px;
}
.ga-foot-logo {
    flex: 0 0 66px;
    width: 66px;
    height: 74px;
    margin-left: -1px;
    margin-right: 5px;
}
.ga-foot-logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ga-foot-name {
    font-size: 13.7px;
    font-weight: 500;
    line-height: 19.4px;
    color: #fff;
}
.ga-foot-tag {
    margin: 14px 0 0;
    font-size: 12.2px;
    line-height: 23.4px;
    color: #c2d1c7;
}
.ga-foot-links {
    display: flex;
    flex-wrap: wrap;
    column-gap: 21px;
    padding: 7px 0 9.5px;
    border-top: 1px solid #356c4c;
}
.ga-foot-links a {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    font-size: 11.3px;
    line-height: 32px;
}
.ga-foot-links-first { margin-top: 11.5px; border-top: 0; }
.ga-foot-links:last-child { padding-bottom: 24.5px; }
.ga-foot-break { flex-basis: 100%; height: 0; }

/* ---------- Part 3: copyright bar ---------- */
.ga-copy {
    padding: 19px 12.5px 24px;
    background: #f3f4ef;
}
.ga-copy p {
    margin: 0;
    font-size: 10.7px;
    line-height: 17px;
    color: #4f5551;
}
.ga-copy .ga-powered { margin-top: 8.7px; font-size: 10.4px; color: #8a908c; }
/* ---------- Apostille certificate panel (owner's Apostille screenshot) ---------- */
.ap-cert-title {
    font-size: 32px;
    letter-spacing: .1em;
}
.ap-cert-sub { font-size: 12.1px; }
.ap-row {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    padding: 11px 12px 11px;
    border-top: 1px solid #c9d0cb;
}
.ap-num {
    grid-row: 1;
    font-size: 13.2px;
    line-height: 20px;
    color: #8a8f8c;
}
.ap-row dt {
    grid-column: 2;
    font-size: 13.2px;
    line-height: 20px;
    color: #666b68;
}
.ap-row dd {
    grid-column: 2;
    margin: 3.6px 0 0;
    font-size: 16.3px;
    font-weight: 500;
    line-height: 24px;
    color: #1d3a29;
    overflow-wrap: anywhere;
}
.ap-row-inline {
    display: block;
    padding: 12.4px 12px 15px 16px;
    font-size: 13.2px;
    line-height: 20px;
}
.ap-row-inline dt, .ap-row-inline dd {
    display: inline;
    margin: 0;
    font-size: inherit;
    line-height: inherit;
}
.ap-row-inline dt { color: #444a46; }
.ap-row-inline dd { font-weight: 600; color: #1d3a29; }
.ap-certified {
    height: 43px;
    border-top: 1px solid #c9d0cb;
    background: #e7eee5;
    font-family: "Noto Serif", Georgia, serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 43px;
    text-align: center;
    color: #1d4d33;
}
.ap-row-officer .ga-officer-sign {
    justify-self: end;
    margin-right: 12px;
    max-height: 60px;
}
/* ---------- PDF box on phones (owner's picture: large "Open" button) ---------- */
.ga-doc-preview {
    height: 760px;
    padding: 277px 7.6px 0;
    background: #202124;
    text-align: center;
}
.ga-pdf-icon {
    width: 36px;
    height: 36px;
    margin: 0 auto;
    border-radius: 4px;
    background: #2a2b2e;
    color: #1d1e21;
    font-size: 12px;
    font-weight: 700;
    line-height: 36px;
}
.ga-pdf-name {
    margin: 22px 0 0;
    font-size: 15.5px;
    line-height: 20px;
    color: #9aa0a6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ga-pdf-open {
    display: block;
    height: 49px;
    margin-top: 13px;
    border-radius: 25px;
    background: #8ab4f8;
    color: #202124;
    font-size: 15.5px;
    font-weight: 500;
    line-height: 49px;
    text-decoration: none;
}
.ga-doc-frame { display: none; }
@media (min-width: 700px) {
    .ga-doc-preview { display: none; }
    .ga-doc-frame { display: block; }
}
/* ---------- "Verify by number and date" page (owner's screenshots) ---------- */
.ga-hero-form { border-bottom: 3px solid #54a361; }
.vf-main { padding: 29.5px 18.5px 29px; background: #fff; }

.vf-intro {
    padding: 24.5px 23.5px 24px;
    background: linear-gradient(180deg, #e3f2df 0%, #eef6ec 100%);
    border: 1px solid #d3e6d1;
    border-radius: 8px;
}
.vf-tile {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 57px;
    height: 56px;
    background: #c8e6c4;
    border: 1px solid #b3d6b0;
    border-radius: 8px;
    color: #2e7d4a;
}
.vf-intro-title {
    margin: 22px 0 0;
    font-size: 29px;
    font-weight: 700;
    line-height: 34px;
    color: #0e4d2c;
}
.vf-intro-text {
    margin: 22px 0 0;
    font-size: 15.8px;
    line-height: 26.2px;
    color: #5f6b62;
}
.vf-switch {
    position: relative;
    display: block;
    margin-top: 30px;
    padding: 23px 50px 23px 19px;
    background: #fff;
    border: 1px solid #d5e3d5;
    border-radius: 8px;
    text-decoration: none;
}
.vf-switch-q { display: block; font-size: 11.5px; line-height: 16px; color: #8a948d; }
.vf-switch-a { display: block; margin-top: 12px; font-size: 12.5px; font-weight: 700; line-height: 16px; color: #0e5f34; }
.vf-switch-arrow { position: absolute; right: 20px; bottom: 16px; color: #3d6a53; }
.vf-lock {
    display: flex;
    gap: 15px;
    margin-top: 27px;
    padding: 16px 33px 16px 19px;
    background: #f5faf4;
    border: 1px solid #dde9dc;
    border-radius: 8px;
    color: #7a8a92;
}
.vf-lock svg { flex: 0 0 16px; margin-top: 5.5px; }
.vf-lock p { margin: 0; font-size: 15.3px; line-height: 26px; }

.vf-card {
    margin-top: 25.7px;
    padding: 32.5px 20px 26px;
    background: #fff;
    border: 1px solid #e3e8e4;
    border-top: 4.4px solid #3f9a55;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .04);
}
.vf-card-label {
    margin: 0;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: #3f8c5b;
}
.vf-card-title {
    margin: 19.5px 0 0;
    font-size: 28px;
    font-weight: 700;
    line-height: 32px;
    color: #0e4d2c;
}
.vf-error {
    margin-top: 16px;
    padding: 11px 13px;
    background: #fdf1ef;
    border: 1px solid #f2c8c1;
    border-radius: 8px;
    font-size: 14px;
    line-height: 20px;
    color: #9b2c20;
}
.vf-label {
    display: block;
    margin-top: 30.5px;
    font-size: 15.5px;
    font-weight: 600;
    line-height: 20px;
    color: #1b4a30;
}
.vf-label-date { margin-top: 24px; }
.vf-req { margin-left: 6px; color: #d23a2f; }
.vf-input {
    display: block;
    width: 100%;
    height: 57px;
    margin-top: 12px;
    padding: 0 15px;
    background: #f5faf3;
    border: 1px solid #c8dccb;
    border-radius: 8px;
    font: inherit;
    font-size: 16px;
    font-weight: 500;
    color: #1f2b25;
    -webkit-appearance: none;
    appearance: none;
}
.vf-input::placeholder { color: #4c5a5f; opacity: 1; }
.vf-input:focus { outline: 2px solid #3f9a55; outline-offset: 0; border-color: #3f9a55; }
.vf-input-date { height: 60.6px; color: #4c5a5f; }
.vf-field-error { margin: 6px 0 0; font-size: 13px; color: #b42318; }
.vf-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    width: 100%;
    height: 55px;
    margin-top: 22.5px;
    background: #0c5e33;
    border: 0;
    border-radius: 3px;
    color: #fff;
    font: inherit;
    font-size: 16.3px;
    font-weight: 600;
    cursor: pointer;
}
.vf-note {
    margin: 26px 0 0;
    padding-top: 23px;
    border-top: 1px solid #e6ebe7;
    font-size: 15.9px;
    line-height: 25.7px;
    color: #8b9690;
}
.vf-band { height: 59px; background: #f1f8f1; border-top: 1px solid #e8eee8; }
/* ---------- Hamburger menu (owner's screenshots) ---------- */
.ga-header { position: relative; }
.ga-nav {
    position: absolute;
    z-index: 50;
    top: 93px;
    left: 18px;
    right: 18px;
}
.ga-nav[hidden], .ga-nav-sub[hidden] { display: none; }
.ga-nav-item {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    height: 49px;
    padding: 0 18px;
    background: #003d1b;
    border: 0;
    color: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}
.ga-nav-verify.is-open {
    height: 169.4px;
    background: #20643f;
    border-bottom: 4.4px solid #c8e3a2;
}
.ga-nav-sub {
    padding: 8.5px 0;
    background: #fff;
    border: 1px solid #e4e6e3;
    border-top: 0;
    box-shadow: 0 8px 16px rgba(0, 0, 0, .08);
}
.ga-nav-sub a {
    display: block;
    padding: 0 20.8px;
    font-size: 16.5px;
    font-weight: 500;
    line-height: 51px;
    color: #173f2a;
    text-decoration: none;
}