:root {
    --font-sans: "Inter", "Segoe UI", Arial, Helvetica, ui-sans-serif, system-ui, sans-serif;
    --font-heading: "Manrope", "Inter", "Segoe UI", Arial, Helvetica, sans-serif;
    --navy: #172b58;
    --blue: #1f4e8c;
    --red: #d93c37;
    --ink: #1b1b1b;
    --muted: #5b6577;
    --paper: #fff;
    --soft: #f7f9fc;
    --soft-blue: #e7f0fb;
    --line: #d5dce8;
    --shadow: 0 18px 50px #172b581c;
    font-family: var(--font-sans);
    color: var(--ink);
    background: var(--paper);
    font-synthesis: none;
    text-rendering: optimizelegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

* {
    box-sizing: border-box
}

html {
    scroll-behavior: smooth
}

body {
    min-width: 320px;
    margin: 0
}


button,
input,
textarea,
select {
    font: inherit
}

::selection {
    color: #fff;
    background: var(--red)
}

.app-recovery-screen {
    color: #fff;
    background: radial-gradient(circle at 100% 0, #b3194259, #0000 32%), linear-gradient(135deg, #101b38, #172b58);
    place-items: center;
    min-height: 100vh;
    padding: 24px;
    display: grid
}

.app-recovery-screen div {
    text-align: center;
    background: #ffffff14;
    border: 1px solid #fff3;
    border-radius: 20px;
    max-width: 520px;
    padding: 32px;
    box-shadow: 0 24px 80px #00000040
}

.app-recovery-screen h1 {
    font-family: var(--font-heading);
    margin: 0 0 12px
}

.app-recovery-screen p {
    color: #ffffffd1;
    margin: 0 0 22px
}

.app-recovery-screen button {
    color: #fff;
    background: var(--red);
    cursor: pointer;
    border: 0;
    border-radius: 999px;
    padding: 12px 20px;
    font-weight: 800
}

.site-shell {
    min-height: 100vh;
    color: var(--ink);
    background: radial-gradient(circle at 88% 8%, #b319421a, transparent 24%), radial-gradient(circle at 8% 26%, #1f4e8c1f, transparent 28%), linear-gradient(180deg, #fff 0, #f7f9fc 48%, #fff 100%), radial-gradient(circle at top left, #1f4e8c14, transparent 30%), var(--paper)
}

.top-notice {
    color: #0000;
    letter-spacing: .01em;
    border-bottom: 0;
    background-color: white;
    padding: 0px 0;
    font-size: 15px;
    overflow: hidden
}

.top-notice-track {
    width: max-content;
    animation: 24s linear infinite notice-slide;
    display: flex
}

.top-notice:hover .top-notice-track {
    animation-play-state: paused
}

.top-notice-group {
    white-space: nowrap;
    align-items: center;
    gap: 20px;
    padding-right: 48px;
    display: flex
}

.top-notice p {
    color: #162e51;
    margin: 0
}

.notice-flag {
    color: #0000;
    letter-spacing: .08em;
    background-image: url("data:image/svg+xml,%3Csvg width='190' height='100' viewBox='0 0 190 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='190' height='100' fill='%23b22234'/%3E%3Cg fill='%23fff'%3E%3Crect y='7.69' width='190' height='7.69'/%3E%3Crect y='23.08' width='190' height='7.69'/%3E%3Crect y='38.46' width='190' height='7.69'/%3E%3Crect y='53.85' width='190' height='7.69'/%3E%3Crect y='69.23' width='190' height='7.69'/%3E%3Crect y='84.62' width='190' height='7.69'/%3E%3C/g%3E%3Crect width='76' height='53.85' fill='%233c3b6e'/%3E%3Cg fill='%23fff'%3E%3Ccircle cx='8' cy='7' r='2'/%3E%3Ccircle cx='20' cy='7' r='2'/%3E%3Ccircle cx='32' cy='7' r='2'/%3E%3Ccircle cx='44' cy='7' r='2'/%3E%3Ccircle cx='56' cy='7' r='2'/%3E%3Ccircle cx='68' cy='7' r='2'/%3E%3Ccircle cx='14' cy='16' r='2'/%3E%3Ccircle cx='26' cy='16' r='2'/%3E%3Ccircle cx='38' cy='16' r='2'/%3E%3Ccircle cx='50' cy='16' r='2'/%3E%3Ccircle cx='62' cy='16' r='2'/%3E%3Ccircle cx='8' cy='25' r='2'/%3E%3Ccircle cx='20' cy='25' r='2'/%3E%3Ccircle cx='32' cy='25' r='2'/%3E%3Ccircle cx='44' cy='25' r='2'/%3E%3Ccircle cx='56' cy='25' r='2'/%3E%3Ccircle cx='68' cy='25' r='2'/%3E%3Ccircle cx='14' cy='34' r='2'/%3E%3Ccircle cx='26' cy='34' r='2'/%3E%3Ccircle cx='38' cy='34' r='2'/%3E%3Ccircle cx='50' cy='34' r='2'/%3E%3Ccircle cx='62' cy='34' r='2'/%3E%3Ccircle cx='8' cy='43' r='2'/%3E%3Ccircle cx='20' cy='43' r='2'/%3E%3Ccircle cx='32' cy='43' r='2'/%3E%3Ccircle cx='44' cy='43' r='2'/%3E%3Ccircle cx='56' cy='43' r='2'/%3E%3Ccircle cx='68' cy='43' r='2'/%3E%3C/g%3E%3C/svg%3E");
    background-position: 50%;
    background-size: cover;
    border-radius: 4px;
    justify-content: center;
    align-items: center;
    width: 50px;
    min-height: 30px;
    padding: 0;
    font-size: 11px;
    font-weight: 900;
    display: inline-flex;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px #ffffff73, 0 4px 10px #00000029
}

.notice-flag:after {
    content: "";
    z-index: 1;
    display: none;
    position: relative
}

@keyframes notice-slide {
    0% {
        transform: translate(0)
    }

    to {
        transform: translate(-50%)
    }
}

.header {
    z-index: 20;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background: #fff;
    border: 0;
    border-radius: 0;
    gap: 0;
    margin: 0;
    padding: 0;
    display: grid;
    position: sticky;
    top: 0;
    box-shadow: 0 10px 28px #172b5814
}

.header-top-row,
.header-nav-row {
    align-items: center;
    padding-inline: clamp(28px, 5vw, 84px);
    display: grid
}

.header-top-row {
    background: #162e51;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: clamp(12px, 1.6vw, 24px);
    min-height: 84px;
    padding-block: 10px;
    padding-inline: clamp(28px, 5vw, 84px);
    display: grid;
    position: relative;
}

.header-nav-row {
    background: white;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    min-height: 72px
}

.brand {
    color: var(--navy);
    align-items: center;
    justify-content: center;
    gap: 12px;
    text-decoration: none;
    display: inline-flex;
    padding: 8px 18px;
    border-radius: 10px;
    height: 65px;
}

.brand-logo-img {
    height: 90px;
    width: auto;
    max-width: 280px;
    object-fit: contain;
    display: block;
}

.brand-lockup,
.brand-kicker,
.brand-wordmark {
    display: block
}

.brand-lockup {
    width: 280px;
    color: var(--navy);
    line-height: 1
}

.brand-kicker {
    text-align: left;
    letter-spacing: .02em;
    text-transform: uppercase;
    margin-top: 2px;
    font-size: 10px;
    font-weight: 900
}

.brand-wordmark {
    min-height: auto;
    color: var(--navy);
    box-shadow: none;
    text-align: left;
    letter-spacing: .03em;
    background: 0 0;
    border: 0;
    border-radius: 0;
    padding: 0;
    font-size: 32px;
    font-weight: 500;
    line-height: 1;
    display: block
}

.header-verified {
    color: var(--navy);
    align-items: center;
    gap: 12px;
    font-size: 15px;
    font-weight: 900;
    line-height: 1.1;
    display: flex
}

.header-verified span {
    color: #071f5c;
    clip-path: polygon(50% 0, 61% 10%, 75% 7%, 82% 20%, 96% 25%, 94% 40%, 100% 50%, 90% 61%, 93% 75%, 80% 82%, 75% 96%, 60% 93%, 50% 100%, 39% 90%, 25% 93%, 18% 80%, 4% 75%, 6% 60%, 0 50%, 10% 39%, 7% 25%, 20% 18%, 25% 4%, 40% 7%);
    background: #55b7ff;
    place-items: center;
    width: 50px;
    height: 50px;
    font-size: 28px;
    font-weight: 900;
    display: grid
}

.header-verified small,
.header-verified strong {
    display: block
}

.header-verified small {
    color: #1f4e8c;
    font-size: 13px;
    font-weight: 800
}

.header-verified strong {
    color: #111827;
    white-space: nowrap;
    font-size: 22px
}

.header-cares {
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    background: #48b346;
    border-radius: 50%;
    grid-area: 1/3;
    place-items: center;
    width: 62px;
    height: 62px;
    font-size: 10px;
    font-weight: 900;
    line-height: 1.05;
    display: grid;
    position: relative;
    overflow: hidden
}

.header-cares:before {
    content: "";
    opacity: .95;
    border: 4px solid #fff;
    border-color: #fff #fff #0000 #0000;
    border-radius: 50%;
    position: absolute;
    inset: 7px;
    transform: rotate(22deg)
}

.header-cares:after {
    content: "";
    border-bottom: 4px solid #fff;
    border-radius: 50%;
    width: 30px;
    height: 12px;
    position: absolute;
    bottom: 12px;
    right: 10px;
    transform: rotate(-15deg)
}

.header-cares span,
.header-cares strong {
    z-index: 1;
    display: block;
    position: relative
}

.header-contact-pills {
    background: #fff;
    border: 1px solid #77a8ff;
    border-radius: 999px;
    grid-area: 1/4;
    justify-content: center;
    align-items: center;
    gap: 16px;
    min-width: 168px;
    min-height: 48px;
    padding: 0 22px;
    display: flex;
    box-shadow: 0 8px 18px #2563eb24
}

.header-contact-pills a {
    color: #0864c8;
    place-items: center;
    width: 26px;
    height: 26px;
    font-size: 19px;
    font-weight: 900;
    text-decoration: none;
    display: grid
}

.header-contact-pills a:nth-child(3) {
    font-size: 0
}

.header-contact-pills a:nth-child(3):before,
.contact-drop-icon.whatsapp:before {
    content: "";
    background: #10a957;
    width: 24px;
    height: 24px;
    display: block;
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.04 3.2c-7.05 0-12.79 5.68-12.79 12.68 0 2.24.6 4.43 1.74 6.35L3.15 28.8l6.77-1.77a12.9 12.9 0 0 0 6.12 1.55c7.05 0 12.79-5.68 12.79-12.68S23.09 3.2 16.04 3.2Zm0 23.22c-1.9 0-3.76-.5-5.38-1.44l-.39-.23-4.01 1.05 1.07-3.89-.25-.4a10.42 10.42 0 0 1-1.62-5.63c0-5.8 4.75-10.51 10.58-10.51s10.58 4.72 10.58 10.51-4.75 10.54-10.58 10.54Zm5.8-7.88c-.32-.16-1.89-.93-2.18-1.04-.29-.11-.5-.16-.71.16-.21.31-.82 1.04-1 1.25-.19.21-.37.24-.69.08-.32-.16-1.35-.49-2.56-1.57-.95-.84-1.59-1.88-1.78-2.2-.19-.31-.02-.48.14-.64.15-.15.32-.37.48-.56.16-.19.21-.32.32-.53.11-.21.05-.4-.03-.56-.08-.16-.71-1.7-.98-2.33-.26-.61-.52-.53-.71-.54l-.61-.01c-.21 0-.56.08-.85.4-.29.31-1.11 1.08-1.11 2.63 0 1.55 1.14 3.05 1.3 3.26.16.21 2.24 3.39 5.42 4.75.76.33 1.35.52 1.81.67.76.24 1.45.21 2 .13.61-.09 1.89-.77 2.16-1.51.27-.75.27-1.39.19-1.52-.08-.13-.29-.21-.61-.37Z'/%3E%3C/svg%3E") 50%/contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.04 3.2c-7.05 0-12.79 5.68-12.79 12.68 0 2.24.6 4.43 1.74 6.35L3.15 28.8l6.77-1.77a12.9 12.9 0 0 0 6.12 1.55c7.05 0 12.79-5.68 12.79-12.68S23.09 3.2 16.04 3.2Zm0 23.22c-1.9 0-3.76-.5-5.38-1.44l-.39-.23-4.01 1.05 1.07-3.89-.25-.4a10.42 10.42 0 0 1-1.62-5.63c0-5.8 4.75-10.51 10.58-10.51s10.58 4.72 10.58 10.51-4.75 10.54-10.58 10.54Zm5.8-7.88c-.32-.16-1.89-.93-2.18-1.04-.29-.11-.5-.16-.71.16-.21.31-.82 1.04-1 1.25-.19.21-.37.24-.69.08-.32-.16-1.35-.49-2.56-1.57-.95-.84-1.59-1.88-1.78-2.2-.19-.31-.02-.48.14-.64.15-.15.32-.37.48-.56.16-.19.21-.32.32-.53.11-.21.05-.4-.03-.56-.08-.16-.71-1.7-.98-2.33-.26-.61-.52-.53-.71-.54l-.61-.01c-.21 0-.56.08-.85.4-.29.31-1.11 1.08-1.11 2.63 0 1.55 1.14 3.05 1.3 3.26.16.21 2.24 3.39 5.42 4.75.76.33 1.35.52 1.81.67.76.24 1.45.21 2 .13.61-.09 1.89-.77 2.16-1.51.27-.75.27-1.39.19-1.52-.08-.13-.29-.21-.61-.37Z'/%3E%3C/svg%3E") 50%/contain no-repeat
}

.header-contact-dropdown {
    z-index: 30;
    opacity: 0;
    pointer-events: none;
    background: #fff;
    border: 1px solid #e5eaf0;
    border-radius: 0 0 28px 28px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    transition: opacity .18s, transform .18s;
    display: grid;
    position: absolute;
    top: calc(100% - 2px);
    left: clamp(16px, 4vw, 64px);
    right: clamp(16px, 4vw, 64px);
    overflow: hidden;
    transform: translateY(12px);
    box-shadow: 0 28px 70px #0c1f492e
}

.header-contact-pills:hover~.header-contact-dropdown,
.header-contact-pills:focus-within~.header-contact-dropdown,
.header-contact-dropdown:hover,
.header-contact-dropdown:focus-within {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0)
}

.header-contact-dropdown a {
    min-height: 235px;
    color: var(--navy);
    text-align: center;
    border-right: 1px solid #e5eaf0;
    justify-items: center;
    padding: 28px 20px 26px;
    text-decoration: none;
    display: grid
}

.header-contact-dropdown a:last-child {
    border-right: 0
}

.contact-drop-icon {
    border-radius: 18px;
    place-items: center;
    width: 58px;
    height: 58px;
    margin-bottom: 14px;
    font-size: 26px;
    font-weight: 900;
    display: grid
}

.contact-drop-icon.call,
.contact-drop-icon.whatsapp {
    color: #10a957;
    background: #dcfce7;
    font-size: 0
}

.contact-drop-icon.whatsapp:before {
    width: 30px;
    height: 30px
}

.contact-drop-icon.email {
    color: #2563eb;
    background: #dbeafe
}

.header-contact-dropdown strong {
    color: var(--navy);
    font-family: var(--font-heading);
    margin-bottom: 8px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
    display: block
}

.header-contact-dropdown small {
    color: #6b7280;
    max-width: 250px;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.35;
    display: block
}

.header-contact-dropdown b {
    color: #2563eb;
    margin-top: 20px;
    font-size: 17px;
    font-weight: 800;
    display: block
}

.header-action-buttons,
.header-nav-actions {
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
    display: flex
}

.header-action-buttons {
    grid-column: auto;
    justify-self: end;
}

.header-start-btn,
.header-dashboard-btn,
.header-signin-btn,
.header-schedule-btn {
    white-space: nowrap;
    border-radius: 25px;
    justify-content: center;
    align-items: center;
    min-height: 35px;
    padding: 0 15px;
    font-size: 15px;
    text-decoration: none;
    display: inline-flex
}

.header-start-btn {
    background: #fff;
    color: #000000;
}

.header-signin-btn {
    background: #ffffff;
    color: #000000;
}

.header-schedule-btn {
    background: #0b2a73;
    color: white;
}

.header-nav-actions select {
    color: #111827;
    min-width: 220px;
    min-height: 50px;
    font: inherit;
    background: #fff;
    border: 1px solid #9aa6b2;
    border-radius: 4px;
    padding: 0 20px;
    font-size: 18px
}

nav {
    align-items: center;
    gap: clamp(8px, 1.3vw, 22px);
    display: flex
}

.nav-item {
    align-items: center;
    display: flex
}

nav a {
    color: #06245f;
    border-radius: 0;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    display: inline-flex
}

nav a:hover,
nav a.active {
    color: #c8202b;
    background: 0 0
}

.nav-signout {
    color: #b91c1c;
    cursor: pointer;
    font: inherit;
    background: #fff7f7;
    border: 1px solid #fee2e2;
    border-radius: 999px;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    transition: transform .18s, box-shadow .18s, background .18s, color .18s;
    display: inline-flex;
    box-shadow: 0 8px 20px #b91c1c14
}

.nav-signout:hover {
    color: #fff;
    background: linear-gradient(135deg, #dc2626, #991b1b);
    transform: translateY(-1px);
    box-shadow: 0 12px 26px #b91c1c33
}

.nav-signout:before {
    content: "";
    border-bottom: 2px solid;
    border-left: 2px solid;
    width: 8px;
    height: 8px;
    transform: rotate(45deg)
}

.menu-caret {
    border-top: 6px solid;
    border-left: 5px solid #0000;
    border-right: 5px solid #0000;
    width: 0;
    height: 0
}

.mobile-menu-toggle,
.services-submenu-toggle,
.mobile-menu-cta {
    display: none
}

.mobile-menu-toggle {
    background: var(--navy);
    width: 46px;
    height: 42px;
    box-shadow: none;
    border: 0;
    border-radius: 8px;
    padding: 10px
}

.mobile-menu-toggle>span {
    background: #fff;
    width: 100%;
    height: 2px;
    margin: 4px 0;
    transition: transform .2s, opacity .2s;
    display: block
}

.mobile-menu-toggle.is-open>span:first-child {
    transform: translateY(6px)rotate(45deg)
}

.mobile-menu-toggle.is-open>span:nth-child(2) {
    opacity: 0
}

.mobile-menu-toggle.is-open>span:nth-child(3) {
    transform: translateY(-6px)rotate(-45deg)
}

.mega-service-copy {
    min-width: 0;
    display: block
}

.mega-service-copy strong,
.mega-service-copy small {
    display: block
}

.mega-service-copy strong {
    color: var(--navy);
    font-size: 14px;
    line-height: 1.25
}

.mega-service-copy small {
    color: var(--muted);
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-top: 4px;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.35;
    display: -webkit-box;
    overflow: hidden
}

.header-cta,
.primary-btn,
.secondary-btn,
.price-card a,
.contact-form button,
.newsletter button,
.application-actions button {
    color: #fff;
    background: var(--red);
    cursor: pointer;
    min-height: 44px;
    font: inherit;
    letter-spacing: .01em;
    border: 0;
    border-radius: 999px;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
    transition: transform .18s, box-shadow .18s, background .18s;
    display: inline-flex;
    box-shadow: 0 12px 22px #b319422e
}

.header-cta:hover,
.primary-btn:hover,
.price-card a:hover,
.contact-form button:hover,
.newsletter button:hover,
.application-actions button:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 18px 32px #b319423d
}

.secondary-btn {
    color: var(--blue);
    box-shadow: none;
    background: #fff;
    border: 1px solid #8aa7ce
}

.hero-section {
    background: linear-gradient(115deg, #091636fa, #172b58e0), radial-gradient(circle at 78% 20%, #b3194252, transparent 30%), radial-gradient(circle at 50% 92%, #ffffff24, transparent 36%), var(--navy);
    color: #fff;
    border-radius: 28px;
    grid-template-columns: minmax(0, .95fr) minmax(420px, 1fr);
    align-items: center;
    gap: clamp(28px, 6vw, 72px);
    min-height: 790px;
    margin: 18px clamp(12px, 2vw, 24px) 0;
    padding: 84px clamp(24px, 5vw, 78px);
    display: grid;
    position: relative;
    overflow: hidden;
    box-shadow: 0 38px 100px #172b5838
}

.hero-section:before {
    content: "";
    background-image: linear-gradient(#ffffff0e 1px, #0000 1px), linear-gradient(90deg, #ffffff0e 1px, #0000 1px);
    background-size: 56px 56px;
    position: absolute;
    inset: 0;
    -webkit-mask-image: linear-gradient(90deg, #000000bf, #0000 82%);
    mask-image: linear-gradient(90deg, #000000bf, #0000 82%)
}

.hero-section:after {
    content: "";
    border: 70px solid #ffffff0f;
    border-radius: 50%;
    width: 460px;
    height: 460px;
    position: absolute;
    bottom: -160px;
    right: -120px
}

.hero-copy {
    z-index: 1;
    max-width: 760px;
    position: relative
}

.hero-proof-panel {
    background: #ffffff24;
    border: 1px solid #ffffff2e;
    border-radius: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    margin-top: 28px;
    display: grid;
    overflow: hidden;
    box-shadow: inset 0 1px #ffffff1f
}

.hero-proof-panel span {
    color: #ffffffe0;
    background: #ffffff13;
    min-height: 76px;
    padding: 18px;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.35
}

.hero-visual {
    z-index: 1;
    min-height: 610px;
    position: relative
}

.hero-visual>img {
    object-fit: cover;
    object-position: 58% center;
    border: 1px solid #ffffff4d;
    border-radius: 28px;
    width: 100%;
    height: 610px;
    box-shadow: 0 36px 90px #00000052
}

.brand-orbit {
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    background: #ffffff1f;
    border: 1px solid #ffffff52;
    border-radius: 50%;
    width: 190px;
    height: 190px;
    position: absolute;
    top: -22px;
    right: -18px
}

.brand-orbit span {
    color: #fff;
    background: linear-gradient(135deg, var(--red), #d94357);
    border: 2px solid #ffffffa6;
    border-radius: 50%;
    place-items: center;
    width: 54px;
    height: 54px;
    font-size: 13px;
    font-weight: 900;
    display: grid;
    position: absolute
}

.brand-orbit span:first-child {
    top: 26px;
    left: 18px
}

.brand-orbit span:nth-child(2) {
    top: 76px;
    right: 12px
}

.brand-orbit span:nth-child(3) {
    background: linear-gradient(135deg, var(--blue), var(--navy));
    bottom: 8px;
    left: 66px
}

.floating-brief {
    color: #fff;
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    background: #0916369e;
    border: 1px solid #ffffff38;
    border-radius: 20px;
    width: 240px;
    padding: 20px;
    position: absolute;
    top: 70px;
    left: -28px;
    box-shadow: 0 24px 58px #00000042
}

.floating-brief small,
.floating-brief strong {
    display: block
}

.floating-brief small {
    color: #ffd6dc;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: 11px;
    font-weight: 900
}

.floating-brief strong {
    margin-top: 8px;
    font-size: 20px
}

.floating-brief p {
    color: #ffffffc2;
    margin: 8px 0 0;
    font-size: 14px
}

.eyebrow {
    color: var(--red);
    text-transform: uppercase;
    letter-spacing: .14em;
    margin-bottom: 14px;
    font-size: 12px;
    font-weight: 900;
    display: inline-flex
}

.hero-section .eyebrow,
.callout .eyebrow {
    color: #ffd6dc
}

h1,
h2,
h3 {
    font-family: var(--font-heading)
}

h1,
h2,
h3,
p {
    margin-top: 0
}

h1 {
    letter-spacing: -.025em;
    margin-bottom: 22px;
    font-size: clamp(44px, 6vw, 84px);
    font-weight: 900;
    line-height: 1
}

h2 {
    color: var(--navy);
    letter-spacing: -.018em;
    margin-bottom: 14px;
    font-size: clamp(30px, 4vw, 52px);
    font-weight: 900;
    line-height: 1.06
}

h3 {
    color: var(--navy);
    font-size: 22px;
    font-weight: 900;
    line-height: 1.15
}

.hero-copy p,
.page-hero p,
.split-section p,
.footer p {
    color: #ffffffd1;
    max-width: 650px;
    font-size: 18px;
    line-height: 1.7
}

.hero-actions {
    flex-wrap: wrap;
    gap: 14px;
    margin: 34px 0;
    display: flex
}

.hero-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    max-width: 620px;
    display: grid
}

.hero-stats span {
    color: #ffffffbd;
    background: #ffffff14;
    border: 1px solid #ffffff2e;
    border-radius: 4px;
    padding: 16px
}

.hero-stats strong {
    color: #fff;
    font-size: 24px;
    display: block
}

.dashboard {
    z-index: 1;
    background: #fff;
    border: 1px solid #ffffff47;
    border-radius: 4px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 34px 90px #0000005c
}

.hero-visual .dashboard {
    width: min(420px, 100% - 48px);
    position: absolute;
    bottom: -34px;
    right: 24px;
    box-shadow: 0 22px 56px #0000004d
}

.dashboard-top {
    border-bottom: 1px solid var(--line);
    background: #f4f6fb;
    gap: 8px;
    padding: 16px;
    display: flex
}

.dashboard-top span {
    background: #b6bdd4;
    border-radius: 50%;
    width: 10px;
    height: 10px
}

.dashboard-grid {
    grid-template-columns: 1.1fr .9fr;
    gap: 16px;
    padding: 20px;
    display: grid
}

.hero-visual .dashboard-grid {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    padding: 14px
}

.hero-visual .case-card {
    padding: 14px
}

.case-card,
.case-list {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 4px;
    padding: 18px
}

.case-card.wide,
.case-list.wide {
    grid-column: span 2
}

.case-card small {
    color: var(--muted);
    font-weight: 800;
    display: block
}

.case-card strong {
    color: var(--navy);
    margin-top: 10px;
    font-size: 20px;
    display: block
}

.case-card.dark {
    background: var(--navy)
}

.case-card.dark small,
.case-card.dark strong {
    color: #fff
}

.progress {
    background: #e7ebf5;
    border-radius: 20px;
    height: 10px;
    margin-top: 18px;
    overflow: hidden
}

.progress span {
    border-radius: inherit;
    background: var(--red);
    width: 72%;
    height: 100%;
    display: block
}

.case-list {
    gap: 10px;
    display: grid
}

.case-list span {
    color: var(--navy);
    font-weight: 800
}

.case-list span:before {
    content: "";
    background: var(--red);
    border-radius: 50%;
    width: 8px;
    height: 8px;
    margin-right: 8px;
    display: inline-block
}

.section,
.page-hero {
    padding: 92px clamp(20px, 5vw, 72px)
}

.section-heading {
    max-width: 850px;
    margin-bottom: 42px
}

.section-heading p,
.service-card p,
.detail-card p,
.price-card p,
.map-card p,
.contact-panel p,
.split-section p {
    color: var(--muted)
}

.trust-intro,
.experience-section {
    grid-template-columns: minmax(0, .9fr) minmax(320px, .75fr);
    align-items: center;
    gap: 56px;
    display: grid
}

.trust-intro {
    border-bottom: 1px solid var(--line);
    background-color: #fff;
    background-image: linear-gradient(90deg, #172b580a 0 1px, #0000 1px 100%), none;
    background-position: 0 0, 0 0;
    background-repeat: repeat, repeat;
    background-size: 46px 46px;
    background-attachment: scroll, scroll;
    background-origin: padding-box, padding-box;
    background-clip: border-box, border-box
}

.trust-intro p,
.experience-section p {
    color: var(--muted);
    font-size: 18px;
    line-height: 1.75
}

.trust-copy {
    gap: 18px;
    display: grid
}

.trust-copy img {
    object-fit: cover;
    border: 1px solid var(--line);
    width: 100%;
    height: 310px;
    box-shadow: var(--shadow);
    border-radius: 24px
}

.registration-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 26px;
    padding-top: 54px;
    display: grid
}

.registration-options article,
.why-grid article,
.expanded-grid article,
.amazon-price {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 22px;
    box-shadow: 0 12px 34px #172b580f
}

.registration-options article {
    min-height: 290px;
    padding: 34px;
    position: relative;
    overflow: hidden
}

.registration-options article:before {
    content: "";
    background: linear-gradient(90deg, var(--red), var(--blue));
    height: 8px;
    position: absolute;
    inset: 0 0 auto
}

.registration-options article:after {
    content: "";
    border: 42px solid #1f4e8c14;
    border-radius: 50%;
    width: 240px;
    height: 240px;
    position: absolute;
    bottom: -100px;
    right: -80px
}

.registration-options span,
.amazon-price span {
    color: var(--red);
    text-transform: uppercase;
    letter-spacing: .12em;
    margin-bottom: 12px;
    font-size: 12px;
    font-weight: 900;
    display: block
}

.registration-options p,
.why-grid p,
.expanded-grid p,
.amazon-section p,
.authenticity-section p,
.service-catalog-card p {
    color: var(--muted);
    line-height: 1.65
}

.authenticity-section {
    background: #fff
}

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

.credential-grid article {
    text-align: center;
    border: 1px solid var(--line);
    background: linear-gradient(#fff, #f7f9fc);
    border-radius: 20px;
    padding: 26px 20px;
    box-shadow: 0 12px 34px #172b5812
}

.credential-seal {
    color: #fff;
    background: var(--navy);
    outline: 2px solid var(--red);
    border: 7px double #fff;
    border-radius: 50%;
    place-items: center;
    width: 76px;
    height: 76px;
    margin: 0 auto 18px;
    font-weight: 900;
    display: grid;
    box-shadow: 0 0 0 5px #b319421a
}

.certificate-section {
    background: #fff
}

.certificate-heading {
    text-align: center
}

.certificate-heading p {
    margin-inline: auto
}

.certificate-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    max-width: 1120px;
    margin: 0 auto;
    display: grid
}

.certificate-card {
    text-align: center;
    min-height: 245px;
    color: var(--navy);
    border: 8px double var(--navy);
    background: linear-gradient(135deg, #1f4e8c09, #0000 45%), #fffef9;
    padding: 28px 34px;
    position: relative;
    box-shadow: 0 14px 34px #172b581f
}

.certificate-card:before {
    content: "";
    pointer-events: none;
    border: 1px solid #172b583d;
    position: absolute;
    inset: 8px
}

.certificate-2 {
    border: 2px solid #dc8739;
    border-radius: 6px
}

.certificate-3 {
    background-color: #f8fcff;
    border-color: #8db5ce
}

.certificate-ribbon {
    z-index: 1;
    color: #fff;
    background: linear-gradient(90deg, var(--blue), var(--red));
    letter-spacing: .14em;
    width: fit-content;
    margin: 0 auto 14px;
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 900;
    position: relative
}

.certificate-card small,
.certificate-card h3,
.certificate-card p,
.certificate-card strong {
    z-index: 1;
    position: relative
}

.certificate-card h3 {
    font-family: var(--font-heading);
    margin: 10px 0;
    font-size: 25px;
    font-weight: 500
}

.certificate-card p {
    color: var(--muted);
    font-family: var(--font-sans);
    margin: 12px 0
}

.certificate-card strong {
    color: var(--red);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 12px
}

.certificate-divider {
    z-index: 1;
    background: #172b5847;
    width: 64%;
    height: 1px;
    margin: 12px auto;
    position: relative
}

.certificate-seal {
    z-index: 1;
    color: #fff;
    background: #c7a438;
    border: 4px double #fff4bc;
    border-radius: 50%;
    place-items: center;
    width: 34px;
    height: 34px;
    display: grid;
    position: absolute;
    bottom: 18px;
    right: 22px
}

.certificate-note {
    max-width: 760px;
    color: var(--muted);
    text-align: center;
    margin: 24px auto 0;
    font-size: 13px
}

.registration-options a,
.expanded-grid a,
.amazon-price a {
    color: #fff;
    background: var(--red);
    border-radius: 999px;
    align-items: center;
    min-height: 42px;
    margin-top: 18px;
    padding: 0 16px;
    font-weight: 900;
    text-decoration: none;
    display: inline-flex
}

.why-section,
.expanded-services {
    background: linear-gradient(90deg, #172b580a 0 1px, transparent 1px 100%), var(--soft);
    background-size: 44px 44px
}

.why-grid,
.expanded-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    display: grid
}

.why-grid article,
.expanded-grid article {
    padding: 26px;
    transition: transform .18s, box-shadow .18s, border-color .18s
}

.why-grid article:hover,
.expanded-grid article:hover,
.service-card:hover,
.price-card:hover {
    border-color: #1f4e8c57;
    transform: translateY(-5px);
    box-shadow: 0 24px 60px #172b5821
}

.expanded-grid article {
    flex-direction: column;
    height: 100%;
    padding: 0;
    display: flex;
    overflow: hidden
}

.expanded-image {
    background: var(--navy);
    height: 190px;
    position: relative;
    overflow: hidden
}

.expanded-image:after {
    content: "";
    background: linear-gradient(#172b5814, #172b588a);
    position: absolute;
    inset: 0
}

.expanded-image img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    transform: scale(1.02)
}

.expanded-image span {
    z-index: 1;
    color: #fff;
    background: var(--red);
    border: 2px solid #ffffffc7;
    border-radius: 50%;
    place-items: center;
    width: 46px;
    height: 46px;
    font-weight: 900;
    display: grid;
    position: absolute;
    bottom: 18px;
    right: 18px
}

.expanded-card-body {
    flex-direction: column;
    flex: 1;
    padding: 26px;
    display: flex
}

.expanded-card-body p {
    flex: 1
}

.expanded-card-body a {
    width: fit-content
}

.why-grid article>span,
.service-icon {
    color: #fff;
    background: var(--blue);
    border-radius: 4px;
    place-items: center;
    width: 46px;
    height: 46px;
    margin-bottom: 22px;
    font-weight: 900;
    display: grid
}

.stats-strip {
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    background: #fff;
    border-radius: 22px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 30px;
    display: grid;
    overflow: hidden
}

.stats-strip div {
    border-right: 1px solid var(--line);
    padding: 24px
}

.stats-strip div:last-child {
    border-right: 0
}

.stats-strip strong {
    color: var(--red);
    font-size: 38px;
    line-height: 1;
    display: block
}

.stats-strip span {
    color: var(--navy);
    margin-top: 8px;
    font-weight: 900;
    display: block
}

.home-pricing {
    background: radial-gradient(circle at 12% 20%, #b3194214, #0000 22%), #fff;
    padding: 96px clamp(20px, 5vw, 72px)
}

.home-pricing .pricing-grid {
    padding: 0
}

.amazon-section {
    color: #fff;
    background: radial-gradient(circle at 86% 18%, #ffffff2e, transparent 28%), linear-gradient(135deg, var(--navy), var(--blue));
    border-radius: 28px;
    grid-template-columns: minmax(0, .9fr) minmax(320px, .85fr);
    align-items: center;
    gap: 34px;
    margin: 0 clamp(12px, 2vw, 24px);
    display: grid;
    box-shadow: 0 28px 90px #172b5833
}

.amazon-copy {
    gap: 18px;
    display: grid
}

.amazon-copy h2,
.amazon-copy p {
    margin: 0
}

.amazon-benefits {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
    display: grid
}

.amazon-benefits li {
    color: #fff;
    background: #ffffff1a;
    border: 1px solid #fff3;
    border-radius: 14px;
    min-height: 58px;
    padding: 14px;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.35
}

.amazon-visual-card {
    grid-template-columns: minmax(0, 1fr) minmax(180px, .65fr);
    align-items: stretch;
    gap: 16px;
    display: grid
}

.amazon-visual-card img {
    object-fit: cover;
    border: 1px solid #ffffff3d;
    border-radius: 22px;
    width: 100%;
    height: 100%;
    min-height: 320px;
    box-shadow: 0 24px 70px #00000038
}

.amazon-section h2,
.amazon-section .eyebrow,
.amazon-section p {
    color: #fff
}

.amazon-price {
    color: var(--navy);
    border-radius: 22px;
    flex-direction: column;
    justify-content: center;
    padding: 30px;
    display: flex
}

.amazon-price p {
    color: var(--muted)
}

.amazon-price strong {
    color: var(--navy);
    font-size: 58px;
    line-height: 1;
    display: block
}

.experience-section {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: #fff
}

.service-grid,
.service-detail-grid,
.pricing-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    display: grid
}

.service-card,
.detail-card,
.price-card,
.contact-panel,
.contact-form,
.team-list article,
.map-card {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 12px 34px #172b580f
}

.service-card,
.detail-card {
    min-height: 220px;
    padding: 28px
}

.service-card {
    flex-direction: column;
    padding: 0;
    display: flex;
    overflow: hidden
}

.service-card-image {
    background: var(--navy);
    height: 210px;
    overflow: hidden
}

.service-card-image img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    transition: transform .35s
}

.service-card:hover .service-card-image img {
    transform: scale(1.045)
}

.service-card-content {
    flex-direction: column;
    flex: 1;
    padding: 28px;
    display: flex
}

.service-card p {
    flex: 1;
    line-height: 1.65
}

.service-card-link {
    width: fit-content;
    color: var(--red);
    margin-top: 20px;
    font-weight: 900;
    text-decoration: none
}

.service-card-link:hover,
.service-card-link:focus-visible {
    color: var(--navy);
    text-underline-offset: 4px;
    text-decoration: underline
}

.service-page-layout {
    grid-template-columns: minmax(0, 1fr) minmax(300px, .55fr);
    align-items: start;
    gap: 28px;
    display: grid
}

.service-page-copy,
.service-page-card {
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    background: #fff;
    border-radius: 4px
}

.service-page-copy {
    padding: 34px
}

.service-page-copy p {
    max-width: 760px;
    color: var(--muted);
    font-size: 18px;
    line-height: 1.75
}

.service-page-image {
    object-fit: cover;
    border-radius: 4px;
    width: 100%;
    height: 280px;
    margin-top: 24px;
    display: block
}

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

.service-catalog-card {
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    background: #fff;
    border-radius: 20px;
    grid-template-columns: 210px 1fr;
    display: grid;
    overflow: hidden
}

.service-catalog-card img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    min-height: 230px
}

.service-catalog-card div {
    padding: 28px
}

.service-catalog-card h2 {
    margin-top: 0;
    font-size: 24px
}

.service-catalog-card a,
.map-link strong {
    color: var(--red);
    font-weight: 900;
    text-decoration: none
}

.service-detail-actions {
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 28px;
    display: flex
}

.service-page-card {
    padding: 30px
}

.service-page-card ul {
    gap: 12px;
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
    display: grid
}

.service-page-card li {
    color: var(--muted);
    font-weight: 800
}

.service-page-card li:before {
    content: "";
    background: var(--red);
    border-radius: 50%;
    width: 8px;
    height: 8px;
    margin-right: 10px;
    display: inline-block
}

.policy-content {
    max-width: 900px
}

.policy-content ul {
    color: var(--muted);
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    background: #fff;
    border-radius: 20px;
    gap: 14px;
    margin: 26px 0;
    padding: 28px 28px 28px 48px;
    display: grid
}

.policy-content p {
    color: var(--muted);
    line-height: 1.7
}

.policy-content h2 {
    color: var(--navy);
    margin: 32px 0 12px;
    font-size: 22px
}

.policy-content h3 {
    color: var(--navy);
    margin: 24px 0 8px;
    font-size: 18px
}

.policy-content a {
    color: var(--blue);
    text-decoration: underline
}

.card-number {
    color: var(--red);
    margin-bottom: 34px;
    font-weight: 900;
    display: inline-flex
}

.process-section {
    background: radial-gradient(circle at 12% 20%, #1f4e8c1a, transparent 24%), linear-gradient(90deg, #172b580a 0 1px, transparent 1px 100%), var(--soft);
    background-size: 44px 44px;
    position: relative;
    overflow: hidden
}

.process-line {
    scrollbar-color: var(--blue) #dfe6f1;
    scrollbar-width: thin;
    grid-template-columns: repeat(8, minmax(230px, 1fr));
    gap: 18px;
    padding: 8px 2px 20px;
    display: grid;
    position: relative;
    overflow-x: auto
}

.process-line:before {
    content: "";
    background: linear-gradient(90deg, var(--red), var(--blue));
    width: 1880px;
    height: 2px;
    position: absolute;
    top: 42px;
    left: 44px
}

.process-step {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 18px;
    align-content: start;
    min-height: 230px;
    padding: 28px;
    display: grid;
    position: relative;
    box-shadow: 0 14px 34px #172b5812
}

.process-step span {
    z-index: 1;
    color: #fff;
    background: linear-gradient(135deg, var(--navy), var(--blue));
    border-radius: 50%;
    place-items: center;
    width: 44px;
    height: 44px;
    margin-bottom: 18px;
    font-weight: 900;
    display: grid;
    position: relative;
    box-shadow: 0 0 0 8px #fff
}

.process-step h3 {
    color: var(--navy);
    margin: 0 0 10px;
    font-size: 20px
}

.process-step p {
    color: var(--muted);
    margin-bottom: 0;
    font-weight: 700;
    line-height: 1.6
}

.split-section {
    grid-template-columns: minmax(0, .9fr) minmax(300px, 1fr);
    align-items: center;
    gap: 40px;
    display: grid
}

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

.state-grid {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(24px, 5vw, 76px) 70px
}

.fit-grid span,
.state-grid a {
    min-height: 58px;
    color: var(--navy);
    background: var(--soft-blue);
    text-align: center;
    border: 1px solid #dfe7fb;
    border-radius: 999px;
    justify-content: center;
    align-items: center;
    padding: 18px;
    font-weight: 900;
    text-decoration: none;
    display: inline-flex
}

.client-experience-section {
    background: #fff
}

.client-experience-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    display: grid
}

.client-experience-grid article {
    border: 1px solid var(--line);
    background: linear-gradient(#fff, #f7f9fc);
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0 16px 42px #172b5814
}

.client-experience-grid article>span {
    color: #fff;
    background: var(--red);
    border-radius: 50%;
    place-items: center;
    width: 44px;
    height: 44px;
    font-weight: 900;
    display: inline-grid
}

.client-experience-grid h3 {
    color: var(--navy);
    margin-top: 24px;
    font-size: 23px
}

.client-experience-grid p {
    color: var(--muted);
    line-height: 1.65
}

.faq-section {
    background: #f3f6fa
}

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

.faq-list details {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 14px;
    align-self: start;
    padding: 0 22px
}

.faq-list summary {
    color: var(--navy);
    cursor: pointer;
    padding: 20px 30px 20px 0;
    font-weight: 900
}

.faq-list details[open] {
    border-color: #1f4e8c59;
    box-shadow: 0 14px 34px #172b5814
}

.faq-list p {
    color: var(--muted);
    margin-top: 0;
    padding-bottom: 20px;
    line-height: 1.65
}

.home-about-section {
    grid-template-columns: minmax(360px, .9fr) minmax(0, 1fr);
    align-items: center;
    gap: clamp(40px, 7vw, 96px);
    display: grid
}

.home-about-section>img {
    object-fit: cover;
    border-radius: 20px;
    width: 100%;
    height: 480px;
    box-shadow: 0 26px 70px #172b582e
}

.home-about-section h2,
.home-contact-copy h2 {
    font-size: clamp(38px, 5vw, 64px);
    line-height: 1.05
}

.home-about-section p,
.home-contact-copy p {
    color: var(--muted);
    font-size: 17px;
    line-height: 1.75
}

.home-contact-section {
    color: #fff;
    background: linear-gradient(135deg, #071a43, var(--navy));
    border-bottom: 6px solid var(--red);
    grid-template-columns: minmax(0, .8fr) minmax(380px, 1fr);
    gap: clamp(40px, 7vw, 96px);
    display: grid
}

.home-contact-copy .eyebrow,
.home-contact-copy h2 {
    color: #fff
}

.home-contact-copy p {
    color: #ffffffbf
}

.home-contact-copy>a {
    color: #fff;
    margin-top: 18px;
    font-size: 22px;
    font-weight: 900;
    display: inline-block
}

.home-contact-form {
    color: var(--navy);
    background: #fff;
    border-radius: 20px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    padding: 30px;
    display: grid;
    box-shadow: 0 24px 70px #0000003d
}

.home-contact-form label {
    gap: 8px;
    font-size: 13px;
    font-weight: 900;
    display: grid
}

.home-contact-form input,
.home-contact-form select {
    width: 100%;
    min-height: 48px;
    color: var(--ink);
    border: 1px solid var(--line);
    font: inherit;
    background: #f7f9fc;
    border-radius: 8px;
    padding: 0 13px
}

.home-contact-form button {
    background: var(--red);
    grid-column: 1/-1;
    min-height: 50px
}

.home-contact-wide {
    grid-column: 1/-1
}

.callout {
    background: linear-gradient(135deg, var(--navy), var(--blue));
    border-left: 8px solid var(--red);
    color: #fff;
    border-radius: 28px;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    margin: 0 clamp(20px, 5vw, 72px) 96px;
    padding: 48px;
    display: flex
}

.callout h2 {
    color: #fff;
    margin-bottom: 0
}

.primary-btn.light {
    min-height: 52px;
    color: var(--navy);
    background: #fff;
    border: 1px solid #ffffffb8;
    gap: 10px;
    padding: 0 26px;
    box-shadow: 0 18px 34px #05123038
}

.primary-btn.light span {
    color: #fff;
    background: var(--red);
    border-radius: 50%;
    place-items: center;
    width: 26px;
    height: 26px;
    font-size: 16px;
    line-height: 1;
    transition: transform .18s, background .18s;
    display: grid
}

.primary-btn.light:hover {
    background: #f7fbff;
    box-shadow: 0 22px 42px #0512304d
}

.primary-btn.light:hover span {
    background: var(--blue);
    transform: translate(3px)
}

.page-hero {
    background: linear-gradient(90deg, #172b580a 0 1px, transparent 1px 100%), linear-gradient(180deg, #fff, var(--soft));
    border-bottom: 1px solid var(--line);
    background-size: 42px 42px, auto;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 460px);
    align-items: center;
    gap: 36px;
    display: grid
}

.page-hero h1 {
    max-width: 1050px;
    color: var(--navy);
    font-size: clamp(38px, 5vw, 68px)
}

.page-hero p {
    color: var(--muted)
}

.page-hero img {
    object-fit: cover;
    border: 1px solid var(--line);
    width: 100%;
    height: 260px;
    box-shadow: var(--shadow);
    border-radius: 24px
}

.pricing-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 12px;
    max-width: 1120px;
    margin: 0 auto
}

.price-card {
    border-color: #d7d7d7;
    border-radius: 8px;
    flex-direction: column;
    min-height: 494px;
    padding: 24px 20px 20px;
    display: flex;
    position: relative;
    box-shadow: 0 8px 24px #172b580f
}

.price-card.featured {
    color: #fff;
    background: #10266d;
    border-color: #10266db8;
    transform: translateY(-20px);
    box-shadow: 0 12px 28px #10266d4d
}

.price-ribbon {
    color: #fff;
    height: 40px;
    font-family: var(--font-heading);
    background: #c71f28;
    border-radius: 8px 8px 0 0;
    place-items: center;
    font-size: 26px;
    font-weight: 700;
    line-height: 1;
    display: grid;
    position: absolute;
    top: -31px;
    left: 8px;
    right: 8px
}

.price-card h3 {
    color: #10266d;
    margin: 0 0 18px;
    font-size: 32px;
    line-height: 1.05
}

.price-card p {
    color: #7a7a7a;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.45
}

.price-card.featured h3,
.price-card.featured p,
.price-card.featured li,
.price-card.featured .price-line,
.price-card.featured .price-line strong,
.price-card.featured .price-line span,
.price-card.featured .price-save {
    color: #fff
}

.price-card ul {
    gap: 10px;
    margin: 22px 0 28px;
    padding: 0;
    list-style: none;
    display: grid
}

.price-card li {
    color: #5f6672;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.45;
    display: flex
}

.price-card li>span {
    color: #fff;
    background: #10e819;
    border-radius: 50%;
    flex: none;
    place-items: center;
    width: 18px;
    height: 18px;
    margin-top: 1px;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    display: grid
}

.price-line {
    color: #0c0c0c;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px;
    margin-top: auto;
    font-size: 22px;
    font-weight: 900;
    line-height: 1.2;
    display: flex
}

.price-line del {
    color: #9b9b9b;
    text-decoration-thickness: 2px
}

.price-line strong {
    color: #0c0c0c;
    font-size: 22px;
    line-height: 1.2
}

.price-line span {
    color: #0c0c0c
}

.price-save {
    color: #777;
    margin: 18px 0 14px;
    font-size: 15px;
    font-weight: 700
}

.price-card a {
    min-width: 246px;
    min-height: 46px;
    box-shadow: none;
    background: #c91f28;
    border-radius: 0;
    align-self: flex-start;
    padding: 0 23px;
    font-size: 18px
}

.state-section,
.contact-section {
    grid-template-columns: .8fr 1.2fr;
    align-items: start;
    gap: 24px;
    display: grid
}

.contact-page-hero {
    color: #fff;
    border-bottom: 6px solid var(--red);
    background: radial-gradient(circle at 14% 10%, #ffffff1f, #0000 26%), linear-gradient(135deg, #071a43, #102f69 68%, #4c1831);
    grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
    align-items: stretch;
    min-height: 620px;
    padding: clamp(42px, 6vw, 86px);
    display: grid
}

.contact-hero-copy {
    align-self: center;
    max-width: 680px;
    padding-right: clamp(24px, 5vw, 72px)
}

.contact-hero-copy .eyebrow {
    color: #ffadb8
}

.contact-hero-copy h1 {
    color: #fff;
    letter-spacing: -.045em;
    margin: 18px 0 24px;
    font-size: clamp(48px, 6vw, 78px);
    line-height: .98
}

.contact-hero-copy>p {
    color: #fffc;
    max-width: 620px;
    font-size: 18px;
    line-height: 1.75
}

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

.contact-hero-phone {
    color: #fff;
    border: 1px solid #ffffff6b;
    border-radius: 8px;
    padding: 13px 18px;
    font-weight: 900;
    text-decoration: none
}

.contact-hero-details {
    color: #ffffffb3;
    border-top: 1px solid #fff3;
    flex-wrap: wrap;
    gap: 8px 18px;
    margin-top: 32px;
    padding-top: 22px;
    font-size: 13px;
    display: flex
}

.contact-hero-details strong {
    color: #fff
}

.contact-hero-image-wrap {
    border: 5px solid #ffffffeb;
    border-radius: 24px;
    min-height: 460px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 30px 80px #00000052
}

.contact-hero-image-wrap img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.contact-hero-image-wrap>div {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background: #071a43e0;
    border-radius: 12px;
    gap: 5px;
    padding: 18px 20px;
    display: grid;
    position: absolute;
    bottom: 20px;
    left: 20px;
    right: 20px
}

.contact-hero-image-wrap span {
    color: #ffadb8;
    letter-spacing: .1em;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 900
}

.map-card {
    padding: 28px
}

.map-link {
    color: inherit;
    text-decoration: none;
    transition: transform .18s, box-shadow .18s;
    display: block
}

.map-link:hover {
    transform: translateY(-4px);
    box-shadow: 0 24px 60px #172b5824
}

.state-application-section {
    background: #eaf8ff;
    width: 100%;
    max-width: none;
    padding: 0;
    display: block
}

.state-map-banner {
    min-height: 470px;
    box-shadow: none;
    background: #eaf7ff;
    border: 0;
    grid-template-columns: minmax(300px, .68fr) minmax(520px, 1.32fr);
    align-items: center;
    margin: 0 auto 34px;
    padding: 44px clamp(28px, 4.5vw, 76px);
    display: grid;
    overflow: hidden
}

.state-map-copy {
    z-index: 2;
    align-self: center;
    padding: 0;
    position: relative
}

.state-map-copy>span {
    color: #111827;
    font-family: var(--font-heading);
    letter-spacing: .04em;
    font-size: 16px;
    font-weight: 700
}

.state-map-copy h1 {
    color: #121a27;
    max-width: 570px;
    font-family: var(--font-heading);
    margin: 30px 0 28px;
    font-size: clamp(40px, 4.7vw, 68px);
    font-weight: 500;
    line-height: 1.08
}

.state-map-copy h1 em {
    color: var(--red);
    font-style: normal
}

.state-map-copy a {
    color: #fff;
    background: var(--red);
    text-transform: uppercase;
    align-items: center;
    min-height: 48px;
    padding: 0 26px;
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
    display: inline-flex;
    box-shadow: 0 10px 24px #b3194233
}

.state-map-visual {
    align-items: center;
    min-width: 0;
    min-height: 360px;
    display: grid;
    position: relative;
    overflow: hidden
}

.state-map-visual img {
    object-fit: contain;
    width: 145%;
    max-width: none;
    height: auto;
    min-height: 0;
    transition: transform .35s;
    display: block;
    transform: translate(-31%)
}

.state-map-visual:hover img {
    transform: translate(-31%)scale(1.025)
}

.state-map-visual>span {
    z-index: 1;
    color: #111827;
    font-family: var(--font-heading);
    font-size: 15px;
    font-style: italic;
    font-weight: 700;
    position: absolute;
    top: 44px;
    left: 38px;
    transform: rotate(-8deg)
}

.state-map-visual>span:after {
    content: "";
    border-top: 5px solid #111827;
    border-radius: 50%;
    width: 112px;
    height: 38px;
    position: absolute;
    top: 62%;
    left: 95%;
    transform: rotate(13deg)
}

.state-map-visual>span:before {
    content: "";
    border-top: 9px solid #0000;
    border-bottom: 9px solid #0000;
    border-left: 18px solid #111827;
    width: 0;
    height: 0;
    position: absolute;
    top: 20px;
    left: calc(95% + 96px);
    transform: rotate(12deg)
}

.map-shape {
    background: linear-gradient(90deg, transparent 48%, #ffffff42 50%, transparent 52%), repeating-linear-gradient(0deg, #ffffff24 0 12px, transparent 12px 24px), var(--navy);
    border-radius: 4px;
    place-items: center;
    height: 240px;
    margin-bottom: 20px;
    display: grid
}

.map-shape span {
    color: #fff;
    background: var(--red);
    border-radius: 4px;
    place-items: center;
    width: 130px;
    height: 88px;
    font-size: 38px;
    font-weight: 900;
    display: grid
}

.team-list {
    gap: 14px;
    display: grid
}

.team-section {
    background: #fff
}

.team-section-compact {
    border-top: 1px solid var(--line)
}

.team-demo-notice {
    color: #6d2b35;
    border-left: 4px solid var(--red);
    background: #fff1f3;
    padding: 14px 18px;
    line-height: 1.55
}

.team-profile-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    display: grid
}

.team-profile-card {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 16px 44px #172b581a
}

.team-profile-portrait {
    aspect-ratio: 1;
    background: #e6e9ee;
    width: 100%;
    position: relative;
    overflow: hidden
}

.team-profile-portrait img {
    width: 400%;
    max-width: none;
    height: 200%;
    position: absolute
}

.team-headshot-placeholder {
    aspect-ratio: 4/5;
    color: #fff;
    background: radial-gradient(circle at 50% 35%, #ffffff2e 0 14%, #0000 15%), radial-gradient(at 50% 85%, #ffffff21 0 30%, #0000 31%), linear-gradient(145deg, #0e3678, #071a43 60%, #4c1831);
    place-items: center;
    min-height: 360px;
    display: grid;
    position: relative
}

.team-headshot-placeholder>span {
    letter-spacing: .06em;
    font-size: 58px;
    font-weight: 900
}

.team-headshot-placeholder small {
    color: var(--navy);
    letter-spacing: .08em;
    background: #fff;
    padding: 6px 9px;
    font-size: 10px;
    font-weight: 900;
    position: absolute;
    bottom: 14px;
    right: 14px
}

.team-profile-body {
    padding: 26px
}

.team-profile-body h3 {
    color: var(--navy);
    margin: 10px 0 5px;
    font-size: 26px
}

.team-profile-body>strong {
    color: var(--blue)
}

.team-profile-body dl {
    gap: 14px;
    margin: 22px 0 0;
    display: grid
}

.team-profile-body dl>div {
    border-top: 1px solid var(--line);
    padding-top: 14px
}

.team-profile-body dt {
    color: var(--navy);
    text-transform: uppercase;
    letter-spacing: .06em;
    font-size: 12px;
    font-weight: 900
}

.team-profile-body dd {
    color: var(--muted);
    margin: 6px 0 0;
    line-height: 1.55
}

.legal-team-section {
    color: #fff;
    background: radial-gradient(circle at 8% 18%, #ffffff1a, #0000 30%), linear-gradient(135deg, #071a43, #0d306d 65%, #102654);
    grid-template-columns: minmax(0, .82fr) minmax(480px, 1.18fr);
    align-items: center;
    gap: clamp(36px, 6vw, 86px);
    display: grid;
    position: relative;
    overflow: hidden
}

.legal-team-hero {
    border-bottom: 6px solid var(--red);
    min-height: 720px;
    padding-top: clamp(72px, 8vw, 118px);
    padding-bottom: clamp(72px, 8vw, 118px)
}

.legal-team-section:before {
    content: "";
    opacity: .09;
    pointer-events: none;
    background: repeating-linear-gradient(105deg, #0000 0 34px, #fff 35px 38px);
    width: 48%;
    position: absolute;
    inset: 0 auto 0 0
}

.legal-team-copy,
.legal-team-gallery {
    z-index: 1;
    position: relative
}

.legal-team-copy h1 {
    color: #fff;
    letter-spacing: -.045em;
    margin: 12px 0 18px;
    font-size: clamp(48px, 6vw, 78px);
    line-height: .98
}

.legal-team-copy .eyebrow {
    color: #ffb3ba
}

.legal-team-copy p {
    color: #ffffffc7;
    margin: 0 0 14px;
    line-height: 1.7
}

.legal-team-focus-list {
    gap: 10px;
    margin: 24px 0 28px;
    padding: 0;
    list-style: none;
    display: grid
}

.legal-team-focus-list li {
    align-items: center;
    gap: 10px;
    font-weight: 800;
    display: flex
}

.legal-team-focus-list li:before {
    content: "✓";
    color: #fff;
    background: var(--red);
    border-radius: 50%;
    flex: 0 0 22px;
    place-items: center;
    width: 22px;
    height: 22px;
    font-size: 12px;
    display: grid
}

.legal-team-cta {
    color: #fff;
    background: var(--red);
    border-radius: 8px;
    width: fit-content;
    padding: 13px 22px;
    font-weight: 900;
    text-decoration: none;
    display: inline-flex
}

.legal-team-actions {
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    display: flex
}

.legal-team-secondary-cta {
    color: #fff;
    border: 1px solid #ffffff73;
    border-radius: 8px;
    padding: 12px 18px;
    font-weight: 900;
    text-decoration: none
}

.legal-team-secondary-cta:hover {
    background: #ffffff14;
    border-color: #fff
}

.legal-team-hero-image {
    border: 6px solid #fffffff0;
    border-radius: 22px;
    width: 100%;
    display: block;
    box-shadow: 0 30px 70px #00000057
}

.about-hero {
    color: #fff;
    background: linear-gradient(135deg, #071a43, var(--navy) 62%, #102f69);
    border-radius: 24px;
    grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
    min-height: 610px;
    margin: 26px clamp(12px, 2vw, 24px) 0;
    display: grid;
    overflow: hidden;
    box-shadow: 0 30px 80px #172b5833
}

.about-hero-copy {
    align-self: center;
    padding: clamp(48px, 7vw, 94px)
}

.about-hero-copy .eyebrow {
    color: #fff
}

.about-hero-copy h1 {
    color: #fff;
    letter-spacing: -.045em;
    max-width: 700px;
    margin: 18px 0 24px;
    font-size: clamp(48px, 6vw, 82px);
    line-height: .98
}

.about-hero-copy h1 em {
    color: #ff6a7f;
    font-style: normal
}

.about-hero-copy>p {
    color: #fffc;
    max-width: 680px;
    font-size: 18px;
    line-height: 1.75
}

.about-hero-actions {
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 34px;
    display: flex
}

.about-hero-image {
    min-height: 610px;
    position: relative;
    overflow: hidden
}

.about-hero-image:after {
    content: "";
    pointer-events: none;
    background: linear-gradient(90deg, #071a4359, #0000 32%);
    position: absolute;
    inset: 0
}

.about-hero-image img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.about-image-label {
    z-index: 1;
    color: var(--navy);
    border-left: 5px solid var(--red);
    background: #fffffff0;
    padding: 18px 22px;
    position: absolute;
    bottom: 28px;
    right: 28px;
    box-shadow: 0 18px 50px #0003
}

.about-image-label strong,
.about-image-label span {
    display: block
}

.about-image-label span {
    color: var(--muted);
    margin-top: 4px;
    font-size: 13px
}

.about-proof {
    border: 1px solid var(--line);
    background: #fff;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0 clamp(12px, 2vw, 24px);
    display: grid;
    box-shadow: 0 20px 50px #172b581a
}

.about-proof article {
    border-right: 1px solid var(--line);
    padding: 26px
}

.about-proof article:last-child {
    border-right: 0
}

.about-proof strong,
.about-proof span {
    display: block
}

.about-proof strong {
    color: var(--red);
    font-size: 20px
}

.about-proof span {
    color: var(--muted);
    margin-top: 7px;
    font-size: 13px;
    line-height: 1.45
}

.about-client-section,
.about-integrity-section {
    grid-template-columns: minmax(0, 1fr) minmax(340px, .72fr);
    align-items: center;
    gap: clamp(36px, 7vw, 96px);
    display: grid
}

.about-client-copy h2,
.about-integrity-section h2 {
    max-width: 760px;
    font-size: clamp(38px, 5vw, 64px);
    line-height: 1.05
}

.about-client-copy p,
.about-integrity-section p {
    color: var(--muted);
    font-size: 17px;
    line-height: 1.75
}

.about-support-card {
    color: #fff;
    background: var(--navy);
    border-top: 6px solid var(--red);
    padding: 34px;
    box-shadow: 0 24px 64px #172b5833
}

.about-support-card>span {
    color: #ff8a9d;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: 12px;
    font-weight: 900
}

.about-support-card ol {
    gap: 22px;
    margin: 28px 0 0;
    padding-left: 26px;
    display: grid
}

.about-support-card li {
    padding-left: 8px
}

.about-support-card li::marker {
    color: #ff8a9d;
    font-weight: 900
}

.about-support-card strong {
    font-size: 19px
}

.about-support-card p {
    color: #ffffffb8;
    margin: 6px 0 0;
    line-height: 1.55
}

.about-integrity-section {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: #f3f6fa
}

.team-list article {
    align-items: center;
    gap: 16px;
    padding: 18px;
    display: flex
}

.team-list span {
    color: #fff;
    background: var(--red);
    border-radius: 4px;
    place-items: center;
    width: 48px;
    height: 48px;
    font-weight: 900;
    display: grid
}

.team-list strong {
    color: var(--navy)
}

.team-list p {
    color: var(--muted);
    margin-bottom: 0
}

.contact-panel,
.contact-form {
    padding: 28px
}

.contact-form>small {
    color: var(--muted);
    line-height: 1.5
}

.cookie-notice {
    z-index: 100;
    color: #fff;
    border: 1px solid #ffffff2e;
    border-bottom: 4px solid var(--red);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    background: #071a43f7;
    justify-content: space-between;
    align-items: center;
    gap: 28px;
    max-width: 1080px;
    margin: 0 auto;
    padding: 20px 22px;
    display: flex;
    position: fixed;
    bottom: 20px;
    left: 20px;
    right: 20px;
    box-shadow: 0 24px 70px #0000004d
}

.cookie-notice strong {
    font-family: var(--font-heading);
    font-size: 18px;
    display: block
}

.cookie-notice p {
    color: #ffffffbf;
    margin: 5px 0;
    line-height: 1.5
}

.cookie-notice a {
    color: #fff;
    font-size: 13px;
    font-weight: 800
}

.cookie-actions {
    flex: none;
    gap: 10px;
    display: flex
}

.cookie-actions button {
    white-space: nowrap;
    min-height: 42px;
    box-shadow: none
}

.cookie-actions .cookie-secondary {
    color: #fff;
    background: 0 0;
    border: 1px solid #ffffff73
}

.contact-form {
    gap: 16px;
    display: grid
}

label {
    color: var(--navy);
    gap: 8px;
    font-weight: 900;
    display: grid
}

input,
textarea,
select {
    box-sizing: border-box;
    border: 1px solid var(--line);
    width: 100%;
    color: var(--ink);
    font: inherit;
    background: #fff;
    border-radius: 4px;
    padding: 15px 16px;
    font-weight: 600;
    transition: border-color .18s, box-shadow .18s
}

input:focus,
textarea:focus,
select:focus {
    border-color: #202d608c;
    outline: none;
    box-shadow: 0 0 0 4px #202d6017
}

textarea {
    resize: vertical
}

select {
    appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
    background-position: calc(100% - 20px) 52%, calc(100% - 14px) 52%;
    background-repeat: no-repeat;
    background-size: 6px 6px, 6px 6px
}

.application-shell {
    background: #fff;
    overflow: hidden
}

.application-topper {
    color: #fff;
    background: radial-gradient(circle at 18% 0%, #ffffff1a, transparent 28%), linear-gradient(135deg, #09235ef0, #081c50fa), var(--navy);
    gap: 22px;
    padding: 34px clamp(20px, 6vw, 80px) 24px;
    display: grid;
    position: relative
}

.application-topper:before {
    content: "";
    opacity: .16;
    pointer-events: none;
    background-image: radial-gradient(circle at 20px 20px, #0000 10px, #ffffff29 11px, #0000 12px), radial-gradient(circle at 62px 42px, #0000 10px, #ffffff1f 11px, #0000 12px);
    background-size: 86px 68px;
    position: absolute;
    inset: 0
}

.application-topper>* {
    z-index: 1;
    position: relative
}

.application-topper-brand {
    text-align: center;
    text-transform: uppercase;
    justify-items: center;
    gap: 3px;
    display: grid
}

.application-topper-brand span {
    letter-spacing: .08em;
    font-size: 20px;
    font-weight: 950
}

.application-topper-brand strong {
    letter-spacing: .12em;
    font-size: 12px
}

.application-stepper {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    width: 100%;
    max-width: 920px;
    margin: 0 auto;
    padding: 0;
    list-style: none;
    display: grid
}

.application-stepper li {
    justify-items: center;
    display: grid;
    position: relative
}

.application-stepper li:before {
    content: "";
    background: #ffffffb3;
    width: 100%;
    height: 2px;
    position: absolute;
    top: 17px;
    left: -50%
}

.application-stepper li:first-child:before {
    display: none
}

.application-stepper button {
    z-index: 1;
    color: #ffffff94;
    cursor: pointer;
    width: 100%;
    font: inherit;
    text-align: center;
    background: 0 0;
    border: 0;
    justify-items: center;
    gap: 10px;
    font-weight: 900;
    display: grid;
    position: relative
}

.application-stepper span {
    color: #fff;
    background: #ffffff57;
    border-radius: 50%;
    place-items: center;
    width: 34px;
    height: 34px;
    display: grid;
    box-shadow: 0 0 0 3px #081c50b3
}

.application-stepper strong {
    font-size: 13px
}

.application-stepper .current button,
.application-stepper .done button {
    color: #fff
}

.application-stepper .current span {
    color: var(--navy);
    background: #fff
}

.application-stepper .done span {
    background: var(--red)
}

.step-progress {
    background: #ffffff38;
    border-radius: 999px;
    width: 100%;
    max-width: 920px;
    height: 4px;
    margin: 0 auto;
    overflow: hidden
}

.step-progress span {
    border-radius: inherit;
    background: #fff;
    height: 100%;
    transition: width .25s;
    display: block
}

.application-form {
    width: calc(100% - clamp(28px, 8vw, 112px));
    max-width: 1320px;
    box-shadow: none;
    background: #fff;
    border: 0;
    border-radius: 0;
    margin: 0 auto;
    padding-top: 28px;
    display: grid;
    overflow: hidden
}

.application-form input,
.application-form textarea,
.application-form select {
    border-radius: 8px
}

fieldset {
    border: 0;
    gap: 22px;
    min-width: 0;
    margin: 0;
    padding: 0 0 34px;
    display: grid
}

.form-step-header {
    color: var(--navy);
    border-bottom: 1px solid var(--line);
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 22px;
    padding: 0 0 26px;
    display: flex
}

.form-step-count {
    color: var(--muted);
    margin-bottom: 8px;
    font-size: 18px;
    font-weight: 800;
    display: block
}

.form-step-header h2 {
    margin-bottom: 8px;
    font-size: clamp(28px, 3vw, 34px)
}

.form-step-header p {
    color: var(--muted);
    margin: 0;
    line-height: 1.6
}

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

.protection-block {
    gap: 16px;
    display: grid
}

.protection-block h3 {
    color: #000;
    margin: 0;
    font-size: 22px
}

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

.protection-card {
    min-width: 0;
    color: var(--ink);
    background: #fff;
    border: 2px solid #252f64;
    border-radius: 12px;
    align-content: start;
    transition: border-color .18s, box-shadow .18s, transform .18s;
    display: grid;
    overflow: hidden;
    box-shadow: 0 2px #14182c4d
}

.protection-card:hover,
.protection-card.selected {
    border-color: var(--red);
    transform: translateY(-1px);
    box-shadow: 0 14px 34px #0e265c1c
}

.protection-card-heading {
    cursor: pointer;
    border-bottom: 1px solid #dfe4ec;
    grid-template-columns: 40px minmax(0, 1fr) 24px;
    align-items: center;
    gap: 8px;
    min-height: 62px;
    padding: 10px;
    display: grid
}

.protection-card-heading>input,
.file-field input {
    opacity: 0;
    pointer-events: none;
    width: 1px;
    height: 1px;
    position: absolute
}

.protection-sample {
    min-width: 44px;
    height: 34px;
    color: var(--red);
    letter-spacing: -.04em;
    place-items: center;
    font-size: 12px;
    font-weight: 950;
    display: grid
}

.protection-type-grid strong {
    color: #000;
    font-size: 20px;
    line-height: 1.1;
    display: block
}

.protection-type-grid small {
    color: var(--muted);
    margin-top: 4px;
    font-size: 13px;
    line-height: 1.35;
    display: block
}

.protection-check {
    color: #fff;
    opacity: 0;
    background: #252f64;
    border-radius: 50%;
    place-items: center;
    width: 22px;
    height: 22px;
    display: grid
}

.protection-card.selected .protection-check {
    opacity: 1
}

.logo-sample,
.name-sample {
    color: var(--red)
}

.slogan-sample {
    color: #2458bd;
    font-size: 8px
}

.protection-card-field,
.protection-text-field {
    min-height: 32px;
    margin: 8px 9px 0;
    background: snow !important;
    border: 1px solid #ff5964 !important;
    border-radius: 8px !important
}

.protection-card-field {
    cursor: pointer;
    text-overflow: ellipsis;
    white-space: nowrap;
    place-items: center;
    padding: 6px 10px;
    font-size: 13px;
    display: grid;
    overflow: hidden
}

.protection-text-field {
    width: calc(100% - 18px) !important;
    padding: 6px 10px !important
}

.protection-required {
    margin: 2px 9px 0;
    color: #ef3340 !important;
    font-size: 10px !important
}

.protection-add-new {
    color: #172158;
    cursor: pointer;
    font: inherit;
    background: 0 0;
    border: 0;
    justify-self: start;
    margin: 7px 9px 10px;
    padding: 0;
    font-size: 12px;
    font-weight: 900
}

.contact-details-heading {
    color: #000;
    margin: 8px 0 0;
    font-size: 22px
}

.upload-mark {
    color: #111827;
    border: 2px solid #111827;
    border-radius: 50%;
    place-items: center;
    width: 26px;
    height: 26px;
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
    display: grid
}

.contact-intake-grid {
    gap: 16px;
    display: grid
}

.phone-input-shell {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 8px;
    grid-template-columns: 44px 48px minmax(0, 1fr);
    align-items: center;
    min-height: 48px;
    display: grid;
    overflow: hidden
}

.phone-input-shell span,
.phone-input-shell strong {
    align-self: stretch;
    place-items: center;
    display: grid
}

.phone-input-shell span {
    background: #f2f4f8
}

.phone-input-shell strong {
    color: #000;
    font-weight: 800
}

.phone-input-shell input {
    box-shadow: none;
    border: 0;
    border-radius: 0
}

.phone-input-shell:focus-within {
    border-color: #202d608c;
    box-shadow: 0 0 0 4px #202d6017
}

.package-choice {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    display: grid
}

.signature-step {
    justify-items: center
}

.signature-intro {
    max-width: 780px;
    color: var(--muted);
    text-align: center;
    margin: 0;
    font-size: 14px;
    line-height: 1.6
}

.signature-mode-tabs {
    background: #eef1f6;
    border-radius: 10px;
    gap: 6px;
    padding: 6px;
    display: inline-flex
}

.signature-mode-tabs button,
.signature-mode-tabs label {
    min-height: 38px;
    color: var(--navy);
    cursor: pointer;
    font: inherit;
    background: 0 0;
    border: 1px solid #0000;
    border-radius: 8px;
    justify-content: center;
    align-items: center;
    padding: 0 18px;
    font-size: 13px;
    font-weight: 900;
    display: inline-flex
}

.signature-mode-tabs .active {
    background: #fff;
    border-color: #d6dce8;
    box-shadow: 0 8px 18px #172b5814
}

.signature-mode-tabs input {
    display: none
}

.signature-canvas,
.signature-upload-preview {
    background: linear-gradient(#0000 49%, #e5eaf2 50%, #0000 51%), #fff;
    border: 1px solid #cfd7e6;
    border-radius: 14px;
    width: min(720px, 100%);
    height: 240px
}

.signature-canvas {
    touch-action: none;
    cursor: crosshair
}

.signature-upload-preview {
    place-items: center;
    display: grid;
    overflow: hidden
}

.signature-upload-preview img {
    object-fit: contain;
    width: 100%;
    height: 100%
}

.signature-actions {
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    width: min(720px, 100%);
    display: flex
}

.signature-actions small {
    color: var(--muted);
    font-weight: 700
}

.signature-actions button {
    color: #fff;
    background: var(--navy);
    cursor: pointer;
    min-height: 36px;
    font: inherit;
    border: 0;
    border-radius: 999px;
    padding: 0 16px;
    font-size: 13px;
    font-weight: 900
}

.consent-row {
    border: 1px solid var(--line);
    background: var(--soft);
    color: var(--navy);
    cursor: pointer;
    border-radius: 4px;
    align-items: center;
    gap: 10px;
    padding: 16px;
    font-weight: 900;
    display: flex
}

.consent-row input {
    width: auto
}

.package-card {
    color: #000;
    cursor: pointer;
    border: 2px solid #dde3ec;
    border-radius: 24px;
    min-height: 100%;
    padding: 24px 20px 28px;
    transition: border-color .18s, box-shadow .18s, transform .18s;
    display: block;
    position: relative;
    overflow: hidden
}

.package-card:hover {
    border-color: var(--navy);
    transform: translateY(-2px);
    box-shadow: 0 18px 40px #0e265c21
}

.package-card:has(input:checked) {
    border-color: var(--navy);
    transform: translateY(-2px);
    box-shadow: 0 18px 40px #0e265c21
}

.package-card.starter {
    background: #fffbc4
}

.package-card.pro {
    background: #d9e9fb
}

.package-card.ultimate {
    background: #ffe0e0
}

.package-card.unsure {
    background: #eef3fb
}

.package-card input {
    opacity: 0;
    cursor: pointer;
    position: absolute;
    inset: 0
}

.package-card-body {
    z-index: 1;
    gap: 12px;
    display: grid;
    position: relative
}

.package-card-body strong {
    max-width: calc(100% - 120px);
    font-size: 22px;
    line-height: 1.15;
    display: block
}

.package-card-body em {
    color: #000;
    letter-spacing: -.03em;
    font-size: clamp(28px, 3vw, 36px);
    font-style: normal;
    font-weight: 950;
    line-height: 1.12;
    display: block
}

.package-original-name {
    color: #00000094;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 13px;
    font-weight: 900
}

.package-select-pill {
    z-index: 2;
    border: 1px solid var(--navy);
    min-height: 30px;
    color: var(--navy);
    background: #ffffff6b;
    border-radius: 999px;
    align-items: center;
    gap: 6px;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 800;
    display: inline-flex;
    position: absolute;
    top: 14px;
    right: 14px
}

.package-select-pill:before {
    content: "✓";
    color: #fff;
    background: var(--navy);
    border-radius: 50%;
    place-items: center;
    width: 18px;
    height: 18px;
    font-size: 11px;
    display: grid
}

.package-card ul {
    gap: 12px;
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
    display: grid
}

.package-card li {
    color: #000;
    align-items: flex-start;
    gap: 10px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    display: flex
}

.package-card li:before {
    content: "✓";
    color: #fff;
    background: #00a64f;
    border-radius: 50%;
    flex: none;
    place-items: center;
    width: 22px;
    height: 22px;
    font-size: 14px;
    font-weight: 950;
    display: grid
}

.application-review {
    background: linear-gradient(135deg, #1f4e8c14, #b319420a), #fff;
    border: 1px solid #dce6fb;
    border-radius: 18px;
    gap: 18px;
    padding: 26px;
    display: grid
}

.application-review-heading h3 {
    color: var(--navy);
    margin: 8px 0;
    font-size: clamp(24px, 2.6vw, 32px)
}

.application-review-heading p {
    max-width: 720px;
    color: var(--muted);
    margin: 0;
    line-height: 1.6
}

.application-review-grid {
    gap: 12px;
    display: grid
}

.application-review-card {
    border: 1px solid var(--line);
    background: #ffffffdb;
    border-radius: 14px;
    padding: 0;
    overflow: hidden;
    box-shadow: 0 12px 26px #172b580f
}

.application-review-card summary {
    color: var(--navy);
    cursor: pointer;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    font-weight: 950;
    list-style: none;
    display: flex
}

.application-review-card summary::-webkit-details-marker {
    display: none
}

.application-review-card summary:after {
    content: "+";
    color: #fff;
    background: var(--navy);
    border-radius: 50%;
    flex: none;
    place-items: center;
    width: 26px;
    height: 26px;
    font-size: 18px;
    line-height: 1;
    display: grid
}

.application-review-card[open] summary:after {
    content: "-"
}

.application-review-card summary span {
    font-size: 18px
}

.application-review-card summary small {
    color: var(--navy);
    background: var(--soft-blue);
    border-radius: 999px;
    margin-left: auto;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 900
}

.application-review-card dl {
    gap: 0;
    margin: 0;
    padding: 0 18px 18px;
    display: grid
}

.application-review-card div {
    border-top: 1px solid #d5dce8c2;
    grid-template-columns: minmax(130px, .38fr) minmax(0, 1fr);
    gap: 12px;
    min-width: 0;
    padding: 10px 0;
    display: grid
}

.application-review-card dt {
    color: var(--muted);
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 900
}

.application-review-card dd {
    color: var(--ink);
    overflow-wrap: anywhere;
    margin: 0;
    font-weight: 800;
    line-height: 1.45
}

.review-submit-step {
    padding-bottom: 18px
}

.review-submit-layout {
    grid-template-columns: minmax(0, 1fr) minmax(320px, .78fr);
    align-items: start;
    gap: 22px;
    display: grid
}

.review-submit-left {
    gap: 14px;
    display: grid
}

.review-summary-card,
.payment-review-panel,
.order-summary-card {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 8px
}

.review-summary-card {
    padding: 16px
}

.review-summary-header {
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    display: flex
}

.review-summary-header h3,
.payment-review-panel h3,
.order-summary-card h4 {
    color: #000;
    margin: 0
}

.review-summary-header h3 {
    font-size: 17px
}

.review-summary-header button {
    border: 1px solid var(--navy);
    min-height: 28px;
    color: var(--navy);
    cursor: pointer;
    font: inherit;
    background: #fff;
    border-radius: 999px;
    padding: 0 12px;
    font-size: 12px;
    font-weight: 900
}

.review-summary-card dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 18px;
    margin: 0;
    display: grid
}

.review-summary-card dl>div {
    min-width: 0
}

.review-summary-card dt,
.review-summary-card dd {
    overflow-wrap: anywhere;
    margin: 0;
    display: inline
}

.review-summary-card dt {
    color: #000;
    font-size: 12px;
    font-weight: 950
}

.review-summary-card dd {
    color: #111827;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35
}

.payment-review-panel {
    background: 0 0;
    border: 0;
    gap: 16px;
    padding: 0;
    display: grid
}

.payment-review-panel>h3 {
    font-size: 22px
}

.order-summary-card {
    background: #f7f7fb;
    gap: 16px;
    padding: 28px;
    display: grid
}

.order-summary-card label {
    color: #000;
    gap: 8px;
    font-size: 13px
}

.order-summary-card p {
    color: #000;
    margin: 0;
    font-size: 14px;
    font-weight: 700
}

.order-total {
    color: #000;
    border-top: 2px solid #000;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding-top: 16px;
    font-size: 20px;
    font-weight: 950;
    display: flex
}

.payment-check-row {
    color: #101828;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
    display: flex
}

.payment-check-row input {
    width: auto;
    margin-top: 3px
}

.paypal-ready-note {
    color: #155724;
    background: #e7f4eb;
    border: 1px solid #b9dfc4;
    border-radius: 6px;
    margin: -6px 0 0;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.45
}

.payment-submit-button {
    color: #fff;
    background: var(--navy);
    cursor: pointer;
    min-height: 54px;
    font: inherit;
    border: 0;
    border-radius: 4px;
    font-weight: 950
}

.payment-submit-button:disabled {
    cursor: not-allowed;
    opacity: .55
}

.payment-submit-secondary {
    color: var(--navy);
    background: #fff;
    border: 1px solid #a9bee4
}

.payment-divider {
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .08em;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    font-weight: 900;
    display: grid
}

.payment-divider:before,
.payment-divider:after {
    content: "";
    background: #d8e4fb;
    height: 1px
}

.paypal-payment-panel {
    background: #f8fbff;
    border: 1px solid #d8e4fb;
    border-radius: 8px;
    gap: 12px;
    padding: 20px;
    display: grid
}

.paypal-payment-panel h4 {
    color: var(--navy);
    margin: 0;
    font-size: 22px
}

.paypal-payment-panel p {
    color: var(--ink);
    margin: 0;
    font-weight: 700;
    line-height: 1.5
}

.payment-ready-badge {
    color: #155724;
    text-transform: uppercase;
    letter-spacing: .06em;
    background: #e7f4eb;
    border-radius: 999px;
    width: fit-content;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 950
}

.paypal-payment-button {
    color: #082c66;
    background: #ffc439;
    border-radius: 4px;
    justify-content: center;
    align-items: center;
    min-height: 52px;
    font-weight: 950;
    text-decoration: none;
    display: inline-flex;
    box-shadow: 0 14px 28px #ffc4393d
}

.paypal-config-note {
    color: #842029;
    background: #f8d7da;
    border: 1px solid #f1aeb5;
    border-radius: 6px;
    padding: 12px;
    font-size: 13px
}

.application-actions {
    background: #fff;
    border-top: 0;
    justify-content: flex-end;
    gap: 12px;
    padding: 6px 0 46px;
    display: flex
}

.application-actions button:first-child {
    color: var(--navy);
    border: 1px solid var(--line);
    box-shadow: none;
    background: #fff
}

.application-actions button:disabled {
    cursor: not-allowed;
    opacity: .45
}

.application-actions.review-page-actions {
    justify-content: flex-end;
    padding-top: 0
}

.form-status {
    border-radius: 4px;
    margin: 0 0 24px;
    padding: 14px 16px;
    font-weight: 800;
    line-height: 1.5
}

.form-status.success {
    color: #155724;
    background: #e7f4eb;
    border: 1px solid #b9dfc4
}

.form-status.error {
    color: #842029;
    background: #f8d7da;
    border: 1px solid #f1aeb5
}

.auth-page {
    background: #fff;
    border-radius: 18px;
    grid-template-columns: minmax(380px, .9fr) minmax(460px, 1fr);
    align-items: stretch;
    gap: 0;
    width: min(1260px, 100% - 72px);
    min-height: 720px;
    margin: 46px auto;
    padding: 0;
    display: grid;
    overflow: hidden;
    box-shadow: 0 28px 80px #0e1f4424
}

.auth-page-intro {
    color: #fff;
    text-align: center;
    background: #0b2362;
    align-content: start;
    justify-items: center;
    gap: 22px;
    min-height: 720px;
    padding: 76px 46px 46px;
    display: grid;
    position: relative;
    overflow: hidden
}

.auth-login-image {
    object-fit: cover;
    object-position: 0 0;
    width: 100%;
    height: 100%;
    display: block
}

.auth-page-intro .eyebrow {
    color: #ffadb8
}

.auth-page-intro h1 {
    color: #fff;
    margin: 18px 0 22px;
    font-size: clamp(48px, 6vw, 76px);
    line-height: 1
}

.auth-page-intro p {
    color: #ffffffc7;
    font-size: 18px;
    line-height: 1.7
}

.auth-page-intro ul {
    gap: 12px;
    margin: 28px 0 0;
    padding: 0;
    list-style: none;
    display: grid
}

.auth-page-intro li:before {
    content: "✓";
    color: #ffadb8;
    margin-right: 10px;
    font-weight: 900
}

.auth-form {
    box-shadow: none;
    background: #fff;
    border-radius: 0;
    align-content: center;
    gap: 18px;
    padding: clamp(42px, 6vw, 72px);
    display: grid
}

.auth-form h2 {
    color: #121827;
    margin: 0;
    font-size: clamp(42px, 5vw, 58px);
    line-height: 1
}

.auth-form-intro {
    color: #0d2b72;
    margin: 0 0 10px;
    font-size: 18px;
    font-weight: 900
}

.auth-form label {
    color: #344054;
    gap: 9px;
    font-size: 15px;
    font-weight: 900;
    display: grid
}

.auth-form input {
    color: #111827;
    width: 100%;
    min-height: 54px;
    font: inherit;
    background: #fff;
    border: 1px solid #cfd8e6;
    border-radius: 12px;
    outline: none;
    padding: 0 20px;
    font-size: 16px;
    transition: border-color .18s, box-shadow .18s
}

.auth-form input:focus {
    border-color: #0d2b72;
    box-shadow: 0 0 0 4px #0d2b721a
}

.auth-form button {
    color: #fff;
    cursor: pointer;
    min-height: 50px;
    font: inherit;
    background: #0d2b72;
    border: 0;
    border-radius: 10px;
    font-weight: 900;
    box-shadow: 0 10px 22px #0d2b7229
}

.auth-form button:disabled {
    cursor: wait;
    opacity: .6
}

.auth-form .google-auth-button {
    color: #1f2937;
    box-shadow: none;
    background: #fff;
    border: 1px solid #cfd8e6;
    justify-content: center;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    font-weight: 600;
    display: flex
}

.auth-form .google-auth-button:hover:not(:disabled) {
    background: #f5f8fc;
    border-color: #94a3b8
}

.auth-form .google-auth-button:focus-visible {
    outline-offset: 3px;
    outline: 3px solid #4285f4
}

.google-auth-button svg {
    flex-shrink: 0
}

.auth-divider {
    color: #667085;
    align-items: center;
    gap: 14px;
    font-size: 14px;
    display: flex
}

.auth-divider:before,
.auth-divider:after {
    content: "";
    background: #e4e7ec;
    flex: 1;
    height: 1px
}

.auth-switch-link {
    color: #475467;
    text-align: center;
    margin: 0;
    font-size: 16px
}

.auth-switch-link a {
    color: #0d2b72;
    font-weight: 900
}

.auth-form-options {
    color: #475467;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    display: flex
}

.auth-form-options label {
    align-items: center;
    gap: 9px;
    font-weight: 500;
    display: flex
}

.auth-form-options input {
    width: 16px;
    min-height: 16px;
    padding: 0
}

.auth-form-options a {
    color: #0d2b72;
    font-weight: 800;
    text-decoration: none
}

.auth-divider {
    color: #98a2b3;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
    font-weight: 900;
    display: grid
}

.auth-divider:before,
.auth-divider:after {
    content: "";
    background: #d8dee8;
    height: 1px
}

.auth-google-btn {
    color: #344054 !important;
    box-shadow: none !important;
    background: #fff !important;
    border: 1px solid #cfd8e6 !important
}

.auth-google-btn span {
    color: #4285f4;
    place-items: center;
    width: 24px;
    height: 24px;
    margin-right: 12px;
    font-size: 24px;
    font-weight: 900;
    display: inline-grid
}

.auth-portal-badge {
    color: #071f5c;
    background: #e9f7ff;
    border-radius: 0 0 32px 32px;
    justify-content: center;
    align-items: center;
    gap: 0;
    width: min(390px, 100% - 78px);
    min-width: 0;
    padding: 16px 28px;
    display: flex;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%);
    box-shadow: 0 18px 40px #071f5c1f
}

.auth-portal-badge span {
    font-size: 24px;
    font-weight: 900
}

.auth-portal-badge strong {
    text-transform: uppercase;
    font-size: 15px
}

.auth-visual-copy h1 {
    color: #fff;
    text-transform: uppercase;
    max-width: 460px;
    margin: 0 0 16px;
    font-size: clamp(34px, 4vw, 44px);
    line-height: 1.12
}

.auth-visual-copy>strong {
    color: #fff;
    text-transform: uppercase;
    background: #e92535;
    border-radius: 14px;
    padding: 9px 15px;
    font-size: 17px;
    display: inline-block
}

.auth-monitor {
    background: #fff;
    border: 0;
    border-radius: 14px;
    width: min(500px, 94%);
    padding: 10px 10px 30px;
    box-shadow: 0 24px 50px #00000047
}

.auth-login-image-frame {
    background: #e9f7ff;
    border-radius: 10px;
    height: 172px;
    overflow: hidden
}

.auth-monitor-top {
    gap: 5px;
    margin-bottom: 10px;
    display: flex
}

.auth-monitor-top span {
    background: #d9e4f2;
    border-radius: 50%;
    width: 8px;
    height: 8px
}

.auth-monitor-screen {
    background: #eaf7ff;
    border-radius: 10px;
    grid-template-columns: 92px 1fr;
    gap: 10px;
    min-height: 170px;
    padding: 12px;
    display: grid
}

.auth-mini-sidebar {
    background: #071f5c;
    border-radius: 10px
}

.auth-mini-content {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    display: grid
}

.auth-mini-content div {
    background: #fff;
    border-radius: 10px;
    box-shadow: inset 0 0 0 1px #dce6f3
}

.auth-trust-row {
    justify-content: center;
    align-items: center;
    gap: 18px;
    width: min(560px, 92%);
    display: flex
}

.auth-trust-row span,
.auth-trust-row strong {
    border-radius: 10px;
    padding: 12px 18px;
    font-weight: 900
}

.auth-trust-row span {
    background: #4ec342
}

.auth-trust-row strong {
    color: #111827;
    background: #fff
}

.auth-required-section {
    justify-content: space-between;
    align-items: center;
    gap: 32px;
    display: flex
}

.auth-required-section p {
    color: var(--muted)
}

.auth-required-actions {
    flex-wrap: wrap;
    gap: 12px;
    display: flex
}

.account-state-card {
    text-align: center;
    min-height: 440px
}

.account-spinner {
    border: 4px solid var(--line);
    border-top-color: var(--red);
    border-radius: 50%;
    width: 38px;
    height: 38px;
    display: inline-block
}

.customer-dashboard-hero {
    color: #fff;
    border-bottom: 6px solid var(--red);
    background: linear-gradient(135deg, #071a43, #102f69);
    justify-content: space-between;
    align-items: center;
    gap: 36px;
    padding: clamp(64px, 8vw, 100px) clamp(20px, 6vw, 86px);
    display: flex
}

.customer-dashboard-hero h1 {
    color: #fff;
    margin: 12px 0;
    font-size: clamp(44px, 6vw, 72px)
}

.customer-dashboard-hero p {
    color: #ffffffbf
}

.customer-applications-section {
    background: var(--soft)
}

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

.customer-application-card,
.customer-empty-state {
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    background: #fff;
    border-radius: 18px;
    padding: 30px
}

.customer-application-card-header {
    color: var(--muted);
    text-transform: uppercase;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    font-size: 12px;
    font-weight: 900;
    display: flex
}

.customer-application-card-header strong {
    color: #155724;
    background: #e7f4eb;
    border-radius: 999px;
    padding: 6px 10px
}

.customer-application-card h2 {
    color: var(--navy);
    margin: 22px 0
}

.customer-application-card dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    display: grid
}

.customer-application-card dt {
    color: var(--muted);
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 900
}

.customer-application-card dd {
    color: var(--ink);
    margin: 5px 0 0;
    font-weight: 800
}

.customer-application-card>p,
.customer-empty-state p {
    color: var(--muted);
    line-height: 1.6
}

.admin-login-section,
.admin-portal-section {
    background: var(--soft)
}

.admin-login-card,
.admin-toolbar,
.admin-table-card,
.admin-detail-card {
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    background: #fff;
    border-radius: 20px
}

.admin-login-card {
    gap: 22px;
    max-width: 680px;
    margin: 0 auto;
    padding: 46px;
    display: grid;
    position: relative;
    overflow: hidden
}

.admin-login-card:before {
    content: "";
    background: linear-gradient(90deg, var(--blue), var(--red));
    height: 5px;
    position: absolute;
    inset: 0 0 auto
}

.admin-login-badge {
    color: var(--blue);
    letter-spacing: .08em;
    text-transform: uppercase;
    background: #f6f9ff;
    border: 1px solid #dbe6f5;
    border-radius: 999px;
    justify-self: start;
    padding: 7px 12px;
    font-size: 12px;
    font-weight: 900
}

.admin-login-copy {
    gap: 12px;
    display: grid
}

.admin-login-card h2 {
    color: var(--navy);
    letter-spacing: 0;
    margin: 0;
    font-size: clamp(42px, 6vw, 76px);
    line-height: .98
}

.admin-login-card p,
.admin-detail-card p,
.admin-empty {
    color: var(--muted);
    line-height: 1.65
}

.admin-login-card p {
    max-width: 620px;
    margin: 0;
    font-size: 18px
}

.admin-login-role-toggle {
    background: #f6f9ff;
    border: 1px solid #dbe6f5;
    border-radius: 999px;
    grid-template-columns: repeat(2, minmax(112px, 1fr));
    justify-self: start;
    padding: 5px;
    display: inline-grid
}

.admin-login-card .admin-login-role-toggle button {
    min-height: 42px;
    color: var(--muted);
    cursor: pointer;
    font: inherit;
    background: 0 0;
    border: 0;
    border-radius: 999px;
    padding: 0 18px;
    font-weight: 900;
    transition: all .18s
}

.admin-login-card .admin-login-role-toggle button.active {
    color: #fff;
    background: var(--red);
    box-shadow: 0 10px 24px #be164838
}

.admin-login-field {
    color: var(--navy);
    gap: 10px;
    font-size: 15px;
    font-weight: 900;
    display: grid
}

.admin-login-field input {
    width: 100%;
    min-height: 58px;
    color: var(--ink);
    font: inherit;
    background: #fff;
    border: 1px solid #cfd9e8;
    border-radius: 10px;
    outline: none;
    padding: 0 18px;
    font-size: 18px;
    transition: border-color .18s, box-shadow .18s
}

.admin-login-field input:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 4px #1f4e8c1f
}

.admin-login-submit,
.admin-toolbar button {
    color: #fff;
    background: var(--red);
    cursor: pointer;
    min-height: 44px;
    font: inherit;
    border: 0;
    border-radius: 999px;
    justify-content: center;
    align-items: center;
    padding: 0 18px;
    font-weight: 900;
    display: inline-flex
}

.admin-login-submit {
    justify-self: start;
    min-height: 54px;
    padding: 0 28px;
    transition: transform .18s, background .18s, box-shadow .18s;
    box-shadow: 0 14px 28px #be16483d
}

.admin-login-submit:hover {
    background: #a8123d;
    transform: translateY(-1px);
    box-shadow: 0 18px 32px #be16484d
}

.admin-toolbar {
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    margin-bottom: 22px;
    padding: 24px;
    display: flex
}

.admin-toolbar h2 {
    margin-bottom: 0
}

.admin-toolbar button:disabled {
    cursor: not-allowed;
    opacity: .6
}

.admin-grid {
    grid-template-columns: minmax(0, 1fr) minmax(320px, .42fr);
    align-items: start;
    gap: 22px;
    display: grid
}

.admin-table-card {
    overflow: auto
}

.admin-table-card table {
    border-collapse: collapse;
    width: 100%;
    min-width: 920px
}

.admin-table-card th,
.admin-table-card td {
    border-bottom: 1px solid var(--line);
    text-align: left;
    padding: 14px 16px
}

.admin-table-card th {
    color: var(--navy);
    background: var(--soft-blue);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 13px
}

.admin-table-card tr {
    cursor: pointer
}

.admin-table-card tbody tr:hover,
.admin-table-card tbody tr.selected {
    background: #f8fbff
}

.admin-table-actions {
    flex-wrap: wrap;
    gap: 8px;
    display: flex
}

.admin-table-actions button {
    border: 1px solid var(--line);
    min-height: 34px;
    color: var(--navy);
    cursor: pointer;
    font: inherit;
    background: #fff;
    border-radius: 999px;
    justify-content: center;
    align-items: center;
    padding: 0 12px;
    font-size: 12px;
    font-weight: 900;
    display: inline-flex
}

.admin-table-actions button:nth-child(2) {
    color: #fff;
    border-color: var(--blue);
    background: var(--blue)
}

.admin-table-actions button.danger {
    color: #fff;
    border-color: var(--red);
    background: var(--red)
}

.admin-table-actions button:disabled {
    cursor: not-allowed;
    opacity: .55
}

.admin-empty {
    margin: 0;
    padding: 24px
}

.admin-detail-card {
    padding: 26px;
    position: sticky;
    top: 116px
}

.admin-detail-header {
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    display: flex
}

.admin-crud-actions,
.admin-edit-actions {
    flex-wrap: wrap;
    gap: 8px;
    display: flex
}

.admin-crud-actions button,
.admin-edit-actions button {
    border: 1px solid var(--line);
    min-height: 38px;
    color: var(--navy);
    cursor: pointer;
    font: inherit;
    background: #fff;
    border-radius: 999px;
    justify-content: center;
    align-items: center;
    padding: 0 14px;
    font-size: 13px;
    font-weight: 900;
    display: inline-flex
}

.admin-crud-actions button.danger {
    color: #fff;
    border-color: var(--red);
    background: var(--red)
}

.admin-crud-actions button:disabled,
.admin-edit-actions button:disabled {
    cursor: not-allowed;
    opacity: .55
}

.admin-specimen-preview {
    gap: 10px;
    margin: 20px 0 6px;
    display: grid
}

.admin-specimen-preview img {
    object-fit: contain;
    border: 1px solid var(--line);
    background: var(--soft);
    border-radius: 16px;
    width: 100%;
    max-height: 260px
}

.admin-specimen-preview a {
    color: var(--blue);
    font-weight: 900;
    text-decoration: none
}

.admin-detail-card dl {
    gap: 14px;
    margin: 20px 0 0;
    display: grid
}

.admin-edit-form {
    gap: 16px;
    margin-top: 20px;
    display: grid
}

.admin-edit-form .form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

.admin-edit-section-grid {
    gap: 16px;
    display: grid
}

.admin-edit-section-card {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 8px;
    gap: 16px;
    padding: 18px;
    display: grid;
    box-shadow: 0 10px 24px #172b580f
}

.admin-edit-section-card h4 {
    border-bottom: 2px solid var(--soft-blue);
    color: var(--navy);
    margin: 0;
    padding-bottom: 10px;
    font-size: 18px
}

.admin-edit-actions {
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    padding-top: 4px;
    display: flex
}

.admin-edit-actions button[type=submit] {
    color: #fff;
    border-color: var(--red);
    background: var(--red)
}

.modal-backdrop {
    z-index: 90;
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
    background: #0614349e;
    place-items: start center;
    padding: 34px 18px;
    display: grid;
    position: fixed;
    inset: 0;
    overflow: auto
}

.modal-overlay {
    z-index: 1000;
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
    background: #0614349e;
    place-items: start center;
    padding: 34px 18px;
    display: grid;
    position: fixed;
    inset: 0;
    overflow: auto
}

.modal-content {
    background: #fff;
    border: 1px solid #ffffff61;
    border-radius: 8px;
    width: min(720px, 100%);
    padding: clamp(22px, 4vw, 34px);
    box-shadow: 0 28px 90px #0614344d
}

.modal-content>h3 {
    color: var(--navy);
    margin: 0 0 18px;
    font-size: clamp(24px, 3vw, 34px)
}

.searchable-user-select {
    gap: 8px;
    display: grid
}

.searchable-user-select input[type=search] {
    border: 1px solid var(--line);
    min-height: 44px;
    color: var(--ink);
    font: inherit;
    background: #fff;
    border-radius: 8px;
    padding: 10px 12px
}

.searchable-user-select input[type=search]:focus,
.searchable-user-select select:focus {
    border-color: var(--blue);
    outline: 2px solid #1c5fd72e
}

.searchable-user-select small {
    color: #be123c;
    font-size: 12px;
    font-weight: 700
}

.billing-payments-field {
    gap: 10px;
    display: grid
}

.billing-payments-field>span {
    color: var(--navy);
    font-weight: 800
}

.billing-payment-row {
    grid-template-columns: minmax(0, 1.5fr) minmax(120px, .7fr) auto;
    align-items: end;
    gap: 10px;
    display: grid
}

.billing-payment-row label {
    margin: 0
}

.billing-add-item,
.billing-remove-item {
    width: fit-content;
    color: var(--blue);
    cursor: pointer;
    background: #f6f9ff;
    border: 1px solid #c8d8f2;
    border-radius: 6px;
    font-weight: 800
}

.billing-add-item {
    padding: 8px 12px;
    font-size: 12px
}

.billing-remove-item {
    color: #be123c;
    background: #fff1f2;
    border-color: #fecdd3;
    width: 40px;
    height: 40px;
    font-size: 18px;
    line-height: 1
}

.admin-edit-modal {
    background: #fff;
    border: 1px solid #ffffff61;
    border-radius: 8px;
    width: min(960px, 100%);
    padding: clamp(22px, 4vw, 34px);
    box-shadow: 0 28px 90px #0614344d
}

.modal-header {
    border-bottom: 1px solid var(--line);
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    padding-bottom: 18px;
    display: flex
}

.modal-header h3 {
    color: var(--navy);
    margin: 8px 0 0;
    font-size: clamp(26px, 3vw, 36px)
}

.modal-close-button {
    border: 1px solid var(--line);
    width: 42px;
    height: 42px;
    color: var(--navy);
    cursor: pointer;
    font: inherit;
    background: #fff;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    font-weight: 900;
    display: inline-flex
}

.modal-specimen-preview {
    max-width: 520px
}

.admin-view-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
    display: flex
}

.admin-view-actions button {
    border: 1px solid var(--blue);
    color: #fff;
    background: var(--blue);
    cursor: pointer;
    min-height: 40px;
    font: inherit;
    border-radius: 999px;
    justify-content: center;
    align-items: center;
    padding: 0 16px;
    font-size: 13px;
    font-weight: 900;
    display: inline-flex
}

.admin-view-actions button.danger {
    border-color: var(--red);
    background: var(--red)
}

.admin-view-actions button:disabled {
    cursor: not-allowed;
    opacity: .55
}

.admin-modal-detail-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 22px 0 0;
    display: grid
}

.admin-modal-detail-list>div {
    border: 1px solid var(--line);
    background: #f8fbff;
    border-radius: 8px;
    padding: 14px
}

.admin-modal-detail-list dt {
    color: var(--muted);
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 900
}

.admin-modal-detail-list dd {
    color: var(--ink);
    overflow-wrap: anywhere;
    margin: 6px 0 0;
    font-weight: 800;
    line-height: 1.5
}

.admin-modal-section-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 22px;
    display: grid
}

.admin-modal-section-card {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 8px;
    padding: 18px;
    box-shadow: 0 10px 24px #172b580f
}

.admin-modal-section-card h4 {
    border-bottom: 2px solid var(--soft-blue);
    color: var(--navy);
    margin: 0 0 14px;
    padding-bottom: 10px;
    font-size: 18px
}

.admin-modal-section-card dl {
    gap: 10px;
    margin: 0;
    display: grid
}

.admin-modal-section-card dl>div {
    grid-template-columns: minmax(120px, .42fr) minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    display: grid
}

.admin-modal-section-card dt {
    color: var(--muted);
    letter-spacing: .06em;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 900
}

.admin-modal-section-card dd {
    color: var(--ink);
    overflow-wrap: anywhere;
    margin: 0;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.45
}

.admin-detail-card dl>div {
    border-bottom: 1px solid var(--line);
    padding-bottom: 14px
}

.admin-detail-card dt {
    color: var(--muted);
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 900
}

.admin-detail-card dd {
    color: var(--ink);
    overflow-wrap: anywhere;
    margin: 6px 0 0;
    font-weight: 700;
    line-height: 1.55
}

.footer {
    color: #ffffffc2;
    background: radial-gradient(circle at 20px 20px, #0000 9px, #ffffff09 10px, #0000 11px) 0 0/40px 40px, radial-gradient(circle at 0 0, #0000 14px, #ffffff06 15px, #0000 16px) 20px 20px/40px 40px, linear-gradient(135deg, #071f5c, #08266f 55%, #061d58);
    border-top: 0
}

.footer-main {
    grid-template-columns: 1.35fr repeat(3, minmax(0, 1fr));
    align-items: start;
    gap: clamp(28px, 5vw, 72px);
    padding: 54px clamp(24px, 6vw, 82px) 38px;
    display: grid
}

.footer-bar {
    color: #fff;
    background: var(--red);
    text-align: center;
    padding: 8px 20px;
    font-size: 12px;
    font-weight: 800
}

.footer h3 {
    color: #fff;
    margin: 0 0 18px;
    font-size: 16px
}

.footer a {
    color: #ffffffc7;
    text-decoration: none
}

.footer-links a {
    border-radius: 0;
    align-items: center;
    gap: 9px;
    width: fit-content;
    margin-bottom: 10px;
    padding: 0;
    font-size: 14px;
    line-height: 1.5;
    display: flex
}

.footer-links {
    display: block
}

.footer-links a:hover,
.footer-links a:focus-visible {
    color: #fff;
    text-underline-offset: 3px;
    background: 0 0;
    text-decoration: underline
}

.footer-links a:before {
    content: "›";
    width: 14px;
    height: 14px;
    color: var(--navy);
    background: #fff;
    border-radius: 50%;
    place-items: center;
    margin-right: 7px;
    font-size: 11px;
    font-weight: 900;
    display: inline-grid
}

.footer a:hover {
    color: #fff
}

.footer-links a:before {
    content: "";
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.65 4.2L8.25 7L5.65 9.8' stroke='%23081c50' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 14px 14px;
    border-radius: 50%;
    flex: 0 0 14px;
    width: 14px;
    height: 14px;
    margin-right: 0;
    display: inline-block
}

.footer .brand,
.footer .brand-kicker {
    color: #fff
}

.footer .brand-wordmark {
    color: #fff;
    text-shadow: 0 2px 10px #55b7ff59;
    border-color: #ffffffad
}

.footer-brand {
    margin-bottom: 18px
}

.footer-identity>p,
.footer-newsletter-column>p {
    color: #ffffffc7;
    margin: 0 0 20px;
    font-size: 13px;
    line-height: 1.5
}

.footer-newsletter-column {
    min-width: 0
}

.footer-trust-badge {
    align-items: center;
    gap: 11px;
    margin: 24px 0;
    display: flex
}

.customer-portal {
    background: #f8fbff;
    grid-template-columns: 280px 1fr;
    gap: 0;
    min-height: calc(100vh - 200px);
    margin-top: 0;
    margin-bottom: -40px;
    padding: 18px 28px 0;
    display: grid
}

.customer-portal-sidebar {
    background: #071f5c;
    border-right: 0;
    border-radius: 12px;
    flex-direction: column;
    align-self: start;
    gap: 26px;
    padding: 30px 24px;
    display: flex;
    box-shadow: 0 18px 38px #071f5c2e
}

.customer-portal-avatar {
    color: #fff;
    letter-spacing: 1px;
    background: #91a5af;
    border: 3px solid #ffffffe6;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 80px;
    margin: 0 auto;
    font-size: 28px;
    font-weight: 700;
    display: flex;
    overflow: hidden;
    box-shadow: 0 8px 20px #0003
}

.customer-portal-avatar.has-image {
    background: #fff
}

.customer-portal-avatar img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.customer-portal-info {
    text-align: center
}

.customer-portal-info h2 {
    color: #fff;
    margin: 16px 0 4px;
    font-size: 18px;
    font-weight: 600
}

.customer-verified-check {
    color: #fff;
    vertical-align: 2px;
    background: #1687ef;
    border-radius: 50%;
    place-items: center;
    width: 17px;
    height: 17px;
    margin-left: 7px;
    font-size: 10px;
    line-height: 1;
    display: inline-grid;
    box-shadow: 0 0 0 2px #1687ef33
}

.customer-portal-info p {
    color: #ffffffbf;
    overflow-wrap: anywhere;
    margin: 0 0 12px;
    font-size: 13px
}

.customer-portal-id {
    color: #fff;
    letter-spacing: .5px;
    background: #ffffff1a;
    border-radius: 4px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 600;
    display: inline-block
}

.customer-signout-btn {
    color: #b31942;
    cursor: pointer;
    width: 100%;
    min-height: 44px;
    font: inherit;
    background: #fff7f9;
    border: 1px solid #f2c4cf;
    border-radius: 8px;
    justify-content: center;
    align-items: center;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 900;
    transition: all .18s;
    display: flex;
    box-shadow: 0 10px 22px #b3194214
}

.customer-signout-btn:hover {
    color: #fff;
    background: #b31942;
    border-color: #b31942;
    transform: translateY(-1px);
    box-shadow: 0 14px 28px #b3194238
}

.customer-edit-profile-btn {
    color: #fff;
    cursor: pointer;
    width: min(150px, 100%);
    min-height: 38px;
    font: inherit;
    background: #cf1f2d;
    border: 1px solid #cf1f2d;
    border-radius: 8px;
    align-self: center;
    padding: 8px 18px;
    font-size: 12px;
    font-weight: 900;
    transition: transform .18s, background .18s;
    box-shadow: 0 9px 20px #cf1f2d40
}

.customer-edit-profile-btn:hover,
.customer-edit-profile-btn:focus-visible {
    background: #e42b3a;
    transform: translateY(-1px)
}

.customer-password-btn {
    color: #fff;
    cursor: pointer;
    width: 100%;
    min-height: 44px;
    font: inherit;
    background: #ffffff1a;
    border: 1px solid #ffffff38;
    border-radius: 8px;
    justify-content: center;
    align-items: center;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 900;
    transition: all .18s;
    display: flex
}

.customer-password-btn:hover {
    color: #071f5c;
    background: #fff;
    border-color: #fff;
    transform: translateY(-1px)
}

.customer-portal-section {
    border-top: 1px solid #ffffff24;
    padding-top: 24px
}

.customer-portal-section h3 {
    text-transform: uppercase;
    letter-spacing: .8px;
    color: #ffffffad;
    margin: 0 0 16px;
    font-size: 12px;
    font-weight: 700
}

.status-item {
    border-bottom: 1px solid #ffffff1a;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 12px;
    font-size: 13px;
    display: flex
}

.status-item span:first-child {
    color: #ffffffbf;
    font-weight: 500
}

.badge {
    letter-spacing: .3px;
    border-radius: 3px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 600;
    display: inline-block
}

.badge.paid,
.badge.verified,
.badge.active {
    color: #15803d;
    background: #f0fdf4
}

.edit-profile-btn {
    color: #fff;
    cursor: pointer;
    background: #cf1f2d;
    border: 1px solid #cf1f2d;
    border-radius: 6px;
    width: 100%;
    padding: 10px 16px;
    font-size: 13px;
    font-weight: 600;
    transition: all .2s;
    display: none
}

.edit-profile-btn:hover {
    background: #b31942
}

.portal-field {
    margin-bottom: 16px
}

.portal-field label {
    text-transform: uppercase;
    letter-spacing: .8px;
    color: #ffffff9e;
    margin-bottom: 4px;
    font-size: 11px;
    font-weight: 700;
    display: block
}

.portal-field p {
    color: #fff;
    margin: 0;
    font-size: 13px
}

.customer-portal-main {
    flex-direction: column;
    min-width: 0;
    padding: 0 0 40px 24px;
    display: flex
}

.portal-header {
    box-shadow: none;
    background: #e9f7ff;
    border: 0;
    border-radius: 999px;
    margin-bottom: 26px;
    padding: 14px 20px;
    display: block
}

.portal-header-top {
    grid-template-columns: minmax(0, 1fr) auto;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    display: grid
}

.portal-header h1 {
    color: var(--ink);
    margin: 0;
    font-size: 28px;
    font-weight: 600
}

.portal-header .primary-btn {
    white-space: nowrap;
    padding: 10px 16px;
    font-size: 13px
}

.portal-eyebrow {
    color: #667085;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 5px;
    font-size: 11px;
    font-weight: 900;
    display: block
}

.portal-brand-lockup {
    color: #071f5c;
    gap: 2px;
    line-height: 1;
    display: grid
}

.portal-brand-mark {
    letter-spacing: .02em;
    font-size: 24px;
    font-weight: 900
}

.portal-brand-lockup small {
    letter-spacing: .04em;
    text-transform: uppercase;
    font-size: 7px;
    font-weight: 900
}

.portal-verified {
    color: #071f5c;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    font-weight: 900;
    display: flex
}

.portal-verified span {
    color: #fff;
    background: #56a9f5;
    border-radius: 50%;
    place-items: center;
    width: 24px;
    height: 24px;
    font-size: 16px;
    display: grid
}

.portal-header-actions {
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    display: flex;
    position: relative
}

.portal-user-dropdown-menu {
    z-index: 20;
    background: #fff;
    border: 1px solid #dfe7f2;
    border-radius: 14px;
    gap: 10px;
    min-width: 230px;
    padding: 14px;
    display: grid;
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    box-shadow: 0 20px 44px #172b582e
}

.portal-user-dropdown-meta {
    border-bottom: 1px solid #edf1f7;
    gap: 3px;
    padding-bottom: 10px;
    display: grid
}

.portal-user-dropdown-meta strong {
    color: var(--navy);
    font-size: 14px
}

.portal-user-dropdown-meta span {
    color: #667085;
    overflow-wrap: anywhere;
    font-size: 12px
}

.portal-user-dropdown-menu>button {
    color: #b31942;
    cursor: pointer;
    min-height: 40px;
    font: inherit;
    background: #fff7f9;
    border: 1px solid #f2c4cf;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 900
}

.portal-user-dropdown-menu>button:hover {
    color: #fff;
    background: #b31942;
    border-color: #b31942
}

.portal-user-dropdown-menu>.portal-dropdown-secondary {
    color: #1f4e8c;
    background: #f8fbff;
    border-color: #d9e4f2
}

.portal-user-dropdown-menu>.portal-dropdown-secondary:hover {
    color: #fff;
    background: #1f4e8c;
    border-color: #1f4e8c
}

.customer-password-modal {
    background: #fff;
    border: 1px solid #dbe5f2;
    border-radius: 16px;
    width: min(460px, 100%);
    overflow: hidden;
    box-shadow: 0 28px 80px #0f172a47
}

.customer-password-modal-head {
    background: linear-gradient(#f8fbff, #fff);
    border-bottom: 1px solid #e5eaf0;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 20px 22px;
    display: flex
}

.customer-password-modal-head span {
    color: #1f4e8c;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 900
}

.customer-password-modal-head h3 {
    color: var(--navy);
    margin: 4px 0 0;
    font-size: 22px;
    font-weight: 900
}

.customer-password-form {
    gap: 16px;
    padding: 22px;
    display: grid
}

.customer-password-form label {
    color: var(--navy);
    gap: 8px;
    font-size: 13px;
    font-weight: 800;
    display: grid
}

.customer-password-form input {
    width: 100%;
    min-height: 46px;
    color: var(--ink);
    font: inherit;
    background: #fff;
    border: 1px solid #cfd8e6;
    border-radius: 10px;
    padding: 0 14px;
    font-size: 14px
}

.customer-password-form input:focus {
    border-color: #1f4e8c;
    outline: 2px solid #1f4e8c2e
}

.customer-profile-form textarea {
    resize: vertical;
    width: 100%;
    min-height: 82px;
    color: var(--ink);
    font: inherit;
    background: #fff;
    border: 1px solid #cfd8e6;
    border-radius: 10px;
    padding: 12px 14px;
    font-size: 14px;
    line-height: 1.45
}

.customer-profile-form textarea:focus {
    border-color: #1f4e8c;
    outline: 2px solid #1f4e8c2e
}

.customer-profile-picture-field {
    background: #f8fbff;
    border: 1px dashed #b8c9de;
    border-radius: 12px;
    align-items: center;
    gap: 16px;
    padding: 12px;
    display: flex
}

.customer-profile-picture-field input {
    background: 0 0;
    border: 0;
    min-height: 0;
    padding: 0;
    font-size: 12px
}

.customer-profile-picture-field input::file-selector-button {
    color: #fff;
    cursor: pointer;
    font: inherit;
    background: #1f4e8c;
    border: 0;
    border-radius: 7px;
    margin-right: 10px;
    padding: 8px 12px;
    font-weight: 800
}

.customer-profile-preview {
    color: #fff;
    background: #8096a2;
    border: 2px solid #fff;
    border-radius: 50%;
    flex: none;
    place-items: center;
    width: 64px;
    height: 64px;
    font-size: 18px;
    font-weight: 900;
    display: grid;
    overflow: hidden;
    box-shadow: 0 4px 12px #071f5c33
}

.customer-profile-preview img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.customer-password-input-wrap {
    display: block;
    position: relative
}

.customer-password-input-wrap input {
    padding-right: 48px
}

.customer-password-eye-btn {
    color: #0f172a;
    cursor: pointer;
    background: 0 0;
    border: 0;
    border-radius: 999px;
    place-items: center;
    width: 34px;
    height: 34px;
    font-size: 16px;
    line-height: 1;
    display: grid;
    position: absolute;
    top: 50%;
    right: 8px
}

.customer-password-eye-btn:hover,
.customer-password-eye-btn:focus-visible {
    background: #eef6ff;
    outline: none
}

.customer-password-actions {
    justify-content: flex-end;
    gap: 10px;
    padding-top: 4px;
    display: flex
}

.customer-password-actions button {
    cursor: pointer;
    min-height: 42px;
    font: inherit;
    border: 1px solid #d9e4f2;
    border-radius: 9px;
    padding: 0 16px;
    font-size: 13px;
    font-weight: 900
}

.customer-password-actions button:first-child {
    color: #1f4e8c;
    background: #fff
}

.customer-password-actions button:last-child {
    color: #fff;
    background: #1f4e8c;
    border-color: #1f4e8c
}

.customer-password-actions button:disabled {
    opacity: .65;
    cursor: not-allowed
}

.portal-icon-link {
    color: #0864c8;
    cursor: pointer;
    width: 42px;
    height: 42px;
    font: inherit;
    background: #fff;
    border: 1px solid #b8dcff;
    border-radius: 50%;
    place-items: center;
    font-size: 15px;
    font-weight: 900;
    text-decoration: none;
    display: grid
}

.portal-user-menu {
    color: #fff;
    cursor: pointer;
    min-height: 42px;
    font: inherit;
    background: #cf1f2d;
    border: 0;
    border-radius: 999px;
    align-items: center;
    gap: 8px;
    padding: 5px 12px 5px 5px;
    font-size: 12px;
    font-weight: 900;
    display: flex;
    box-shadow: 0 10px 24px #cf1f2d38
}

.portal-user-menu span {
    background: #8096a2;
    border-radius: 50%;
    place-items: center;
    width: 32px;
    height: 32px;
    display: grid
}

.portal-user-menu strong {
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 115px;
    overflow: hidden
}

.portal-user-menu small {
    font-size: 13px
}

.portal-tabs {
    background: #071f5c;
    border-bottom: 0;
    border-radius: 999px;
    justify-self: start;
    gap: 2px;
    max-width: 100%;
    margin-bottom: 0;
    padding: 4px;
    display: flex;
    overflow-x: auto
}

.portal-tab {
    color: #fff;
    cursor: pointer;
    white-space: nowrap;
    background: 0 0;
    border: 0;
    border-radius: 999px;
    min-height: 36px;
    margin-bottom: 0;
    padding: 8px 11px;
    font-size: 11px;
    font-weight: 800;
    transition: all .2s
}

.portal-tab:hover {
    color: #fff;
    background: #ffffff1a;
    border-color: #0000
}

.portal-tab.active {
    color: #fff;
    box-shadow: none;
    background: #cf1f2d;
    border-color: #0000
}

.portal-content {
    flex: 1
}

.time-zone-clock-panel {
    background: #071f5c;
    border-radius: 14px;
    grid-template-columns: repeat(4, minmax(54px, 1fr));
    align-content: center;
    gap: clamp(7px, 1vw, 12px);
    min-width: 300px;
    padding: 20px 18px 16px;
    display: grid;
    box-shadow: 0 18px 38px #071f5c29
}

.time-zone-clock {
    justify-items: center;
    gap: 6px;
    min-width: 0;
    display: grid
}

.time-zone-clock strong {
    color: #fff;
    text-align: center;
    font-size: 11px;
    font-weight: 900;
    line-height: 1
}

.analog-clock {
    filter: drop-shadow(0 3px 5px #0000003d);
    width: 62px;
    max-width: 100%;
    height: 62px;
    display: block
}

.analog-clock-face {
    fill: #fff;
    stroke: #d5d9e0;
    stroke-width: 2px
}

.analog-clock-hour-tick,
.analog-clock-minute-tick {
    stroke: #263247;
    stroke-linecap: round
}

.analog-clock-hour-tick {
    stroke-width: 2px
}

.analog-clock-minute-tick {
    stroke-width: .8px
}

.analog-clock-number {
    fill: #14213a;
    font-size: 7px;
    font-weight: 800
}

.analog-clock-hour-hand,
.analog-clock-minute-hand {
    stroke: #101828;
    stroke-linecap: round
}

.analog-clock-hour-hand {
    stroke-width: 4px
}

.analog-clock-minute-hand {
    stroke-width: 3px
}

.analog-clock-second-hand {
    stroke: #cf1f2d;
    stroke-linecap: round;
    stroke-width: 1.4px
}

.analog-clock-pin {
    fill: #cf1f2d;
    stroke: #fff;
    stroke-width: 1px
}

.portal-dashboard {
    gap: 18px;
    display: grid
}

.portal-dashboard-top {
    grid-template-columns: minmax(0, 2fr) minmax(300px, .8fr);
    gap: 14px;
    display: grid
}

.customer-brand-assets {
    background: #fff;
    border: 1px solid #dfe7f2;
    border-radius: 14px;
    gap: 14px;
    padding: 20px;
    display: grid
}

.customer-brand-assets-heading {
    justify-content: space-between;
    align-items: end;
    gap: 16px;
    display: flex
}

.customer-brand-assets-heading span {
    color: #1f4e8c;
    letter-spacing: .1em;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 900
}

.customer-brand-assets-heading h2 {
    color: var(--navy);
    margin: 3px 0 0;
    font-size: 20px
}

.customer-brand-assets-heading small {
    color: #667085;
    font-size: 11px;
    font-weight: 800
}

.customer-brand-assets-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    display: inline-flex
}

.customer-brand-assets-actions button {
    color: #142b69;
    cursor: pointer;
    min-height: 34px;
    font: inherit;
    background: #fff;
    border: 1px solid #142b69;
    border-radius: 6px;
    padding: 0 14px;
    font-size: 12px;
    font-weight: 900
}

.customer-brand-assets-actions button:hover {
    color: #fff;
    background: #142b69
}

.customer-brand-assets-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    display: grid
}

.customer-brand-asset-card {
    background: #fff;
    border: 2px solid #142b69;
    border-radius: 12px;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px 12px;
    min-width: 0;
    padding: 14px;
    display: grid
}

.customer-brand-asset-card>div:nth-child(2) {
    min-width: 0
}

.customer-brand-asset-card>div:nth-child(2)>span {
    color: #667085;
    text-transform: uppercase;
    margin-bottom: 3px;
    font-size: 10px;
    font-weight: 900;
    display: block
}

.customer-brand-asset-card>div:nth-child(2)>strong {
    color: var(--navy);
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    display: block;
    overflow: hidden
}

.customer-brand-asset-edit {
    color: #142b69;
    cursor: pointer;
    min-height: 30px;
    font: inherit;
    background: #f8fbff;
    border: 1px solid #d8e2f1;
    border-radius: 6px;
    align-self: start;
    padding: 0 11px;
    font-size: 11px;
    font-weight: 900
}

.customer-brand-asset-edit:hover {
    color: #fff;
    background: #142b69;
    border-color: #142b69
}

.customer-brand-asset-icon {
    color: #cf1f2d;
    background: #f4f7fc;
    border-radius: 10px;
    place-items: center;
    width: 48px;
    height: 48px;
    font-size: 9px;
    font-weight: 900;
    display: grid;
    overflow: hidden
}

.customer-brand-asset-icon img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.customer-brand-asset-icon.text-icon {
    color: #fff;
    background: #071f5c;
    font-size: 19px
}

.brand-verification-status {
    border-radius: 999px;
    grid-column: 1/-1;
    justify-self: start;
    padding: 5px 9px;
    font-size: 10px;
    font-weight: 900
}

.brand-verification-status.verified,
.brand-verification-status.approved {
    color: #087443;
    background: #e8f8ef
}

.brand-verification-status.submitted {
    color: #1f4e8c;
    background: #e8f2ff
}

.brand-verification-status.under-review {
    color: #9a5b00;
    background: #fff5dd
}

.brand-verification-status.rejected {
    color: #b42318;
    background: #fff1f0
}

.brand-verification-status.unverified {
    color: #9a5b00;
    background: #fff5dd
}

.customer-brand-assets-modal {
    max-width: 560px
}

.brand-assets-logo-field {
    background: #fff;
    border: 1px dashed #9db3d1;
    border-radius: 8px;
    gap: 8px;
    padding: 14px;
    display: grid
}

.brand-assets-logo-field span {
    color: #667085;
    font-size: 12px;
    font-weight: 800
}

.brand-assets-logo-field input {
    color: #344054;
    width: 100%
}

.customer-application-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    display: grid
}

.customer-application-summary article {
    background: #fff;
    border: 1px solid #dfe7f2;
    border-left: 4px solid #1f4e8c;
    border-radius: 12px;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    min-height: 92px;
    padding: 18px 20px;
    display: flex;
    box-shadow: 0 8px 22px #071f5c0f
}

.customer-application-summary article.pending {
    border-left-color: #d38a11
}

.customer-application-summary article.approved {
    border-left-color: #15945b
}

.customer-application-summary span {
    color: #667085;
    letter-spacing: .04em;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 900
}

.customer-application-summary strong {
    color: var(--navy);
    font-size: 30px;
    line-height: 1
}

.portal-dashboard-hero {
    color: #fff;
    background: #071f5c;
    border-radius: 14px;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    padding: 24px;
    display: flex;
    box-shadow: 0 18px 38px #071f5c29
}

.portal-dashboard-hero span {
    color: #ffffffc2;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 900;
    display: block
}

.portal-dashboard-hero h2 {
    color: #fff;
    margin: 0 0 8px;
    font-size: 26px
}

.portal-dashboard-hero p {
    color: #ffffffd6;
    max-width: 680px;
    margin: 0;
    line-height: 1.5
}

.portal-dashboard-hero .primary-btn {
    color: #071f5c;
    background: #fff;
    flex: none
}

.portal-dashboard-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    display: grid
}

.portal-dashboard-card {
    background: #fff;
    border: 1px solid #dfe7f2;
    border-radius: 14px;
    min-width: 0;
    padding: 18px;
    box-shadow: 0 12px 30px #172b5812
}

.portal-dashboard-card-head {
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    display: flex
}

.portal-dashboard-card-head span {
    color: #667085;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 900
}

.portal-dashboard-card-head button {
    color: #1f4e8c;
    cursor: pointer;
    min-height: 28px;
    font: inherit;
    background: #f8fbff;
    border: 1px solid #d9e4f2;
    border-radius: 999px;
    padding: 0 12px;
    font-size: 12px;
    font-weight: 900
}

.portal-dashboard-card>strong,
.portal-dashboard-item strong {
    color: var(--navy);
    overflow-wrap: anywhere;
    margin-bottom: 6px;
    font-size: 16px;
    display: block
}

.portal-dashboard-card p,
.portal-dashboard-item p {
    color: #667085;
    overflow-wrap: anywhere;
    margin: 0;
    font-size: 13px;
    line-height: 1.45
}

.portal-dashboard-list {
    align-content: start;
    display: grid
}

.portal-dashboard-item {
    border-top: 1px solid #edf1f7;
    padding: 11px 0
}

.portal-dashboard-item:first-of-type {
    border-top: 0;
    padding-top: 0
}

.applications-tab h2 {
    color: var(--ink);
    margin: 0 0 24px;
    font-size: 18px;
    font-weight: 600
}

.applications-table-wrapper {
    background: #fff;
    border: 1px solid #dfe7f2;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 18px 45px #172b5814
}

.applications-table {
    border-collapse: collapse;
    width: 100%
}

.applications-table thead {
    background: #f8f9fc;
    border-bottom: 1px solid #e5eaf0
}

.applications-table th {
    text-align: left;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #666;
    padding: 14px 16px;
    font-size: 12px;
    font-weight: 600
}

.applications-table tbody tr {
    cursor: pointer;
    border-bottom: 1px solid #f0f3f8;
    transition: background .2s, box-shadow .2s, transform .2s
}

.applications-table tbody tr:hover {
    background: #f8fbff;
    box-shadow: inset 4px 0 #1f4e8c
}

.applications-table tbody tr:focus-visible {
    outline-offset: -2px;
    outline: 2px solid #1f4e8c
}

.applications-table td {
    vertical-align: middle;
    padding: 16px;
    font-size: 13px
}

.applications-table .mark-type {
    color: var(--ink);
    font-weight: 600
}

.status-badge,
.payment-badge {
    letter-spacing: .3px;
    border-radius: 3px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 600;
    display: inline-block
}

.status-badge.submitted {
    color: #1e40af;
    background: #dbeafe
}

.status-badge.under-review {
    color: #92400e;
    background: #fef3c7
}

.status-badge.approved {
    color: #15803d;
    background: #dcfce7
}

.status-badge.rejected {
    color: #b91c1c;
    background: #fee2e2
}

.payment-badge.paid {
    color: #15803d;
    background: #f0fdf4
}

.payment-badge.pending {
    color: #92400e;
    background: #fef3c7
}

.applications-table .app-id {
    color: #1f4e8c;
    font-family: Monaco, monospace;
    font-size: 12px;
    font-weight: 600
}

.applications-table .submitted-date {
    color: #999;
    font-size: 12px
}

.applications-table .action {
    text-align: right
}

.portal-action-btn {
    color: #1f4e8c;
    cursor: pointer;
    background: #e7f0fb;
    border: 1px solid #c9d9ef;
    border-radius: 999px;
    min-width: 64px;
    padding: 7px 12px;
    font-size: 0;
    font-weight: 800;
    transition: all .2s
}

.portal-action-btn:after {
    content: "View";
    font-size: 12px
}

.portal-action-btn:hover {
    color: #fff;
    background: #1f4e8c;
    border-color: #1f4e8c
}

.empty-state,
.tab-placeholder {
    text-align: center;
    background: #fff;
    border: 1px dashed #e5eaf0;
    border-radius: 8px;
    padding: 60px 40px
}

.empty-state h3,
.tab-placeholder h3 {
    color: var(--ink);
    margin: 0 0 12px;
    font-size: 16px;
    font-weight: 600
}

.empty-state p,
.tab-placeholder p {
    color: #999;
    margin: 0 0 24px;
    font-size: 13px
}

.loading-message {
    text-align: center;
    color: #666;
    padding: 40px;
    font-size: 13px
}

.applications-header {
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    display: flex
}

.applications-header h2 {
    color: var(--ink);
    margin: 0;
    font-size: 18px;
    font-weight: 600
}

.refresh-btn {
    color: #1f4e8c;
    cursor: pointer;
    background: 0 0;
    border: 1px solid #1f4e8c;
    border-radius: 4px;
    padding: 8px 16px;
    font-size: 12px;
    font-weight: 600;
    transition: all .2s
}

.refresh-btn:hover {
    background: #f0f3f8
}

.applications-layout {
    display: block
}

.customer-application-modal-overlay {
    z-index: 1000;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    background: #0f172a94;
    justify-content: center;
    align-items: center;
    padding: 24px;
    display: flex;
    position: fixed;
    inset: 0
}

.applications-table-wrapper.with-detail {
    background: #fff
}

.protection-details-panel {
    background: #fff;
    border: 1px solid #e5eaf0e6;
    border-radius: 16px;
    flex-direction: column;
    width: min(920px, 100%);
    max-height: min(86vh, 820px);
    display: flex;
    overflow: hidden auto;
    box-shadow: 0 30px 90px #0f172a47
}

.detail-close {
    background: linear-gradient(#f8fbff, #fff);
    border-bottom: 1px solid #e5eaf0;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 18px 20px;
    display: flex
}

.detail-close h3 {
    color: var(--navy);
    margin: 4px 0 0;
    font-size: 20px;
    font-weight: 800
}

.customer-application-modal-eyebrow {
    color: #1f4e8c;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 900
}

.detail-close-btn {
    cursor: pointer;
    color: #667085;
    background: #fff;
    border: 1px solid #dbe5f2;
    border-radius: 999px;
    width: 36px;
    height: 36px;
    padding: 0;
    font-size: 24px;
    line-height: 1;
    transition: all .2s
}

.detail-close-btn:hover {
    color: #fff;
    background: #1f4e8c;
    border-color: #1f4e8c
}

.customer-application-modal-overlay .delete-app-btn {
    display: none
}

.delete-app-btn {
    color: #fff;
    cursor: pointer;
    background: #dc2626;
    border: none;
    border-radius: 4px;
    padding: 6px 12px;
    font-size: 11px;
    font-weight: 600;
    transition: all .2s
}

.delete-app-btn:hover {
    background: #b91c1c
}

.protection-section {
    padding: 20px
}

.protection-header {
    background: #2563eb;
    margin: -20px -20px 20px;
    padding: 12px 20px
}

.protection-header h3 {
    color: #fff;
    text-transform: uppercase;
    letter-spacing: .8px;
    margin: 0;
    font-size: 12px;
    font-weight: 700
}

.customer-application-detail-group {
    background: #f8fafc;
    border: 1px solid #e5eaf0;
    border-radius: 10px;
    margin-bottom: 18px;
    padding: 16px
}

.customer-application-detail-group h4 {
    color: var(--navy);
    text-transform: uppercase;
    letter-spacing: .06em;
    margin: 0 0 12px;
    font-size: 13px;
    font-weight: 800
}

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

.customer-application-detail-field {
    background: #fff;
    border: 1px solid #edf1f7;
    border-radius: 8px;
    min-width: 0;
    padding: 10px
}

.customer-application-detail-field span {
    color: #667085;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 5px;
    font-size: 10px;
    font-weight: 800;
    display: block
}

.customer-application-detail-field p {
    color: var(--ink);
    overflow-wrap: anywhere;
    margin: 0;
    font-size: 13px;
    line-height: 1.45
}

.detail-row {
    border-bottom: 1px solid #f0f3f8;
    margin-bottom: 20px;
    padding-bottom: 20px
}

.detail-row:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0
}

.detail-row label,
.detail-section-header label {
    text-transform: uppercase;
    letter-spacing: .8px;
    color: #666;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 700;
    display: block
}

.detail-row p {
    color: var(--ink);
    margin: 0;
    font-size: 13px
}

.detail-section {
    border-bottom: 1px solid #f0f3f8;
    margin-bottom: 20px;
    padding-bottom: 20px
}

.detail-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0
}

.detail-section-header {
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    display: flex
}

.detail-section-header label {
    margin: 0
}

.add-btn {
    color: #2563eb;
    cursor: pointer;
    background: 0 0;
    border: none;
    padding: 4px 8px;
    font-size: 11px;
    font-weight: 600;
    transition: color .2s
}

.add-btn:hover {
    color: #1f4e8c
}

.detail-item {
    background: #f9fafb;
    border-radius: 4px;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    padding: 10px 12px;
    display: flex
}

.item-content {
    flex: 1;
    align-items: center;
    gap: 12px;
    display: flex
}

.item-text {
    color: var(--ink);
    font-size: 13px;
    font-weight: 500
}

.item-status {
    letter-spacing: .3px;
    text-transform: uppercase;
    border-radius: 3px;
    padding: 3px 8px;
    font-size: 10px;
    font-weight: 600;
    display: inline-block
}

.item-status.approved {
    color: #047857;
    background: #d1fae5
}

.item-status.under-review {
    color: #92400e;
    background: #fcd34d
}

.item-delete {
    color: #dc2626;
    cursor: pointer;
    background: 0 0;
    border: none;
    border-radius: 3px;
    padding: 2px 6px;
    font-size: 14px;
    transition: all .2s
}

.item-delete:hover {
    background: #fee2e2
}

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

.logo-item {
    aspect-ratio: 1;
    position: relative
}

.logo-placeholder {
    color: #9ca3af;
    cursor: pointer;
    background: #f0f3f8;
    border: 2px dashed #d1d5db;
    border-radius: 6px;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    font-size: 24px;
    transition: all .2s;
    display: flex
}

.logo-placeholder:hover {
    background: #f8fafc;
    border-color: #1f4e8c
}

.logo-placeholder.approved {
    color: #047857;
    background: #d1fae5;
    border-color: #047857;
    font-size: 28px;
    font-weight: 600
}

.site-shell--admin main {
    max-width: none;
    padding: 0
}

.admin-portal {
    background: #f0f2f5;
    grid-template-columns: 260px 1fr;
    gap: 0;
    width: 100%;
    min-width: 0;
    min-height: 100vh;
    display: grid
}

.admin-portal--manager .admin-actions .danger,
.admin-portal--manager .admin-user-crud-actions .danger,
.admin-portal--manager .admin-view-actions .danger {
    display: none
}

.admin-portal-sidebar {
    background: #fff;
    border-right: 1px solid #e5eaf0;
    flex-direction: column;
    align-self: start;
    gap: 20px;
    min-width: 0;
    height: 100vh;
    padding: 20px 16px;
    display: flex;
    position: sticky;
    top: 0;
    overflow-y: auto
}

.admin-sidebar-header {
    border-bottom: 1px solid #edf1f7;
    grid-template-columns: 1fr;
    align-items: center;
    gap: 8px;
    padding-bottom: 14px;
    display: grid
}

.admin-sidebar-title {
    min-width: 0
}

.admin-sidebar-title .brand-lockup {
    width: 132px
}

.admin-sidebar-title .brand-wordmark {
    letter-spacing: .06em;
    border-width: 1.5px;
    border-radius: 5px;
    min-height: 30px;
    padding: 4px 8px;
    font-size: 18px
}

.admin-sidebar-title .brand-kicker {
    letter-spacing: .02em;
    margin-top: 4px;
    font-size: 7px;
    line-height: 1.2
}

.admin-sidebar-refresh-btn {
    display: none
}

.admin-create-user-btn {
    color: #fff;
    background: var(--blue);
    cursor: pointer;
    border: 0;
    border-radius: 6px;
    min-height: 32px;
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 800;
    transition: background .15s
}

.admin-create-user-btn:hover {
    background: var(--navy)
}

.admin-sidebar-stats {
    background: linear-gradient(135deg, #f0f4ff 0%, #f8faff 100%);
    border: 1px solid #e8edf5;
    border-radius: 10px;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    padding: 14px;
    display: grid
}

.admin-sidebar-stats .stat {
    flex-direction: column;
    align-items: center;
    gap: 2px;
    display: flex
}

.admin-sidebar-stats strong {
    color: #1f4e8c;
    font-size: 20px;
    line-height: 1.2
}

.admin-sidebar-stats span {
    color: #667085;
    text-transform: uppercase;
    letter-spacing: .4px;
    font-size: 10px;
    font-weight: 700
}

.admin-dashboard-nav {
    gap: 4px;
    display: grid
}

.admin-dashboard-nav button {
    color: #475467;
    cursor: pointer;
    text-align: left;
    background: 0 0;
    border: 0;
    border-radius: 8px;
    width: 100%;
    min-height: 38px;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 600;
    transition: background .12s, color .12s
}

.admin-dashboard-nav button:hover {
    color: var(--navy);
    background: #f0f2f5
}

.admin-dashboard-nav button.active {
    color: #fff;
    background: var(--navy);
    font-weight: 700
}

.admin-users-list {
    flex-direction: column;
    flex: 1;
    gap: 12px;
    min-height: 0;
    display: flex
}

.admin-users-list h3 {
    text-transform: uppercase;
    letter-spacing: .8px;
    color: #666;
    margin: 0;
    font-size: 12px;
    font-weight: 700
}

.admin-users-list {
    overflow-y: auto
}

.empty-users {
    text-align: center;
    color: #999;
    padding: 20px 12px;
    font-size: 12px
}

.admin-user-item {
    text-align: left;
    background: #f9fafb;
    border: 1px solid #e5eaf0;
    border-radius: 6px;
    align-items: center;
    gap: 12px;
    padding: 12px;
    transition: all .2s;
    display: flex
}

.admin-user-item:hover {
    background: #f0f3f8;
    border-color: #1f4e8c
}

.admin-user-item.active {
    background: #eff6ff;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px #2563eb1a
}

.user-item-avatar {
    color: #fff;
    background: linear-gradient(135deg, #1f4e8c 0%, #b31942 100%);
    border-radius: 8px;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    font-size: 12px;
    font-weight: 700;
    display: flex
}

.user-item-info {
    flex-direction: column;
    flex: 1;
    gap: 3px;
    min-width: 0;
    display: flex
}

.user-item-info strong {
    color: var(--ink);
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 12px;
    overflow: hidden
}

.user-item-info small {
    color: #999;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 10px;
    overflow: hidden
}

.user-item-info .app-count {
    color: #666;
    background: #f0f3f8;
    border-radius: 3px;
    width: fit-content;
    padding: 2px 6px;
    font-size: 10px;
    font-weight: 600;
    display: inline-block
}

.admin-user-crud-actions {
    flex-shrink: 0;
    align-items: center;
    gap: 6px;
    display: flex
}

.admin-user-status-controls {
    grid-template-columns: repeat(3, minmax(86px, 1fr));
    gap: 8px;
    min-width: 300px;
    display: grid
}

.admin-user-status-controls label {
    gap: 4px;
    display: grid
}

.admin-user-status-controls span {
    color: #667085;
    letter-spacing: .06em;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 800
}

.admin-user-status-controls select {
    min-height: 32px;
    color: var(--navy);
    font: inherit;
    background: #fff;
    border: 1px solid #d9e4f2;
    border-radius: 7px;
    padding: 0 8px;
    font-size: 12px;
    font-weight: 800
}

.admin-user-status-controls select:disabled {
    opacity: .58;
    cursor: not-allowed
}

.admin-user-status-controls .admin-enable-status-btn {
    min-height: 32px;
    color: var(--navy);
    cursor: pointer;
    font: inherit;
    background: #eef5ff;
    border: 1px solid #b8cbea;
    border-radius: 7px;
    grid-column: 1/-1;
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 800
}

.admin-user-status-controls .admin-enable-status-btn:hover {
    color: #fff;
    border-color: var(--blue);
    background: var(--blue)
}

.admin-user-crud-actions button {
    min-height: 30px;
    color: var(--navy);
    cursor: pointer;
    background: #fff;
    border: 1px solid #d7deea;
    border-radius: 6px;
    padding: 6px 9px;
    font-size: 10px;
    font-weight: 800;
    transition: background .2s, border-color .2s, color .2s
}

.admin-user-crud-actions button:hover {
    color: #fff;
    background: var(--blue);
    border-color: var(--blue)
}

.admin-user-crud-actions button.danger {
    color: #b91c1c;
    background: #fff5f5;
    border-color: #fecaca
}

.admin-user-crud-actions button.danger:hover {
    color: #fff;
    background: #dc2626;
    border-color: #dc2626
}

.admin-user-crud-actions button:disabled {
    opacity: .55;
    cursor: not-allowed
}

.admin-auth-note {
    color: #667085;
    margin: 12px 0 0;
    font-size: 12px;
    line-height: 1.5
}

.admin-portal-main {
    flex-direction: column;
    min-width: 0;
    padding: 32px 36px;
    display: flex;
    overflow-y: auto
}

.admin-dashboard-home,
.admin-dashboard-section {
    gap: 24px;
    display: grid
}

.admin-dashboard-top {
    grid-template-columns: minmax(0, 2fr) minmax(300px, .8fr);
    gap: 14px;
    display: grid
}

.admin-dashboard-hero {
    background: linear-gradient(135deg, #fff 0%, #f8faff 100%);
    border: 1px solid #e5eaf0;
    border-radius: 16px;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    padding: 28px 32px;
    display: flex;
    box-shadow: 0 1px 4px #0000000a
}

.admin-dashboard-hero h1 {
    color: var(--navy);
    letter-spacing: -.5px;
    margin: 4px 0 6px;
    font-size: clamp(24px, 3.5vw, 36px)
}

.admin-dashboard-hero p {
    color: #667085;
    margin: 0;
    font-size: 14px
}

.admin-dashboard-cards {
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 14px;
    display: grid
}

.admin-dashboard-cards article {
    background: #fff;
    border: 1px solid #e5eaf0;
    border-radius: 14px;
    flex-direction: column;
    gap: 2px;
    min-height: 122px;
    padding: 18px;
    transition: box-shadow .2s, transform .2s;
    display: flex;
    position: relative;
    overflow: hidden;
    box-shadow: 0 1px 3px #0000000a
}

.admin-dashboard-cards article:after {
    content: "";
    background: #f3f7fd;
    border-radius: 999px;
    width: 86px;
    height: 86px;
    position: absolute;
    bottom: -26px;
    right: -22px
}

.admin-dashboard-cards article:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px #0000000f
}

.admin-dashboard-cards article:first-child {
    border-left: 4px solid var(--blue)
}

.admin-dashboard-cards article:nth-child(2) {
    border-left: 4px solid #16a34a
}

.admin-dashboard-cards article:nth-child(3) {
    border-left: 4px solid #f59e0b
}

.admin-dashboard-cards article:nth-child(4) {
    border-left: 4px solid #7c3aed
}

.admin-dashboard-cards article:nth-child(5) {
    border-left: 4px solid #0f766e
}

.admin-dashboard-cards article:nth-child(6) {
    border-left: 4px solid #be123c
}

.admin-dashboard-cards article:nth-child(7) {
    border-left: 4px solid #2563eb
}

.admin-dashboard-cards article:nth-child(8) {
    border-left: 4px solid #64748b
}

.admin-dashboard-cards span {
    z-index: 1;
    color: #667085;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 4px;
    font-size: 11px;
    font-weight: 800;
    display: block;
    position: relative
}

.admin-dashboard-cards strong {
    z-index: 1;
    color: var(--navy);
    font-size: 34px;
    line-height: 1.1;
    position: relative
}

.admin-dashboard-panels {
    grid-template-columns: 1fr;
    gap: 20px;
    display: grid
}

.admin-dashboard-panels section {
    background: #fff;
    border: 1px solid #e5eaf0;
    border-radius: 14px;
    min-width: 0;
    padding: 20px;
    box-shadow: 0 1px 3px #0000000a
}

.admin-section-heading {
    border-bottom: 1px solid #f0f2f5;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    display: flex
}

.admin-section-heading h2 {
    color: var(--ink);
    margin: 0;
    font-size: 16px;
    font-weight: 700
}

.admin-section-heading button {
    color: var(--blue);
    cursor: pointer;
    background: #f0f4ff;
    border: 0;
    border-radius: 6px;
    padding: 6px 12px;
    font-size: 11px;
    font-weight: 800;
    transition: background .15s
}

.admin-section-heading button:hover {
    background: #dbe6ff
}

.admin-mini-list {
    gap: 8px;
    display: grid
}

.admin-mini-user-list {
    gap: 10px
}

.admin-mini-user-row {
    background: #fafbfc;
    border: 1px solid #edf1f7;
    border-radius: 10px;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    display: grid
}

.admin-mini-user-row>div {
    gap: 3px;
    min-width: 0;
    display: grid
}

.admin-mini-user-row strong,
.admin-mini-user-row span {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.admin-mini-user-row button {
    color: #fff;
    background: var(--blue);
    cursor: pointer;
    border: 0;
    border-radius: 7px;
    flex: none;
    width: auto;
    padding: 8px 14px;
    font-size: 12px;
    font-weight: 800
}

.admin-mini-user-row button:hover {
    background: #173f8f
}

.admin-mini-list>button {
    cursor: pointer;
    text-align: left;
    background: #fafbfc;
    border: 1px solid #edf1f7;
    border-radius: 10px;
    gap: 3px;
    width: 100%;
    padding: 12px 14px;
    transition: background .12s, border-color .12s;
    display: grid
}

.admin-mini-list>button:hover {
    background: #f0f4ff;
    border-color: #c7d7f0
}

.admin-mini-list strong {
    color: var(--ink);
    font-size: 13px;
    font-weight: 600
}

.admin-mini-list span,
.admin-muted-text {
    color: #667085;
    font-size: 12px
}

.admin-users-table {
    gap: 12px;
    display: grid
}

.admin-users-table-row {
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 14px;
    padding: 14px;
    display: grid
}

.admin-users-table-row strong,
.admin-users-table-row span {
    display: block
}

.admin-users-table-row strong {
    color: var(--ink)
}

.admin-users-table-row span,
.admin-users-table-row em {
    color: #667085;
    font-size: 12px;
    font-style: normal
}

.admin-empty-state {
    text-align: center;
    color: #999;
    padding: 60px 40px;
    font-size: 14px
}

.admin-applications-header {
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    display: flex
}

.admin-applications-header h2 {
    color: var(--ink);
    margin: 0;
    font-size: 18px;
    font-weight: 600
}

.app-count-badge {
    color: #fff;
    background: #2563eb;
    border-radius: 20px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 600
}

.admin-search-field {
    flex: 260px;
    max-width: 420px;
    margin-left: auto
}

.admin-search-field input {
    width: 100%;
    min-height: 40px;
    color: var(--ink);
    font: inherit;
    background: #fff;
    border: 1px solid #d8e4fb;
    border-radius: 8px;
    padding: 0 14px;
    font-size: 13px;
    font-weight: 700;
    box-shadow: 0 1px 2px #172b580a
}

.admin-search-field input:focus {
    border-color: #8bb4ff;
    outline: 2px solid #2563eb38
}

.user-overview-section {
    gap: 18px;
    display: grid
}

.user-overview-stats {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 12px;
    display: grid
}

.user-overview-stats article,
.user-overview-card {
    background: #fff;
    border: 1px solid #e5eaf0;
    border-radius: 10px;
    box-shadow: 0 1px 3px #172b580a
}

.user-overview-stats article {
    padding: 16px
}

.user-overview-stats span {
    color: #667085;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 900;
    display: block
}

.user-overview-stats strong {
    color: var(--navy);
    margin-top: 5px;
    font-size: 28px;
    line-height: 1;
    display: block
}

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

.user-overview-card {
    min-width: 0;
    padding: 18px
}

.user-overview-card.wide {
    grid-column: 1/-1
}

.user-overview-list {
    gap: 10px;
    display: grid
}

.user-overview-list article {
    background: #f8fbff;
    border: 1px solid #edf2fb;
    border-radius: 8px;
    gap: 5px;
    padding: 12px;
    display: grid
}

.user-overview-list strong {
    color: var(--navy);
    font-size: 14px
}

.user-overview-list span,
.user-overview-card p {
    color: #667085;
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45
}

.user-overview-list a {
    width: fit-content;
    color: var(--blue);
    font-size: 13px;
    font-weight: 900
}

.admin-empty-apps {
    text-align: center;
    color: #999;
    background: #fff;
    border: 1px dashed #e5eaf0;
    border-radius: 8px;
    padding: 40px;
    font-size: 13px
}

.admin-applications-table-wrapper {
    -webkit-overflow-scrolling: touch;
    background: #fff;
    border: 1px solid #e5eaf0;
    border-radius: 8px;
    overflow-x: auto;
    box-shadow: 0 1px 3px #0000000a
}

.admin-applications-table {
    border-collapse: collapse;
    width: 100%;
    min-width: 980px
}

.admin-applications-table thead {
    background: #f8f9fc;
    border-bottom: 1px solid #e5eaf0
}

.admin-applications-table th {
    text-align: left;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #666;
    padding: 14px 16px;
    font-size: 12px;
    font-weight: 600
}

.admin-applications-table tbody tr {
    border-bottom: 1px solid #f0f3f8;
    transition: background .2s
}

.admin-applications-table tbody tr:hover {
    background: #fafbfd
}

.admin-applications-table td {
    vertical-align: middle;
    padding: 14px 16px;
    font-size: 13px
}

.admin-applications-table .app-name {
    color: var(--ink);
    font-weight: 600
}

.admin-actions {
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    display: flex
}

.admin-quick-status-controls {
    grid-template-columns: repeat(3, minmax(92px, 1fr));
    gap: 6px;
    min-width: 300px;
    display: grid
}

.admin-quick-status-controls label {
    gap: 4px;
    display: grid
}

.admin-quick-status-controls span {
    color: #667085;
    letter-spacing: .06em;
    text-transform: uppercase;
    font-size: 9px;
    font-weight: 900
}

.admin-quick-status-controls select {
    width: 100%;
    min-height: 32px;
    color: var(--navy);
    font: inherit;
    background: #fff;
    border: 1px solid #d8e2f1;
    border-radius: 6px;
    padding: 0 8px;
    font-size: 11px;
    font-weight: 800
}

.admin-quick-status-controls select:disabled {
    opacity: .55;
    cursor: not-allowed
}

.admin-actions button {
    cursor: pointer;
    opacity: .7;
    background: 0 0;
    border: none;
    border-radius: 4px;
    min-width: 38px;
    min-height: 38px;
    padding: 4px 8px;
    font-size: 0;
    transition: all .2s
}

.admin-actions button:after {
    content: attr(title);
    font-size: 12px;
    font-weight: 700
}

.admin-actions button:hover {
    opacity: 1;
    background: #f0f3f8
}

.admin-actions button.danger:hover {
    background: #fee2e2
}

.admin-actions button:disabled {
    opacity: .5;
    cursor: not-allowed
}

.admin-sidebar-footer {
    background: linear-gradient(#fff 0%, #f8fbff 100%);
    border: 1px solid #dbe5f2;
    border-radius: 16px;
    flex-direction: column;
    gap: 14px;
    margin-top: auto;
    padding: 16px;
    display: flex;
    box-shadow: 0 16px 36px #172b5814
}

.admin-sidebar-user {
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    display: grid
}

.admin-sidebar-avatar {
    color: #fff;
    border-radius: 12px;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    width: 42px;
    height: 42px;
    font-size: 15px;
    font-weight: 900;
    display: flex;
    box-shadow: 0 12px 24px #1f4e8c2e
}

.admin-sidebar-avatar.admin-avatar {
    background: linear-gradient(135deg, var(--blue), var(--navy))
}

.admin-sidebar-avatar.manager-avatar {
    background: linear-gradient(135deg, #f59e0b, #b45309)
}

.admin-sidebar-user-info {
    flex-direction: column;
    min-width: 0;
    display: flex
}

.admin-sidebar-user-info strong {
    color: var(--navy);
    font-size: 14px;
    font-weight: 900;
    line-height: 1.2
}

.admin-sidebar-user-info span {
    color: #667085;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4
}

.signout-btn {
    color: #b91c1c;
    cursor: pointer;
    text-align: center;
    background: linear-gradient(#fff, #fff7f7);
    border: 1px solid #fecaca;
    border-radius: 12px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    font-size: 13.5px;
    font-weight: 900;
    transition: transform .18s, box-shadow .18s, background .18s, color .18s, border-color .18s;
    display: flex;
    box-shadow: 0 12px 24px #b91c1c1a
}

.signout-btn:hover {
    color: #fff;
    background: linear-gradient(135deg, #dc2626, #991b1b);
    border-color: #dc2626;
    transform: translateY(-1px);
    box-shadow: 0 14px 28px #b91c1c3d
}

.signout-btn:before {
    content: "";
    border: 2px solid;
    border-right: 0;
    border-radius: 4px 0 0 4px;
    width: 16px;
    height: 16px;
    box-shadow: 7px 4px 0 -5px
}

@media (width<=900px) {
    .admin-portal {
        grid-template-columns: 1fr;
        min-height: auto
    }

    .admin-portal-sidebar {
        border-bottom: 1px solid #e5eaf0;
        border-right: none;
        gap: 16px;
        height: auto;
        padding: 16px;
        position: static;
        overflow: visible
    }

    .admin-sidebar-footer {
        background: #f8fbff;
        border: 1px solid #edf1f7;
        border-radius: 14px;
        flex-direction: column;
        gap: 12px;
        margin-top: auto;
        padding: 14px;
        display: flex
    }

    .admin-sidebar-user {
        align-items: center;
        gap: 10px;
        display: flex
    }

    .admin-sidebar-avatar {
        color: #fff;
        border-radius: 8px;
        flex-shrink: 0;
        justify-content: center;
        align-items: center;
        width: 34px;
        height: 34px;
        font-size: 13px;
        font-weight: 800;
        display: flex
    }

    .admin-sidebar-avatar.admin-avatar {
        background: var(--blue)
    }

    .admin-sidebar-avatar.manager-avatar {
        background: #c97a00
    }

    .admin-sidebar-user-info {
        flex-direction: column;
        min-width: 0;
        display: flex
    }

    .admin-sidebar-user-info strong {
        color: var(--ink);
        font-size: 12px;
        font-weight: 700;
        line-height: 1.3
    }

    .admin-sidebar-user-info span {
        color: #8890a0;
        font-size: 10px;
        line-height: 1.3
    }

    .signout-btn {
        color: #b91c1c;
        cursor: pointer;
        text-align: center;
        background: linear-gradient(#fff, #fff7f7);
        border: 1px solid #fecaca;
        border-radius: 12px;
        justify-content: center;
        align-items: center;
        gap: 10px;
        width: 100%;
        min-height: 48px;
        padding: 12px 14px;
        font-size: 13.5px;
        font-weight: 800;
        transition: transform .18s, box-shadow .18s, background .18s, color .18s, border-color .18s;
        display: flex;
        box-shadow: 0 12px 24px #b91c1c1a
    }

    .signout-btn:hover {
        color: #fff;
        background: linear-gradient(135deg, #dc2626, #991b1b);
        border-color: #dc2626;
        transform: translateY(-1px);
        box-shadow: 0 14px 28px #b91c1c3d
    }

    .signout-btn:before {
        content: "←";
        content: "";
        border: 2px solid;
        border-right: 0;
        border-radius: 4px 0 0 4px;
        width: 16px;
        height: 16px;
        font-size: 14px;
        line-height: 1;
        transform: none;
        box-shadow: 7px 4px 0 -5px
    }

    .role-badge--admin {
        color: var(--blue);
        background: #e8f4fd
    }

    .role-badge--manager {
        color: #c97a00;
        background: #fef3e2
    }

    .admin-users-list {
        scroll-snap-type: x proximity;
        flex-direction: row;
        gap: 10px;
        padding: 2px 2px 10px;
        overflow: auto hidden
    }

    .admin-dashboard-nav {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .admin-dashboard-nav button {
        text-align: center
    }

    .admin-dashboard-cards,
    .admin-dashboard-panels {
        grid-template-columns: 1fr
    }

    .admin-dashboard-hero {
        flex-direction: column;
        align-items: flex-start
    }

    .admin-dashboard-top {
        grid-template-columns: 1fr
    }

    .admin-dashboard-top .time-zone-clock-panel {
        width: 100%;
        min-width: 0
    }

    .admin-users-table-row {
        grid-template-columns: auto minmax(0, 1fr)
    }

    .admin-users-table-row em,
    .admin-users-table-row .admin-user-crud-actions {
        grid-column: 1/-1
    }

    .admin-users-list h3 {
        display: none
    }

    .admin-user-item {
        scroll-snap-align: start;
        flex-direction: column;
        flex: 0 0 min(260px, 78vw);
        align-items: flex-start
    }

    .admin-user-crud-actions {
        grid-template-columns: repeat(3, 1fr);
        width: 100%;
        display: grid
    }

    .admin-user-crud-actions button {
        width: 100%
    }

    .admin-portal-main {
        padding: 24px 18px
    }
}

@media (width<=640px) {
    .admin-portal-main {
        padding: 20px 16px
    }

    .admin-sidebar-header,
    .admin-applications-header {
        align-items: flex-start
    }

    .admin-search-field {
        flex-basis: 100%;
        max-width: none;
        margin-left: 0
    }

    .user-overview-stats,
    .user-overview-grid {
        grid-template-columns: 1fr
    }

    .admin-sidebar-stats {
        width: 100%
    }

    .admin-applications-header h2 {
        overflow-wrap: anywhere;
        font-size: 16px
    }

    .admin-applications-table-wrapper {
        box-shadow: none;
        background: 0 0;
        border: 0;
        overflow: visible
    }

    .admin-applications-table {
        min-width: 0;
        display: block
    }

    .admin-applications-table thead {
        display: none
    }

    .admin-applications-table tbody {
        gap: 14px;
        display: grid
    }

    .admin-applications-table tbody tr {
        background: #fff;
        border: 1px solid #e5eaf0;
        border-radius: 10px;
        display: block;
        overflow: hidden;
        box-shadow: 0 8px 22px #172b5814
    }

    .admin-applications-table td {
        overflow-wrap: anywhere;
        border-bottom: 1px solid #f0f3f8;
        grid-template-columns: 88px minmax(0, 1fr);
        gap: 10px;
        padding: 11px 14px;
        display: grid
    }

    .admin-applications-table td:before {
        content: attr(data-label);
        color: #6b7280;
        letter-spacing: .05em;
        text-transform: uppercase;
        font-size: 10px;
        font-weight: 800
    }

    .admin-applications-table td.admin-actions {
        border-bottom: 0;
        grid-template-columns: 88px repeat(3, minmax(40px, 1fr));
        align-items: center
    }

    .admin-actions button {
        background: #f8f9fc;
        border: 1px solid #e5eaf0;
        min-width: 44px;
        min-height: 44px
    }

    .modal-backdrop {
        padding: 0
    }

    .admin-edit-modal {
        border: 0;
        border-radius: 0;
        width: 100%;
        min-height: 100dvh;
        max-height: 100dvh;
        padding: 18px;
        overflow-y: auto
    }

    .modal-header {
        z-index: 3;
        background: #fff;
        padding: 18px 0;
        position: sticky;
        top: -18px
    }

    .admin-modal-section-grid,
    .admin-modal-detail-list,
    .admin-edit-form .form-grid {
        grid-template-columns: 1fr
    }

    .admin-modal-section-card dl>div {
        grid-template-columns: 1fr;
        gap: 4px
    }

    .admin-view-actions,
    .admin-edit-actions,
    .admin-crud-actions {
        grid-template-columns: 1fr;
        display: grid
    }

    .admin-view-actions button,
    .admin-edit-actions button,
    .admin-crud-actions button {
        width: 100%;
        min-height: 46px
    }

    .admin-edit-section-card {
        padding: 14px
    }
}

.logo-item .item-delete {
    color: #fff;
    background: #dc2626;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    padding: 0;
    font-size: 12px;
    display: flex;
    position: absolute;
    top: -6px;
    right: -6px
}

.logo-item .item-delete:hover {
    background: #b91c1c
}

.applications-table tbody tr {
    cursor: pointer
}

.applications-table tbody tr.selected {
    background: #eff6ff;
    border-left: 3px solid #2563eb
}

.applications-table tbody tr.selected:hover {
    background: #eff6ff
}

@media (width<=768px) {
    .customer-portal {
        grid-template-columns: 1fr;
        padding: 14px
    }

    .customer-portal-sidebar {
        border-bottom: 0;
        border-right: none;
        gap: 24px;
        padding: 24px 16px
    }

    .customer-portal-main {
        padding: 18px 0 30px
    }

    .portal-header {
        border-radius: 22px;
        padding: 16px
    }

    .portal-header-top {
        grid-template-columns: 1fr;
        align-items: stretch;
        gap: 14px
    }

    .portal-verified,
    .portal-header-actions {
        justify-content: flex-start
    }

    .portal-tabs {
        justify-self: stretch;
        width: 100%;
        overflow-x: auto
    }

    .time-zone-clock-panel {
        width: 100%;
        min-width: 0
    }

    .portal-dashboard-top {
        grid-template-columns: 1fr
    }

    .portal-dashboard-hero {
        flex-direction: column;
        align-items: flex-start
    }

    .portal-dashboard-hero .primary-btn {
        justify-content: center;
        width: 100%
    }

    .portal-dashboard-grid,
    .customer-brand-assets-grid,
    .customer-application-summary {
        grid-template-columns: 1fr
    }

    .applications-table {
        font-size: 12px
    }

    .applications-table th,
    .applications-table td {
        padding: 10px 12px
    }

    .applications-layout {
        grid-template-columns: 1fr
    }

    .protection-details-panel {
        max-height: none
    }

    .customer-application-detail-grid {
        grid-template-columns: 1fr
    }
}

.footer-trust-badge>span {
    color: #071f5c;
    clip-path: polygon(50% 0, 61% 10%, 75% 7%, 82% 20%, 96% 25%, 94% 40%, 100% 50%, 90% 61%, 93% 75%, 80% 82%, 75% 96%, 60% 93%, 50% 100%, 39% 90%, 25% 93%, 18% 80%, 4% 75%, 6% 60%, 0 50%, 10% 39%, 7% 25%, 20% 18%, 25% 4%, 40% 7%);
    background: #55b7ff;
    place-items: center;
    width: 44px;
    height: 44px;
    font-size: 24px;
    font-weight: 900;
    display: grid
}

.footer-trust-badge small,
.footer-trust-badge strong {
    display: block
}

.footer-trust-badge small {
    font-size: 11px
}

.footer-trust-badge strong {
    color: #fff;
    font-size: 20px
}

.footer-social {
    gap: 18px;
    display: flex
}

.footer-social a,
.footer-social span {
    color: #fff;
    background: #ffffff1a;
    border: 1px solid #ffffff29;
    border-radius: 50%;
    place-items: center;
    width: 32px;
    height: 32px;
    font-size: 14px;
    font-weight: 900;
    display: grid
}

.footer-social a:hover,
.footer-social a:focus-visible {
    color: var(--navy);
    background: #fff
}

.footer-social-unavailable {
    opacity: .4;
    cursor: not-allowed
}

.newsletter {
    gap: 9px;
    max-width: 420px;
    display: grid
}

.newsletter input {
    width: 100%;
    min-height: 42px;
    color: var(--navy);
    background: #fff;
    border: 0;
    border-radius: 2px;
    padding: 10px 14px;
    font-size: 14px
}

.newsletter button {
    background: var(--red);
    min-height: 42px;
    box-shadow: none;
    border-radius: 0;
    padding: 0 18px
}

.newsletter button:hover,
.newsletter button:focus-visible {
    background: #d2224e;
    transform: none
}

.newsletter-status {
    color: #ffffffd1;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.4
}

.footer-contact-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    padding: 0 clamp(24px, 6vw, 82px) 30px;
    display: grid
}

.footer-contact-card {
    background: #041647b3;
    border: 1px solid #ffffff0f;
    align-items: center;
    gap: 16px;
    min-width: 0;
    padding: 18px 22px;
    display: flex
}

a.footer-contact-card:hover,
a.footer-contact-card:focus-visible {
    color: #fff;
    background: #092977e6;
    border-color: #ffffff2e
}

.footer-contact-card>span:last-child {
    min-width: 0
}

.footer-contact-card small,
.footer-contact-card strong {
    display: block
}

.footer-contact-card small {
    color: #ffffffad;
    letter-spacing: .08em;
    margin-bottom: 5px;
    font-size: 11px
}

.footer-contact-card strong {
    color: #fff;
    overflow-wrap: anywhere;
    font-size: 13px
}

.footer-contact-icon {
    color: #fff;
    flex: none;
    font-size: 28px
}

.footer-disclaimer {
    color: #ffffffb8;
    text-align: center;
    border-top: 1px solid #ffffff14;
    padding: 14px clamp(24px, 6vw, 82px);
    font-size: 12px
}

.sr-only {
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden
}

@media (width<=980px) {
    .auth-page {
        grid-template-columns: 1fr;
        width: min(720px, 100% - 36px)
    }

    .customer-application-grid {
        grid-template-columns: 1fr
    }

    .contact-page-hero {
        grid-template-columns: 1fr;
        gap: 42px
    }

    .contact-hero-copy {
        padding-right: 0
    }

    .contact-hero-image-wrap {
        min-height: 420px
    }

    .legal-team-section {
        grid-template-columns: 1fr
    }

    .legal-team-gallery {
        max-width: 820px
    }

    .top-notice,
    .callout {
        flex-direction: column;
        align-items: stretch
    }

    .hero-section,
    .amazon-section,
    .about-hero {
        margin-inline: 12px
    }

    .header {
        margin-inline: 0;
        display: grid
    }

    .header-top-row {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 14px;
        min-height: auto;
        padding: 14px 18px
    }

    .header-verified,
    .header-cares,
    .header-contact-pills,
    .header-contact-dropdown,
    .header-action-buttons {
        display: none
    }

    .header-nav-row {
        min-height: 0;
        padding: 0 18px 14px;
        display: block
    }

    .mobile-menu-toggle {
        justify-self: end;
        display: block
    }

    .header-nav-row>nav {
        border-top: 1px solid var(--line);
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        padding-top: 16px;
        display: none
    }

    .header-nav-row>nav.mobile-open {
        display: flex
    }

    .header-nav-row>nav>a,
    .services-nav>a {
        border-radius: 8px;
        justify-content: space-between;
        width: 100%;
        padding: 13px 14px;
        font-size: 15px
    }

    .header-nav-actions {
        display: none
    }

    .header .mobile-menu-cta {
        color: #fff;
        background: var(--red);
        border-radius: 8px;
        justify-content: center;
        margin-top: 8px;
        display: flex
    }

    nav {
        flex-wrap: wrap
    }

    .hero-section,
    .trust-intro,
    .split-section,
    .experience-section,
    .amazon-section,
    .page-hero,
    .admin-grid,
    .review-submit-layout,
    .state-section,
    .contact-section,
    .service-page-layout,
    .application-layout,
    .about-hero,
    .about-client-section,
    .about-integrity-section,
    .home-about-section,
    .home-contact-section,
    .footer {
        grid-template-columns: 1fr
    }

    .client-experience-grid,
    .team-profile-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .faq-list {
        grid-template-columns: 1fr
    }

    .about-hero-image {
        min-height: 440px
    }

    .about-proof {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .about-proof article:nth-child(2) {
        border-right: 0
    }

    .about-proof article:nth-child(-n+2) {
        border-bottom: 1px solid var(--line)
    }

    .application-stepper {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        row-gap: 18px
    }

    .application-stepper li:nth-child(5):before {
        display: none
    }

    .protection-type-grid {
        grid-template-columns: 1fr
    }

    .application-review-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .mega-menu {
        min-height: 0;
        box-shadow: none;
        opacity: 1;
        pointer-events: auto;
        border-width: 2px;
        grid-template-columns: 1fr;
        margin-top: 8px;
        padding: 22px;
        display: none;
        position: static;
        transform: none
    }

    .services-nav {
        grid-template-columns: minmax(0, 1fr) 44px;
        align-items: center;
        width: 100%;
        display: grid
    }

    .services-submenu-toggle {
        width: 40px;
        height: 40px;
        color: var(--navy);
        background: var(--soft-blue);
        border: 1px solid var(--line);
        box-shadow: none;
        border-radius: 8px;
        place-items: center;
        padding: 0;
        display: grid
    }

    .services-submenu-toggle .menu-caret {
        transition: transform .2s
    }

    .services-open .services-submenu-toggle .menu-caret {
        transform: rotate(180deg)
    }

    .services-nav.services-open .mega-menu {
        display: grid
    }

    .services-nav:not(.services-open):hover .mega-menu,
    .services-nav:not(.services-open):focus-within .mega-menu {
        display: none
    }

    .services-nav>.mega-menu {
        grid-column: 1/-1
    }

    .mega-intro {
        display: none
    }

    .mega-list {
        grid-template-columns: 1fr;
        max-height: 430px;
        overflow-y: auto
    }

    .amazon-visual-card,
    .amazon-benefits {
        grid-template-columns: 1fr
    }

    .application-sidebar,
    .admin-detail-card {
        position: static
    }

    .service-grid,
    .service-detail-grid,
    .service-catalog,
    .credential-grid,
    .certificate-gallery,
    .process-line,
    .pricing-grid,
    .registration-options,
    .why-grid,
    .expanded-grid,
    .package-choice {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .process-line:before {
        display: none
    }

    .hero-section {
        border-radius: 22px;
        min-height: auto
    }

    .hero-visual,
    .hero-visual>img {
        height: 460px;
        min-height: 0
    }

    .floating-brief,
    .brand-orbit {
        display: none
    }

    .hero-visual .dashboard {
        width: 100%;
        margin-top: 16px;
        position: relative;
        bottom: auto;
        right: auto
    }

    .state-map-banner {
        grid-template-columns: 1fr;
        gap: 28px;
        padding-block: 42px
    }

    .state-map-visual {
        min-height: 340px
    }

    .state-map-visual img {
        width: 150%;
        transform: translate(-34%)
    }

    .state-map-visual:hover img {
        transform: translate(-34%)scale(1.02)
    }

    .footer-main {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .footer-contact-strip {
        grid-template-columns: 1fr
    }
}

@media (width<=640px) {
    .auth-page {
        gap: 32px;
        width: calc(100% - 28px);
        min-height: 0;
        margin: 24px auto;
        padding: 0
    }

    .auth-page-intro h1 {
        font-size: 42px
    }

    .auth-form {
        padding: 34px 24px
    }

    .auth-page-intro {
        min-height: 560px;
        padding: 74px 22px 34px
    }

    .auth-login-image-frame {
        height: 150px
    }

    .auth-portal-badge {
        width: calc(100% - 54px);
        padding: 14px 18px
    }

    .auth-portal-badge span {
        font-size: 24px
    }

    .auth-monitor {
        width: 100%
    }

    .auth-trust-row {
        flex-direction: column;
        align-items: center
    }

    .auth-required-section,
    .customer-dashboard-hero {
        flex-direction: column;
        align-items: flex-start
    }

    .customer-application-card dl {
        grid-template-columns: 1fr
    }

    .contact-page-hero {
        gap: 30px;
        min-height: 0;
        padding: 52px 20px
    }

    .contact-hero-copy h1 {
        font-size: 42px
    }

    .contact-hero-image-wrap {
        border-width: 3px;
        border-radius: 16px;
        min-height: 330px
    }

    .legal-team-section {
        gap: 30px
    }

    .legal-team-copy h1 {
        font-size: 36px
    }

    .legal-team-hero {
        min-height: 0
    }

    .legal-team-hero-image {
        border-width: 3px;
        border-radius: 14px
    }

    .top-notice {
        gap: 6px
    }

    .cookie-notice {
        flex-direction: column;
        align-items: stretch;
        gap: 16px
    }

    .cookie-actions {
        grid-template-columns: 1fr 1fr;
        display: grid
    }

    .brand-lockup {
        width: 190px
    }

    .brand-wordmark {
        min-height: 38px;
        font-size: 27px
    }

    .about-hero {
        border-radius: 0;
        margin-inline: 0
    }

    .about-hero-copy {
        padding: 54px 24px
    }

    .about-hero-copy h1 {
        font-size: 48px
    }

    .about-hero-image {
        min-height: 330px
    }

    .about-proof {
        grid-template-columns: 1fr;
        margin-inline: 0
    }

    .about-proof article {
        border-right: 0;
        border-bottom: 1px solid var(--line)
    }

    .about-proof article:last-child {
        border-bottom: 0
    }

    .client-experience-grid,
    .team-profile-grid,
    .home-contact-form {
        grid-template-columns: 1fr
    }

    .home-contact-form button {
        grid-column: auto
    }

    .home-about-section>img {
        height: 330px
    }

    .state-map-banner {
        padding: 38px 22px 44px
    }

    .state-map-copy {
        padding: 0
    }

    .state-map-copy h1 {
        margin: 22px 0 24px;
        font-size: 38px
    }

    .state-map-visual {
        min-height: 260px
    }

    .state-map-visual img {
        width: 170%;
        transform: translate(-40%)
    }

    .state-map-visual:hover img {
        transform: translate(-40%)scale(1.02)
    }

    .state-map-visual>span {
        font-size: 12px;
        top: 12px;
        left: 18px
    }

    .footer-main {
        grid-template-columns: 1fr;
        padding: 42px 24px 30px
    }

    .footer-contact-strip {
        padding-inline: 24px
    }

    .hero-stats,
    .hero-proof-panel,
    .service-grid,
    .service-detail-grid,
    .service-catalog,
    .credential-grid,
    .certificate-gallery,
    .application-stepper,
    .protection-type-grid,
    .process-line,
    .pricing-grid,
    .fit-grid,
    .state-grid,
    .registration-options,
    .why-grid,
    .expanded-grid,
    .stats-strip,
    .dashboard-grid,
    .mega-list,
    .application-review-grid,
    .admin-modal-section-grid,
    .review-summary-card dl,
    .form-grid,
    .package-choice,
    .service-catalog-card {
        grid-template-columns: 1fr
    }

    .service-catalog-card img {
        height: 220px;
        min-height: 0
    }

    .application-form {
        width: calc(100% - 36px)
    }

    .application-topper {
        padding-inline: 18px
    }

    .application-stepper li:before {
        display: none
    }

    fieldset,
    .application-sidebar,
    .form-status,
    .application-actions {
        padding: 20px
    }

    .form-step-header {
        padding: 22px 20px 18px
    }

    fieldset {
        padding-top: 0
    }

    .application-actions {
        flex-direction: column
    }

    .admin-toolbar {
        flex-direction: column;
        align-items: stretch
    }

    .admin-detail-header,
    .admin-edit-form .form-grid,
    .admin-modal-detail-list {
        grid-template-columns: 1fr
    }

    .admin-detail-header {
        flex-direction: column
    }

    .case-card.wide,
    .case-list.wide {
        grid-column: auto
    }

    .section,
    .page-hero,
    .hero-section {
        padding: 54px 18px
    }

    .header,
    .hero-section,
    .amazon-section {
        border-radius: 0;
        margin-inline: 0
    }

    .callout {
        margin: 0 18px 54px;
        padding: 28px
    }

    .newsletter {
        flex-direction: column
    }

    .hero-visual,
    .hero-visual>img,
    .amazon-visual-card img,
    .page-hero img,
    .trust-copy img {
        height: 260px
    }

    .footer-bar {
        flex-direction: column
    }
}

.user-form-modal {
    width: min(560px, 100%)
}

.admin-profile-fields {
    border: 0;
    gap: 16px;
    min-width: 0;
    margin: 0;
    padding: 0;
    display: grid
}

.admin-profile-photo {
    text-align: center;
    justify-items: center;
    gap: 12px;
    display: grid
}

.admin-profile-photo img,
.admin-profile-photo>span {
    object-fit: cover;
    background: var(--soft);
    border-radius: 50%;
    place-items: center;
    width: 96px;
    height: 96px;
    display: grid
}

.admin-profile-photo input {
    max-width: 100%
}

.user-form-grid {
    grid-template-columns: 1fr;
    gap: 16px;
    display: grid
}

.user-form-fields {
    grid-template-columns: 1fr;
    gap: 14px;
    display: grid
}

.user-form-field-full {
    grid-column: 1/-1
}

.required-star {
    color: var(--red);
    font-weight: 700
}

.user-form-optional {
    color: #8898aa;
    font-size: 11px;
    font-weight: 400
}

.password-input-wrap {
    align-items: center;
    display: flex;
    position: relative
}

.password-input-wrap input {
    width: 100%;
    padding-right: 46px
}

.password-toggle-btn {
    color: #667085;
    cursor: pointer;
    background: 0 0;
    border: none;
    border-radius: 4px;
    justify-content: center;
    align-items: center;
    width: 28px;
    height: 28px;
    padding: 0;
    font-size: 15px;
    line-height: 1;
    transition: background .15s;
    display: flex;
    position: absolute;
    right: 10px
}

.password-toggle-btn:hover {
    background: var(--soft)
}

.password-strength-wrap {
    align-items: center;
    gap: 10px;
    margin-top: 8px;
    display: flex
}

.password-strength-bar {
    flex: 1;
    gap: 4px;
    display: flex
}

.password-strength-segment {
    background: var(--line);
    border-radius: 100px;
    flex: 1;
    height: 5px;
    transition: background .25s
}

.password-strength-label {
    white-space: nowrap;
    font-size: 11px;
    font-weight: 700;
    transition: color .25s
}

.user-form-field-error {
    color: var(--red);
    margin: 6px 0 0;
    font-size: 12px;
    font-weight: 600
}

.user-form-field-ok {
    color: #10b981;
    margin: 6px 0 0;
    font-size: 12px;
    font-weight: 600
}

.modal-close-btn {
    border: 1px solid var(--line);
    color: #667085;
    cursor: pointer;
    background: 0 0;
    border-radius: 8px;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    font-size: 16px;
    line-height: 1;
    transition: background .15s, color .15s;
    display: flex
}

.modal-close-btn:hover {
    background: var(--soft);
    color: var(--navy)
}

.admin-edit-actions button[type=button] {
    color: var(--navy);
    border-color: var(--line);
    background: #fff
}

.admin-edit-actions button[type=button]:hover {
    background: var(--soft)
}

.admin-notifications-list {
    flex-direction: column;
    gap: 12px;
    margin-top: 16px;
    display: flex
}

.admin-notification-item {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 8px;
    padding: 16px
}

.admin-notification-item .admin-notification-head {
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    display: flex
}

.admin-notification-item strong {
    color: var(--navy);
    font-size: 15px
}

.admin-notification-item p {
    color: var(--ink);
    margin: 0 0 8px;
    line-height: 1.5
}

.admin-notification-item small,
.notification-date {
    color: #8890a0;
    font-size: 12px
}

.notification-modal {
    max-width: 520px
}

.notification-modal select {
    width: 100%;
    min-height: 44px
}

.notification-modal textarea {
    resize: vertical;
    width: 100%;
    min-height: 100px
}

.notices-tab {
    padding: 0
}

.notifications-list {
    flex-direction: column;
    gap: 12px;
    margin-top: 16px;
    display: flex
}

.notification-card {
    border: 1px solid var(--line);
    cursor: default;
    background: #fff;
    border-radius: 8px;
    padding: 16px;
    transition: box-shadow .15s
}

.notification-card:hover {
    box-shadow: 0 2px 8px #0000000f
}

.notification-card.unread {
    border-left: 3px solid var(--blue);
    background: #f8faff
}

.notification-card.unread:hover {
    cursor: pointer
}

.notification-card .notification-head {
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
    display: flex
}

.notification-card strong {
    color: var(--navy);
    font-size: 15px
}

.notification-card p {
    color: #344054;
    margin: 0 0 6px;
    font-size: 14px;
    line-height: 1.5
}

.notification-card small {
    color: #8890a0;
    font-size: 12px
}

.notification-badge {
    text-transform: uppercase;
    letter-spacing: .02em;
    border-radius: 10px;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: 600;
    display: inline-block
}

.notification-card.unread .notification-badge {
    color: var(--blue);
    background: #e8f4fd
}

.notification-card.read .notification-badge {
    color: #8890a0;
    background: #f0f1f3
}

.billing-card {
    cursor: default
}

.billing-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 12px 0;
    display: grid
}

.billing-card-grid .status-item,
.billing-card-grid>div {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 8px;
    min-width: 0;
    padding: 12px
}

.billing-card-grid span {
    color: #667085;
    text-transform: uppercase;
    margin-bottom: 5px;
    font-size: 11px;
    font-weight: 800;
    display: block
}

.billing-card-grid strong {
    overflow-wrap: anywhere;
    color: var(--navy);
    font-size: 15px;
    display: block
}

.invoice-upload-card {
    gap: 14px;
    display: grid
}

.invoice-upload-control span {
    color: #667085;
    font-size: 12px;
    font-weight: 800;
    display: block
}

.invoice-upload-control {
    background: #fff;
    border: 1px dashed #9db3d1;
    border-radius: 8px;
    gap: 8px;
    padding: 14px;
    display: grid
}

.invoice-upload-control input {
    color: #344054;
    width: 100%
}

.admin-pages-list {
    flex-direction: column;
    gap: 16px;
    margin-top: 16px;
    display: flex
}

.admin-page-item {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 8px;
    padding: 16px
}

.admin-page-head {
    justify-content: space-between;
    align-items: center;
    display: flex
}

.admin-page-head strong {
    color: var(--navy);
    font-size: 16px
}

.admin-page-editor {
    flex-direction: column;
    gap: 14px;
    margin-top: 16px;
    display: flex
}

.admin-page-editor label {
    color: var(--navy);
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    display: flex
}

.admin-page-editor input[type=text] {
    border: 1px solid var(--line);
    width: 100%;
    min-height: 44px;
    color: var(--ink);
    box-sizing: border-box;
    background: #fff;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 14px
}

.admin-page-textarea {
    border: 1px solid var(--line);
    width: 100%;
    min-height: 300px;
    color: var(--ink);
    resize: vertical;
    box-sizing: border-box;
    background: #fafbfc;
    border-radius: 8px;
    padding: 12px 14px;
    font-family: Courier New, monospace;
    font-size: 13px;
    line-height: 1.6
}

.schedule-call-section {
    width: 100%;
    max-width: none;
    margin-inline: auto;
    padding: 0;
    display: grid
}

.schedule-call-copy {
    display: none
}

.schedule-calendar-card {
    min-height: 1000px;
    box-shadow: none;
    background: #fff;
    border: 0;
    border-radius: 0;
    padding: 0;
    position: relative
}

.schedule-calendar-loader {
    z-index: 2;
    min-height: 520px;
    color: var(--navy);
    text-align: center;
    background: #fff;
    align-content: center;
    place-items: center;
    gap: 16px;
    display: grid;
    position: absolute;
    inset: 0
}

.schedule-calendar-loader span {
    border: 5px solid #dbeafe;
    border-top-color: var(--red);
    border-radius: 50%;
    width: 52px;
    height: 52px;
    animation: .8s linear infinite calendarLoaderSpin
}

.schedule-calendar-loader strong {
    font-size: 18px;
    font-weight: 900
}

.schedule-calendar-card iframe {
    border-radius: 0;
    min-height: 1000px;
    display: block
}

@keyframes calendarLoaderSpin {
    to {
        transform: rotate(360deg)
    }
}

@media (width<=640px) {
    .application-stepper {
        grid-template-columns: repeat(7, 1fr);
        gap: 6px;
        max-width: 100%;
        padding: 0;
        display: grid;
        overflow: visible
    }

    .application-stepper li {
        justify-items: center
    }

    .application-stepper li:before {
        display: none
    }

    .application-stepper button {
        background: 0 0;
        border: 0;
        border-radius: 0;
        gap: 0;
        width: auto;
        min-height: auto;
        padding: 0
    }

    .application-stepper strong {
        display: none
    }

    .application-stepper span {
        width: 34px;
        height: 34px;
        font-size: 14px;
        box-shadow: 0 0 0 2px #ffffff29
    }

    .application-stepper .current button,
    .application-stepper .done button {
        background: 0 0
    }

    .application-stepper .current span {
        color: var(--navy);
        background: #fff
    }

    .application-stepper .done span {
        color: #fff;
        background: var(--red)
    }
}

.admin-data-grid {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 10px;
    min-width: 0;
    overflow: hidden
}

.admin-data-grid-scroll {
    max-width: 100%;
    overflow-x: auto
}

.admin-data-grid table {
    border-collapse: collapse;
    text-align: left;
    width: 100%;
    min-width: 900px
}

.admin-grid-caption {
    text-align: left;
    color: var(--navy);
    padding: 12px 16px;
    font-weight: 700
}

.admin-data-grid th {
    color: var(--navy);
    white-space: nowrap;
    background: #f3f6fb;
    padding: 12px 16px;
    font-size: 12px
}

.admin-data-grid th button {
    color: inherit;
    font: inherit;
    cursor: pointer;
    text-align: left;
    background: 0 0;
    border: 0;
    border-radius: 0;
    align-items: center;
    gap: 12px;
    padding: 0;
    font-weight: 700;
    display: flex
}

.admin-data-grid :is(th, td) {
    border-bottom: 1px solid #e5eaf0;
    border-right: 1px solid #e5eaf0
}

.admin-data-grid :is(th, td):last-child {
    border-right: 0
}

.admin-data-grid td {
    vertical-align: top;
    color: #344054;
    overflow-wrap: anywhere;
    min-width: 110px;
    max-width: 380px;
    padding: 12px 16px;
    font-size: 13px;
    line-height: 1.5
}

.admin-data-grid tbody tr:nth-child(2n) {
    background: #fafbfd
}

.admin-data-grid tbody tr:hover {
    background: #f1f6fd
}

.admin-data-grid td p {
    margin: 0
}

.admin-data-grid td .admin-actions {
    margin-top: 0 !important
}

.admin-data-grid .admin-user-crud-actions {
    flex-wrap: wrap;
    gap: 6px;
    min-width: 230px;
    display: flex
}

.admin-data-grid .admin-user-crud-actions button {
    width: auto
}

.admin-data-grid .admin-grid-actions-cell {
    min-width: 220px
}

.admin-data-grid .admin-grid-actions-cell>button {
    margin: 0 6px 6px 0
}

.admin-data-grid .admin-quick-status-controls {
    margin: 8px 0
}

.admin-data-grid .admin-grid-empty {
    text-align: center;
    padding: 24px
}

.admin-data-grid .admin-grid-detail {
    background: #f8faff;
    padding: 24px
}

.admin-grid-detail .admin-page-editor {
    max-width: 1000px;
    margin-top: 0
}

.admin-grid-pagination {
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    font-size: 12px;
    display: flex
}

.admin-grid-pagination label {
    align-items: center;
    gap: 8px;
    margin-right: auto;
    display: flex
}

.admin-grid-pagination select {
    width: auto;
    min-height: 32px;
    padding: 4px 8px
}

.admin-grid-pagination button {
    padding: 7px 12px;
    font-size: 12px
}

.admin-data-grid button:disabled {
    opacity: .45;
    cursor: not-allowed
}

.admin-data-grid :is(button, select, .admin-data-grid-scroll):focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: -2px
}

.admin-login-logs {
    background: #fff;
    border-radius: 16px;
    padding: 24px
}

.login-logs-controls {
    flex-wrap: wrap;
    align-items: end;
    gap: 16px;
    margin: 24px 0;
    display: flex
}

.login-logs-controls label {
    flex: 240px;
    gap: 8px;
    display: grid
}

.login-logs-controls input,
.login-logs-controls select {
    border: 1px solid #cfd8e6;
    border-radius: 8px;
    width: 100%;
    padding: 12px
}

.login-logs-controls select {
    color: inherit;
    font: inherit;
    background: #fff;
    min-width: 0
}

.login-logs-table {
    overflow-x: auto
}

.login-logs-table table {
    border-collapse: collapse;
    text-align: left;
    width: 100%
}

.login-logs-table th,
.login-logs-table td {
    vertical-align: top;
    border-bottom: 1px solid #e4e7ec;
    padding: 14px
}

.login-logs-table td {
    overflow-wrap: anywhere;
    min-width: 140px
}

.login-logs-pagination {
    align-items: center;
    gap: 16px;
    margin-top: 20px;
    display: flex
}

/* ============================================
   MEGA MENU — 3-Column USPTO Style
   ============================================ */

.mega-menu {
    display: block;
    grid-template-columns: none;
    gap: 0;
    min-height: 0;

    z-index: 40;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: calc(80% + 8px);
    left: clamp(18px, 6vw, 110px);
    right: clamp(18px, 6vw, 110px);
    transform: translateY(10px);
    transition: opacity .18s, transform .18s, visibility .18s;
    visibility: hidden;

    background: #fff;
    border: 1px solid #e4ebf5;
    border-radius: 4px 4px 12px 12px;
    padding: 24px 36px 26px;
    box-shadow: 0 28px 80px #172b5828;
    overflow: hidden;
}

.services-nav:hover #services-mega-menu,
.services-nav:focus-within #services-mega-menu {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
    visibility: visible !important;
}

#services-mega-menu:before {
    content: "";
    position: absolute;
    top: -14px;
    left: 0;
    right: 0;
    height: 14px;
    background: transparent;
    pointer-events: auto;
}

/* ---------- Top: Trademarks Home link ---------- */
.mega-top {
    border-bottom: 1px solid #e7edf5;
    margin: -24px -36px 22px;
    padding: 16px 36px;
    background: linear-gradient(90deg, #f7faff 0%, #ffffff 100%);
}

.mega-top-link {
    color: var(--navy);
    align-items: center;
    gap: 10px;
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 800;
    text-decoration: none;
    display: inline-flex;
    transition: color .18s, gap .18s;
}

.mega-top-link:hover {
    color: var(--red);
    gap: 14px;
}

.mega-arrow {
    color: var(--red);
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
    transition: transform .18s;
}

.mega-top-link:hover .mega-arrow {
    transform: translateX(4px);
}

/* ---------- Three columns ---------- */
.mega-columns {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px 42px;
    display: grid;
}

.mega-column {
    flex-direction: column;
    min-width: 0;
    display: flex;
}

.mega-column h4 {
    color: #111827;
    border-bottom: 2px solid #dbe4f0;
    letter-spacing: -.01em;
    margin: 0 0 12px;
    padding: 0 0 10px;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 800;
}

.mega-column a {
    color: #1a4586;
    border-radius: 4px;
    margin: 0;
    padding: 7px 8px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    text-decoration: none;
    transition: color .15s, background .15s, padding-left .15s;
    display: block;
}

.mega-column a:hover {
    color: var(--red);
    background: #f5f8fd;
    padding-left: 14px;
}

/* Special red pill link (Avoid Scams) */

.mega-column a.mega-scam-link:hover {
    color: #fff;
    background: #a3123a;
    padding-left: 18px;
    transform: translateY(-1px);
    box-shadow: 0 14px 28px #b319424d;
}

/* ---------- Hide old unused blocks ---------- */
.mega-menu .mega-intro,
.mega-menu .mega-list {
    display: none;
}

/* ---------- Responsive: 980px and below ---------- */
@media (width<=980px) {
    .mega-menu {
        display: none;
        visibility: visible;
        position: static;
        border-radius: 12px;
        border: 1px solid #e4ebf5;
        border-top: 4px solid var(--red);
        padding: 20px 22px 18px;
        margin-top: 8px;
        opacity: 1;
        pointer-events: auto;
        transform: none;
        box-shadow: 0 12px 30px #172b5814;
    }

    .mega-top {
        margin: -20px -22px 18px;
        padding: 14px 22px;
    }

    .mega-top-link {
        font-size: 17px;
    }

    /* 3 columns → 1 column on mobile */
    .mega-columns {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .mega-column h4 {
        font-size: 15px;
    }

    .mega-column a {
        font-size: 14px;
        padding: 8px 6px;
    }
}

/* ============================================
   HERO SEARCH — Centered, USPTO.gov style
   ============================================ */

.hero-search {
    background: linear-gradient(180deg, #f7f9fc 0%, #ffffff 100%);
    border-bottom: 1px solid #e5eaf0;
    padding: clamp(64px, 8vw, 80px) clamp(24px, 5vw, 80px) 80px;
}

.hero-search-inner {
    max-width: 780px;
    margin: 0 auto;
    text-align: center;
}

.hero-search-eyebrow {
    display: inline-block;
    color: var(--red);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.hero-search h1 {
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: clamp(38px, 5vw, 62px);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.028em;
    margin: 0 0 20px;
}

.hero-search p {
    color: var(--muted);
    font-size: 18px;
    line-height: 1.7;
    max-width: 620px;
    margin: 0 auto 40px;
}

/* Search bar */
.hero-search-form {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    background: #fff;
    border: 2px solid #d0d8e6;
    border-radius: 14px;
    padding: 8px 8px 8px 18px;
    max-width: 720px;
    margin: 0 auto;
    box-shadow: 0 18px 44px #172b5814;
    transition: border-color .18s, box-shadow .18s;
}

.hero-search-form:focus-within {
    border-color: var(--navy);
    box-shadow: 0 18px 44px #172b5829;
}

.hero-search-icon {
    color: #667085;
    display: grid;
    place-items: center;
    margin-right: 12px;
}

.hero-search-form input {
    border: 0;
    outline: 0;
    background: transparent;
    font: inherit;
    font-size: 16px;
    font-weight: 600;
    color: var(--ink);
    padding: 14px 0;
    min-width: 0;
    width: 100%;
}

.hero-search-form input::placeholder {
    color: #98a2b3;
    font-weight: 500;
}

.hero-search-form button {
    background: var(--red);
    color: #fff;
    border: 0;
    border-radius: 10px;
    padding: 0 24px;
    min-height: 52px;
    font-size: 15px;
    font-weight: 900;
    cursor: pointer;
    white-space: nowrap;
    transition: background .18s, transform .18s;
}

.hero-search-form button:hover {
    background: #9f1540;
    transform: translateY(-1px);
}

/* Popular links */
.hero-search-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 18px;
    margin-top: 20px;
    font-size: 13px;
}

.hero-search-links span {
    color: #98a2b3;
    font-weight: 700;
}

.hero-search-links a {
    color: #1a4586;
    font-weight: 800;
    text-decoration: none;
    border-bottom: 1px solid #d0d8e6;
    padding-bottom: 1px;
    transition: color .15s, border-color .15s;
}

.hero-search-links a:hover {
    color: var(--red);
    border-color: var(--red);
}

/* Quick cards below */
.hero-search-cards {
    max-width: 1180px;
    margin: 64px auto 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.hero-search-card {
    background: #fff;
    border: 1px solid #e5eaf0;
    border-radius: 14px;
    padding: 28px 26px;
    text-decoration: none;
    display: block;
    transition: border-color .18s, box-shadow .18s, transform .18s;
}

.hero-search-card:hover {
    border-color: #c4d3ea;
    transform: translateY(-3px);
    box-shadow: 0 20px 44px #172b581f;
}

.hero-search-card-icon {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #eaf2ff;
    color: var(--navy);
    font-family: var(--font-heading);
    font-weight: 900;
    font-size: 14px;
    margin-bottom: 18px;
}

.hero-search-card h3 {
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 800;
    margin: 0 0 10px;
    line-height: 1.2;
}

.hero-search-card p {
    color: var(--muted);
    font-size: 15px;
    line-height: 1.55;
    margin: 0 0 18px;
    text-align: left;
}

.hero-search-card-link {
    color: var(--red);
    font-size: 14px;
    font-weight: 900;
}

/* Responsive */
@media (width <=900px) {
    .hero-search-cards {
        grid-template-columns: 1fr;
    }
}

@media (width <=640px) {
    .hero-search-form {
        grid-template-columns: auto 1fr;
        padding: 8px 8px 8px 14px;
    }

    .hero-search-form button {
        grid-column: 1 / -1;
        margin-top: 8px;
    }

    .hero-search h1 {
        font-size: 34px;
    }
}

/* ============================================
   TRUST BENTO — Modern grid with icons
   ============================================ */

.trust-bento {
    padding: 92px clamp(20px, 5vw, 72px);
    background: #f7f9fc;
}

.trust-bento-heading {
    max-width: 780px;
    margin: 0 0 48px;
}

.trust-bento-heading h2 {
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -.02em;
    margin: 14px 0 14px;
}

.trust-bento-heading p {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.6;
    margin: 0;
}

.trust-bento-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    max-width: 1180px;
    margin: 0 auto;
}

/* Large feature card spans 2 cols */
.trust-card--lg {
    grid-column: span 2;
    grid-row: span 1;
    background: linear-gradient(135deg, #ffffff 0%, #f3f7fd 100%);
}

.trust-card {
    background: #fff;
    border: 1px solid #e5eaf0;
    border-radius: 16px;
    padding: 30px 28px;
    transition: border-color .18s, transform .18s, box-shadow .18s;
    display: flex;
    flex-direction: column;
}

.trust-card:hover {
    border-color: #c4d3ea;
    transform: translateY(-3px);
    box-shadow: 0 20px 44px #172b581a;
}

/* Accent card (last one) */
.trust-card--accent {
    background: linear-gradient(135deg, var(--navy) 0%, #102a5a 100%);
    border-color: var(--navy);
}

.trust-card--accent h3 {
    color: #fff;
}

.trust-card--accent p {
    color: #ffffffb8;
}

/* Icon box */
.trust-icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: #eaf2ff;
    color: var(--navy);
    margin-bottom: 22px;
}

.trust-icon svg {
    width: 24px;
    height: 24px;
}

.trust-icon--light {
    background: #ffffff1a;
    color: #fff;
    border: 1px solid #ffffff26;
}

/* Typography */
.trust-card h3 {
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: 19px;
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 10px;
    letter-spacing: -.01em;
}

.trust-card p {
    color: var(--muted);
    font-size: 15px;
    line-height: 1.6;
    margin: 0;
    flex: 1;
}

/* Responsive */
@media (width <=980px) {
    .trust-bento-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .trust-card--lg {
        grid-column: span 2;
    }
}

@media (width <=640px) {
    .trust-bento {
        padding: 60px 20px;
    }

    .trust-bento-grid {
        grid-template-columns: 1fr;
    }

    .trust-card--lg {
        grid-column: span 1;
    }
}

/* ============================================
   TRUST SPLIT — Sticky heading + numbered list
   ============================================ */

.trust-split {
    background: #f7f9fc;
    padding: 100px clamp(20px, 5vw, 72px);
}

.trust-split-inner {
    display: grid;
    grid-template-columns: minmax(320px, .8fr) minmax(0, 1.2fr);
    gap: clamp(40px, 7vw, 96px);
    max-width: 1240px;
    margin: 0 auto;
    align-items: start;
}

/* Left — sticky heading */
.trust-split-aside {
    position: sticky;
    top: 130px;
    max-width: 440px;
}

.trust-split-aside h2 {
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: clamp(30px, 3.8vw, 46px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -.022em;
    margin: 14px 0 18px;
}

.trust-split-aside p {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.65;
    margin: 0 0 28px;
}

.trust-split-cta {
    color: var(--red);
    font-size: 15px;
    font-weight: 900;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    padding-bottom: 2px;
    transition: border-color .18s, color .18s;
}

.trust-split-cta:hover {
    color: var(--navy);
    border-color: var(--navy);
}

/* Right — list */
.trust-split-list {
    display: grid;
    gap: 0;
}

.trust-row {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    align-items: start;
    gap: 24px;
    padding: 32px 0;
    border-bottom: 1px solid #dbe4f0;
    transition: padding-left .22s ease;
}

.trust-row:last-child {
    border-bottom: 0;
}

.trust-row:hover {
    padding-left: 12px;
}

.trust-row:hover .trust-row-num {
    color: var(--red);
    border-color: var(--red);
}

/* Number */
.trust-row-num {
    font-family: var(--font-heading);
    font-size: 34px;
    font-weight: 900;
    line-height: 1;
    color: #c4d3ea;
    letter-spacing: -.03em;
    border-top: 2px solid #c4d3ea;
    padding-top: 16px;
    transition: color .22s, border-color .22s;
}

.trust-row-body h3 {
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -.01em;
    margin: 0 0 8px;
}

.trust-row-body p {
    color: var(--muted);
    font-size: 15px;
    line-height: 1.65;
    margin: 0;
    max-width: 540px;
}

@media (width <=900px) {
    .trust-split {
        padding: 64px 20px;
    }

    .trust-split-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .trust-split-aside {
        position: static;
        max-width: none;
    }

    .trust-row {
        grid-template-columns: 56px minmax(0, 1fr);
        gap: 18px;
        padding: 26px 0;
    }

    .trust-row-num {
        font-size: 26px;
        padding-top: 12px;
    }

    .trust-row-body h3 {
        font-size: 18px;
    }
}

/* ============================================
   REG US — Full-width action banner
   ============================================ */

.reg-us {
    position: relative;
    padding: clamp(64px, 8vw, 110px) clamp(24px, 5vw, 80px);
    background:
        radial-gradient(circle at 15% 20%, #b3194224, transparent 42%),
        radial-gradient(circle at 88% 82%, #1f4e8c29, transparent 44%),
        linear-gradient(135deg, #071a43 0%, #172b58 100%);
    color: #fff;
    overflow: hidden;
    isolation: isolate;
}

.reg-us:before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(#ffffff08 1px, transparent 1px),
        linear-gradient(90deg, #ffffff08 1px, transparent 1px);
    background-size: 52px 52px;
    z-index: 0;
    -webkit-mask-image: linear-gradient(90deg, #0000009e, #0000 88%);
    mask-image: linear-gradient(90deg, #0000009e, #0000 88%);
}

.reg-us-inner {
    position: relative;
    z-index: 1;
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, .9fr);
    gap: clamp(40px, 6vw, 88px);
    align-items: center;
}

/* Left copy */
.reg-us-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #ffb3ba;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.reg-us-kicker:before {
    content: "";
    width: 28px;
    height: 2px;
    background: currentColor;
}

.reg-us-copy h2 {
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(32px, 4.2vw, 52px);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.028em;
    margin: 0 0 22px;
    max-width: 620px;
}

.reg-us-copy p {
    color: #ffffffd1;
    font-size: 17px;
    line-height: 1.7;
    margin: 0 0 32px;
    max-width: 560px;
}

.reg-us-points {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 14px;
    max-width: 540px;
}

.reg-us-points li {
    color: #ffffffec;
    font-size: 15.5px;
    font-weight: 600;
    line-height: 1.5;
    padding-left: 30px;
    position: relative;
}

.reg-us-points li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #b31942;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 8.5 6.5 12 13 4.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 12px;
    box-shadow: 0 0 0 3px #b3194226;
}

/* Right card */
.reg-us-card {
    background: #fff;
    color: var(--navy);
    border-radius: 20px;
    padding: 36px 32px;
    box-shadow: 0 30px 80px #00000038;
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative;
}

.reg-us-card-label {
    color: #667085;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.reg-us-card strong {
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: 56px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -.035em;
    display: block;
}

.reg-us-card p {
    color: #667085;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
    margin: 0;
}

.reg-us-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 54px;
    margin-top: 14px;
    padding: 0 26px;
    background: var(--red);
    color: #fff;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 900;
    text-decoration: none;
    transition: background .18s, transform .18s, box-shadow .18s;
    box-shadow: 0 14px 30px #b319423d;
}

.reg-us-btn span {
    font-size: 18px;
    line-height: 1;
    transition: transform .18s;
}

.reg-us-btn:hover {
    background: #9f1540;
    transform: translateY(-2px);
    box-shadow: 0 18px 40px #b319424d;
}

.reg-us-btn:hover span {
    transform: translateX(4px);
}

.reg-us-card small {
    color: #98a2b3;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    margin-top: 4px;
}

/* Responsive */
@media (width <=900px) {
    .reg-us-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .reg-us-copy h2 {
        font-size: 34px;
    }

    .reg-us-card strong {
        font-size: 46px;
    }
}

/* ============================================
   SVC ROWS — Horizontal numbered list
   ============================================ */

.svc-rows {
    padding: 92px clamp(20px, 5vw, 72px);
    background: #fff;
    border-top: 1px solid #e5eaf0;
    border-bottom: 1px solid #e5eaf0;
}

.svc-rows-heading {
    max-width: 780px;
    margin: 0 auto 52px;
    text-align: center;
}

.svc-rows-heading h2 {
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -.024em;
    margin: 14px 0 14px;
}

.svc-rows-heading p {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.6;
    margin: 0;
}

.svc-rows-list {
    max-width: 1180px;
    margin: 0 auto;
    border-top: 1px solid #e5eaf0;
}

/* Row */
.svc-row {
    display: grid;
    grid-template-columns: 72px 68px minmax(0, 1fr) auto;
    gap: 28px;
    align-items: center;
    padding: 32px 0;
    border-bottom: 1px solid #e5eaf0;
    transition: padding-left .22s ease;
    position: relative;
}

.svc-row:hover {
    padding-left: 14px;
}

.svc-row:hover .svc-row-num {
    color: var(--red);
}

.svc-row:hover .svc-row-icon {
    background: var(--red);
    color: #fff;
    border-color: var(--red);
    transform: rotate(-6deg) scale(1.05);
}

.svc-row:hover .svc-row-link {
    background: var(--red);
    color: #fff;
    border-color: var(--red);
}

.svc-row-num {
    font-family: var(--font-heading);
    font-size: 38px;
    font-weight: 900;
    line-height: 1;
    color: #c4d3ea;
    letter-spacing: -.035em;
    transition: color .22s;
}

.svc-row-icon {
    display: grid;
    place-items: center;
    width: 60px;
    height: 60px;
    border-radius: 14px;
    background: #eaf2ff;
    color: var(--navy);
    border: 1px solid #d5e2f5;
    transition: all .25s ease;
}

.svc-row-icon svg {
    width: 26px;
    height: 26px;
}

.svc-row-body h3 {
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -.012em;
    margin: 0 0 8px;
}

.svc-row-body p {
    color: var(--muted);
    font-size: 15px;
    line-height: 1.6;
    margin: 0;
    max-width: 620px;
}

/* Link button */
.svc-row-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 22px;
    background: transparent;
    color: var(--navy);
    border: 1.5px solid #d0d8e6;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
    white-space: nowrap;
    transition: all .22s ease;
}

.svc-row-link span {
    font-size: 16px;
    line-height: 1;
    transition: transform .22s;
}

.svc-row-link:hover span {
    transform: translateX(4px);
}

/* Responsive */
@media (width <=900px) {
    .svc-rows {
        padding: 64px 22px;
    }

    .svc-row {
        grid-template-columns: 48px 56px minmax(0, 1fr);
        gap: 16px;
        padding: 26px 0;
    }

    .svc-row-link {
        grid-column: 1 / -1;
        justify-self: start;
        margin-top: 12px;
    }

    .svc-row-num {
        font-size: 26px;
    }

    .svc-row-icon {
        width: 48px;
        height: 48px;
        border-radius: 12px;
    }

    .svc-row-icon svg {
        width: 22px;
        height: 22px;
    }

    .svc-row-body h3 {
        font-size: 18px;
    }

    .svc-row-body p {
        font-size: 14px;
    }
}

/* ============================================
   AMZ SPLIT — Split copy + side panel
   ============================================ */

.amz-split {
    position: relative;
    padding: 100px clamp(24px, 5vw, 80px);
    background:
        radial-gradient(circle at 15% 20%, #b319421a, transparent 42%),
        radial-gradient(circle at 88% 78%, #1f4e8c24, transparent 44%),
        linear-gradient(135deg, #071a43 0%, #172b58 100%);
    color: #fff;
    overflow: hidden;
    isolation: isolate;
}

.amz-split:before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(#ffffff08 1px, transparent 1px),
        linear-gradient(90deg, #ffffff08 1px, transparent 1px);
    background-size: 52px 52px;
    z-index: 0;
    -webkit-mask-image: linear-gradient(90deg, #0000009e, #0000 88%);
    mask-image: linear-gradient(90deg, #0000009e, #0000 88%);
}

.amz-split-inner {
    position: relative;
    z-index: 1;
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, .85fr);
    gap: clamp(40px, 6vw, 88px);
    align-items: center;
}

/* Left copy */
.amz-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #ffb3ba;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.amz-eyebrow:before {
    content: "";
    width: 28px;
    height: 2px;
    background: currentColor;
}

.amz-copy h2 {
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(30px, 3.8vw, 46px);
    font-weight: 900;
    line-height: 1.06;
    letter-spacing: -.026em;
    margin: 0 0 20px;
    max-width: 580px;
}

.amz-copy>p {
    color: #ffffffc4;
    font-size: 17px;
    line-height: 1.7;
    margin: 0 0 40px;
    max-width: 560px;
}

/* Checklist */
.amz-checklist {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 22px;
    max-width: 620px;
}

.amz-checklist li {
    display: grid;
    grid-template-columns: 32px 1fr;
    gap: 18px;
    align-items: start;
    padding-bottom: 22px;
    border-bottom: 1px solid #ffffff1a;
}

.amz-checklist li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.amz-check {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #b31942;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 8.5 6.5 12 13 4.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px;
    box-shadow: 0 0 0 4px #b3194226;
    flex: none;
}

.amz-checklist strong {
    display: block;
    color: #fff;
    font-family: var(--font-heading);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.25;
    margin-bottom: 6px;
    letter-spacing: -.005em;
}

.amz-checklist small {
    display: block;
    color: #ffffff9e;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.55;
}

/* Right side panel */
.amz-side {
    background: #fff;
    color: var(--navy);
    border-radius: 20px;
    padding: 36px 32px 30px;
    box-shadow: 0 30px 80px #00000038;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

.amz-side:before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    background: linear-gradient(90deg, var(--red), #172b58);
}

.amz-side-tag {
    display: inline-block;
    color: #1f4e8c;
    background: #eaf2ff;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    width: fit-content;
    margin-bottom: 20px;
}

.amz-side-price span {
    display: block;
    color: #667085;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-bottom: 6px;
}

.amz-side-price strong {
    display: block;
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: 54px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -.035em;
}

.amz-side-price small {
    display: block;
    color: #98a2b3;
    font-size: 12px;
    font-weight: 600;
    margin-top: 8px;
}

.amz-side-list {
    list-style: none;
    padding: 20px 0;
    margin: 20px 0;
    border-top: 1px solid #e5eaf0;
    border-bottom: 1px solid #e5eaf0;
    display: grid;
    gap: 12px;
}

.amz-side-list li {
    color: #344054;
    font-size: 14px;
    font-weight: 700;
    padding-left: 26px;
    position: relative;
    line-height: 1.4;
}

.amz-side-list li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #eaf2ff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%231a4586' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 8.5 6.5 12 13 4.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 11px;
}

.amz-side-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 54px;
    padding: 0 26px;
    background: var(--red);
    color: #fff;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 900;
    text-decoration: none;
    box-shadow: 0 14px 30px #b319423d;
    transition: transform .18s, box-shadow .18s, background .18s;
}

.amz-side-btn span {
    font-size: 18px;
    line-height: 1;
    transition: transform .18s;
}

.amz-side-btn:hover {
    background: #9f1540;
    transform: translateY(-2px);
    box-shadow: 0 18px 40px #b319424d;
}

.amz-side-btn:hover span {
    transform: translateX(4px);
}

.amz-side-note {
    display: block;
    color: #98a2b3;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    text-align: center;
    margin-top: 14px;
}

/* Responsive */
@media (width <=900px) {
    .amz-split {
        padding: 64px 22px;
    }

    .amz-split-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .amz-side {
        padding: 30px 24px 26px;
    }

    .amz-side-price strong {
        font-size: 46px;
    }

    .amz-copy h2 {
        font-size: 30px;
    }
}

/* ============================================
   PR TABLE — Comparison table pricing
   ============================================ */

.pr-table {
    padding: 100px clamp(20px, 5vw, 72px);
    background: #f7f9fc;
    border-top: 1px solid #e5eaf0;
    border-bottom: 1px solid #e5eaf0;
}

.pr-table-head {
    max-width: 780px;
    margin: 0 auto 52px;
    text-align: center;
}

.pr-table-head h2 {
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -.024em;
    margin: 14px 0 14px;
}

.pr-table-head p {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.6;
    margin: 0;
}

.pr-table-wrap {
    max-width: 1080px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #e5eaf0;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 24px 60px #172b5814;
}

.pr-table-el {
    width: 100%;
    border-collapse: collapse;
    text-align: center;
}

.pr-table-el th,
.pr-table-el td {
    padding: 18px 20px;
    border-bottom: 1px solid #f0f3f8;
    font-size: 14px;
    vertical-align: middle;
}

/* Header */
.pr-table-el thead th {
    background: #f8fafd;
    padding: 28px 20px;
    vertical-align: top;
}

.pr-feature-col {
    text-align: left !important;
    color: #667085 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: .12em;
    text-transform: uppercase;
    background: #fff !important;
    width: 38%;
}

.pr-plan-name {
    display: block;
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 12px;
}

.pr-plan-price {
    display: block;
    color: var(--navy);
    font-family: var(--font-heading);
    font-size: 40px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -.035em;
    margin-bottom: 6px;
}

.pr-plan-price del {
    color: #b0b7c3;
    font-size: 18px;
    font-weight: 700;
    margin-right: 8px;
    text-decoration-thickness: 1.5px;
}

.pr-plan-note {
    display: block;
    color: #98a2b3;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
}

/* Featured column */
.pr-plan-featured {
    background: #f8faff !important;
    position: relative;
}

.pr-plan-featured .pr-plan-name {
    color: var(--red);
}

.pr-plan-badge {
    display: inline-block;
    background: var(--red);
    color: #fff;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 999px;
    margin-bottom: 12px;
}

/* Body cells */
.pr-table-el tbody td {
    color: #344054;
    font-weight: 600;
}

.pr-table-el tbody td:first-child {
    text-align: left;
    color: var(--navy);
    font-weight: 700;
}

.pr-table-el tbody tr:nth-child(even) td {
    background: #fbfcfe;
}

.pr-table-el tbody tr:nth-child(even) .pr-plan-featured {
    background: #f2f7fd !important;
}

.pr-table-el tbody tr:hover td {
    background: #f5f8fd;
}

.pr-table-el tbody tr:hover .pr-plan-featured {
    background: #edf3fd !important;
}

/* Footer buttons */
.pr-table-el tfoot td {
    padding: 24px 20px;
    border-bottom: 0;
    background: #f8fafd;
}

.pr-table-el tfoot tr:hover td {
    background: #f8fafd;
}

.pr-table-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 22px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
    background: #fff;
    color: var(--navy);
    border: 1.5px solid #d0d8e6;
    transition: all .18s;
    width: 100%;
}

.pr-table-btn:hover {
    border-color: var(--navy);
    background: #f5f8fd;
}

.pr-table-btn--solid {
    background: var(--red);
    color: #fff;
    border-color: var(--red);
    box-shadow: 0 12px 26px #b3194233;
}

.pr-table-btn--solid:hover {
    background: #9f1540;
    border-color: #9f1540;
    transform: translateY(-1px);
    box-shadow: 0 16px 34px #b319424d;
}

/* Responsive */
@media (width <=900px) {
    .pr-table {
        padding: 64px 20px;
    }

    .pr-table-wrap {
        overflow-x: auto;
    }

    .pr-table-el {
        min-width: 720px;
    }
}

/* ============================================
   USPTO FOOTER — 3-tier government style
   ============================================ */

.uspt-footer {
    font-family: var(--font-sans, "Inter", "Segoe UI", sans-serif);
}

.uspt-footer .uspt-footer-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 clamp(20px, 5vw, 60px);
}

/* ---------- TIER 1: Feedback row ---------- */
.uspt-footer-feedback {
    background: #fff;
    border-top: 1px solid #e5eaf0;
    border-bottom: 1px solid #e5eaf0;
    padding: 22px 0;
}

.uspt-footer-feedback .uspt-footer-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 32px;
    flex-wrap: wrap;
}

.uspt-feedback-left {
    display: flex;
    align-items: center;
    gap: 16px;
    color: #1b1b1b;
    font-size: 15px;
    font-weight: 600;
}

.uspt-feedback-btn {
    background: transparent;
    border: 1.5px solid #005ea2;
    color: #005ea2;
    border-radius: 4px;
    width: 40px;
    height: 36px;
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: background .15s, color .15s;
}

.uspt-feedback-btn svg {
    width: 20px;
    height: 20px;
}

.uspt-feedback-btn:hover {
    background: #005ea2;
    color: #fff;
}

.uspt-feedback-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}

.uspt-feedback-actions {
    display: flex;
    align-items: center;
    gap: 24px;
}

.uspt-feedback-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    border: 0;
    color: #1b1b1b;
    font: inherit;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    padding: 0;
}

.uspt-feedback-link svg {
    color: #005ea2;
}

.uspt-feedback-link:hover {
    color: #005ea2;
}

.uspt-feedback-info {
    color: #005ea2;
    font-size: 14px;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.uspt-feedback-info:hover {
    color: #1a4480;
}

/* ---------- TIER 2: Gray links + newsletter ---------- */
.uspt-footer-mid {
    background: #f0f0f0;
    padding: 48px 0;
}

.uspt-footer-mid .uspt-footer-inner {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 1fr);
    gap: 60px;
    align-items: start;
}

/* Quick links row */
.uspt-footer-quicklinks {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    padding-bottom: 24px;
    margin-bottom: 24px;
    border-bottom: 1px solid #c5c5c5;
}

.uspt-footer-quicklinks a {
    color: #1b1b1b;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transition: color .15s;
}

.uspt-footer-quicklinks a:hover {
    color: #005ea2;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.uspt-footer-quicklinks span {
    color: #71767a;
    font-weight: 700;
}

/* Legal links two-column grid */
.uspt-footer-legal-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 40px;
}

.uspt-footer-legal-grid a {
    color: #1b1b1b;
    font-size: 14.5px;
    font-weight: 500;
    line-height: 1.5;
    text-decoration: none;
    padding: 4px 0;
    transition: color .15s, text-decoration .15s;
}

.uspt-footer-legal-grid a:hover {
    color: #005ea2;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Newsletter block */
.uspt-footer-mid-right h3 {
    color: #1b1b1b;
    font-family: var(--font-heading, sans-serif);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 10px;
    letter-spacing: -.005em;
}

.uspt-footer-mid-right p {
    color: #5d5d5d;
    font-size: 14px;
    line-height: 1.5;
    margin: 0 0 16px;
}

.uspt-newsletter {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0;
    max-width: 520px;
}

.uspt-newsletter input {
    border: 1px solid #71767a;
    border-right: 0;
    background: #fff;
    color: #1b1b1b;
    padding: 12px 16px;
    font: inherit;
    font-size: 15px;
    outline: none;
    min-width: 0;
    border-radius: 0;
}

.uspt-newsletter input:focus {
    box-shadow: 0 0 0 2px #005ea233;
    border-color: #005ea2;
}

.uspt-newsletter input::placeholder {
    color: #71767a;
}

.uspt-newsletter button {
    background:#162e51;
    color: #fff;
    border: 1px solid #005ea2;
    padding: 0 26px;
    font: inherit;
    font-size: 15px;
    font-weight: 800;
    cursor: pointer;
    letter-spacing: .02em;
    transition: background .15s;
    border-radius: 0;
}

.uspt-newsletter button:hover {
    background: #1a4480;
    border-color: #1a4480;
}

/* ---------- TIER 3: Black bottom bar ---------- */
.uspt-footer-bottom {
    background: #000;
    padding: 26px 0;
}

.uspt-footer-bottom .uspt-footer-inner {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 30px;
    align-items: center;
}

/* Logo */
.uspt-footer-logo {
    display: flex;
    align-items: center;
    gap: 14px;
    text-decoration: none;
}

.uspt-footer-wordmark {
    display: inline-block;
    background: #fff;
    color: #000;
    font-family: var(--font-heading, sans-serif);
    font-size: 18px;
    font-weight: 900;
    padding: 8px 14px;
    border-radius: 4px;
    letter-spacing: -.01em;
    line-height: 1;
}

.uspt-footer-logo-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.uspt-footer-logo-text strong {
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    line-height: 1;
}

.uspt-footer-logo-text small {
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    line-height: 1;
}

/* Right side — Follow us + socials */
.uspt-footer-bottom-right {
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: center;
}

.uspt-follow-label {
    color: #fff;
    font-size: 15px;
    font-weight: 700;
}

.uspt-footer-social {
    display: flex;
    align-items: center;
    gap: 12px;
}

.uspt-footer-social a {
    color: #fff;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    transition: color .15s, transform .15s;
    text-decoration: none;
}

.uspt-footer-social a svg {
    width: 26px;
    height: 26px;
}

.uspt-footer-social a:hover {
    color: #55b7ff;
    transform: translateY(-2px);
}

/* Back to top */
.uspt-back-to-top {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #162e51;
    color: #fff;
    padding: 10px 16px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    letter-spacing: .02em;
    transition: background .15s;
    white-space: nowrap;
}

.uspt-back-to-top:hover {
    background: #1a4480;
}

.uspt-back-to-top svg {
    margin-left: 2px;
}

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
    .uspt-footer-mid .uspt-footer-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .uspt-footer-bottom .uspt-footer-inner {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
        gap: 22px;
    }

    .uspt-footer-bottom-right {
        flex-direction: column;
        gap: 12px;
    }

    .uspt-feedback-right {
        align-items: flex-start;
    }
}

@media (max-width: 640px) {
    .uspt-footer-feedback .uspt-footer-inner {
        flex-direction: column;
        align-items: flex-start;
    }

    .uspt-feedback-actions {
        flex-wrap: wrap;
        gap: 16px;
    }

    .uspt-footer-legal-grid {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .uspt-newsletter {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .uspt-newsletter input {
        border-right: 1px solid #71767a;
    }

    .uspt-newsletter button {
        padding: 14px 24px;
    }

    .uspt-footer-mid-right h3 {
        font-size: 18px;
    }
}

/* ============================================
   USPTO ABOUT PAGE — Minimal
   ============================================ */

.uspt-about-page {
    padding: 60px 0 100px;
    background: #fff;
    font-family: var(--font-sans);
}

.uspt-about-page .uspt-container {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 clamp(20px, 5vw, 64px);
}

.uspt-about-page h1 {
    color: var(--uswds-navy, #112e51);
    font-family: var(--font-heading);
    font-size: clamp(36px, 5vw, 56px);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.02em;
    margin: 0 0 32px;
    padding-bottom: 22px;
    border-bottom: 4px solid var(--uswds-red, #d83933);
    max-width: 900px;
}

.uspt-about-lead {
    color: #1b1b1b;
    font-size: 19px;
    line-height: 1.75;
    margin: 0 0 56px;
    max-width: 860px;
}

/* Link cards — simple list style */
.uspt-about-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid var(--uswds-border, #dfe1e2);
    border-left: 1px solid var(--uswds-border, #dfe1e2);
    max-width: 900px;
}

.uspt-about-cards a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 26px 28px;
    border-right: 1px solid var(--uswds-border, #dfe1e2);
    border-bottom: 1px solid var(--uswds-border, #dfe1e2);
    color: var(--uswds-navy, #112e51);
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -.005em;
    text-decoration: none;
    transition: background .15s, color .15s;
}

.uspt-about-cards a span {
    color: #005ea2;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    transition: transform .18s;
    flex: none;
}

.uspt-about-cards a:hover {
    background: #f8fafd;
    color: #005ea2;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.uspt-about-cards a:hover span {
    transform: translateX(6px);
}

/* Responsive */
@media (max-width: 640px) {
    .uspt-about-page {
        padding: 40px 0 64px;
    }

    .uspt-about-page h1 {
        font-size: 34px;
        padding-bottom: 18px;
        margin-bottom: 24px;
    }

    .uspt-about-lead {
        font-size: 17px;
        margin-bottom: 40px;
    }

    .uspt-about-cards {
        grid-template-columns: 1fr;
    }

    .uspt-about-cards a {
        padding: 20px 20px;
        font-size: 17px;
    }
}

/* ============================================
   USPTO CONTACT PAGE
   ============================================ */

.uspt-contact-page {
    padding: 60px 0 100px;
    background: #fff;
    font-family: var(--font-sans);
}

.uspt-contact-page .uspt-container {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 clamp(20px, 5vw, 64px);
}

.uspt-contact-page h1 {
    color: var(--uswds-navy, #112e51);
    font-family: var(--font-heading);
    font-size: clamp(36px, 5vw, 56px);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.02em;
    margin: 0 0 32px;
    padding-bottom: 22px;
    border-bottom: 4px solid var(--uswds-red, #d83933);
    max-width: 900px;
}

.uspt-contact-lead {
    color: #1b1b1b;
    font-size: 19px;
    line-height: 1.75;
    margin: 0 0 56px;
    max-width: 860px;
}

/* ---------- Contact info cards ---------- */
.uspt-contact-cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid var(--uswds-border, #dfe1e2);
    border-left: 1px solid var(--uswds-border, #dfe1e2);
    margin-bottom: 64px;
}

.uspt-contact-card {
    padding: 28px 24px;
    border-right: 1px solid var(--uswds-border, #dfe1e2);
    border-bottom: 1px solid var(--uswds-border, #dfe1e2);
    background: #fff;
}

.uspt-contact-card h2 {
    color: var(--uswds-navy, #112e51);
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -.005em;
    margin: 0 0 10px;
}

.uspt-contact-card p {
    color: #5d5d5d;
    font-size: 14.5px;
    line-height: 1.55;
    margin: 0 0 14px;
}

.uspt-contact-card a {
    color: #005ea2;
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    padding-bottom: 2px;
    transition: border-color .15s;
}

.uspt-contact-card a:hover {
    border-color: #005ea2;
}

/* ---------- Contact form ---------- */
.uspt-contact-form-block {
    max-width: 780px;
    border-top: 4px solid var(--uswds-navy, #112e51);
    padding-top: 28px;
}

.uspt-contact-form-block h2 {
    color: var(--uswds-navy, #112e51);
    font-family: var(--font-heading);
    font-size: 28px;
    font-weight: 900;
    letter-spacing: -.012em;
    margin: 0 0 10px;
}

.uspt-contact-form-block>p {
    color: #5d5d5d;
    font-size: 16px;
    line-height: 1.6;
    margin: 0 0 32px;
}

.uspt-contact-form {
    display: grid;
    gap: 20px;
}

.uspt-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.uspt-contact-form label {
    display: grid;
    gap: 8px;
    color: var(--uswds-navy, #112e51);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .02em;
}

.uspt-contact-form input,
.uspt-contact-form select,
.uspt-contact-form textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #71767a;
    border-radius: 2px;
    background: #fff;
    font: inherit;
    font-size: 15px;
    color: var(--uswds-text, #1b1b1b);
    outline: none;
    transition: border-color .15s, box-shadow .15s;
}

.uspt-contact-form textarea {
    resize: vertical;
    min-height: 120px;
    font-family: var(--font-sans);
}

.uspt-contact-form input:focus,
.uspt-contact-form select:focus,
.uspt-contact-form textarea:focus {
    border-color: #005ea2;
    box-shadow: 0 0 0 3px #005ea233;
}

.uspt-contact-form button {
    background: var(--uswds-red, #d83933);
    color: #fff;
    border: 0;
    padding: 14px 32px;
    font: inherit;
    font-size: 15px;
    font-weight: 900;
    letter-spacing: .02em;
    cursor: pointer;
    justify-self: start;
    border-radius: 2px;
    transition: background .15s;
}

.uspt-contact-form button:hover {
    background: #a4113a;
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
    .uspt-contact-cards {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .uspt-contact-page h1 {
        font-size: 34px;
        padding-bottom: 18px;
        margin-bottom: 24px;
    }

    .uspt-contact-lead {
        font-size: 17px;
        margin-bottom: 40px;
    }

    .uspt-contact-cards {
        grid-template-columns: 1fr;
        margin-bottom: 48px;
    }

    .uspt-form-row {
        grid-template-columns: 1fr;
    }

    .uspt-contact-form-block h2 {
        font-size: 24px;
    }

    .uspt-contact-form button {
        width: 100%;
        justify-self: stretch;
    }
}

/* ============================================================
   PRICING PAGE — Self-contained USPTO style
   ============================================================ */

.uspt-wrap {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 clamp(20px, 5vw, 64px);
}

/* ---------- Page hero ---------- */
.uspt-simple-hero {
    background: #fff;
    padding: 48px 0 40px;
    border-bottom: 1px solid #dfe1e2;
}

.uspt-crumb {
    display: flex;
    gap: 10px;
    color: #71767a;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 28px;
}

.uspt-crumb a {
    color: #005ea2;
    text-decoration: none;
}

.uspt-crumb a:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.uspt-simple-hero h1 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: clamp(36px, 5vw, 54px);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.02em;
    margin: 0 0 24px;
    padding-bottom: 22px;
    border-bottom: 4px solid #d83933;
    max-width: 900px;
}

.uspt-simple-hero p {
    color: #1b1b1b;
    font-size: 18px;
    line-height: 1.7;
    margin: 0;
    max-width: 860px;
}

/* ---------- Pricing table ---------- */
.uspt-pricing {
    padding: 56px 0 40px;
    background: #fff;
}

.uspt-pricing-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.uspt-price-table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #dfe1e2;
    background: #fff;
    min-width: 720px;
    text-align: center;
}

.uspt-price-table th,
.uspt-price-table td {
    padding: 16px 18px;
    border-bottom: 1px solid #dfe1e2;
    border-right: 1px solid #dfe1e2;
    font-size: 14.5px;
    vertical-align: middle;
}

.uspt-price-table th:last-child,
.uspt-price-table td:last-child {
    border-right: 0;
}

/* Header row */
.uspt-price-table thead th {
    background: #f8f8f8;
    padding: 26px 18px;
    vertical-align: top;
    border-bottom: 2px solid #112e51;
}

.uspt-col-feature {
    text-align: left !important;
    width: 34%;
    color: #5d5d5d !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: .12em;
    text-transform: uppercase;
    background: #fff !important;
    border-bottom-color: #dfe1e2 !important;
}

.uspt-plan-name {
    display: block;
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.uspt-plan-price {
    display: block;
    margin-bottom: 8px;
    line-height: 1;
}

.uspt-plan-price del {
    display: block;
    color: #a3a3a3;
    font-size: 14px;
    font-weight: 700;
    text-decoration-thickness: 1.5px;
    margin-bottom: 6px;
}

.uspt-plan-price strong {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 38px;
    font-weight: 900;
    letter-spacing: -.03em;
    line-height: 1;
}

.uspt-plan-fees {
    display: block;
    color: #71767a;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .02em;
}

/* Featured column */
.uspt-plan-badge {
    display: inline-block;
    background: #d83933;
    color: #fff;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 2px;
    margin-bottom: 12px;
}

/* Body */
.uspt-price-table tbody td:first-child {
    text-align: left;
    color: #112e51;
    font-weight: 700;
    font-size: 14.5px;
}

.uspt-price-table tbody td {
    color: #5d5d5d;
    font-weight: 600;
}

.uspt-price-table tbody tr:nth-child(even) {
    background: #fbfbfb;
}

/* Featured column — no blue tint, subtle header highlight only */
.uspt-price-table thead .uspt-col-featured {
    background: #fafafa !important;
}

.uspt-price-table tbody .uspt-col-featured {
    background: transparent !important;
}

/* Footer */
.uspt-price-table tfoot td {
    background: #f8f8f8;
    border-bottom: 0;
    padding: 24px 18px;
}

.uspt-price-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    padding: 0 18px;
    background: #fff;
    color: #112e51;
    border: 2px solid #112e51;
    border-radius: 2px;
    font-size: 13.5px;
    font-weight: 900;
    letter-spacing: .02em;
    text-decoration: none;
    transition: background .15s, color .15s;
    white-space: nowrap;
}

.uspt-price-btn:hover {
    background: #112e51;
    color: #fff;
}

.uspt-price-btn--solid {
    background: #d83933;
    color: #fff;
    border-color: #d83933;
}

.uspt-price-btn--solid:hover {
    background: #a4113a;
    border-color: #a4113a;
}

.uspt-price-btn--light {
    background: transparent;
    color: #fff;
    border-color: #ffffff8c;
}

.uspt-price-btn--light:hover {
    background: #fff;
    color: #112e51;
    border-color: #fff;
}

/* Table note */
.uspt-price-note {
    margin: 20px 0 0;
    color: #5d5d5d;
    font-size: 13.5px;
    font-style: italic;
    line-height: 1.6;
    font-weight: 600;
}

/* ---------- What's not included ---------- */
.uspt-pr-notes {
    background: #f0f0f0;
    padding: 72px 0;
    border-top: 1px solid #dfe1e2;
    border-bottom: 1px solid #dfe1e2;
}

.uspt-pr-notes h2 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: clamp(26px, 3.2vw, 36px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -.015em;
    margin: 0 0 36px;
    padding-bottom: 18px;
    border-bottom: 4px solid #d83933;
    max-width: 720px;
}

.uspt-pr-notes-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    background: #fff;
    border: 1px solid #dfe1e2;
}

.uspt-pr-note {
    padding: 30px 26px;
    border-right: 1px solid #dfe1e2;
}

.uspt-pr-note:last-child {
    border-right: 0;
}

.uspt-pr-note h3 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 800;
    margin: 0 0 12px;
    letter-spacing: -.005em;
}

.uspt-pr-note p {
    color: #5d5d5d;
    font-size: 15px;
    line-height: 1.6;
    margin: 0;
}

/* ---------- FAQ ---------- */
.uspt-pr-faq {
    background: #fff;
    padding: 72px 0;
}

.uspt-pr-faq h2 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: clamp(26px, 3.2vw, 36px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -.015em;
    margin: 0 0 36px;
    padding-bottom: 18px;
    border-bottom: 4px solid #d83933;
    max-width: 720px;
}

.uspt-pr-faq-list {
    border-top: 1px solid #dfe1e2;
    max-width: 900px;
}

.uspt-pr-faq-list details {
    border-bottom: 1px solid #dfe1e2;
}

.uspt-pr-faq-list summary {
    padding: 22px 60px 22px 0;
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.35;
    cursor: pointer;
    list-style: none;
    position: relative;
    transition: color .15s;
}

.uspt-pr-faq-list summary::-webkit-details-marker {
    display: none;
}

.uspt-pr-faq-list summary:hover {
    color: #d83933;
}

.uspt-pr-faq-list summary:after {
    content: "+";
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    background: #112e51;
    color: #fff;
    border-radius: 50%;
    font-size: 18px;
    line-height: 1;
    transition: background .15s;
}

.uspt-pr-faq-list details[open] summary:after {
    content: "−";
    background: #d83933;
}

.uspt-pr-faq-list details[open] summary {
    color: #d83933;
}

.uspt-pr-faq-list p {
    padding: 0 60px 22px 0;
    color: #5d5d5d;
    font-size: 15.5px;
    line-height: 1.7;
    margin: 0;
}

/* ---------- CTA strip ---------- */
.uspt-pr-cta {
    background: #112e51;
    padding: 52px 0;
}

.uspt-pr-cta-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 32px;
    flex-wrap: wrap;
}

.uspt-pr-cta h2 {
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 900;
    line-height: 1.15;
    margin: 0 0 8px;
    letter-spacing: -.01em;
}

.uspt-pr-cta p {
    color: #ffffffb8;
    font-size: 15.5px;
    line-height: 1.5;
    margin: 0;
}

.uspt-pr-cta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.uspt-pr-cta .uspt-price-btn {
    width: auto;
    min-width: 180px;
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
    .uspt-pr-notes-grid {
        grid-template-columns: 1fr;
    }

    .uspt-pr-note {
        border-right: 0;
        border-bottom: 1px solid #dfe1e2;
    }

    .uspt-pr-note:last-child {
        border-bottom: 0;
    }
}

@media (max-width: 640px) {
    .uspt-simple-hero {
        padding: 32px 0 28px;
    }

    .uspt-simple-hero h1 {
        font-size: 32px;
        padding-bottom: 16px;
        margin-bottom: 18px;
    }

    .uspt-simple-hero p {
        font-size: 16px;
    }

    .uspt-pricing {
        padding: 36px 0 24px;
    }

    .uspt-pr-notes,
    .uspt-pr-faq {
        padding: 48px 0;
    }

    .uspt-pr-cta {
        padding: 40px 0;
    }

    .uspt-pr-cta-inner {
        flex-direction: column;
        text-align: center;
    }

    .uspt-pr-cta-actions {
        width: 100%;
        flex-direction: column;
    }

    .uspt-pr-cta .uspt-price-btn {
        width: 100%;
    }
}

/* ============================================================
   STATES PAGE — USPTO style
   ============================================================ */

/* Reuse .uspt-wrap, .uspt-simple-hero, .uspt-crumb from pricing page */

/* ---------- States grid section ---------- */
.uspt-states {
    padding: 56px 0 64px;
    background: #fff;
    border-bottom: 1px solid #dfe1e2;
}

.uspt-states-head {
    margin-bottom: 32px;
}

.uspt-states-head h2 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: clamp(24px, 3vw, 32px);
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: -.015em;
    margin: 0 0 10px;
}

.uspt-states-head p {
    color: #5d5d5d;
    font-size: 15px;
    line-height: 1.6;
    margin: 0;
}

.uspt-states-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid #dfe1e2;
    border-left: 1px solid #dfe1e2;
}

.uspt-state-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 18px;
    border-right: 1px solid #dfe1e2;
    border-bottom: 1px solid #dfe1e2;
    background: #fff;
    text-decoration: none;
    transition: background .15s;
    position: relative;
}

.uspt-state-card:hover {
    background: #f5f8fd;
}

.uspt-state-card:hover .uspt-state-name {
    color: #005ea2;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.uspt-state-card:hover .uspt-state-arrow {
    opacity: 1;
    transform: translateX(4px);
}

.uspt-state-abbr {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #112e51;
    color: #fff;
    font-family: var(--font-heading);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;
    flex: none;
}

.uspt-state-name {
    color: #112e51;
    font-size: 14.5px;
    font-weight: 700;
    line-height: 1.3;
    flex: 1;
    transition: color .15s;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.uspt-state-arrow {
    color: #005ea2;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    opacity: 0;
    transition: opacity .15s, transform .15s;
    flex: none;
}

/* ---------- Info section ---------- */
.uspt-states-info {
    padding: 72px 0;
    background: #f0f0f0;
}

.uspt-states-info h2 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: clamp(26px, 3.2vw, 36px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -.015em;
    margin: 0 0 36px;
    padding-bottom: 18px;
    border-bottom: 4px solid #d83933;
    max-width: 720px;
}

.uspt-states-info-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    background: #fff;
    border: 1px solid #dfe1e2;
}

.uspt-states-info-card {
    padding: 30px 26px;
    border-right: 1px solid #dfe1e2;
}

.uspt-states-info-card:last-child {
    border-right: 0;
}

.uspt-states-info-card h3 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 800;
    margin: 0 0 12px;
    letter-spacing: -.005em;
}

.uspt-states-info-card p {
    color: #5d5d5d;
    font-size: 15px;
    line-height: 1.6;
    margin: 0;
}

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
    .uspt-states-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .uspt-states-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .uspt-states-info-grid {
        grid-template-columns: 1fr;
    }

    .uspt-states-info-card {
        border-right: 0;
        border-bottom: 1px solid #dfe1e2;
    }

    .uspt-states-info-card:last-child {
        border-bottom: 0;
    }
}

@media (max-width: 640px) {
    .uspt-states {
        padding: 40px 0 48px;
    }

    .uspt-states-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .uspt-state-card {
        padding: 14px 12px;
        gap: 10px;
    }

    .uspt-state-abbr {
        width: 32px;
        height: 32px;
        font-size: 10.5px;
    }

    .uspt-state-name {
        font-size: 13px;
    }

    .uspt-state-arrow {
        display: none;
    }

    .uspt-states-info {
        padding: 48px 0;
    }
}

@media (max-width: 380px) {
    .uspt-states-grid {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
   TESS — Content Sections (Tips, Popular, Classes)
   ============================================================ */

.tess-content {
    background: #fff;
    padding: 56px 0 72px;
    border-bottom: 1px solid #e5eaf0;
}

.tess-content-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
    margin-bottom: 48px;
}

/* ---------- Panels ---------- */
.tess-panel {
    background: #fff;
    border: 1px solid #dfe1e2;
    border-top: 4px solid #0b4d8c;
    border-radius: 2px;
    padding: 26px 24px;
    display: flex;
    flex-direction: column;
}

.tess-panel-head {
    border-bottom: 1px solid #dfe1e2;
    padding-bottom: 14px;
    margin-bottom: 18px;
}

.tess-panel-head h3 {
    color: #112e51;
    font-family: var(--font-heading, sans-serif);
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -.005em;
    margin: 0;
    line-height: 1.25;
}

.tess-panel-note {
    color: #5d5d5d;
    font-size: 13.5px;
    line-height: 1.55;
    margin: 0 0 16px;
}

/* ---------- Search Tips ---------- */
.tess-tips {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 14px;
}

.tess-tips li {
    color: #1b1b1b;
    font-size: 14px;
    line-height: 1.55;
    padding-left: 26px;
    position: relative;
}

.tess-tips li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #e8f0fb;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%230b4d8c' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 8.5 6.5 12 13 4.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 11px;
}

.tess-tips strong {
    color: #112e51;
    font-weight: 800;
}

/* ---------- Popular Searches ---------- */
.tess-popular {
    display: grid;
    gap: 0;
    border-top: 1px solid #eaeef4;
}

.tess-popular a {
    color: #1a4586;
    font-size: 14px;
    font-weight: 600;
    padding: 11px 0;
    border-bottom: 1px solid #eaeef4;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    transition: color .15s, padding-left .15s;
}

.tess-popular a:after {
    content: "→";
    color: #0b4d8c;
    font-size: 16px;
    line-height: 1;
    opacity: 0;
    transition: opacity .15s, transform .15s;
}

.tess-popular a:hover {
    color: #d83933;
    padding-left: 6px;
}

.tess-popular a:hover:after {
    opacity: 1;
    transform: translateX(2px);
    color: #d83933;
}

/* ---------- Browse by Class ---------- */
.tess-classes {
    display: grid;
    gap: 0;
    border-top: 1px solid #eaeef4;
}

.tess-classes a {
    color: #1b1b1b;
    padding: 11px 0;
    border-bottom: 1px solid #eaeef4;
    text-decoration: none;
    display: grid;
    grid-template-columns: 78px 1fr;
    gap: 12px;
    align-items: center;
    transition: background .15s, padding-left .15s;
}

.tess-classes a strong {
    color: #0b4d8c;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .02em;
}

.tess-classes a span {
    color: #5d5d5d;
    font-size: 13.5px;
    font-weight: 500;
}

.tess-classes a:hover {
    background: #f5f8fd;
    padding-left: 8px;
}

.tess-classes a:hover strong {
    color: #d83933;
}

/* ---------- Quick Help CTA ---------- */
.tess-quick-help {
    background: #f0f5fb;
    border-left: 5px solid #0b4d8c;
    padding: 28px 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 32px;
    flex-wrap: wrap;
}

.tess-quick-help-text h4 {
    color: #112e51;
    font-family: var(--font-heading, sans-serif);
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -.005em;
    margin: 0 0 6px;
}

.tess-quick-help-text p {
    color: #5d5d5d;
    font-size: 14.5px;
    line-height: 1.5;
    margin: 0;
    max-width: 620px;
}

.tess-quick-help-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

/* ---------- Buttons (reused) ---------- */
.tess-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 22px;
    border-radius: 2px;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .02em;
    text-decoration: none;
    border: 2px solid transparent;
    transition: background .15s, color .15s, border-color .15s;
    white-space: nowrap;
}

.tess-btn--solid {
    background: #d83933;
    color: #fff;
    border-color: #d83933;
}

.tess-btn--solid:hover {
    background: #a4113a;
    border-color: #a4113a;
}

.tess-btn--outline {
    background: #fff;
    color: #0b4d8c;
    border-color: #0b4d8c;
}

.tess-btn--outline:hover {
    background: #0b4d8c;
    color: #fff;
}

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
    .tess-content-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .tess-content {
        padding: 40px 0 52px;
    }

    .tess-content-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        margin-bottom: 32px;
    }

    .tess-panel {
        padding: 22px 20px;
    }

    .tess-quick-help {
        padding: 22px 20px;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }

    .tess-quick-help-actions {
        width: 100%;
        flex-direction: column;
    }

    .tess-btn {
        width: 100%;
    }
}

/* ============================================================
   TESS — Trademark Search Page (USPTO style)
   ============================================================ */

.tess-page {
    background: #fff;
    font-family: var(--font-sans, "Inter", sans-serif);
    min-height: 60vh;
}

.tess-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 clamp(16px, 3vw, 40px);
}

/* ---------- Title bar ---------- */
.tess-title-bar {
    background: #e8e8e8;
    border-bottom: 1px solid #cfcfcf;
    padding: 14px 0;
}

.tess-title-bar h1 {
    color: #1b1b1b;
    font-family: var(--font-heading, "Inter", sans-serif);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.005em;
    margin: 0;
    line-height: 1.2;
}

/* ---------- Breadcrumb ---------- */
.tess-breadcrumb {
    background: #0b4d8c;
    padding: 8px 0;
}

.tess-breadcrumb-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.tess-breadcrumb a {
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    padding: 4px 0;
}

.tess-breadcrumb a:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.tess-breadcrumb-spacer {
    flex: 1;
}

/* ---------- Search Section ---------- */
.tess-search-section {
    background: #f0f0f0;
    border-bottom: 1px solid #cfcfcf;
    padding: 26px 0;
}

.tess-search-form {
    max-width: 1300px;
    margin: 0 auto;
}

.tess-search-field {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: stretch;
    background: #fff;
    border: 1px solid #cfcfcf;
    height: 52px;
    overflow: hidden;
    box-shadow: 0 1px 2px #0000000d;
}

.tess-search-field select {
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    border-right: 1px solid #cfcfcf;
    background: #0b4d8c;
    color: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    padding: 0 36px 0 20px;
    cursor: pointer;
    outline: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='%23ffffff'%3E%3Cpath d='M6 8 0 0h12z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 10px;
    min-width: 130px;
}

.tess-search-field input {
    border: 0;
    outline: none;
    background: #fff;
    color: #1b1b1b;
    font: inherit;
    font-size: 15px;
    font-weight: 500;
    padding: 0 18px;
    min-width: 0;
    width: 100%;
}

.tess-search-field input::placeholder {
    color: #6b7280;
    font-weight: 400;
}

.tess-search-field button {
    border: 0;
    background: #0b4d8c;
    color: #fff;
    width: 68px;
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: background .15s;
}

.tess-search-field button:hover {
    background: #073763;
}

.tess-search-field:focus-within {
    border-color: #0b4d8c;
    box-shadow: 0 0 0 2px #0b4d8c33;
}

/* ---------- Help cards section ---------- */
.tess-help {
    background: #fff;
    padding: 60px 0 80px;
}

.tess-help-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    max-width: 900px;
    margin: 0 auto;
}

.tess-help-card {
    text-align: center;
    text-decoration: none;
    color: inherit;
    padding: 20px;
    border-radius: 4px;
    transition: background .15s;
}

.tess-help-card:hover {
    background: #f5f8fd;
}

.tess-help-icon {
    width: 84px;
    height: 84px;
    margin: 0 auto 20px;
    display: grid;
    place-items: center;
}

.tess-help-icon svg {
    width: 84px;
    height: 84px;
}

.tess-help-card h3 {
    color: #0b4d8c;
    font-family: var(--font-heading, sans-serif);
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 10px;
    letter-spacing: -.005em;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.tess-help-card:hover h3 {
    color: #073763;
}

.tess-help-card p {
    color: #5d5d5d;
    font-size: 15px;
    line-height: 1.55;
    margin: 0;
    max-width: 280px;
    margin-inline: auto;
}

/* ---------- Responsive ---------- */
@media (max-width: 780px) {
    .tess-title-bar h1 {
        font-size: 17px;
    }

    .tess-search-section {
        padding: 18px 0;
    }

    .tess-search-field {
        grid-template-columns: 1fr auto;
        height: auto;
    }

    .tess-search-field select {
        grid-column: 1 / -1;
        border-right: 0;
        border-bottom: 1px solid #cfcfcf;
        padding: 12px 36px 12px 16px;
        min-width: 0;
        width: 100%;
    }

    .tess-search-field input {
        padding: 14px 16px;
        font-size: 14px;
    }

    .tess-search-field button {
        width: 54px;
    }

    .tess-help {
        padding: 40px 0 60px;
    }

    .tess-help-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .tess-help-icon,
    .tess-help-icon svg {
        width: 68px;
        height: 68px;
    }
}

/* ============================================================
   SERVICE PAGES — Reusable layout
   ============================================================ */

.svc-page {
    background: #fff;
    font-family: var(--font-sans);
}

.svc-container {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(20px, 5vw, 60px);
}

/* ---------- Breadcrumb ---------- */
.svc-breadcrumb {
    background: #f0f0f0;
    border-bottom: 1px solid #dfe1e2;
    padding: 12px 0;
}

.svc-breadcrumb-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    color: #5d5d5d;
    font-size: 13px;
    font-weight: 600;
}

.svc-breadcrumb-inner a {
    color: #0b4d8c;
    text-decoration: none;
}

.svc-breadcrumb-inner a:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ---------- Hero ---------- */
.svc-hero {
    padding: 64px 0 48px;
    background: #fff;
    border-bottom: 1px solid #dfe1e2;
}

.svc-eyebrow {
    display: inline-block;
    color: #d83933;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.svc-hero h1 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: clamp(34px, 4.6vw, 54px);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.022em;
    margin: 0 0 22px;
    padding-bottom: 22px;
    border-bottom: 4px solid #d83933;
    max-width: 900px;
}

.svc-hero-lead {
    color: #1b1b1b;
    font-size: 18px;
    line-height: 1.7;
    margin: 0;
    max-width: 780px;
}

/* ---------- Body grid ---------- */
.svc-body {
    padding: 64px 0 72px;
    background: #fff;
}

.svc-body-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, .42fr);
    gap: 64px;
    align-items: start;
}

/* Content blocks */
.svc-block {
    margin-bottom: 44px;
}

.svc-block:last-child {
    margin-bottom: 0;
}

.svc-block h2 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 26px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: -.012em;
    margin: 0 0 18px;
    padding-bottom: 12px;
    border-bottom: 1px solid #dfe1e2;
    max-width: 720px;
}

.svc-block p {
    color: #3d3d3d;
    font-size: 16.5px;
    line-height: 1.75;
    margin: 0 0 16px;
    max-width: 760px;
}

.svc-block p strong {
    color: #112e51;
    font-weight: 700;
}

/* Checklist */
.svc-list {
    list-style: none;
    padding: 0;
    margin: 8px 0 0;
    display: grid;
    gap: 12px;
    max-width: 760px;
}

.svc-list li {
    color: #1b1b1b;
    font-size: 15.5px;
    line-height: 1.6;
    padding-left: 28px;
    position: relative;
}

.svc-list li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #e8f0fb;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%230b4d8c' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 8.5 6.5 12 13 4.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 11px;
}

/* ---------- Sidebar ---------- */
.svc-side {
    position: sticky;
    top: 100px;
    display: grid;
    gap: 20px;
}

.svc-side-card {
    background: #f5f8fd;
    border: 1px solid #dbe4f2;
    border-top: 4px solid #0b4d8c;
    border-radius: 2px;
    padding: 28px 24px;
}

.svc-side-tag {
    display: inline-block;
    color: #d83933;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.svc-side-card h3 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 12px;
    letter-spacing: -.008em;
}

.svc-side-card p {
    color: #5d5d5d;
    font-size: 14.5px;
    line-height: 1.6;
    margin: 0 0 20px;
}

.svc-side-card small {
    display: block;
    color: #98a2b3;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.5;
    margin-top: 14px;
    text-align: center;
}

/* Sidebar buttons */
.svc-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 46px;
    padding: 0 20px;
    border-radius: 2px;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .02em;
    text-decoration: none;
    border: 2px solid transparent;
    transition: all .15s;
    margin-bottom: 10px;
}

.svc-btn--solid {
    background: #d83933;
    color: #fff;
    border-color: #d83933;
}

.svc-btn--solid:hover {
    background: #a4113a;
    border-color: #a4113a;
}

.svc-btn--outline {
    background: #fff;
    color: #0b4d8c;
    border-color: #0b4d8c;
}

.svc-btn--outline:hover {
    background: #0b4d8c;
    color: #fff;
}

/* Related list */
.svc-side-card--related {
    background: #fff;
    border-top-color: #d83933;
}

.svc-related-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 0;
}

.svc-related-list li {
    border-bottom: 1px solid #eaeef4;
}

.svc-related-list li:last-child {
    border-bottom: 0;
}

.svc-related-list a {
    display: block;
    color: #1a4586;
    font-size: 14px;
    font-weight: 600;
    padding: 10px 0;
    text-decoration: none;
    transition: color .15s, padding-left .15s;
}

.svc-related-list a:hover {
    color: #d83933;
    padding-left: 6px;
}

/* ---------- CTA strip ---------- */
.svc-cta {
    background: #112e51;
    padding: 52px 0;
}

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

.svc-cta h2 {
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 900;
    margin: 0 0 8px;
    letter-spacing: -.01em;
}

.svc-cta p {
    color: #ffffffb8;
    font-size: 15.5px;
    margin: 0;
}

.svc-cta-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.svc-btn--light {
    background: #d83933;
    color: #fff;
    border-color: #d83933;
    width: auto;
    min-width: 180px;
}

.svc-btn--light:hover {
    background: #a4113a;
    border-color: #a4113a;
}

.svc-btn--outline-light {
    background: transparent;
    color: #fff;
    border-color: #ffffff8c;
    width: auto;
    min-width: 180px;
}

.svc-btn--outline-light:hover {
    background: #fff;
    color: #112e51;
    border-color: #fff;
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
    .svc-body-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .svc-side {
        position: static;
    }

    .svc-hero {
        padding: 44px 0 32px;
    }

    .svc-body {
        padding: 40px 0 48px;
    }

    .svc-block h2 {
        font-size: 22px;
    }
}

@media (max-width: 640px) {
    .svc-hero h1 {
        font-size: 30px;
    }

    .svc-hero-lead {
        font-size: 16px;
    }

    .svc-cta-inner {
        flex-direction: column;
        text-align: center;
    }

    .svc-cta-actions {
        width: 100%;
        flex-direction: column;
    }

    .svc-btn--light,
    .svc-btn--outline-light {
        width: 100%;
    }
}

/* ============================================================
   BATCH 3 — Services grid, Categories, Scam page
   ============================================================ */

/* ---------- Services grid (All Services page) ---------- */
.svc-grid-section {
    padding: 64px 0 80px;
    background: #fff;
    border-top: 1px solid #dfe1e2;
}

.svc-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid #dfe1e2;
    border-left: 1px solid #dfe1e2;
}

.svc-tile {
    background: #fff;
    border-right: 1px solid #dfe1e2;
    border-bottom: 1px solid #dfe1e2;
    padding: 28px 26px;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    transition: background .15s;
    position: relative;
}

.svc-tile:hover {
    background: #f5f8fd;
}

.svc-tile-num {
    color: #0b4d8c;
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 900;
    letter-spacing: .1em;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e8eef7;
    width: fit-content;
    min-width: 40px;
    transition: color .15s, border-color .15s;
}

.svc-tile:hover .svc-tile-num {
    color: #d83933;
    border-color: #d83933;
}

.svc-tile h3 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -.005em;
    margin: 0 0 12px;
}

.svc-tile p {
    color: #5d5d5d;
    font-size: 14.5px;
    line-height: 1.55;
    margin: 0 0 20px;
    flex: 1;
}

.svc-tile-link {
    color: #0b4d8c;
    font-size: 13.5px;
    font-weight: 800;
    letter-spacing: .02em;
}

.svc-tile:hover .svc-tile-link {
    color: #d83933;
}

/* Warn tile */
.svc-tile--warn {
    background: #fff7f8;
}

.svc-tile--warn .svc-tile-num {
    color: #d83933;
    border-color: #f4c8cc;
}

.svc-tile--warn:hover {
    background: #fff0f2;
}

/* ---------- Explore Services — Categories ---------- */
.svc-categories {
    padding: 64px 0 80px;
    background: #fff;
}

.svc-category {
    border-bottom: 1px solid #dfe1e2;
    padding: 44px 0;
    display: grid;
    grid-template-columns: minmax(280px, .75fr) minmax(0, 1.25fr);
    gap: 56px;
    align-items: start;
}

.svc-category:first-child {
    padding-top: 0;
}

.svc-category:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.svc-category-head {
    display: flex;
    gap: 22px;
    align-items: flex-start;
}

.svc-category-num {
    font-family: var(--font-heading);
    font-size: 40px;
    font-weight: 900;
    line-height: 1;
    color: #c4d3ea;
    letter-spacing: -.03em;
    border-top: 2px solid #c4d3ea;
    padding-top: 14px;
    flex: none;
    min-width: 60px;
}

.svc-category-head h2 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: -.012em;
    margin: 0 0 10px;
}

.svc-category-head p {
    color: #5d5d5d;
    font-size: 15px;
    line-height: 1.55;
    margin: 0;
}

.svc-category-list {
    display: grid;
    gap: 0;
    border-top: 1px solid #dfe1e2;
}

.svc-category-list a {
    padding: 20px 0;
    border-bottom: 1px solid #dfe1e2;
    text-decoration: none;
    display: block;
    transition: padding-left .18s;
}

.svc-category-list a:hover {
    padding-left: 10px;
}

.svc-category-list a h3 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 17px;
    font-weight: 800;
    margin: 0 0 6px;
    line-height: 1.25;
    letter-spacing: -.005em;
    transition: color .15s;
}

.svc-category-list a:hover h3 {
    color: #0b4d8c;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.svc-category-list a p {
    color: #5d5d5d;
    font-size: 14.5px;
    line-height: 1.55;
    margin: 0;
}

/* ---------- Scam page — warn theme ---------- */
.svc-hero--warn {
    background: #fff7f8;
    border-bottom-color: #f4c8cc;
}

.svc-eyebrow--warn {
    color: #d83933;
}

.svc-hero--warn h1 {
    color: #112e51;
    border-bottom-color: #d83933;
}

.svc-warn-banner {
    background: #d83933;
    color: #fff;
    padding: 22px 0;
}

.svc-warn-inner {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    max-width: 980px;
    margin: 0 auto;
}

.svc-warn-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #ffffff2e;
    border: 2px solid #ffffff5c;
    font-size: 22px;
    font-weight: 900;
    flex: none;
}

.svc-warn-inner strong {
    display: block;
    color: #fff;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 900;
    margin-bottom: 4px;
    letter-spacing: -.005em;
}

.svc-warn-inner p {
    color: #ffffffd1;
    font-size: 14.5px;
    line-height: 1.6;
    margin: 0;
    max-width: 780px;
}

/* Warning list — red circles */
.svc-warn-list {
    list-style: none;
    padding: 0;
    margin: 8px 0 0;
    display: grid;
    gap: 12px;
    max-width: 780px;
}

.svc-warn-list li {
    color: #1b1b1b;
    font-size: 15.5px;
    line-height: 1.55;
    padding-left: 32px;
    position: relative;
}

.svc-warn-list li:before {
    content: "!";
    position: absolute;
    left: 0;
    top: 2px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #d83933;
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 12px;
    font-weight: 900;
    font-family: var(--font-heading);
    line-height: 1;
}

/* Scam grid */
.svc-scam-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 8px;
}

.svc-scam-card {
    background: #fff;
    border: 1px solid #dfe1e2;
    border-left: 4px solid #d83933;
    padding: 22px 22px 22px 24px;
    border-radius: 2px;
}

.svc-scam-card h3 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -.005em;
    margin: 0 0 10px;
}

.svc-scam-card p {
    color: #5d5d5d;
    font-size: 14.5px;
    line-height: 1.6;
    margin: 0;
}

/* Red CTA strip */
.svc-cta--red {
    background: #d83933;
}

.svc-cta--red h2 {
    color: #fff;
}

.svc-cta--red p {
    color: #ffffffd1;
}

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
    .svc-cards-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .svc-category {
        grid-template-columns: 1fr;
        gap: 32px;
    }
}

@media (max-width: 640px) {
    .svc-cards-grid {
        grid-template-columns: 1fr;
    }

    .svc-tile {
        padding: 24px 22px;
    }

    .svc-category {
        padding: 32px 0;
    }

    .svc-category-num {
        font-size: 30px;
        padding-top: 10px;
        min-width: 44px;
    }

    .svc-category-head h2 {
        font-size: 20px;
    }

    .svc-scam-grid {
        grid-template-columns: 1fr;
    }

    .svc-warn-inner {
        flex-direction: column;
        gap: 12px;
    }

    .svc-warn-icon {
        width: 36px;
        height: 36px;
        font-size: 18px;
    }
}

/* ============================================
   AUTH PAGES — USPTO Style
   ============================================ */

.uspt-auth-body {
    background: #f0f0f0;
    font-family: var(--font-sans);
    min-height: 100vh;
}

.uspt-auth-wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
}

.uspt-auth-card {
    background: #fff;
    border: 1px solid #dcdcdc;
    border-radius: 6px;
    width: 100%;
    max-width: 460px;
    padding: 36px 40px 32px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
    margin-bottom: 24px;
}

.uspt-auth-card--wide {
    max-width: 560px;
}

.uspt-auth-logo {
    text-align: center;
    margin-bottom: 24px;
}

.uspt-auth-logo img {
    max-height: 58px;
    width: auto;
}

.uspt-auth-title {
    text-align: center;
    color: #333;
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 22px;
}

.uspt-auth-subtitle {
    text-align: center;
    color: #666;
    font-size: 13px;
    margin: -14px 0 22px;
}

/* Alerts */
.uspt-auth-alert {
    padding: 12px 16px;
    border-radius: 4px;
    font-size: 14px;
    margin-bottom: 20px;
}

.uspt-auth-alert--error {
    background: #f8d7da;
    color: #842029;
    border: 1px solid #f1aeb5;
}

.uspt-auth-alert--success {
    background: #e7f4eb;
    color: #155724;
    border: 1px solid #b9dfc4;
}

.uspt-auth-alert ul {
    margin: 6px 0 0;
    padding-left: 20px;
}

/* Okta button */
.uspt-okta-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 48px;
    border: 1px solid #c0c0c0;
    border-radius: 6px;
    background: #fff;
    color: #333;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    margin-bottom: 22px;
    transition: background 0.15s;
}

.uspt-okta-btn:hover {
    background: #f7f7f7;
}

/* Divider */
.uspt-auth-divider {
    display: flex;
    align-items: center;
    gap: 16px;
    color: #888;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-bottom: 22px;
}

.uspt-auth-divider::before,
.uspt-auth-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #dcdcdc;
}

/* Form groups */
.uspt-form-group {
    display: grid;
    gap: 8px;
    margin-bottom: 18px;
}

.uspt-form-group label {
    color: #333;
    font-size: 14px;
    font-weight: 700;
}

.uspt-form-group input[type="text"],
.uspt-form-group input[type="email"],
.uspt-form-group input[type="password"] {
    width: 100%;
    min-height: 48px;
    border: 1px solid #c0c0c0;
    border-radius: 6px;
    padding: 0 14px;
    font-size: 15px;
    color: #1b1b1b;
    background: #fff;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.uspt-form-group input:focus {
    border-color: #0b4d8c;
    box-shadow: 0 0 0 3px rgba(11, 77, 140, 0.15);
}

.uspt-form-hint {
    color: #777;
    font-size: 12px;
}

.req {
    color: #d83933;
    font-weight: 900;
}

.uspt-form-options {
    margin-bottom: 22px;
}

.uspt-form-options label {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #333;
    font-size: 15px;
    cursor: pointer;
}

.uspt-form-options input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #0b4d8c;
    cursor: pointer;
}

.uspt-form-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 8px 0 22px;
    font-size: 13.5px;
    color: #333;
    line-height: 1.55;
}

.uspt-form-check input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: #0b4d8c;
    flex: none;
    cursor: pointer;
}

.uspt-form-check a {
    color: #0b4d8c;
    text-decoration: underline;
}

.uspt-auth-submit {
    width: 100%;
    min-height: 52px;
    background: #162e51;
    color: #fff;
    border: 0;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 900;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: background 0.15s;
}

.uspt-auth-submit:hover {
    background: #073763;
}

.uspt-auth-links {
    display: grid;
    gap: 10px;
    margin-top: 22px;
}

.uspt-auth-links a {
    color: #0b4d8c;
    font-size: 14px;
    text-decoration: underline;
}

.uspt-auth-bottom-link {
    margin-top: 22px;
    text-align: center;
    font-size: 14px;
    color: #555;
}

.uspt-auth-bottom-link a {
    color: #0b4d8c;
    font-weight: 700;
    text-decoration: underline;
}

.uspt-auth-disclaimer {
    max-width: 460px;
    color: #555;
    font-size: 12px;
    line-height: 1.65;
    text-align: left;
}

.uspt-auth-disclaimer p {
    margin: 0 0 12px;
}

.uspt-auth-disclaimer a {
    color: #0b4d8c;
    text-decoration: underline;
}

/* ============================================
   DASHBOARD
   ============================================ */

.uspt-dash-page {
    background: #f7f9fc;
    min-height: 100vh;
    padding: 0 0 80px;
}

.uspt-dash-container {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 clamp(20px, 5vw, 60px);
}

.uspt-dash-hero {
    background: linear-gradient(135deg, #162e51 0%, #172b58 100%);
    color: #ffffff;
    padding: 20px 0 30px;
}

.uspt-dash-eyebrow {
    display: block;
    color: #ffb3ba;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.uspt-dash-hero h1 {
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 900;
    margin: 0 0 14px;
}

.uspt-dash-hero p {
    color: #ffffffc7;
    font-size: 17px;
    margin: 0;
    max-width: 620px;
}

.uspt-dash-section {
    padding: 48px 0 0;
}

.uspt-dash-heading {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 900;
    margin: 0 0 24px;
    padding-bottom: 14px;
    border-bottom: 3px solid #d83933;
    max-width: 500px;
}

.uspt-dash-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.uspt-dash-stat {
    background: #fff;
    border: 1px solid #dfe1e2;
    border-radius: 12px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    box-shadow: 0 6px 20px #172b580f;
}

.uspt-dash-stat span {
    color: #667085;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.uspt-dash-stat strong {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 36px;
    font-weight: 900;
    line-height: 1;
}

.uspt-dash-stat small {
    color: #98a2b3;
    font-size: 12px;
    font-weight: 600;
    margin-top: 4px;
}

.uspt-dash-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.uspt-dash-action {
    background: #fff;
    border: 1px solid #dfe1e2;
    border-left: 4px solid #d83933;
    border-radius: 10px;
    padding: 24px 26px;
    text-decoration: none;
    display: block;
    transition: transform 0.18s, box-shadow 0.18s, border-color 0.18s;
}

.uspt-dash-action:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px #172b5819;
    border-left-color: #0b4d8c;
}

.uspt-dash-action h3 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 800;
    margin: 0 0 8px;
}

.uspt-dash-action p {
    color: #5d5d5d;
    font-size: 14.5px;
    line-height: 1.55;
    margin: 0 0 14px;
}

.uspt-dash-action span {
    color: #d83933;
    font-size: 14px;
    font-weight: 900;
}

.uspt-dash-info {
    background: #fff;
    border: 1px solid #dfe1e2;
    border-radius: 10px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: hidden;
}

.uspt-dash-info>div {
    padding: 22px 24px;
    border-right: 1px solid #dfe1e2;
}

.uspt-dash-info>div:last-child {
    border-right: 0;
}

.uspt-dash-info span {
    display: block;
    color: #667085;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 6px;
}

.uspt-dash-info strong {
    color: #112e51;
    font-size: 15px;
    font-weight: 800;
    word-break: break-word;
}

.uspt-dash-logout-form {
    margin-top: 30px;
}

.uspt-dash-logout-btn {
    background: #fff;
    color: #b31942;
    border: 1.5px solid #f2c4cf;
    border-radius: 8px;
    min-height: 46px;
    padding: 0 24px;
    font-size: 14px;
    font-weight: 900;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.uspt-dash-logout-btn:hover {
    background: #b31942;
    color: #fff;
    border-color: #b31942;
}

@media (max-width: 900px) {
    .uspt-dash-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .uspt-dash-actions {
        grid-template-columns: 1fr;
    }

    .uspt-dash-info {
        grid-template-columns: 1fr;
    }

    .uspt-dash-info>div {
        border-right: 0;
        border-bottom: 1px solid #dfe1e2;
    }

    .uspt-dash-info>div:last-child {
        border-bottom: 0;
    }
}

@media (max-width: 640px) {
    .uspt-dash-stats {
        grid-template-columns: 1fr;
    }

    .uspt-auth-card {
        padding: 28px 22px 24px;
    }
}

.uspt-form-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 8px 0 22px;
    font-size: 13.5px;
    color: #333;
    line-height: 1.55;
}

.uspt-form-check input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-top: 3px;
    accent-color: #0b4d8c;
    flex: none;
    cursor: pointer;
}

/* YEH IMPORTANT HAI — label ko reset karein */
.uspt-form-check label {
    display: inline;
    /* grid se hataya */
    font-weight: 500;
    /* bold se normal */
    color: #333;
    gap: 0;
    line-height: 1.55;
    cursor: pointer;
}

.uspt-form-check a {
    color: #0b4d8c;
    text-decoration: underline;
    font-weight: 600;
}

.uspt-form-check .req {
    color: #d83933;
    font-weight: 900;
}
/* Auth logo — blue background wrapper */
.uspt-auth-logo {
    text-align: center;
    margin: 1px auto 15px;
    background: #162e51;              /* Navy blue brand color */
    border-radius: 7px;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
}

.uspt-auth-logo a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.uspt-auth-logo img {
    max-height: 58px;
    width: auto;
    display: block;
}
/* ============================================
   PROFILE PAGE
   ============================================ */

.uspt-profile-card {
    background: #fff;
    border: 1px solid #dfe1e2;
    border-radius: 12px;
    padding: 40px;
    max-width: 620px;
    box-shadow: 0 6px 20px #172b580f;
}

.uspt-profile-section-title {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -.005em;
    margin: 0 0 18px;
    padding-bottom: 10px;
    border-bottom: 1px solid #dfe1e2;
}

.uspt-profile-hint {
    color: #667085;
    font-size: 13.5px;
    line-height: 1.5;
    margin: -8px 0 20px;
}

.uspt-profile-form .uspt-form-group input {
    border: 1px solid #c0c0c0;
    border-radius: 6px;
    min-height: 48px;
    padding: 0 14px;
    font-size: 15px;
    width: 100%;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.uspt-profile-form .uspt-form-group input:focus {
    border-color: #0b4d8c;
    box-shadow: 0 0 0 3px rgba(11, 77, 140, 0.15);
}

.uspt-profile-form .uspt-form-group label {
    display: block;
    color: #333;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 8px;
}

.uspt-profile-actions {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.uspt-profile-cancel {
    color: #667085;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: color 0.15s;
}

.uspt-profile-cancel:hover {
    color: #112e51;
    text-decoration: underline;
}

/* ============================================
   EMPTY STATE (No applications)
   ============================================ */

.uspt-empty-state {
    background: #fff;
    border: 2px dashed #d0d8e6;
    border-radius: 16px;
    padding: 60px 40px;
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
}

.uspt-empty-icon {
    color: #667085;
    display: inline-grid;
    place-items: center;
    width: 84px;
    height: 84px;
    border-radius: 50%;
    background: #f0f5fb;
    margin-bottom: 22px;
}

.uspt-empty-state h2 {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 900;
    letter-spacing: -.01em;
    margin: 0 0 14px;
}

.uspt-empty-state p {
    color: #667085;
    font-size: 15.5px;
    line-height: 1.65;
    margin: 0 auto 28px;
    max-width: 480px;
}

@media (max-width: 640px) {
    .uspt-profile-card {
        padding: 26px 22px;
    }
    .uspt-empty-state {
        padding: 44px 24px;
    }
}
/* ============================================
   APPLICATION DETAIL PAGE
   ============================================ */

.uspt-app-detail-page {
    background: #f7f9fc;
    min-height: 100vh;
    padding: 0 0 80px;
}

/* Hero */
.uspt-app-hero {
    background: linear-gradient(135deg, #162e51 0%, #162e51 100%);
    color: #fff;
    padding: 40px 0 40px;
    border-bottom: 6px solid #d83933;
}

.uspt-app-crumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    color: #ffffff9e;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 26px;
}
.uspt-app-crumbs a {
    color: #ffb3ba;
    text-decoration: none;
}
.uspt-app-crumbs a:hover {
    text-decoration: underline;
}

.uspt-app-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 30px;
    align-items: end;
}

.uspt-app-wordmark {
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(32px, 5vw, 56px);
    font-weight: 900;
    letter-spacing: -.02em;
    line-height: 1.05;
    margin: 12px 0 16px;
}

.uspt-app-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 22px;
    align-items: center;
    color: #ffffffc2;
    font-size: 14px;
    font-weight: 600;
}
.uspt-app-hero-meta-item strong {
    color: #fff;
}

.uspt-app-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.uspt-app-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 22px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
    border: 2px solid transparent;
    transition: background .15s, color .15s, border-color .15s;
    white-space: nowrap;
}
.uspt-app-btn--outline {
    background: transparent;
    color: #fff;
    border-color: #ffffff8c;
}
.uspt-app-btn--outline:hover {
    background: #fff;
    color: #112e51;
    border-color: #fff;
}
.uspt-app-btn--solid {
    background: #d83933;
    color: #fff;
    border-color: #d83933;
}
.uspt-app-btn--solid:hover {
    background: #a4113a;
    border-color: #a4113a;
}

