
    :root {
        --navy: #083867;
        --deep: #052b50;
        --blue: #0b5a9e;
        --bright: #1685c7;
        --gold: #d5ad57;
        --text: #26384d;
        --muted: #6d7c8d;
        --line: #dce5ed;
        --pale: #f4f7fa;
        --white: #fff
    }

    * {
        box-sizing: border-box
    }

    html {
        scroll-behavior: smooth
    }

    body {
        margin: 0;
        color: var(--text);
        background: #fff;
        font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        line-height: 1.65
    }

    .wrap {
        width: min(1200px, calc(100% - 40px));
        margin: auto
    }

    .topbar {
        background: var(--deep);
        color: #cbd8e4;
        font-size: 12px
    }

    .topbar-inner {
        height: 36px;
        display: flex;
        align-items: center;
        justify-content: space-between
    }

    .topbar a {
        color: #fff;
        text-decoration: none
    }

    .site-header {
        background: #fff;
        position: relative;
        z-index: 20
    }

    .nav {
        height: 86px;
        display: flex;
        align-items: center;
        justify-content: space-between
    }

    .brand {
        display: flex;
        align-items: center;
        gap: 13px;
        text-decoration: none;
        color: var(--navy)
    }

    .brand-mark {
        width: 48px;
        height: 48px;
        display: grid;
        place-items: center;
        background: var(--navy);
        color: #fff;
        font-size: 20px;
        font-weight: 700;
        letter-spacing: 1px
    }

    .brand-copy {
        display: flex;
        flex-direction: column;
        line-height: 1.15
    }

    .brand-copy strong {
        font-size: 17px;
        letter-spacing: .08em
    }

    .brand-copy small {
        font-size: 10px;
        color: #8290a0;
        margin-top: 5px;
        letter-spacing: .03em
    }

    .hero {
        position: relative;
        overflow: hidden;
        color: #fff;
        background: linear-gradient(118deg, var(--deep) 0%, var(--navy) 58%, #0a477b 100%)
    }

    .hero:after {
        content: "";
        position: absolute;
        inset: 0 0 0 52%;
        background: linear-gradient(135deg, transparent, rgba(255, 255, 255, .05));
        clip-path: polygon(34% 0, 100% 0, 100% 100%, 0 100%)
    }

    .hero-grid {
        min-height: 620px;
        display: grid;
        grid-template-columns: 1.45fr .75fr;
        gap: 80px;
        align-items: center;
        position: relative;
        z-index: 2
    }

    .eyebrow,
    .section-tag {
        font-size: 12px;
        font-weight: 700;
        letter-spacing: .16em;
        color: var(--gold);
        margin: 0 0 13px
    }

    .hero h1 {
        font-size: 58px;
        line-height: 1.12;
        margin: 0 0 22px;
        font-weight: 700;
        letter-spacing: -.025em
    }

    .hero h1 span {
        color: #fff
    }

    .lead {
        font-size: 21px;
        margin: 0 0 13px;
        color: #f0f5fa
    }

    .hero-text {
        max-width: 760px;
        color: #c8d7e5;
        font-size: 15px
    }

    .hero-actions {
        display: flex;
        gap: 13px;
        margin: 32px 0
    }

    .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 48px;
        padding: 0 23px;
        border: 1px solid transparent;
        text-decoration: none;
        font-size: 13px;
        font-weight: 700;
        cursor: pointer;
        transition: .2s
    }

    .btn-primary {
        background: var(--bright);
        color: #fff
    }

    .btn-primary:hover {
        background: #0875b4
    }

    .btn-secondary {
        background: var(--navy);
        color: #fff
    }

    .btn-outline {
        border-color: rgba(255, 255, 255, .65);
        color: #fff;
        background: transparent
    }

    .btn-white {
        background: #fff;
        color: var(--navy)
    }

    .hero-stats {
        display: flex;
        gap: 38px;
        padding-top: 18px;
        border-top: 1px solid rgba(255, 255, 255, .18);
        font-size: 10px;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: #b9cada
    }

    .hero-stats b {
        display: block;
        font-size: 23px;
        color: #fff;
        letter-spacing: 0
    }

    .hero-card {
        background: #fff;
        color: var(--text);
        padding: 39px;
        border-top: 4px solid var(--bright);
        box-shadow: 0 22px 55px rgba(0, 0, 0, .22)
    }

    .card-label {
        font-size: 10px;
        color: var(--blue);
        font-weight: 700;
        letter-spacing: .14em
    }

    .hero-card h2 {
        font-size: 28px;
        line-height: 1.3;
        color: var(--navy);
        margin: 17px 0
    }

    .hero-card p {
        font-size: 14px;
        color: var(--muted)
    }

    .hero-card a {
        display: inline-flex;
        gap: 10px;
        color: var(--blue);
        font-size: 13px;
        font-weight: 700;
        text-decoration: none;
        margin-top: 9px
    }

    .section {
        padding: 92px 0
    }

    .intro-section {
        padding-bottom: 58px
    }

    .intro-grid {
        display: grid;
        grid-template-columns: 1.15fr .85fr;
        gap: 80px;
        align-items: end
    }

    .intro-grid h2,
    .section-heading h2,
    .service-intro h2 {
        font-size: 42px;
        line-height: 1.22;
        color: var(--navy);
        margin: 0
    }

    .intro-grid>p {
        margin: 0;
        color: var(--muted);
        font-size: 16px
    }

    .category-section {
        background: var(--pale);
        padding: 55px 0 95px
    }

    .category-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 18px
    }

    .category-card {
        background: #fff;
        border: 1px solid #e0e7ee;
        min-height: 250px;
        padding: 22px 22px 48px;
        position: relative;
        cursor: pointer;
        transition: .23s
    }

    .category-card.compact-card {
        min-height: 205px
    }

    .category-card.compact-card ul {
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        padding-top: 0;
        transition: max-height .28s ease, opacity .2s ease, padding .2s ease
    }

    .category-card.compact-card.expanded ul {
        max-height: 520px;
        opacity: 1;
        padding-top: 15px
    }

    .category-card .sub-toggle {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        margin-top: 14px;
        padding: 7px 10px;
        border: 1px solid #d6e2eb;
        background: #f5f9fc;
        color: var(--blue);
        font-size: 11px;
        font-weight: 700;
        cursor: pointer
    }

    .category-card .sub-toggle:after {
        content: "+";
        font-size: 14px;
        line-height: 1
    }

    .category-card.expanded .sub-toggle:after {
        content: "−"
    }

    .category-icon {
        transition: .23s
    }

    .category-card:hover,
    .category-card.active {
        transform: translateY(-4px);
        border-color: var(--bright);
        box-shadow: 0 16px 38px rgba(8, 56, 103, .12)
    }

    .category-card-head {
        display: flex;
        align-items: center;
        gap: 15px;
        border-bottom: 1px solid #e7edf2;
        padding-bottom: 16px
    }

    .category-icon {
        width: 62px;
        height: 62px;
        flex: 0 0 62px;
        display: grid;
        place-items: center;
        border-radius: 50%;
        background: linear-gradient(145deg, #f4f9fc, #e6f0f7);
        border: 1px solid #d9e6ef;
        box-shadow: inset 0 1px 0 #fff, 0 7px 18px rgba(8, 56, 103, .08);
        font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;
        font-size: 31px;
        line-height: 1
    }

    .category-title {
        min-width: 0;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 7px
    }

    .category-card .num {
        width: auto;
        height: auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: transparent;
        color: var(--blue);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .12em
    }

    .category-card .num:before {
        content: "CATEGORY "
    }

    .category-card h3 {
        font-size: 16px;
        line-height: 1.35;
        color: var(--navy);
        margin: 0
    }

    .category-card:hover .category-icon,
    .category-card.active .category-icon {
        background: linear-gradient(145deg, #fff, #edf7fc);
        border-color: #9dd2ed;
        transform: scale(1.04)
    }

    .category-card ul {
        list-style: none;
        padding: 15px 0 0;
        margin: 0;
        display: grid;
        gap: 7px
    }

    .category-card li {
        font-size: 12px;
        color: #66778a;
        display: flex;
        gap: 9px
    }

    .category-card li b {
        color: var(--blue);
        min-width: 35px
    }

    .category-card .arrow {
        position: absolute;
        right: 20px;
        bottom: 14px;
        color: var(--bright);
        font-weight: 700
    }

    .search-section {
        background: linear-gradient(120deg, var(--deep), var(--navy));
        color: #fff
    }

    .search-section .section-heading h2 {
        display: inline-block;
        max-width: 920px;
        padding: 13px 22px 15px;
        background: rgba(255, 255, 255, .98);
        color: var(--navy);
        box-shadow: 0 10px 28px rgba(0, 0, 0, .18);
        text-shadow: none;
        line-height: 1.15
    }

    .search-section .section-heading.centered {
        max-width: 980px
    }

    .search-section .section-heading.centered p:not(.section-tag) {
        max-width: 820px;
        margin: 18px auto 0
    }

    .section-heading {
        max-width: 820px;
        margin-bottom: 38px
    }

    .section-heading.centered {
        text-align: center;
        margin: 0 auto 40px
    }

    .section-heading p:not(.section-tag) {
        color: var(--muted)
    }

    .search-section .section-heading p:not(.section-tag) {
        color: #c7d6e5
    }

    .light-tag {
        color: #80c7ec
    }

    .search-panel {
        background: #fff;
        color: var(--text);
        padding: 30px;
        box-shadow: 0 25px 55px rgba(0, 0, 0, .2)
    }

    .search-guide {
        display: flex;
        flex-wrap: wrap;
        gap: 17px 28px;
        padding: 0 0 19px;
        margin-bottom: 20px;
        border-bottom: 1px solid var(--line);
        font-size: 12px;
        color: #6b7a8b
    }

    .search-guide b {
        color: var(--navy)
    }

    .search-row {
        display: grid;
        grid-template-columns: 1fr 1.25fr 1.45fr auto;
        gap: 13px;
        align-items: end
    }

    .search-row label {
        display: flex;
        flex-direction: column;
        gap: 7px;
        font-size: 11px;
        color: #5e6e80;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .05em
    }

    .search-row input,
    .search-row select {
        width: 100%;
        height: 50px;
        border: 1px solid #cfd9e2;
        padding: 0 13px;
        background: #fff;
        color: var(--text);
        font: 14px 'Inter', sans-serif
    }

    .search-row input:focus,
    .search-row select:focus {
        outline: 2px solid rgba(22, 133, 199, .15);
        border-color: var(--bright)
    }

    .search-btn {
        height: 50px
    }

    .search-tools {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 20px;
        color: #69798b;
        font-size: 13px
    }

    .download {
        border: 0;
        background: none;
        color: var(--blue);
        font-weight: 700;
        cursor: pointer
    }

    .download:disabled {
        opacity: .35;
        cursor: not-allowed
    }

    .table-wrap {
        overflow: auto;
        margin-top: 20px;
        border: 1px solid var(--line)
    }

    table {
        border-collapse: collapse;
        width: 100%;
        min-width: 1260px;
        font-size: 12px
    }

    th {
        background: #eaf1f6;
        padding: 13px;
        text-align: left;
        color: #29435d;
        position: sticky;
        top: 0
    }

    td {
        padding: 12px 13px;
        border-top: 1px solid #e5ebf0;
        vertical-align: top
    }

    td:first-child,
    td:nth-child(2),
    td:nth-child(4) {
        font-weight: 700;
        color: var(--blue);
        white-space: nowrap
    }

    .table-note {
        padding: 12px 14px;
        background: #f8fafc;
        color: #6a798a;
        font-size: 12px
    }

    .empty {
        text-align: center;
        background: #f6f9fb;
        border: 1px solid #dfe7ee;
        padding: 40px 22px;
        margin-top: 22px
    }

    .empty-icon {
        width: 46px;
        height: 46px;
        border-radius: 50%;
        background: var(--navy);
        color: #fff;
        display: grid;
        place-items: center;
        margin: auto;
        font-weight: 700
    }

    .empty h3 {
        color: var(--navy);
        margin: 14px 0 6px
    }

    .empty p {
        max-width: 800px;
        margin: 7px auto;
        color: #5e6f81
    }

    .empty .cn {
        font-size: 13px
    }

    .empty small {
        display: block;
        color: #8794a2;
        margin: 14px auto 20px
    }

    .hidden {
        display: none
    }

    .procedure-section {
        background: #fff
    }

    .procedure-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 16px
    }

    .procedure-grid article {
        background: var(--pale);
        border-top: 3px solid var(--blue);
        padding: 27px;
        min-height: 275px
    }

    .procedure-grid span {
        font-size: 28px;
        font-weight: 700;
        color: #b9cad8
    }

    .procedure-grid h3 {
        font-size: 16px;
        line-height: 1.35;
        color: var(--navy);
        margin: 18px 0 10px
    }

    .procedure-grid p {
        font-size: 13px;
        color: #69798a;
        margin: 0
    }

    .important-note {
        margin-top: 25px;
        padding: 20px 24px;
        background: #eef5fa;
        border-left: 4px solid var(--bright);
        font-size: 13px;
        color: #536678
    }

    .services-section {
        background: var(--pale)
    }

    .service-layout {
        display: grid;
        grid-template-columns: .72fr 1.28fr;
        gap: 75px
    }

    .service-intro {
        position: sticky;
        top: 30px;
        align-self: start
    }

    .service-intro p:not(.section-tag) {
        color: #68798b
    }

    .service-intro .btn {
        margin-top: 18px
    }

    .service-cards {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px
    }

    .service-cards article {
        background: #fff;
        border: 1px solid #e0e8ef;
        padding: 24px;
        display: grid;
        grid-template-columns: 45px 1fr;
        gap: 14px
    }

    .service-cards b {
        color: var(--bright);
        font-size: 18px
    }

    .service-cards h3 {
        color: var(--navy);
        font-size: 15px;
        margin: 0 0 7px
    }

    .service-cards p {
        font-size: 12px;
        color: #718092;
        margin: 0
    }

    .cta-section {
        background: linear-gradient(120deg, #07518d, var(--navy));
        color: #fff;
        padding: 72px 0
    }

    .cta-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 60px
    }

    .cta-inner h2 {
        font-size: 36px;
        line-height: 1.25;
        margin: 0 0 10px
    }

    .cta-inner p:not(.section-tag) {
        color: #c9d9e8
    }

    .cta-buttons {
        display: flex;
        gap: 12px;
        flex-shrink: 0
    }

    .floating-contact {
        position: fixed;
        right: 22px;
        bottom: 22px;
        z-index: 50;
        background: var(--bright);
        color: #fff;
        text-decoration: none;
        padding: 14px 18px;
        box-shadow: 0 10px 28px rgba(5, 43, 80, .3);
        font-size: 13px;
        font-weight: 700
    }

    .floating-contact span {
        margin-right: 8px
    }

    footer {
        background: #04233f;
        color: #aebfce;
        padding: 52px 0 23px
    }

    .footer-main {
        display: grid;
        grid-template-columns: 1fr 1fr auto;
        gap: 45px;
        align-items: center
    }

    .footer-brand {
        color: #fff
    }

    .footer-main p {
        font-size: 12px
    }

    .footer-links {
        display: grid;
        gap: 5px
    }

    .footer-links a {
        color: #d2deea;
        text-decoration: none;
        font-size: 12px
    }

    .legal {
        border-top: 1px solid rgba(255, 255, 255, .1);
        padding-top: 18px;
        margin-top: 30px;
        font-size: 10px
    }

    @media(max-width:1020px) {
        .nav-links {
            display: none
        }

        .hero-grid,
        .intro-grid,
        .service-layout {
            grid-template-columns: 1fr
        }

        .hero-grid {
            padding: 80px 0
        }

        .hero-card {
            max-width: 620px
        }

        .category-grid {
            grid-template-columns: repeat(2, 1fr)
        }

        .search-row {
            grid-template-columns: 1fr 1fr
        }

        .procedure-grid {
            grid-template-columns: repeat(2, 1fr)
        }

        .service-intro {
            position: static
        }

        .footer-main {
            grid-template-columns: 1fr 1fr
        }

        .footer-links {
            grid-column: 1/-1
        }

        .cta-inner {
            align-items: flex-start;
            flex-direction: column
        }
    }

    @media(max-width:650px) {
        .wrap {
            width: min(100% - 24px, 1200px)
        }

        .topbar {
            display: none
        }

        .nav {
            height: 74px
        }

        .brand-mark {
            width: 42px;
            height: 42px
        }

        .hero-grid {
            min-height: auto;
            padding: 65px 0;
            gap: 35px
        }

        .hero h1 {
            font-size: 39px
        }

        .lead {
            font-size: 18px
        }

        .hero-actions,
        .hero-stats,
        .cta-buttons {
            flex-direction: column;
            align-items: flex-start
        }

        .hero-stats {
            gap: 14px
        }

        .section {
            padding: 68px 0
        }

        .intro-grid {
            gap: 25px
        }

        .intro-grid h2,
        .section-heading h2,
        .service-intro h2 {
            font-size: 33px
        }

        .category-grid,
        .search-row,
        .procedure-grid,
        .service-cards {
            grid-template-columns: 1fr
        }

        .category-card {
            min-height: auto
        }

        .search-panel {
            padding: 16px
        }

        .search-tools,
        .cta-inner {
            align-items: flex-start;
            flex-direction: column
        }

        .footer-main {
            grid-template-columns: 1fr
        }

        .floating-contact {
            right: 12px;
            bottom: 12px
        }

        .cta-inner h2 {
            font-size: 30px
        }
    }

    /* Premium recommended-category visual system */
    :root {
        --navy: #082f4f;
        --navy-deep: #05243d;
        --orange-gold: #d99a3d;
        --orange-gold-dark: #b8741c;
        --champagne: #f6ead5;
        --ink: #172536;
        --muted: #657384;
        --ivory: #fbfaf7
    }

    body {
        font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        color: var(--ink);
        background: var(--ivory)
    }

    h1,
    h2,
    h3,
    .brand-copy strong {
        letter-spacing: -.02em
    }

    .category-card {
        border: 1px solid rgba(217, 154, 61, .72) !important;
        border-top: 4px solid var(--orange-gold) !important;
        background: linear-gradient(145deg, #fff 0%, #fffaf2 100%);
        box-shadow: 0 14px 34px rgba(9, 48, 79, .09)
    }

    .category-card:hover,
    .category-card.active {
        border-color: var(--orange-gold-dark) !important;
        box-shadow: 0 20px 46px rgba(9, 48, 79, .16);
        transform: translateY(-5px)
    }

    .category-icon {
        background: linear-gradient(145deg, #fff7e8, #f4d49e) !important;
        border-color: #e6b86f !important;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .9), 0 7px 18px rgba(184, 116, 28, .16) !important
    }

    .category-card .num,
    .section-tag {
        color: var(--orange-gold-dark) !important
    }

    .category-card li b {
        background: #f4dfbc !important;
        color: #8b5511 !important
    }

    .category-card .arrow {
        color: #9d6119 !important;
        text-decoration: none;
        font-weight: 700
    }

    .category-page-link {
        display: inline-flex;
        align-items: center;
        gap: 6px
    }

    .hero-copy h1 span {
        color: #efb75f !important
    }

    .btn-primary {
        background: linear-gradient(135deg, #e3a64d, #bd781d) !important;
        border-color: #d99a3d !important;
        color: #fff !important;
        box-shadow: 0 10px 24px rgba(184, 116, 28, .25)
    }

    .nav-contact,
    .floating-contact {
        background: linear-gradient(135deg, #e3a64d, #bd781d) !important
    }

    /* Category detail pages */
    .detail-hero {
        position: relative;
        overflow: hidden;
        background: linear-gradient(120deg, #052a48 0%, #0b426d 62%, #123d5b 100%);
        color: #fff;
        padding: 92px 0 76px
    }

    .detail-hero:after {
        content: "";
        position: absolute;
        right: -120px;
        top: -180px;
        width: 540px;
        height: 540px;
        border: 1px solid rgba(239, 183, 95, .2);
        border-radius: 50%;
        box-shadow: 0 0 0 70px rgba(239, 183, 95, .05), 0 0 0 140px rgba(239, 183, 95, .035)
    }

    .breadcrumb {
        font-size: 13px;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: #d7e3ed;
        margin-bottom: 24px
    }

    .breadcrumb a {
        color: #efb75f;
        text-decoration: none
    }

    .detail-title-row {
        display: flex;
        gap: 24px;
        align-items: flex-start;
        max-width: 980px
    }

    .detail-icon {
        width: 84px;
        height: 84px;
        display: grid;
        place-items: center;
        border-radius: 22px;
        font-size: 42px;
        background: linear-gradient(145deg, #fff8eb, #eecb91);
        box-shadow: 0 16px 40px rgba(0, 0, 0, .22);
        flex: 0 0 auto
    }

    .detail-hero h1 {
        font-size: clamp(38px, 5vw, 66px);
        line-height: 1.04;
        margin: 0 0 18px
    }

    .recommended-pill {
        display: inline-flex;
        align-items: center;
        border: 1px solid rgba(239, 183, 95, .7);
        background: rgba(239, 183, 95, .13);
        color: #ffd899;
        padding: 7px 12px;
        border-radius: 999px;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: .12em;
        text-transform: uppercase;
        margin-bottom: 16px
    }

    .detail-lead {
        font-size: 19px;
        line-height: 1.7;
        max-width: 860px;
        color: #e2ebf2
    }

    .detail-stats {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        margin-top: 28px
    }

    .detail-stats span {
        padding: 11px 15px;
        border: 1px solid rgba(255, 255, 255, .16);
        background: rgba(255, 255, 255, .07);
        border-radius: 8px;
        font-size: 13px
    }

    .detail-nav {
        background: #fff;
        border-bottom: 1px solid #ead8bb;
        position: sticky;
        top: 0;
        z-index: 20;
        box-shadow: 0 8px 24px rgba(8, 47, 79, .07)
    }

    .detail-nav .wrap {
        display: flex;
        gap: 28px;
        overflow: auto
    }

    .detail-nav a {
        padding: 17px 0;
        color: #334457;
        text-decoration: none;
        font-weight: 700;
        white-space: nowrap;
        border-bottom: 3px solid transparent
    }

    .detail-nav a:hover {
        color: #a86616;
        border-color: #d99a3d
    }

    .detail-section {
        padding: 72px 0
    }

    .detail-section.alt {
        background: #f4f1eb
    }

    .detail-grid {
        display: grid;
        grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr);
        gap: 42px
    }

    .detail-panel {
        background: #fff;
        border: 1px solid #ead8bb;
        border-radius: 14px;
        padding: 30px;
        box-shadow: 0 15px 38px rgba(8, 47, 79, .07)
    }

    .detail-panel h2 {
        font-size: 34px;
        margin: 0 0 14px;
        color: #0a3658
    }

    .detail-panel h3 {
        font-size: 21px;
        color: #0a3658
    }

    .gold-rule {
        width: 62px;
        height: 3px;
        background: linear-gradient(90deg, #d99a3d, #f0c578);
        margin: 16px 0 24px
    }

    .risk-list,
    .doc-list,
    .service-detail-list {
        list-style: none;
        padding: 0;
        margin: 0
    }

    .risk-list li,
    .doc-list li,
    .service-detail-list li {
        position: relative;
        padding: 13px 0 13px 28px;
        border-bottom: 1px solid #eee8de;
        line-height: 1.55
    }

    .risk-list li:before,
    .doc-list li:before,
    .service-detail-list li:before {
        content: "✓";
        position: absolute;
        left: 0;
        color: #b8741c;
        font-weight: 900
    }

    .subdirectory-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px
    }

    .subdirectory-item {
        display: flex;
        gap: 12px;
        align-items: center;
        padding: 14px;
        border: 1px solid #ead8bb;
        border-radius: 9px;
        background: #fff
    }

    .subdirectory-item b {
        color: #9b5d11;
        background: #f7e6c8;
        padding: 6px 8px;
        border-radius: 5px
    }

    .code-toolbar {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 12px;
        margin: 22px 0
    }

    .code-toolbar input {
        width: 100%;
        padding: 14px 16px;
        border: 1px solid #d8c6aa;
        border-radius: 7px;
        font-size: 15px
    }

    .code-table-wrap {
        overflow: auto;
        border: 1px solid #dfd2bd;
        border-radius: 10px
    }

    .code-table {
        width: 100%;
        border-collapse: collapse;
        background: #fff;
        min-width: 820px
    }

    .code-table th {
        background: #0a3658;
        color: #fff;
        text-align: left;
        padding: 13px;
        font-size: 12px;
        letter-spacing: .04em
    }

    .code-table td {
        padding: 12px 13px;
        border-bottom: 1px solid #eee8de;
        font-size: 13px;
        vertical-align: top
    }

    .code-table tr:hover td {
        background: #fffaf2
    }

    .process-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px
    }

    .process-step {
        background: #fff;
        border: 1px solid #ead8bb;
        border-radius: 12px;
        padding: 22px;
        position: relative
    }

    .process-step em {
        font-style: normal;
        font-family: 'Inter', system-ui, sans-serif;
        font-size: 32px;
        color: #d99a3d
    }

    .process-step h3 {
        margin: 8px 0;
        color: #0a3658
    }

    .premium-cta {
        background: linear-gradient(120deg, #082f4f, #0b456f);
        color: #fff;
        border-radius: 18px;
        padding: 38px;
        display: flex;
        justify-content: space-between;
        gap: 30px;
        align-items: center;
        box-shadow: 0 22px 55px rgba(8, 47, 79, .2)
    }

    .premium-cta h2 {
        color: #fff;
        margin: 0 0 10px
    }

    .small-note {
        font-size: 12px;
        color: #697888;
        margin-top: 14px
    }

    .back-link {
        display: inline-block;
        margin-top: 18px;
        color: #a86616;
        font-weight: 700;
        text-decoration: none
    }

    @media(max-width:800px) {
        .detail-grid {
            grid-template-columns: 1fr
        }

        .detail-title-row {
            display: block
        }

        .detail-icon {
            margin-bottom: 22px
        }

        .subdirectory-grid,
        .process-list {
            grid-template-columns: 1fr
        }

        .premium-cta {
            display: block
        }

        .premium-cta .btn {
            margin-top: 20px
        }

        .detail-section {
            padding: 52px 0
        }
    }

    /* 2026 compact premium refinements */
    .detail-hero {
        padding: 54px 0 42px
    }

    .detail-hero h1 {
        margin-bottom: 12px
    }

    .detail-lead {
        margin: 0;
        max-width: 920px
    }

    .category-card {
        cursor: pointer
    }

    .category-card.compact-card {
        min-height: 205px
    }

    .category-card.compact-card ul {
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        padding-top: 0
    }

    .category-card .sub-toggle {
        display: none !important
    }

    .code-toolbar {
        grid-template-columns: minmax(260px, 1fr) auto auto;
        align-items: end
    }

    .page-size-control {
        display: flex;
        flex-direction: column;
        gap: 5px;
        color: #6b7785;
        font-size: 11px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .08em
    }

    .page-size-control select {
        height: 48px;
        min-width: 90px;
        padding: 0 32px 0 13px;
        border: 1px solid #d8c6aa;
        border-radius: 7px;
        background: #fff;
        color: #18364f;
        font: 700 14px 'Inter', sans-serif
    }

    .table-pagination {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 14px;
        padding-top: 16px
    }

    .table-pagination button {
        min-width: 92px;
        height: 38px;
        border: 1px solid #d8c6aa;
        border-radius: 6px;
        background: #fff;
        color: #9b5d11;
        font-weight: 800;
        cursor: pointer
    }

    .table-pagination button:hover:not(:disabled) {
        background: #fff7ea;
        border-color: #d99a3d
    }

    .table-pagination button:disabled {
        opacity: .4;
        cursor: not-allowed
    }

    .table-pagination span {
        font-size: 12px;
        color: #657585;
        min-width: 190px;
        text-align: center
    }

    .applicant-types {
        margin-top: 24px;
        padding: 20px 22px;
        border-left: 4px solid #d99a3d;
        background: #fff8ec;
        border-radius: 0 9px 9px 0
    }

    .applicant-types h3 {
        margin: 0 0 8px;
        font-size: 19px
    }

    .applicant-types p {
        margin: 0;
        color: #586b7d
    }

    @media(max-width:760px) {
        .detail-hero {
            padding: 40px 0 32px
        }

        .code-toolbar {
            grid-template-columns: 1fr
        }

        .page-size-control select {
            width: 100%
        }

        .table-pagination {
            justify-content: center;
            flex-wrap: wrap
        }

        .table-pagination span {
            order: -1;
            width: 100%
        }
    }