/* Status badges */
.uspt-app-badge {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.uspt-app-badge--pending {
    background: #fef3c7;
    color: #92400e;
}
.uspt-app-badge--paid {
    background: #dcfce7;
    color: #15803d;
}
.uspt-app-badge--submitted {
    background: #dbeafe;
    color: #1e40af;
}
.uspt-app-badge--approved {
    background: #dcfce7;
    color: #15803d;
}
.uspt-app-badge--rejected {
    background: #fee2e2;
    color: #b91c1c;
}

/* Main grid */
.uspt-app-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, .36fr);
    gap: 30px;
    align-items: start;
}

/* Content blocks */
.uspt-app-main {
    display: grid;
    gap: 22px;
}

.uspt-app-block {
    background: #fff;
    border: 1px solid #dfe1e2;
    border-radius: 12px;
    padding: 30px 32px;
    box-shadow: 0 6px 20px #172b580f;
}

.uspt-app-block-title {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 20px;
    font-weight: 900;
    letter-spacing: -.01em;
    margin: 0 0 22px;
    padding-bottom: 12px;
    border-bottom: 2px solid #d83933;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.uspt-app-count {
    color: #667085;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
}

/* Definition lists */
.uspt-app-dl {
    display: grid;
    gap: 16px;
    margin: 0;
}
.uspt-app-dl--2col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 32px;
}
.uspt-app-dl > div {
    min-width: 0;
}
.uspt-app-dl dt {
    color: #667085;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 5px;
}
.uspt-app-dl dd {
    color: #112e51;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
    margin: 0;
    word-break: break-word;
}

/* Classes */
.uspt-app-classes {
    display: grid;
    gap: 14px;
}
.uspt-app-class {
    border: 1px solid #dfe1e2;
    border-left: 4px solid #0b4d8c;
    border-radius: 8px;
    padding: 20px 22px;
    background: #fafbfd;
}
.uspt-app-class-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}
.uspt-app-class-num {
    color: #0b4d8c;
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .06em;
    background: #eaf2ff;
    padding: 4px 10px;
    border-radius: 4px;
}
.uspt-app-class-cat {
    color: #112e51;
    font-size: 14px;
    font-weight: 800;
}
.uspt-app-class-desc {
    color: #3d3d3d;
    font-size: 15px;
    line-height: 1.6;
    margin: 0 0 14px;
}
.uspt-app-class-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
    padding-top: 14px;
    border-top: 1px solid #dfe1e2;
}
.uspt-app-class-meta dt {
    color: #667085;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 4px;
}
.uspt-app-class-meta dd {
    color: #112e51;
    font-size: 13px;
    font-weight: 700;
    margin: 0;
}

/* Timeline */
.uspt-app-timeline {
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
}
.uspt-app-timeline::before {
    content: "";
    position: absolute;
    left: 8px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background: #dfe1e2;
}
.uspt-app-timeline-item {
    position: relative;
    padding-left: 34px;
    padding-bottom: 20px;
    display: grid;
    gap: 4px;
}
.uspt-app-timeline-item:last-child {
    padding-bottom: 0;
}
.uspt-app-timeline-item::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 6px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #d83933;
    border: 2px solid #fff;
    box-shadow: 0 0 0 2px #d83933;
}
.uspt-app-timeline-date {
    color: #667085;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.uspt-app-timeline-desc {
    color: #112e51;
    font-size: 14.5px;
    font-weight: 700;
    line-height: 1.5;
}

/* Sidebar */
.uspt-app-side {
    display: grid;
    gap: 18px;
    position: sticky;
    top: 100px;
}
.uspt-app-side-card {
    background: #fff;
    border: 1px solid #dfe1e2;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 6px 20px #172b580f;
}
.uspt-app-side-label {
    display: block;
    color: #667085;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 12px;
}
.uspt-app-side-status {
    margin-bottom: 16px;
}
.uspt-app-side-list {
    display: grid;
    gap: 12px;
    margin: 0;
    padding-top: 16px;
    border-top: 1px solid #dfe1e2;
}
.uspt-app-side-list dt {
    color: #667085;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 3px;
}
.uspt-app-side-list dd {
    color: #112e51;
    font-size: 15px;
    font-weight: 800;
    margin: 0;
}
.uspt-app-side-value {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 900;
    letter-spacing: -.01em;
    display: block;
    margin-bottom: 12px;
}
.uspt-app-side-link {
    color: #d83933;
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
}
.uspt-app-side-link:hover {
    text-decoration: underline;
}

.uspt-app-side-card--dark {
    background: linear-gradient(135deg, #071a43, #162e51);
    color: #fff;
    border-color: #071a43;
}
.uspt-app-side-label--light {
    color: #ffb3ba;
}
.uspt-app-side-card--dark p {
    color: #ffffffd1;
    font-size: 14px;
    line-height: 1.55;
    margin: 0 0 16px;
}
.uspt-app-side-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 46px;
    background: #d83933;
    color: #fff;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
    transition: background .15s;
}
.uspt-app-side-btn:hover {
    background: #a4113a;
}

/* ============================================
   APPLICATIONS LIST (my-applications)
   ============================================ */

.uspt-apps-list {
    display: grid;
    gap: 16px;
    margin-bottom: 24px;
}
.uspt-apps-card {
    display: block;
    background: #fff;
    border: 1px solid #dfe1e2;
    border-left: 4px solid #d83933;
    border-radius: 12px;
    padding: 26px 28px;
    text-decoration: none;
    transition: transform .18s, box-shadow .18s, border-left-color .18s;
}
.uspt-apps-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px #172b5819;
    border-left-color: #0b4d8c;
}
.uspt-apps-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
.uspt-apps-card-serial {
    color: #0b4d8c;
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .06em;
}
.uspt-apps-card-title {
    color: #112e51;
    font-family: var(--font-heading);
    font-size: 26px;
    font-weight: 900;
    letter-spacing: -.015em;
    margin: 0 0 8px;
}
.uspt-apps-card-meta {
    color: #667085;
    font-size: 14px;
    font-weight: 700;
    margin: 0 0 6px;
}
.uspt-apps-card-classes {
    color: #667085;
    font-size: 13px;
    font-weight: 600;
    margin: 0 0 16px;
}
.uspt-apps-card-cta {
    color: #d83933;
    font-size: 14px;
    font-weight: 900;
}

.uspt-apps-note {
    color: #667085;
    font-size: 13px;
    line-height: 1.5;
    text-align: center;
    margin-top: 20px;
}

/* Responsive */
@media (max-width: 900px) {
    .uspt-app-hero-grid {
        grid-template-columns: 1fr;
        align-items: start;
    }
    .uspt-app-grid {
        grid-template-columns: 1fr;
    }
    .uspt-app-side {
        position: static;
    }
    .uspt-app-dl--2col,
    .uspt-app-class-meta {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 640px) {
    .uspt-app-block {
        padding: 22px 20px;
    }
    .uspt-apps-card {
        padding: 20px 22px;
    }
    .uspt-apps-card-title {
        font-size: 22px;
    }
}

/* Print styles */
@media print {
    .uspt-app-hero-actions,
    .uspt-app-side,
    .uspt-app-crumbs {
        display: none;
    }
    .uspt-app-hero {
        background: #fff;
        color: #000;
        border-bottom: 2px solid #000;
    }
    .uspt-app-wordmark {
        color: #000;
    }
    .uspt-app-block {
        break-inside: avoid;
        box-shadow: none;
    }
}
/* ============================================
   APPLICATIONS LIST — Compact USPTO Card
   ============================================ */

.uspt-apps-list {
    display: grid;
    gap: 16px;
    margin-bottom: 24px;
}

.uspt-apps-card {
    display: block;
    background: #fff;
    border: 1px solid #dfe1e2;
    border-left: 4px solid #d83933;
    border-radius: 12px;
    padding: 24px 28px;
    text-decoration: none;
    transition: transform .18s, box-shadow .18s, border-left-color .18s;
}

.uspt-apps-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px #172b5819;
    border-left-color: #0b4d8c;
}

.uspt-apps-card-wordmark {
    color: #0b4d8c;
    font-family: var(--font-heading);
    font-size: 24px;
    font-weight: 900;
    letter-spacing: -.01em;
    text-decoration: underline;
    text-underline-offset: 4px;
    margin-bottom: 10px;
}

.uspt-apps-card-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
}

.uspt-apps-card-dl {
    display: grid;
    grid-template-columns: minmax(140px, 180px) minmax(0, 1fr);
    gap: 10px 24px;
    margin: 0 0 18px;
}
.uspt-apps-card-dl > div {
    display: contents;
}
.uspt-apps-card-dl dt {
    color: #112e51;
    font-size: 13.5px;
    font-weight: 900;
    letter-spacing: .01em;
}
.uspt-apps-card-dl dd {
    color: #1b1b1b;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.55;
    margin: 0;
    word-break: break-word;
}

.uspt-apps-card-cta {
    color: #d83933;
    font-size: 14px;
    font-weight: 900;
}

/* ============================================
   USPTO Compact Table (Class & G/S)
   ============================================ */

.uspt-tm-table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #dfe1e2;
    font-size: 14px;
}
.uspt-tm-table thead th {
    text-align: left;
    background: #f8fafd;
    color: #112e51;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: 12px 16px;
    border-bottom: 2px solid #dfe1e2;
}
.uspt-tm-table tbody td {
    vertical-align: top;
    padding: 14px 16px;
    border-bottom: 1px solid #f0f3f8;
    color: #1b1b1b;
    line-height: 1.55;
}
.uspt-tm-table tbody tr:last-child td {
    border-bottom: 0;
}
.uspt-tm-table tbody td:first-child {
    color: #0b4d8c;
    white-space: nowrap;
}
.uspt-tm-table tbody td strong {
    color: #0b4d8c;
    font-family: var(--font-heading);
    font-weight: 900;
    letter-spacing: .02em;
}

/* ============================================
   LIVE Badge (green)
   ============================================ */

.uspt-app-badge--live {
    background: #15803d;
    color: #fff;
}

/* ============================================
   Plain text inside application blocks
   ============================================ */

.uspt-app-text {
    color: #1b1b1b;
    font-size: 14.5px;
    line-height: 1.65;
    margin: 0;
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 640px) {
    .uspt-apps-card {
        padding: 20px 20px;
    }
    .uspt-apps-card-wordmark {
        font-size: 20px;
    }
    .uspt-apps-card-dl {
        grid-template-columns: 1fr;
        gap: 4px;
    }
    .uspt-apps-card-dl dt {
        margin-top: 8px;
    }
    .uspt-tm-table thead th,
    .uspt-tm-table tbody td {
        padding: 10px 12px;
        font-size: 13px;
    }
}