:root {
    --vr-green: #1f5a3d;
    --vr-green-2: #7fa46a;
    --vr-blue: #153e4d;
    --vr-amber: #e4a11b;
    --vr-ink: #1e2524;
    --vr-muted: #68736f;
    --vr-line: #dfe6df;
    --vr-paper: #f5f7f3;
    --vr-white: #ffffff;
    --vr-shadow: 0 18px 40px rgba(14, 32, 29, .14);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    color: var(--vr-ink);
    background: var(--vr-paper);
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.6;
}

a {
    color: inherit;
}

img {
    max-width: 100%;
    display: block;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 20;
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 14px 48px;
    background: rgba(245, 247, 243, .94);
    border-bottom: 1px solid rgba(31, 90, 61, .12);
    backdrop-filter: blur(14px);
}

.site-header.is-scrolled {
    box-shadow: 0 8px 24px rgba(14, 32, 29, .08);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 210px;
    text-decoration: none;
}

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

.brand-copy {
    display: grid;
    line-height: 1.1;
}

.brand-name {
    font-weight: 800;
    font-size: 1.2rem;
    color: var(--vr-blue);
}

.brand-note {
    margin-top: 3px;
    color: var(--vr-muted);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: 0;
}

.site-nav {
    display: flex;
    align-items: center;
    gap: 8px;
}

.site-nav a {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    padding: 9px 14px;
    color: var(--vr-blue);
    text-decoration: none;
    font-weight: 700;
    border-radius: 8px;
}

.site-nav a:hover,
.site-nav a:focus {
    background: rgba(31, 90, 61, .1);
    outline: none;
}

.site-nav .nav-cta {
    margin-left: 8px;
    color: #102c24;
    background: var(--vr-amber);
}

.nav-toggle {
    width: 44px;
    height: 44px;
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
}

.nav-toggle span:not(.sr-only) {
    width: 20px;
    height: 2px;
    background: var(--vr-blue);
}

.hero {
    min-height: calc(100vh - 132px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    align-items: end;
    gap: 40px;
    padding: 96px 48px 64px;
    color: var(--vr-white);
    background-size: cover;
    background-position: center;
}

.hero-content {
    max-width: 780px;
}

.eyebrow {
    margin: 0 0 12px;
    color: var(--vr-amber);
    font-size: .82rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0;
}

.hero h1,
.page-hero h1 {
    margin: 0;
    font-size: 4.8rem;
    line-height: .95;
    letter-spacing: 0;
}

.hero-subtitle {
    max-width: 660px;
    margin: 20px 0 0;
    font-size: 1.65rem;
    line-height: 1.24;
    font-weight: 700;
}

.hero-text {
    max-width: 680px;
    margin: 18px 0 0;
    color: rgba(255, 255, 255, .88);
    font-size: 1.08rem;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 32px;
}

.btn {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 18px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.btn-primary {
    color: #13271f;
    background: var(--vr-amber);
}

.btn-primary:hover,
.btn-primary:focus {
    background: #f0b23b;
    outline: none;
}

.btn-secondary {
    color: var(--vr-white);
    border-color: rgba(255, 255, 255, .48);
    background: rgba(255, 255, 255, .08);
}

.btn-secondary:hover,
.btn-secondary:focus {
    background: rgba(255, 255, 255, .16);
    outline: none;
}

.hero-panel {
    display: grid;
    gap: 12px;
}

.hero-panel div {
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 8px;
    background: rgba(13, 34, 30, .72);
    box-shadow: var(--vr-shadow);
}

.hero-panel span {
    color: var(--vr-amber);
    font-weight: 900;
}

.hero-panel strong {
    display: block;
    margin-top: 4px;
    font-size: 1.1rem;
}

.hero-panel p {
    margin: 6px 0 0;
    color: rgba(255, 255, 255, .78);
}

.section {
    padding: 76px 48px;
}

.section-heading {
    max-width: 760px;
    margin-bottom: 34px;
}

.section-heading h2,
.split-section h2,
.cta-band h2,
.contact-info h2 {
    margin: 0;
    color: var(--vr-blue);
    font-size: 2.3rem;
    line-height: 1.12;
    letter-spacing: 0;
}

.lead-grid,
.feature-grid,
.tech-grid,
.case-grid,
.footer-grid {
    display: grid;
    gap: 22px;
}

.lead-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 1120px;
}

.lead-grid p,
.split-section p,
.cta-band p,
.contact-info p,
.legal-content p,
.architecture p {
    color: var(--vr-muted);
}

.intro-band {
    background: var(--vr-white);
}

.feature-grid,
.tech-grid,
.case-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.tech-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.feature-card,
.tech-grid article,
.case-grid article,
.timeline article,
.callout {
    min-width: 0;
    padding: 24px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
}

.feature-card h3,
.tech-grid h2,
.case-grid h2,
.timeline h3 {
    margin: 12px 0 8px;
    color: var(--vr-blue);
    font-size: 1.18rem;
    line-height: 1.25;
}

.feature-card p,
.tech-grid p,
.case-grid p,
.timeline p {
    margin: 0;
    color: var(--vr-muted);
}

.feature-icon {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--vr-blue);
    background: rgba(228, 161, 27, .18);
    border-radius: 8px;
    font-size: 1.25rem;
}

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

.text-link {
    display: inline-flex;
    margin-top: 12px;
    color: var(--vr-green);
    font-weight: 800;
    text-decoration: none;
    border-bottom: 2px solid var(--vr-amber);
}

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

.metrics div {
    min-height: 120px;
    padding: 22px;
    display: grid;
    align-content: center;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
}

.metrics strong {
    color: var(--vr-green);
    font-size: 2rem;
    line-height: 1;
}

.metrics span {
    margin-top: 8px;
    color: var(--vr-muted);
}

.cta-band {
    margin: 0 48px 76px;
    padding: 34px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    color: var(--vr-white);
    background: var(--vr-blue);
    border-radius: 8px;
}

.cta-band h2 {
    color: var(--vr-white);
}

.cta-band p {
    margin-bottom: 0;
    color: rgba(255, 255, 255, .8);
}

.page-hero {
    padding: 86px 48px 64px;
    color: var(--vr-white);
    background: linear-gradient(135deg, var(--vr-blue), var(--vr-green));
}

.compact-hero h1 {
    max-width: 960px;
    font-size: 3.2rem;
}

.compact-hero p:not(.eyebrow) {
    max-width: 780px;
    margin: 20px 0 0;
    color: rgba(255, 255, 255, .82);
    font-size: 1.18rem;
}

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

.timeline span,
.case-grid span {
    color: var(--vr-amber);
    font-weight: 900;
}

.stack-list {
    display: grid;
    gap: 12px;
}

.stack-list div {
    padding: 18px;
    display: grid;
    gap: 4px;
    border-left: 4px solid var(--vr-amber);
    background: var(--vr-white);
    border-radius: 0 8px 8px 0;
}

.stack-list strong {
    color: var(--vr-blue);
}

.stack-list span {
    color: var(--vr-muted);
}

.architecture {
    background: var(--vr-white);
}

.architecture-flow {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 24px;
}

.architecture-flow span {
    min-height: 70px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px;
    color: var(--vr-blue);
    font-weight: 800;
    text-align: center;
    background: var(--vr-paper);
    border: 1px solid var(--vr-line);
    border-radius: 8px;
}

.callout {
    border-color: rgba(228, 161, 27, .5);
    background: #fffaf0;
}

.callout strong {
    color: var(--vr-blue);
}

.contact-section {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(360px, 1fr);
    gap: 54px;
    align-items: start;
}

.contact-methods {
    display: grid;
    gap: 8px;
    margin: 24px 0;
}

.contact-methods a {
    color: var(--vr-green);
    font-weight: 800;
    text-decoration: none;
}

.contact-logo {
    width: 220px;
    margin-top: 28px;
}

.contact-form-shell {
    padding: 26px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: var(--vr-shadow);
}

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

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

.form-row {
    display: grid;
    gap: 7px;
}

.form-row label {
    color: var(--vr-blue);
    font-weight: 800;
}

.form-control {
    width: 100%;
    min-height: 46px;
    padding: 11px 12px;
    color: var(--vr-ink);
    border: 1px solid #cfd8d1;
    border-radius: 8px;
    background: var(--vr-white);
    font: inherit;
}

textarea.form-control {
    min-height: 140px;
    resize: vertical;
}

.form-control:focus {
    border-color: var(--vr-green);
    outline: 3px solid rgba(31, 90, 61, .16);
}

.form-submit {
    width: 100%;
}

.form-success {
    margin-bottom: 16px;
    padding: 12px 14px;
    color: #153721;
    border: 1px solid rgba(31, 90, 61, .28);
    border-radius: 8px;
    background: #eaf4eb;
}

.validation-summary,
.field-validation {
    color: #a53d2b;
    font-weight: 700;
}

.form-consent {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 10px 12px;
    align-items: start;
    color: var(--vr-muted);
    font-size: .94rem;
}

.form-consent input {
    width: 18px;
    height: 18px;
    margin-top: 4px;
    accent-color: var(--vr-green);
}

.form-consent label {
    margin: 0;
}

.form-consent a {
    color: var(--vr-green);
    font-weight: 800;
}

.form-consent .field-validation {
    grid-column: 2;
}

.hp-field {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.legal-hero {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(120deg, rgba(18, 42, 52, .98) 0%, rgba(21, 62, 77, .94) 46%, rgba(31, 90, 61, .88) 100%);
}

.legal-hero::after {
    content: "";
    position: absolute;
    right: 48px;
    bottom: -44px;
    width: 320px;
    height: 190px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 8px;
    transform: rotate(-6deg);
    opacity: .45;
}

.legal-hero > * {
    position: relative;
    z-index: 1;
}

.legal-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

.legal-hero-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 11px;
    color: rgba(255, 255, 255, .9);
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 8px;
    background: rgba(255, 255, 255, .08);
    font-weight: 800;
    font-size: .9rem;
}

.legal-section {
    background: linear-gradient(180deg, var(--vr-white) 0%, var(--vr-paper) 100%);
}

.legal-layout {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    align-items: start;
    gap: 34px;
    max-width: 1240px;
    margin: 0 auto;
}

.legal-sidebar {
    position: sticky;
    top: 96px;
    display: grid;
    gap: 16px;
}

.legal-side-block,
.legal-contact-box {
    padding: 18px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
}

.legal-side-block {
    display: grid;
    gap: 4px;
}

.legal-side-block a {
    padding: 8px 0;
    color: var(--vr-blue);
    text-decoration: none;
    font-weight: 800;
    border-bottom: 1px solid rgba(223, 230, 223, .72);
}

.legal-side-block a:last-child {
    border-bottom: 0;
}

.legal-side-block a:hover,
.legal-side-block a:focus,
.legal-contact-box a:hover,
.legal-contact-box a:focus {
    color: var(--vr-green);
    outline: none;
}

.legal-small {
    margin-bottom: 8px;
    color: var(--vr-amber);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.legal-contact-box {
    display: grid;
    gap: 7px;
    color: var(--vr-muted);
    font-size: .94rem;
}

.legal-contact-box strong {
    color: var(--vr-blue);
    font-size: 1rem;
}

.legal-contact-box a {
    color: var(--vr-green);
    font-weight: 800;
    text-decoration: none;
}

.legal-main {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.legal-updated {
    margin: 0;
    color: var(--vr-blue);
    font-weight: 900;
}

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

.legal-summary-grid-wide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.legal-summary-grid article {
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
}

.legal-summary-grid span {
    display: block;
    color: var(--vr-amber);
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.legal-summary-grid strong {
    display: block;
    margin-top: 6px;
    color: var(--vr-blue);
    font-size: 1.05rem;
}

.legal-summary-grid p {
    margin: 7px 0 0;
    color: var(--vr-muted);
}

.legal-panel {
    scroll-margin-top: 100px;
    padding: 26px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
}

.legal-panel h2 {
    margin: 0 0 12px;
    color: var(--vr-blue);
    font-size: 1.48rem;
    line-height: 1.2;
}

.legal-panel p {
    margin: 0 0 12px;
    color: var(--vr-muted);
}

.legal-panel p:last-child,
.legal-list:last-child,
.legal-definition-list:last-child {
    margin-bottom: 0;
}

.legal-panel a {
    color: var(--vr-green);
    font-weight: 800;
}

.legal-definition-list {
    display: grid;
    gap: 10px;
    margin: 18px 0 0;
}

.legal-definition-list div {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 14px;
    padding: 12px 0;
    border-bottom: 1px solid var(--vr-line);
}

.legal-definition-list div:last-child {
    border-bottom: 0;
}

.legal-definition-list dt {
    color: var(--vr-blue);
    font-weight: 900;
}

.legal-definition-list dd {
    margin: 0;
    color: var(--vr-muted);
}

.legal-list {
    display: grid;
    gap: 10px;
    margin: 14px 0;
    padding: 0;
    list-style: none;
}

.legal-list li {
    position: relative;
    padding-left: 24px;
    color: var(--vr-muted);
}

.legal-list li::before {
    content: "";
    position: absolute;
    top: .72em;
    left: 0;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--vr-amber);
}

.legal-note {
    margin-top: 18px;
    padding: 16px;
    border: 1px solid rgba(228, 161, 27, .45);
    border-radius: 8px;
    background: #fff8e8;
}

.legal-note strong {
    display: block;
    color: var(--vr-blue);
}

.legal-note p {
    margin: 6px 0 0;
}

.legal-table-wrap {
    width: 100%;
    overflow-x: auto;
    margin: 18px 0 8px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
}

.legal-table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
}

.legal-table-compact {
    min-width: 620px;
}

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

.legal-table th {
    width: 220px;
    color: var(--vr-blue);
    background: #eef4ef;
}

.legal-table td {
    color: var(--vr-muted);
}

.legal-table tr:last-child th,
.legal-table tr:last-child td {
    border-bottom: 0;
}

.legal-reset-button {
    margin-top: 6px;
    color: var(--vr-blue);
    border-color: #b8c6bf;
    background: var(--vr-white);
}

.legal-reset-status {
    display: block;
    margin-top: 10px;
    color: var(--vr-green);
    font-weight: 800;
}

.site-footer {
    padding: 48px;
    color: rgba(255, 255, 255, .78);
    background: #122a34;
}

.footer-grid {
    grid-template-columns: 1.2fr .8fr .8fr;
}

.footer-grid h2 {
    margin: 0 0 12px;
    color: var(--vr-white);
    font-size: 1rem;
}

.footer-grid p {
    margin: 0 0 10px;
}

.footer-grid a {
    color: var(--vr-white);
    text-decoration: none;
}

.footer-product {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.footer-product img {
    width: 42px;
    height: 42px;
}

.footer-product strong,
.footer-product span {
    display: block;
}

.footer-product strong {
    color: var(--vr-white);
}

.powered {
    margin-bottom: 8px;
    color: rgba(255, 255, 255, .58);
    text-transform: uppercase;
    font-size: .78rem;
    font-weight: 800;
}

.manchanet-logo {
    width: 180px;
    max-height: 54px;
    object-fit: contain;
}

.footer-links {
    margin-top: 18px;
}

.cookie-notice {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 80;
    width: min(620px, calc(100vw - 32px));
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    padding: 18px;
    color: var(--vr-ink);
    border: 1px solid rgba(31, 90, 61, .18);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: 0 20px 56px rgba(14, 32, 29, .22);
}

.cookie-notice[hidden] {
    display: none;
}

.cookie-notice strong {
    display: block;
    color: var(--vr-blue);
    font-size: 1rem;
}

.cookie-notice p {
    margin: 4px 0 0;
    color: var(--vr-muted);
    font-size: .92rem;
    line-height: 1.45;
}

.cookie-notice-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cookie-notice-actions a {
    color: var(--vr-green);
    font-weight: 800;
    text-decoration: none;
    border-bottom: 2px solid var(--vr-amber);
    white-space: nowrap;
}

.cookie-notice-actions .btn {
    min-height: 42px;
    padding: 10px 16px;
}

.product-hero {
    min-height: calc(100vh - 72px);
    align-items: center;
}

.product-hero .hero-content {
    max-width: 860px;
}

.product-hero h1 {
    max-width: 850px;
    font-size: 3.72rem;
    line-height: 1;
}

.product-hero .hero-subtitle {
    font-size: 1.42rem;
}

.product-hero .hero-text {
    font-size: 1rem;
}

.product-hero .hero-actions {
    margin-top: 24px;
}

.product-hero .hero-panel div {
    padding: 16px;
}

.hero-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 26px;
}

.hero-trust span {
    padding: 8px 11px;
    color: rgba(255, 255, 255, .86);
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 8px;
    background: rgba(255, 255, 255, .08);
    font-weight: 700;
    font-size: .92rem;
}

.product-status span {
    display: inline-flex;
    padding: 4px 8px;
    color: #13271f;
    background: var(--vr-amber);
    border-radius: 999px;
    font-size: .75rem;
    text-transform: uppercase;
}

.proof-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    padding-top: 0;
    padding-bottom: 0;
    background: var(--vr-white);
    border-bottom: 1px solid var(--vr-line);
}

.proof-strip div {
    min-height: 124px;
    display: grid;
    align-content: center;
    padding: 24px 28px;
    border-right: 1px solid var(--vr-line);
}

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

.proof-strip strong {
    color: var(--vr-green);
    font-size: 2.1rem;
    line-height: 1;
}

.proof-strip span {
    margin-top: 8px;
    color: var(--vr-muted);
    font-weight: 700;
}

.product-intro {
    background: linear-gradient(180deg, var(--vr-white), var(--vr-paper));
}

.drone-mission-section {
    background:
        linear-gradient(135deg, rgba(237, 244, 238, .96), rgba(255, 250, 240, .92));
}

.drone-mission-section .module-grid article {
    border-color: rgba(228, 161, 27, .34);
    background: var(--vr-white);
}

.drone-mission-section .module-grid span {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    color: #13271f;
    background: var(--vr-amber);
    border-radius: 50%;
}

.image-feature {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .86fr);
    align-items: center;
    gap: 54px;
}

.image-feature-alt {
    grid-template-columns: minmax(360px, .86fr) minmax(0, 1fr);
}

.image-copy h2 {
    margin: 0;
    color: var(--vr-blue);
    font-size: 2.35rem;
    line-height: 1.12;
}

.image-copy p {
    color: var(--vr-muted);
}

.image-frame {
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid rgba(21, 62, 77, .14);
    background: var(--vr-white);
    box-shadow: var(--vr-shadow);
}

.image-frame img {
    width: 100%;
    aspect-ratio: 16 / 11;
    object-fit: cover;
}

.check-list {
    display: grid;
    gap: 10px;
    margin: 22px 0 0;
    padding: 0;
    list-style: none;
}

.check-list li {
    position: relative;
    padding-left: 28px;
    color: var(--vr-ink);
    font-weight: 700;
}

.check-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .55em;
    width: 12px;
    height: 12px;
    background: var(--vr-amber);
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(228, 161, 27, .16);
}

.module-grid,
.workflow,
.plans-grid,
.faq-grid {
    display: grid;
    gap: 18px;
}

.module-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.module-grid article {
    min-height: 220px;
    padding: 24px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
}

.module-grid span,
.workflow span {
    color: var(--vr-amber);
    font-weight: 900;
}

.module-grid h3,
.workflow h3,
.plans-grid h3 {
    margin: 10px 0 8px;
    color: var(--vr-blue);
    font-size: 1.25rem;
    line-height: 1.2;
}

.module-grid p,
.workflow p,
.plans-grid p {
    margin: 0;
    color: var(--vr-muted);
}

.platform-section,
.workflow-section,
.plans-section {
    background: var(--vr-white);
}

.workflow {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.workflow article {
    min-height: 190px;
    padding: 20px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-paper);
}

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

.mini-stats div {
    min-height: 108px;
    display: grid;
    align-content: center;
    padding: 16px;
    border-radius: 8px;
    background: var(--vr-white);
    border: 1px solid var(--vr-line);
}

.mini-stats strong {
    color: var(--vr-green);
    font-size: 1.8rem;
    line-height: 1;
}

.mini-stats span {
    margin-top: 6px;
    color: var(--vr-muted);
    font-size: .9rem;
    font-weight: 700;
}

.case-grid-expanded {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.case-grid-expanded article {
    min-height: 235px;
}

.case-grid-expanded article span {
    display: inline-flex;
    color: var(--vr-green);
    font-weight: 900;
}

.security-band {
    background: #edf4ee;
}

.security-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.plans-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.plans-grid article {
    padding: 26px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-paper);
}

.plans-grid .featured-plan {
    color: var(--vr-white);
    background: var(--vr-blue);
    border-color: var(--vr-blue);
    box-shadow: var(--vr-shadow);
}

.plans-grid .featured-plan h3,
.plans-grid .featured-plan p,
.plans-grid .featured-plan li {
    color: var(--vr-white);
}

.plans-grid ul {
    display: grid;
    gap: 9px;
    margin: 20px 0 0;
    padding-left: 18px;
}

.plans-grid li {
    color: var(--vr-muted);
    font-weight: 700;
}

.faq-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.faq-grid details {
    padding: 20px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
}

.faq-grid summary {
    color: var(--vr-blue);
    font-weight: 900;
    cursor: pointer;
}

.faq-grid p {
    margin-bottom: 0;
    color: var(--vr-muted);
}

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

.final-cta .btn-secondary {
    border-color: rgba(255, 255, 255, .36);
}

.compact-callout {
    margin-top: 22px;
}

.code-card {
    margin-top: 24px;
    padding: 20px;
    display: grid;
    gap: 8px;
    color: var(--vr-white);
    background: var(--vr-blue);
    border-radius: 8px;
}

.code-card span {
    font-family: Consolas, "Courier New", monospace;
    color: var(--vr-amber);
    font-weight: 800;
}

.code-card small {
    color: rgba(255, 255, 255, .75);
}

.contact-points {
    display: grid;
    gap: 12px;
    margin: 24px 0;
}

.contact-points div {
    display: grid;
    grid-template-columns: 38px 1fr;
    align-items: center;
    gap: 12px;
    padding: 14px;
    border-radius: 8px;
    background: var(--vr-white);
    border: 1px solid var(--vr-line);
}

.contact-points strong {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #13271f;
    background: var(--vr-amber);
    border-radius: 50%;
}

.contact-points span {
    color: var(--vr-muted);
    font-weight: 700;
}

.login-page {
    min-height: calc(100vh - 72px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) 430px;
    gap: 56px;
    align-items: center;
    padding: 44px 48px;
    background:
        linear-gradient(135deg, rgba(21, 62, 77, .96), rgba(31, 90, 61, .9)),
        url("/Content/img/feature-control-center.png");
    background-size: cover;
    background-position: center;
    color: var(--vr-white);
}

.login-copy h1 {
    max-width: 760px;
    margin: 0;
    font-size: 3.25rem;
    line-height: 1;
}

.login-copy p {
    max-width: 720px;
    color: rgba(255, 255, 255, .82);
    font-size: 1.08rem;
}

.portal-preview {
    max-width: 640px;
    margin-top: 22px;
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 8px;
    background: rgba(255, 255, 255, .08);
    box-shadow: var(--vr-shadow);
}

.portal-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

.portal-header span {
    width: 12px;
    height: 12px;
    background: var(--vr-amber);
    border-radius: 50%;
}

.portal-map {
    position: relative;
    min-height: 140px;
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(127, 164, 106, .5), rgba(21, 62, 77, .7)),
        repeating-linear-gradient(45deg, rgba(255,255,255,.08) 0, rgba(255,255,255,.08) 1px, transparent 1px, transparent 28px);
}

.pin {
    position: absolute;
    width: 18px;
    height: 18px;
    background: var(--vr-amber);
    border: 3px solid var(--vr-white);
    border-radius: 50%;
    box-shadow: 0 0 0 8px rgba(228, 161, 27, .18);
}

.pin-one { left: 22%; top: 36%; }
.pin-two { left: 58%; top: 24%; }
.pin-three { left: 70%; top: 62%; }

.portal-rows {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.portal-rows span {
    height: 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .22);
}

.portal-rows span:nth-child(2) {
    width: 78%;
}

.portal-rows span:nth-child(3) {
    width: 52%;
}

.portal-capabilities {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    max-width: 640px;
    margin-top: 14px;
}

.portal-capabilities div {
    padding: 14px;
    border-radius: 8px;
    background: rgba(255, 255, 255, .1);
}

.portal-capabilities strong,
.portal-capabilities span {
    display: block;
}

.portal-capabilities span {
    color: rgba(255, 255, 255, .72);
    font-size: .9rem;
}

.login-card {
    padding: 24px;
    color: var(--vr-ink);
    background: var(--vr-white);
    border-radius: 8px;
    box-shadow: 0 22px 54px rgba(0, 0, 0, .24);
}

.login-logo {
    width: 54px;
    height: 54px;
    margin-bottom: 12px;
}

.login-card h2 {
    margin: 0;
    color: var(--vr-blue);
    font-size: 1.65rem;
}

.login-card > p {
    color: var(--vr-muted);
}

.login-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 2px 0 4px;
    font-size: .94rem;
}

.login-options a {
    color: var(--vr-green);
    font-weight: 800;
    text-decoration: none;
}

.check-line {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--vr-muted);
    font-weight: 700;
    cursor: pointer;
}

.switch-line {
    position: relative;
    min-height: 28px;
}

.switch-input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    opacity: 0;
    pointer-events: none;
}

.switch-slider {
    position: relative;
    flex: 0 0 46px;
    width: 46px;
    height: 26px;
    border: 1px solid rgba(21, 62, 77, .22);
    border-radius: 999px;
    background: #dce6e1;
    box-shadow: inset 0 1px 2px rgba(21, 62, 77, .14);
    transition: background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.switch-slider::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--vr-white);
    box-shadow: 0 2px 7px rgba(21, 62, 77, .24);
    transition: transform .18s ease;
}

.switch-input:checked ~ .switch-slider {
    border-color: rgba(31, 90, 61, .62);
    background: var(--vr-green);
    box-shadow: inset 0 1px 2px rgba(21, 62, 77, .2);
}

.switch-input:checked ~ .switch-slider::after {
    transform: translateX(20px);
}

.switch-input:focus-visible ~ .switch-slider {
    outline: 2px solid rgba(228, 161, 27, .82);
    outline-offset: 3px;
}

.switch-input:disabled ~ .switch-slider,
.switch-input:disabled ~ .switch-text {
    opacity: .55;
}

.switch-text {
    color: var(--vr-muted);
}

.service-hero,
.tech-hero,
.cases-hero {
    min-height: 360px;
    background:
        linear-gradient(105deg, rgba(13, 34, 43, .94) 0%, rgba(18, 60, 54, .82) 48%, rgba(31, 90, 61, .58) 100%),
        url("/Content/img/hero-service-drone-launch.png");
    background-size: cover;
    background-position: center 54%;
}

.tech-hero {
    background:
        linear-gradient(105deg, rgba(13, 34, 43, .96) 0%, rgba(18, 60, 54, .82) 48%, rgba(31, 90, 61, .52) 100%),
        url("/Content/img/hero-technology-camera-drone.png");
    background-size: cover;
    background-position: center 30%;
}

.cases-hero {
    background:
        linear-gradient(105deg, rgba(13, 34, 43, .96) 0%, rgba(18, 60, 54, .78) 48%, rgba(31, 90, 61, .5) 100%),
        url("/Content/img/hero-cases-rural-sites.png");
    background-size: cover;
    background-position: center 30%;
}

.tech-overview,
.usecase-intro {
    background: var(--vr-white);
}

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

.tech-system-stage {
    position: relative;
    min-height: 190px;
    padding: 22px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-paper);
}

.tech-system-stage::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -13px;
    width: 14px;
    height: 2px;
    background: var(--vr-amber);
}

.tech-system-stage:last-child::after {
    display: none;
}

.tech-system-stage span {
    color: var(--vr-amber);
    font-weight: 900;
}

.tech-system-stage strong {
    display: block;
    margin-top: 8px;
    color: var(--vr-blue);
    font-size: 1.22rem;
}

.tech-system-stage p {
    margin-bottom: 0;
    color: var(--vr-muted);
}

.tech-data-card {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 24px;
}

.tech-data-card div {
    padding: 16px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
}

.tech-data-card span,
.tech-data-card strong {
    display: block;
}

.tech-data-card span {
    color: var(--vr-muted);
    font-size: .82rem;
    font-weight: 800;
    text-transform: uppercase;
}

.tech-data-card strong {
    margin-top: 5px;
    color: var(--vr-blue);
    font-size: 1.12rem;
}

.tech-matrix-section,
.tech-layers-section,
.integrations-section,
.scenario-section,
.usecase-table-section {
    background: var(--vr-white);
}

.tech-matrix,
.tech-layer-grid,
.integration-grid,
.scenario-grid {
    display: grid;
    gap: 18px;
}

.tech-matrix {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.tech-matrix article,
.tech-layer-grid article,
.integration-grid article,
.scenario-grid article {
    min-height: 210px;
    padding: 24px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-paper);
}

.tech-matrix h3,
.tech-layer-grid h3,
.scenario-grid h3 {
    margin: 0 0 10px;
    color: var(--vr-blue);
    line-height: 1.2;
}

.tech-matrix p,
.tech-layer-grid p,
.scenario-grid p {
    margin: 0;
    color: var(--vr-muted);
}

.capability-list {
    display: grid;
    gap: 12px;
    margin-top: 24px;
}

.capability-list div {
    padding: 16px;
    border-left: 4px solid var(--vr-amber);
    background: var(--vr-white);
    border-radius: 0 8px 8px 0;
}

.capability-list strong,
.capability-list span {
    display: block;
}

.capability-list strong {
    color: var(--vr-blue);
}

.capability-list span {
    color: var(--vr-muted);
}

.drone-response-block {
    background: #edf4ee;
}

.drone-response-block .image-frame img {
    min-height: 430px;
    object-fit: cover;
}

.drone-operation-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 24px;
}

.drone-operation-grid div {
    padding: 16px;
    border: 1px solid rgba(31, 90, 61, .18);
    border-left: 4px solid var(--vr-amber);
    border-radius: 8px;
    background: var(--vr-white);
}

.drone-operation-grid strong,
.drone-operation-grid span {
    display: block;
}

.drone-operation-grid strong {
    color: var(--vr-blue);
}

.drone-operation-grid span {
    margin-top: 5px;
    color: var(--vr-muted);
}

.tech-layer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tech-layer-grid article {
    background: var(--vr-white);
}

.tech-layer-grid article > span {
    display: inline-flex;
    min-width: 58px;
    justify-content: center;
    padding: 5px 8px;
    margin-bottom: 14px;
    color: #13271f;
    background: var(--vr-amber);
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 900;
}

.security-roadmap {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.security-roadmap div {
    min-height: 170px;
    padding: 22px;
    color: var(--vr-white);
    border-radius: 8px;
    background: var(--vr-blue);
}

.security-roadmap strong,
.security-roadmap span {
    display: block;
}

.security-roadmap strong {
    font-size: 1.12rem;
}

.security-roadmap span {
    margin-top: 8px;
    color: rgba(255, 255, 255, .76);
}

.integration-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.integration-grid article {
    min-height: 160px;
    background: #fffaf0;
    border-color: rgba(228, 161, 27, .35);
}

.integration-grid strong,
.integration-grid span {
    display: block;
}

.integration-grid strong {
    color: var(--vr-blue);
    font-size: 1.08rem;
}

.integration-grid span {
    margin-top: 8px;
    color: var(--vr-muted);
}

.usecase-gallery {
    display: grid;
    gap: 34px;
}

.usecase-detail {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: var(--vr-shadow);
}

.usecase-detail-reverse .usecase-image {
    order: 2;
}

.usecase-detail-drone {
    border-color: rgba(228, 161, 27, .5);
    background: #fffaf0;
}

.usecase-detail-drone .usecase-content {
    background: linear-gradient(180deg, #fffaf0, var(--vr-white));
}

.usecase-image img {
    width: 100%;
    height: 100%;
    min-height: 430px;
    object-fit: cover;
}

.usecase-content {
    padding: 34px;
    display: grid;
    align-content: center;
}

.usecase-content h2 {
    margin: 0;
    color: var(--vr-blue);
    font-size: 2.05rem;
    line-height: 1.12;
}

.usecase-content p {
    color: var(--vr-muted);
}

.usecase-columns {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 20px;
}

.usecase-columns div {
    padding: 14px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-paper);
}

.usecase-columns strong,
.usecase-columns span {
    display: block;
}

.usecase-columns strong {
    color: var(--vr-green);
}

.usecase-columns span {
    margin-top: 5px;
    color: var(--vr-muted);
    font-size: .92rem;
}

.scenario-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.scenario-grid article {
    background: var(--vr-white);
}

.scenario-grid article > span {
    display: inline-flex;
    margin-bottom: 10px;
    color: var(--vr-green);
    font-weight: 900;
}

.usecase-protocol {
    display: grid;
    grid-template-columns: minmax(0, .82fr) minmax(360px, 1fr);
    gap: 46px;
    align-items: center;
    background: #edf4ee;
}

.usecase-protocol h2 {
    margin: 0;
    color: var(--vr-blue);
    font-size: 2.2rem;
    line-height: 1.12;
}

.usecase-protocol p {
    color: var(--vr-muted);
}

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

.protocol-flow span {
    min-height: 86px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px;
    color: var(--vr-blue);
    font-weight: 900;
    background: var(--vr-white);
    border: 1px solid var(--vr-line);
    border-radius: 8px;
}

.usecase-table {
    display: grid;
    overflow: hidden;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
}

.usecase-table > div {
    display: grid;
    grid-template-columns: .55fr 1.1fr 1fr;
    border-bottom: 1px solid var(--vr-line);
}

.usecase-table > div:last-child {
    border-bottom: 0;
}

.usecase-table span {
    padding: 16px;
    color: var(--vr-muted);
    border-right: 1px solid var(--vr-line);
}

.usecase-table span:first-child {
    color: var(--vr-blue);
    font-weight: 900;
}

.usecase-table span:last-child {
    border-right: 0;
}

.usecase-table .table-head {
    background: var(--vr-blue);
}

.usecase-table .table-head span {
    color: var(--vr-white);
    font-weight: 900;
}

@media (max-width: 1080px) {
    .site-header {
        padding: 14px 28px;
    }

    .hero {
        grid-template-columns: 1fr;
        padding: 86px 28px 54px;
    }

    .hero-panel {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .feature-grid,
    .tech-grid,
    .case-grid,
    .timeline {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .proof-strip,
    .module-grid,
    .workflow,
    .security-grid,
    .plans-grid,
    .faq-grid,
    .tech-system,
    .tech-matrix,
    .tech-layer-grid,
    .security-roadmap,
    .integration-grid,
    .scenario-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .image-feature,
    .image-feature-alt,
    .login-page,
    .usecase-detail,
    .usecase-protocol {
        grid-template-columns: 1fr;
    }

    .tech-system-stage::after {
        display: none;
    }

    .usecase-detail-reverse .usecase-image {
        order: initial;
    }

    .usecase-image img {
        min-height: 310px;
    }

    .architecture-flow {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .section,
    .page-hero,
    .site-footer {
        padding-left: 28px;
        padding-right: 28px;
    }

    .cta-band {
        margin-left: 28px;
        margin-right: 28px;
    }

    .legal-layout {
        grid-template-columns: 240px minmax(0, 1fr);
        gap: 24px;
    }

    .legal-panel {
        padding: 22px;
    }

    .legal-definition-list div {
        grid-template-columns: 170px minmax(0, 1fr);
    }
}

@media (max-width: 820px) {
    .nav-toggle {
        display: inline-flex;
    }

    .site-nav {
        position: absolute;
        top: 72px;
        right: 18px;
        left: 18px;
        display: none;
        padding: 12px;
        flex-direction: column;
        align-items: stretch;
        background: var(--vr-white);
        border: 1px solid var(--vr-line);
        border-radius: 8px;
        box-shadow: var(--vr-shadow);
    }

    .site-nav.is-open {
        display: flex;
    }

    .site-nav .nav-cta {
        margin-left: 0;
    }

    .hero {
        min-height: auto;
        padding-top: 72px;
        background-position: 62% center;
    }

    .hero h1,
    .page-hero h1 {
        font-size: 3rem;
    }

    .product-hero h1,
    .login-copy h1 {
        font-size: 3rem;
    }

    .hero-subtitle {
        font-size: 1.35rem;
    }

    .hero-panel,
    .lead-grid,
    .split-section,
    .contact-section,
    .footer-grid {
        grid-template-columns: 1fr;
    }

    .portal-capabilities,
    .mini-stats {
        grid-template-columns: 1fr;
    }

    .login-card {
        order: -1;
    }

    .portal-preview,
    .portal-capabilities {
        display: none;
    }

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

    .form-grid {
        grid-template-columns: 1fr;
    }

    .legal-layout {
        grid-template-columns: 1fr;
    }

    .legal-sidebar {
        position: static;
        grid-template-columns: 1fr;
    }

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

    .legal-side-block .legal-small {
        grid-column: 1 / -1;
    }

    .legal-summary-grid,
    .legal-summary-grid-wide {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cookie-notice {
        right: 16px;
        bottom: 16px;
        grid-template-columns: 1fr;
    }

    .cookie-notice-actions {
        justify-content: space-between;
    }
}

@media (max-width: 560px) {
    body {
        font-size: 15px;
    }

    .site-header {
        padding: 12px 18px;
    }

    .brand {
        min-width: 0;
    }

    .brand-note {
        display: none;
    }

    .section,
    .page-hero,
    .site-footer {
        padding: 52px 18px;
    }

    .hero {
        padding: 58px 18px 42px;
    }

    .hero h1,
    .page-hero h1 {
        font-size: 2.55rem;
    }

    .hero-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .legal-hero-meta {
        align-items: stretch;
        flex-direction: column;
    }

    .legal-summary-grid,
    .legal-summary-grid-wide,
    .legal-side-block {
        grid-template-columns: 1fr;
    }

    .legal-panel {
        padding: 18px;
    }

    .legal-panel h2 {
        font-size: 1.28rem;
    }

    .legal-definition-list div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .legal-table,
    .legal-table-compact {
        min-width: 620px;
    }

    .cookie-notice {
        right: 12px;
        bottom: 12px;
        width: calc(100vw - 24px);
        padding: 14px;
    }

    .cookie-notice-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .cookie-notice-actions .btn {
        width: 100%;
    }

    .feature-grid,
    .tech-grid,
    .case-grid,
    .timeline,
    .metrics,
    .architecture-flow,
    .proof-strip,
    .module-grid,
    .workflow,
    .security-grid,
    .plans-grid,
    .faq-grid,
    .tech-system,
    .tech-data-card,
    .tech-matrix,
    .tech-layer-grid,
    .security-roadmap,
    .integration-grid,
    .scenario-grid,
    .usecase-columns,
    .protocol-flow {
        grid-template-columns: 1fr;
    }

    .usecase-content {
        padding: 24px;
    }

    .usecase-content h2 {
        font-size: 1.72rem;
    }

    .usecase-image img {
        min-height: 230px;
    }

    .usecase-table {
        gap: 0;
        border: 0;
        background: transparent;
    }

    .usecase-table > div,
    .usecase-table .table-head {
        grid-template-columns: 1fr;
        margin-bottom: 12px;
        border: 1px solid var(--vr-line);
        border-radius: 8px;
        overflow: hidden;
        background: var(--vr-white);
    }

    .usecase-table .table-head {
        display: none;
    }

    .usecase-table span {
        border-right: 0;
        border-bottom: 1px solid var(--vr-line);
    }

    .usecase-table span:last-child {
        border-bottom: 0;
    }

    .section-heading h2,
    .split-section h2,
    .cta-band h2,
    .contact-info h2 {
        font-size: 2rem;
    }

    .cta-band {
        margin: 0 18px 52px;
        padding: 24px;
    }

    .contact-form-shell {
        padding: 18px;
    }

    .login-page {
        padding: 48px 18px;
    }

    .login-card {
        padding: 22px;
    }

    .login-options {
        align-items: flex-start;
        flex-direction: column;
    }
}

.admin-body {
    background: #eef3ee;
}

.admin-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
}

.admin-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    gap: 28px;
    padding: 24px;
    color: var(--vr-white);
    background: #123846;
}

.admin-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}

.admin-brand img {
    width: 46px;
    height: 46px;
}

.admin-brand strong,
.admin-brand small {
    display: block;
}

.admin-brand small {
    color: rgba(255, 255, 255, .72);
    text-transform: uppercase;
    font-size: .72rem;
    letter-spacing: .08em;
}

.admin-nav {
    display: grid;
    gap: 8px;
}

.admin-nav a,
.admin-logout button {
    min-height: 42px;
    display: flex;
    align-items: center;
    padding: 10px 12px;
    color: var(--vr-white);
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 8px;
    background: rgba(255, 255, 255, .06);
    text-decoration: none;
    font-weight: 700;
    cursor: pointer;
}

.admin-nav a:hover,
.admin-nav a:focus,
.admin-logout button:hover,
.admin-logout button:focus {
    background: rgba(228, 161, 27, .2);
    border-color: rgba(228, 161, 27, .55);
}

.admin-userbox {
    margin-top: auto;
    display: grid;
    gap: 8px;
}

.admin-userbox span,
.admin-userbox small {
    display: block;
}

.admin-userbox small {
    color: rgba(255, 255, 255, .72);
}

.admin-logout {
    margin: 8px 0 0;
}

.admin-logout button {
    width: 100%;
    justify-content: center;
    font-family: inherit;
    font-size: .95rem;
}

.admin-main {
    min-width: 0;
    padding: 38px;
}

.private-breadcrumb {
    margin: 0 0 18px;
}

.private-breadcrumb ol {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.private-breadcrumb li {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    color: var(--vr-muted);
    font-size: .88rem;
    font-weight: 900;
    line-height: 1.2;
    text-transform: uppercase;
}

.private-breadcrumb li + li::before {
    content: "/";
    margin-right: 8px;
    color: rgba(21, 62, 77, .42);
}

.private-breadcrumb a {
    color: var(--vr-blue);
    text-decoration: none;
}

.private-breadcrumb a:hover,
.private-breadcrumb a:focus {
    color: #102c24;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}

.private-breadcrumb [aria-current="page"] {
    color: var(--vr-amber);
}

.admin-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 26px;
}

.admin-page-header h1 {
    margin: 0 0 8px;
    color: var(--vr-blue);
    font-size: clamp(2rem, 4vw, 3.1rem);
    line-height: 1.05;
}

.admin-page-header p:not(.eyebrow) {
    max-width: 760px;
    margin: 0;
    color: var(--vr-muted);
}

.admin-page-header-actions {
    align-items: center;
}

.admin-alert {
    margin: 0 0 18px;
    padding: 12px 14px;
    border-radius: 8px;
    border: 1px solid var(--vr-line);
    background: var(--vr-white);
    color: var(--vr-blue);
    font-weight: 700;
}

.admin-alert-ok {
    border-color: rgba(31, 90, 61, .28);
    background: #eef7ef;
}

.admin-alert-warning {
    border-color: rgba(228, 161, 27, .42);
    background: #fff7e5;
}

.platform-modal-open {
    overflow: hidden;
}

.platform-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(8, 24, 30, .48);
    backdrop-filter: blur(3px);
}

.platform-modal-backdrop.is-closing {
    opacity: 0;
    transition: opacity .16s ease;
}

.platform-modal {
    position: relative;
    width: min(460px, 100%);
    padding: 28px;
    color: var(--vr-blue);
    border: 1px solid rgba(21, 62, 77, .14);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: 0 24px 70px rgba(8, 24, 30, .28);
    text-align: center;
}

.platform-modal:focus {
    outline: none;
}

.platform-modal-close {
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    color: var(--vr-muted);
    border: 1px solid var(--vr-line);
    border-radius: 50%;
    background: var(--vr-white);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
}

.platform-modal-close:hover,
.platform-modal-close:focus {
    color: var(--vr-blue);
    border-color: rgba(228, 161, 27, .7);
    background: #fff7e5;
    outline: none;
}

.platform-modal-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin-bottom: 16px;
    border-radius: 50%;
    background: #e7f3e9;
    color: #1f5a3d;
}

.platform-modal-warning .platform-modal-mark {
    background: #fff0d0;
    color: #936208;
}

.platform-modal-mark::before {
    content: "";
    width: 18px;
    height: 10px;
    border-left: 3px solid currentColor;
    border-bottom: 3px solid currentColor;
    transform: rotate(-45deg) translate(1px, -2px);
}

.platform-modal-warning .platform-modal-mark::before {
    width: 4px;
    height: 24px;
    border: 0;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 15px 0 -1px currentColor;
    transform: none;
}

.platform-modal h2 {
    margin: 0 0 10px;
    font-size: 1.35rem;
    line-height: 1.18;
}

.platform-modal p {
    margin: 0;
    color: var(--vr-muted);
    font-weight: 700;
    line-height: 1.55;
}

.platform-modal-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 22px;
}

.platform-modal-actions .btn {
    min-width: 128px;
}

.platform-confirm-modal {
    width: min(500px, 100%);
}

.platform-confirm-actions .btn-secondary {
    color: var(--vr-blue);
    border-color: rgba(21, 62, 77, .24);
    background: var(--vr-white);
}

.platform-confirm-actions .btn-secondary:hover,
.platform-confirm-actions .btn-secondary:focus {
    color: var(--vr-blue);
    border-color: rgba(228, 161, 27, .72);
    background: #fff7e5;
    outline: none;
}

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

.admin-metrics article,
.admin-action-grid a,
.admin-table-card,
.admin-form-card {
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: 0 16px 34px rgba(14, 32, 29, .08);
}

.admin-metrics article {
    padding: 22px;
}

.admin-metrics span,
.admin-metrics small {
    display: block;
    color: var(--vr-muted);
}

.admin-metrics strong {
    display: block;
    margin: 8px 0;
    color: var(--vr-blue);
    font-size: 2rem;
    line-height: 1.1;
    overflow-wrap: anywhere;
}

.admin-action-grid {
    margin-top: 24px;
}

.admin-action-grid a {
    display: grid;
    gap: 8px;
    padding: 22px;
    text-decoration: none;
}

.admin-action-grid strong {
    color: var(--vr-blue);
    font-size: 1.2rem;
}

.admin-action-grid span {
    color: var(--vr-muted);
}

.admin-table-card {
    overflow-x: auto;
}

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

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

.admin-table th {
    color: var(--vr-muted);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.admin-table td strong,
.admin-table td span {
    display: block;
}

.admin-table td span {
    color: var(--vr-muted);
}

.status-pill {
    display: inline-flex;
    width: fit-content;
    padding: 4px 9px;
    border-radius: 999px;
    color: var(--vr-muted);
    background: #f1f2ee;
    font-size: .84rem;
    font-weight: 800;
}

.status-ok {
    color: #1f5a3d;
    background: #e7f3e9;
}

.status-warning {
    color: #8a4f00;
    background: #fff1cf;
}

.status-danger {
    color: #8f1d1d;
    background: #ffe2df;
}

.table-actions {
    white-space: nowrap;
}

.admin-table th.table-actions-heading {
    text-align: right;
}

.admin-table td.table-actions-icon {
    text-align: right;
}

.table-action-group {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.table-actions a {
    display: inline-block;
    margin-left: 10px;
    color: var(--vr-blue);
    font-weight: 800;
}

.admin-form-card {
    max-width: 1040px;
    padding: 26px;
}

.admin-form-card-wide {
    max-width: 1180px;
}

.admin-form-card-small {
    max-width: 620px;
}

.admin-filter-card,
.api-key-once,
.admin-input-detail {
    margin-bottom: 18px;
}

.api-key-once h2,
.admin-input-detail h2 {
    margin: 0 0 10px;
    color: var(--vr-blue);
}

.api-key-once p {
    margin: 0 0 14px;
    color: var(--vr-muted);
    font-weight: 700;
}

.api-key-once input {
    font-family: Consolas, "Courier New", monospace;
}

.admin-page-header .btn-secondary {
    color: var(--vr-blue);
    border-color: rgba(21, 62, 77, .28);
    background: var(--vr-white);
}

.admin-page-header .btn-secondary:hover,
.admin-page-header .btn-secondary:focus {
    border-color: rgba(228, 161, 27, .7);
    background: #fff7e5;
}

.admin-inputs-table {
    min-width: 1040px;
}

.input-image-link {
    display: block;
    width: min(620px, 100%);
}

.input-image-link img {
    display: block;
    width: 100%;
    max-height: 460px;
    object-fit: contain;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: #f8faf7;
}

.json-pre {
    max-height: 520px;
    margin: 0;
    padding: 16px;
    overflow: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: #f8faf7;
    color: var(--vr-blue);
    font-family: Consolas, "Courier New", monospace;
    font-size: .9rem;
    line-height: 1.5;
}

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

.form-row-full {
    grid-column: 1 / -1;
}

.form-section-title {
    gap: 0;
    padding-top: 6px;
    border-top: 1px solid var(--vr-line);
}

.form-section-title:first-child {
    padding-top: 0;
    border-top: 0;
}

.form-section-title h2 {
    margin: 0;
    color: var(--vr-blue);
    font-size: 1rem;
}

.admin-form .check-group {
    justify-content: center;
    gap: 12px;
}

.admin-form .check-group small {
    color: var(--vr-muted);
}

.client-cell {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 240px;
}

.client-logo-thumb,
.client-portal-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    color: var(--vr-blue);
    background: #edf3ef;
    border: 1px solid var(--vr-line);
    font-weight: 900;
}

.client-logo-thumb {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    flex: 0 0 44px;
}

.client-logo-thumb img,
.client-portal-logo img,
.logo-preview img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.empty-table {
    color: var(--vr-muted);
    font-weight: 700;
    text-align: center;
}

.logo-dropzone {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    min-height: 124px;
    padding: 16px;
    border: 1px dashed rgba(21, 62, 77, .34);
    border-radius: 8px;
    background: #f8fbf8;
    cursor: pointer;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.logo-dropzone.is-dragover {
    border-color: var(--vr-green);
    background: #eef7ef;
    box-shadow: 0 12px 26px rgba(31, 90, 61, .12);
}

.logo-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.logo-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 92px;
    height: 92px;
    overflow: hidden;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
    color: var(--vr-muted);
    font-weight: 900;
}

.logo-dropzone-copy {
    display: grid;
    gap: 5px;
}

.logo-dropzone-copy strong {
    color: var(--vr-blue);
}

.logo-dropzone-copy span,
.admin-form small {
    color: var(--vr-muted);
}

.farm-definition-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(340px, .55fr);
    gap: 20px;
    align-items: start;
    margin-top: 22px;
}

.farm-map-workspace {
    margin-top: 22px;
    width: 100%;
    max-width: none;
}

.farm-camera-edit-layout {
    grid-template-columns: minmax(0, 1fr) minmax(420px, .42fr);
}

.farm-map-panel,
.farm-tool-card,
.farm-camera-form-card {
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: 0 16px 34px rgba(14, 32, 29, .08);
}

.farm-map-panel {
    overflow: hidden;
}

.farm-map-panel-full {
    width: 100%;
    max-width: none;
}

.farm-map-toolbar,
.table-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px;
    border-bottom: 1px solid var(--vr-line);
}

.farm-map-toolbar strong,
.farm-tool-card h2,
.table-card-header h2 {
    margin: 0;
    color: var(--vr-blue);
    font-size: 1rem;
}

.farm-map-toolbar span {
    display: block;
    color: var(--vr-muted);
    font-size: .92rem;
}

.farm-map-tools {
    align-items: flex-start;
    flex-wrap: wrap;
}

.map-tool-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.map-tool-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--vr-blue);
    border-color: rgba(21, 62, 77, .24);
    background: var(--vr-white);
}

.map-tool-button:hover,
.map-tool-button:focus,
.map-tool-button.is-active {
    color: var(--vr-blue);
    border-color: rgba(228, 161, 27, .75);
    background: #fff7e5;
    outline: none;
}

.tool-plus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: currentColor;
    color: var(--vr-white);
    font-size: 1rem;
    line-height: 1;
}

.map-tool-panel {
    padding: 16px;
    border-bottom: 1px solid var(--vr-line);
    background: #f8fbf8;
}

.map-tool-panel.is-hidden {
    display: none;
}

.map-inline-form {
    display: grid;
    gap: 14px;
}

.map-inline-form.is-submitting,
.farm-import-form.is-submitting,
.inline-form.is-submitting {
    opacity: .62;
    pointer-events: none;
}

.map-tool-copy {
    display: grid;
    gap: 3px;
}

.map-tool-copy strong {
    color: var(--vr-blue);
}

.map-tool-copy span {
    color: var(--vr-muted);
    font-weight: 700;
}

.map-tool-grid {
    display: grid;
    align-items: end;
    gap: 12px;
}

.map-tool-grid-parcel {
    grid-template-columns: minmax(240px, .45fr) minmax(240px, 1fr) auto;
}

.map-tool-grid-camera,
.map-tool-grid-drone {
    grid-template-columns: repeat(4, minmax(150px, 1fr));
}

.map-tool-actions-inline {
    display: flex;
    align-items: end;
    flex-wrap: wrap;
    gap: 10px;
}

.map-tool-actions-inline .btn,
.map-tool-grid-parcel .btn {
    min-height: 50px;
}

.map-tool-actions-inline .btn-secondary {
    color: var(--vr-blue);
    border-color: rgba(21, 62, 77, .28);
    background: var(--vr-white);
}

.map-tool-actions-inline .btn-secondary:hover,
.map-tool-actions-inline .btn-secondary:focus {
    color: var(--vr-blue);
    border-color: rgba(228, 161, 27, .7);
    background: #fff7e5;
}

.map-tool-grid .btn[disabled] {
    opacity: .48;
    cursor: not-allowed;
}

.farm-map-toolbar .sigpac-search-button,
.farm-tool-card .sigpac-search-button {
    color: var(--vr-blue);
    border-color: rgba(21, 62, 77, .28);
    background: var(--vr-white);
}

.farm-map-toolbar .sigpac-search-button:hover,
.farm-map-toolbar .sigpac-search-button:focus,
.farm-tool-card .sigpac-search-button:hover,
.farm-tool-card .sigpac-search-button:focus {
    color: var(--vr-blue);
    border-color: rgba(228, 161, 27, .75);
    background: #fff7e5;
    outline: none;
}

.farm-map {
    width: 100%;
    height: 640px;
    background: #e7ece7;
}

.farm-camera-marker {
    background: transparent;
    border: 0;
}

.farm-camera-pin {
    position: relative;
    display: block;
    width: 38px;
    height: 50px;
    filter: drop-shadow(0 8px 12px rgba(14, 32, 29, .28));
}

.farm-camera-pin::before {
    content: "";
    position: absolute;
    left: 10px;
    top: 19px;
    width: 18px;
    height: 22px;
    background: var(--vr-amber);
    border-right: 3px solid var(--vr-white);
    border-bottom: 3px solid var(--vr-white);
    transform: rotate(45deg);
    transform-origin: center;
}

.farm-camera-pin-head {
    position: absolute;
    left: 3px;
    top: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: #13271f;
    background: var(--vr-amber);
    border: 3px solid var(--vr-white);
    border-radius: 50%;
}

.farm-camera-icon {
    width: 17px;
    height: 17px;
    background: currentColor;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3Z'/%3E%3Ccircle cx='12' cy='13' r='3'/%3E%3C/svg%3E");
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3Z'/%3E%3Ccircle cx='12' cy='13' r='3'/%3E%3C/svg%3E");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
}

.farm-camera-marker-draft .farm-camera-pin::before,
.farm-camera-marker-draft .farm-camera-pin-head {
    background: var(--vr-blue);
}

.farm-camera-marker-draft .farm-camera-pin-head {
    color: var(--vr-white);
}

.farm-drone-marker {
    background: transparent;
    border: 0;
}

.farm-drone-pin {
    position: relative;
    display: block;
    width: 42px;
    height: 52px;
    filter: drop-shadow(0 8px 12px rgba(14, 32, 29, .3));
}

.farm-drone-pin::before {
    content: "";
    position: absolute;
    left: 11px;
    top: 20px;
    width: 20px;
    height: 23px;
    background: var(--vr-blue);
    border-right: 3px solid var(--vr-white);
    border-bottom: 3px solid var(--vr-white);
    transform: rotate(45deg);
    transform-origin: center;
}

.farm-drone-pin-head {
    position: absolute;
    left: 3px;
    top: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: var(--vr-white);
    background: var(--vr-blue);
    border: 3px solid var(--vr-white);
    border-radius: 50%;
}

.farm-drone-icon {
    width: 21px;
    height: 21px;
    background: currentColor;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 12h4'/%3E%3Cpath d='M12 10v4'/%3E%3Cpath d='M7 7l3 3'/%3E%3Cpath d='M17 7l-3 3'/%3E%3Cpath d='M7 17l3-3'/%3E%3Cpath d='M17 17l-3-3'/%3E%3Ccircle cx='5' cy='5' r='2'/%3E%3Ccircle cx='19' cy='5' r='2'/%3E%3Ccircle cx='5' cy='19' r='2'/%3E%3Ccircle cx='19' cy='19' r='2'/%3E%3C/svg%3E");
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 12h4'/%3E%3Cpath d='M12 10v4'/%3E%3Cpath d='M7 7l3 3'/%3E%3Cpath d='M17 7l-3 3'/%3E%3Cpath d='M7 17l3-3'/%3E%3Cpath d='M17 17l-3-3'/%3E%3Ccircle cx='5' cy='5' r='2'/%3E%3Ccircle cx='19' cy='5' r='2'/%3E%3Ccircle cx='5' cy='19' r='2'/%3E%3Ccircle cx='19' cy='19' r='2'/%3E%3C/svg%3E");
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
}

.farm-drone-marker-draft .farm-drone-pin::before,
.farm-drone-marker-draft .farm-drone-pin-head {
    background: var(--vr-amber);
}

.farm-drone-marker-draft .farm-drone-pin-head {
    color: #13271f;
}

.farm-map .leaflet-control-layers {
    border: 0;
    border-radius: 7px;
    box-shadow: 0 10px 22px rgba(14, 32, 29, .18);
    font: inherit;
    font-weight: 800;
}

.map-feedback {
    min-height: 42px;
    padding: 11px 16px;
    color: var(--vr-muted);
    border-top: 1px solid var(--vr-line);
    font-weight: 700;
}

.farm-side-panel {
    display: grid;
    gap: 16px;
}

.farm-tool-card {
    padding: 18px;
}

.farm-tool-card h2 {
    margin-bottom: 12px;
}

.compact-form {
    display: grid;
    gap: 12px;
}

.compact-form .form-submit {
    width: 100%;
}

.selected-feature {
    min-height: 42px;
    padding: 10px 12px;
    color: var(--vr-blue);
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: #f8fbf8;
    font-weight: 800;
}

.farm-import-modal[hidden] {
    display: none;
}

.farm-import-dialog {
    text-align: left;
}

.farm-import-dialog .platform-modal-mark {
    display: flex;
    margin-right: auto;
    margin-left: auto;
}

.farm-import-dialog h2,
.farm-import-dialog > p {
    text-align: center;
}

.farm-import-form {
    margin-top: 18px;
}

.farm-import-form small {
    color: var(--vr-muted);
    font-weight: 700;
}

.action-icon-upload {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='M17 8l-5-5-5 5'/%3E%3Cpath d='M12 3v12'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='M17 8l-5-5-5 5'/%3E%3Cpath d='M12 3v12'/%3E%3C/svg%3E");
}

.form-row-split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.farm-list-card {
    margin-top: 22px;
}

.inline-form {
    display: inline;
}

.inline-form button {
    padding: 0;
    color: var(--vr-blue);
    border: 0;
    background: transparent;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
    text-decoration: underline;
}

.inline-form + .inline-form {
    margin-left: 10px;
}

.inline-form-danger button {
    color: #b42318;
}

.table-actions-icon .inline-form {
    display: inline-flex;
}

.table-actions-icon .inline-form + .inline-form {
    margin-left: 0;
}

.table-actions-icon .icon-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-width: 116px;
    height: 34px;
    padding: 0 10px;
    color: var(--vr-blue);
    border: 1px solid rgba(21, 62, 77, .2);
    border-radius: 7px;
    background: var(--vr-white);
    font: inherit;
    font-size: .86rem;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}

.table-actions-icon .icon-action:hover,
.table-actions-icon .icon-action:focus {
    border-color: rgba(228, 161, 27, .75);
    background: #fff7e5;
    outline: none;
}

.table-actions-icon .icon-action-danger {
    color: #b42318;
    border-color: rgba(180, 35, 24, .24);
}

.table-actions-icon .icon-action-danger:hover,
.table-actions-icon .icon-action-danger:focus {
    border-color: rgba(180, 35, 24, .45);
    background: #fff1ef;
}

.action-icon {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    background: currentColor;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
}

.action-icon-edit {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z'/%3E%3C/svg%3E");
}

.action-icon-disable {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M10 15V9'/%3E%3Cpath d='M14 15V9'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M10 15V9'/%3E%3Cpath d='M14 15V9'/%3E%3C/svg%3E");
}

.action-icon-enable {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

.action-icon-delete {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M8 6V4h8v2'/%3E%3Cpath d='M19 6l-1 14H6L5 6'/%3E%3Cpath d='M10 11v6'/%3E%3Cpath d='M14 11v6'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M8 6V4h8v2'/%3E%3Cpath d='M19 6l-1 14H6L5 6'/%3E%3Cpath d='M10 11v6'/%3E%3Cpath d='M14 11v6'/%3E%3C/svg%3E");
}

.action-icon-filter {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21v-7'/%3E%3Cpath d='M4 10V3'/%3E%3Cpath d='M12 21v-9'/%3E%3Cpath d='M12 8V3'/%3E%3Cpath d='M20 21v-5'/%3E%3Cpath d='M20 12V3'/%3E%3Cpath d='M2 14h4'/%3E%3Cpath d='M10 8h4'/%3E%3Cpath d='M18 16h4'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21v-7'/%3E%3Cpath d='M4 10V3'/%3E%3Cpath d='M12 21v-9'/%3E%3Cpath d='M12 8V3'/%3E%3Cpath d='M20 21v-5'/%3E%3Cpath d='M20 12V3'/%3E%3Cpath d='M2 14h4'/%3E%3Cpath d='M10 8h4'/%3E%3Cpath d='M18 16h4'/%3E%3C/svg%3E");
}

.form-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 22px;
}

.admin-form .btn-secondary,
.admin-test-button {
    color: var(--vr-blue);
    border-color: rgba(21, 62, 77, .28);
    background: var(--vr-white);
}

.admin-form .btn-secondary:hover,
.admin-form .btn-secondary:focus,
.admin-test-button:hover,
.admin-test-button:focus {
    color: var(--vr-blue);
    border-color: rgba(228, 161, 27, .7);
    background: #fff7e5;
}

.recovery-card {
    max-width: 520px;
}

.admin-login-page {
    min-height: calc(100vh - 72px);
}

.client-portal-page {
    padding: 110px 24px 70px;
    background: #f4f7f2;
}

.client-portal-header,
.client-portal-grid,
.client-portal-detail {
    width: min(1120px, 100%);
    margin: 0 auto;
}

.client-portal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.client-portal-identity {
    display: flex;
    align-items: center;
    gap: 18px;
}

.client-portal-logo {
    width: 82px;
    height: 82px;
    border-radius: 8px;
    background: var(--vr-white);
}

.client-portal-header h1 {
    margin: 4px 0 6px;
    color: var(--vr-blue);
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.06;
}

.client-portal-header p:not(.eyebrow) {
    margin: 0;
    color: var(--vr-muted);
}

.client-portal-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 26px;
}

.client-portal-grid article,
.client-portal-detail {
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: 0 16px 34px rgba(14, 32, 29, .08);
}

.client-portal-grid article {
    display: grid;
    gap: 6px;
    padding: 20px;
}

.client-portal-grid span,
.client-portal-grid small {
    color: var(--vr-muted);
}

.client-portal-grid strong {
    color: var(--vr-blue);
    overflow-wrap: anywhere;
}

.client-portal-detail {
    margin-top: 18px;
    padding: 24px;
}

.client-portal-detail h2 {
    margin: 0 0 18px;
    color: var(--vr-blue);
}

.client-portal-detail dl {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 12px 20px;
    margin: 0;
}

.client-portal-detail dt {
    color: var(--vr-muted);
    font-weight: 800;
}

.client-portal-detail dd {
    margin: 0;
    color: var(--vr-blue);
}

.client-body {
    background: #eef3ee;
}

.client-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
}

.client-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px 18px;
    color: var(--vr-white);
    background: #143746;
}

.client-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px;
    color: var(--vr-white);
    text-decoration: none;
}

.client-brand img {
    width: 46px;
    height: 46px;
}

.client-brand span,
.client-brand small,
.client-userbox span,
.client-userbox small {
    display: block;
}

.client-brand strong {
    font-size: 1.1rem;
}

.client-brand small,
.client-userbox small {
    color: rgba(255, 255, 255, .72);
}

.client-nav {
    display: grid;
    gap: 8px;
}

.client-nav a {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 10px 12px;
    color: var(--vr-white);
    text-decoration: none;
    font-weight: 800;
    border-radius: 8px;
}

.client-nav a:hover,
.client-nav a:focus {
    color: #102c24;
    background: var(--vr-amber);
    outline: none;
}

.client-userbox {
    display: grid;
    gap: 10px;
    margin-top: auto;
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 8px;
    background: rgba(255, 255, 255, .08);
}

.client-userbox span {
    font-weight: 900;
    overflow-wrap: anywhere;
}

.client-logout button {
    width: 100%;
    min-height: 40px;
    border: 1px solid rgba(255, 255, 255, .26);
    border-radius: 8px;
    color: var(--vr-white);
    background: transparent;
    font-weight: 900;
    cursor: pointer;
}

.client-logout button:hover,
.client-logout button:focus {
    color: #102c24;
    background: var(--vr-amber);
    outline: none;
}

.client-main {
    min-width: 0;
    padding: 36px;
}

.client-page-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 22px;
}

.client-page-header-actions {
    align-items: center;
}

.client-title-block h1 {
    margin: 4px 0 6px;
    color: var(--vr-blue);
    font-size: clamp(2rem, 4vw, 3.5rem);
    line-height: 1.05;
}

.client-title-block p:not(.eyebrow) {
    margin: 0;
    color: var(--vr-muted);
    font-weight: 700;
}

.client-dashboard-hero {
    display: grid;
    grid-template-columns: minmax(320px, .9fr) minmax(0, 1.1fr);
    gap: 22px;
    align-items: stretch;
    margin-bottom: 18px;
    padding: 22px;
    border-radius: 8px;
    color: var(--vr-white);
    background: #143746;
    box-shadow: 0 18px 40px rgba(14, 32, 29, .18);
}

.client-hero-copy {
    display: grid;
    align-content: center;
    gap: 18px;
    min-height: 360px;
}

.client-hero-copy .eyebrow {
    color: var(--vr-amber);
}

.client-hero-copy h1 {
    margin: 0;
    max-width: 640px;
    font-size: clamp(2.4rem, 5vw, 5rem);
    line-height: 1;
}

.client-hero-copy p:not(.eyebrow) {
    margin: 0;
    color: rgba(255, 255, 255, .8);
    font-size: 1.1rem;
    font-weight: 800;
}

.client-hero-status {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    color: rgba(255, 255, 255, .82);
    font-weight: 800;
}

.client-hero-actions,
.client-drone-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.client-hero-actions .btn-secondary,
.client-drone-actions .btn-secondary {
    color: var(--vr-white);
    border-color: rgba(255, 255, 255, .32);
    background: transparent;
}

.client-hero-actions .btn-secondary:hover,
.client-hero-actions .btn-secondary:focus,
.client-drone-actions .btn-secondary:hover,
.client-drone-actions .btn-secondary:focus {
    color: #102c24;
    border-color: var(--vr-amber);
    background: var(--vr-amber);
}

.client-hero-map-shell {
    position: relative;
    min-height: 360px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 8px;
    background: #e8eee8;
}

.client-hero-map {
    width: 100%;
    height: 100%;
    min-height: 360px;
}

.client-hero-map-caption {
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 14px;
    border-radius: 8px;
    color: var(--vr-white);
    background: rgba(20, 55, 70, .9);
}

.client-hero-map-caption strong,
.client-hero-map-caption span {
    display: block;
}

.client-hero-map-caption span {
    color: rgba(255, 255, 255, .76);
    font-size: .9rem;
    font-weight: 700;
}

.client-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 18px;
}

.client-metrics article,
.client-panel,
.client-map-panel,
.client-farm-tile,
.client-drone-card {
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: 0 16px 34px rgba(14, 32, 29, .08);
}

.client-metrics article {
    display: grid;
    gap: 6px;
    padding: 20px;
}

.client-metrics span,
.client-metrics small {
    color: var(--vr-muted);
}

.client-metrics strong {
    color: var(--vr-blue);
    font-size: 2.05rem;
    line-height: 1.1;
}

.client-metrics .metric-date {
    font-size: 1.1rem;
}

.client-metrics-strong article {
    background: #fffdf8;
}

.client-dashboard-section {
    margin-bottom: 18px;
}

.client-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.client-section-heading h2 {
    margin: 3px 0 0;
    color: var(--vr-blue);
    font-size: clamp(1.6rem, 3vw, 2.4rem);
    line-height: 1.1;
}

.client-farm-showcase-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 660px), 1fr));
    gap: 18px;
}

.client-farm-list-showcase {
    padding: 18px 20px 20px;
}

.client-farm-showcase {
    display: grid;
    grid-template-columns: minmax(320px, 1.05fr) minmax(320px, .95fr);
    min-height: 360px;
    overflow: hidden;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: 0 16px 34px rgba(14, 32, 29, .08);
}

.client-farm-map-link {
    position: relative;
    display: block;
    min-height: 360px;
    color: inherit;
    text-decoration: none;
    background: #e8eee8;
}

.client-farm-mini-map {
    width: 100%;
    height: 100%;
    min-height: 360px;
}

.client-farm-mini-map .leaflet-control-attribution {
    display: none;
}

.client-farm-map-label {
    position: absolute;
    left: 14px;
    bottom: 14px;
    z-index: 420;
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    padding: 8px 12px;
    color: #102c24;
    border-radius: 8px;
    background: var(--vr-amber);
    font-weight: 900;
}

.client-farm-showcase-body {
    display: grid;
    align-content: space-between;
    gap: 18px;
    min-width: 0;
    padding: 20px;
}

.client-farm-showcase-title {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.client-farm-showcase-title h3 {
    margin: 0;
    color: var(--vr-blue);
    font-size: 1.5rem;
    line-height: 1.15;
}

.client-farm-showcase-title p {
    margin: 4px 0 0;
    color: var(--vr-muted);
    font-weight: 800;
}

.client-farm-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.client-farm-stats span {
    display: grid;
    gap: 2px;
    padding: 12px;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    color: var(--vr-muted);
    background: #f8faf7;
    font-weight: 800;
}

.client-farm-stats strong {
    color: var(--vr-blue);
    font-size: 1.4rem;
    line-height: 1;
}

.client-farm-detection {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    padding-top: 14px;
    border-top: 1px solid var(--vr-line);
}

.client-detection-thumb,
.client-last-detection-image,
.client-detection-card-media {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 8px;
    background: #e8eee8;
}

.client-detection-thumb {
    width: 120px;
    height: 86px;
}

.client-detection-thumb img,
.client-last-detection-image img,
.client-detection-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.client-detection-thumb-empty {
    border: 1px dashed rgba(21, 62, 77, .24);
}

.client-farm-detection span,
.client-farm-detection small {
    display: block;
    color: var(--vr-muted);
    font-weight: 800;
}

.client-farm-detection strong {
    display: block;
    color: var(--vr-blue);
    overflow-wrap: anywhere;
}

.client-dashboard-split {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(360px, .65fr);
    gap: 18px;
    margin-bottom: 18px;
}

.client-drone-command,
.client-last-detection-card {
    overflow: hidden;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: 0 16px 34px rgba(14, 32, 29, .08);
}

.client-drone-command {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    grid-template-areas:
        "copy media"
        "list media";
}

.client-drone-command-copy {
    grid-area: copy;
    display: grid;
    align-content: center;
    gap: 12px;
    padding: 24px;
    color: var(--vr-white);
    background: #143746;
}

.client-drone-command-copy .eyebrow {
    color: var(--vr-amber);
}

.client-drone-command-copy h2 {
    margin: 0;
    font-size: clamp(1.6rem, 3vw, 2.7rem);
    line-height: 1.08;
}

.client-drone-command-copy p:not(.eyebrow) {
    margin: 0;
    color: rgba(255, 255, 255, .78);
    font-weight: 700;
}

.client-drone-command-media {
    grid-area: media;
    min-height: 360px;
    background: #e8eee8;
}

.client-drone-command-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.client-drone-command-list {
    grid-area: list;
    display: grid;
    gap: 12px;
    padding: 18px 24px 24px;
}

.client-last-detection-image {
    height: 260px;
    margin: 18px;
    color: var(--vr-blue);
}

.client-last-detection-image .client-icon {
    width: 72px;
    height: 72px;
}

.client-last-detection-info,
.client-last-detection-empty {
    display: grid;
    gap: 6px;
    padding: 0 18px 18px;
}

.client-last-detection-empty {
    justify-items: start;
    padding: 26px 18px;
}

.client-last-detection-info strong,
.client-last-detection-empty strong {
    color: var(--vr-blue);
    font-size: 1.2rem;
}

.client-last-detection-info span,
.client-last-detection-info small,
.client-last-detection-empty p {
    color: var(--vr-muted);
    font-weight: 800;
}

.client-last-detection-info a {
    color: var(--vr-blue);
    font-weight: 900;
}

.client-detection-gallery {
    display: grid;
    grid-template-columns: repeat(5, minmax(180px, 1fr));
    gap: 14px;
}

.client-detection-card {
    display: grid;
    overflow: hidden;
    color: inherit;
    text-decoration: none;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: 0 14px 28px rgba(14, 32, 29, .07);
}

.client-detection-card-media {
    height: 140px;
    color: var(--vr-blue);
    border-radius: 0;
}

.client-detection-card-copy {
    display: grid;
    gap: 5px;
    padding: 14px;
}

.client-detection-card-copy strong,
.client-detection-card-copy span,
.client-detection-card-copy small {
    display: block;
}

.client-detection-card-copy strong {
    color: var(--vr-blue);
}

.client-detection-card-copy span,
.client-detection-card-copy small {
    color: var(--vr-muted);
    font-weight: 800;
}

.client-detection-card-copy em {
    font-style: normal;
}

.client-dashboard-grid,
.client-detail-grid,
.client-profile-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(330px, .55fr);
    gap: 18px;
    margin-bottom: 18px;
}

.client-detail-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.client-profile-layout {
    grid-template-columns: minmax(280px, .42fr) minmax(0, 1fr) minmax(0, 1fr);
}

.client-panel,
.client-map-panel {
    margin-bottom: 18px;
    overflow: hidden;
}

.client-panel-large {
    min-width: 0;
}

.client-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--vr-line);
}

.client-panel-header h2,
.client-farm-tile h2,
.client-drone-card h2,
.client-profile-card h2 {
    margin: 0;
    color: var(--vr-blue);
    font-size: 1.08rem;
}

.client-panel-header p,
.client-farm-tile p,
.client-drone-card p,
.client-profile-card p {
    margin: 3px 0 0;
    color: var(--vr-muted);
    font-weight: 700;
}

.client-panel-header a {
    color: var(--vr-blue);
    font-weight: 900;
}

.client-main .btn-secondary {
    color: var(--vr-blue);
    border-color: rgba(21, 62, 77, .28);
    background: var(--vr-white);
}

.client-main .btn-secondary:hover,
.client-main .btn-secondary:focus {
    color: var(--vr-blue);
    border-color: rgba(228, 161, 27, .72);
    background: #fff7e5;
    outline: none;
}

.client-dashboard-hero .btn-secondary,
.client-drone-command-copy .btn-secondary {
    color: var(--vr-white);
    border-color: rgba(255, 255, 255, .32);
    background: transparent;
}

.client-dashboard-hero .btn-secondary:hover,
.client-dashboard-hero .btn-secondary:focus,
.client-drone-command-copy .btn-secondary:hover,
.client-drone-command-copy .btn-secondary:focus {
    color: #102c24;
    border-color: var(--vr-amber);
    background: var(--vr-amber);
}

.client-card-list,
.client-compact-list,
.client-table-wrap {
    padding: 18px 20px;
}

.client-farm-card {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) repeat(3, 110px) auto;
    gap: 14px;
    align-items: center;
    padding: 14px 0;
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid var(--vr-line);
}

.client-farm-card:first-of-type {
    padding-top: 0;
}

.client-farm-card:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.client-farm-card strong,
.client-compact-row strong {
    display: block;
    color: var(--vr-blue);
}

.client-farm-card small,
.client-compact-row small,
.client-tile-footer span {
    display: block;
    color: var(--vr-muted);
    font-weight: 700;
}

.client-farm-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 9px 14px;
    color: #102c24;
    border-radius: 8px;
    background: var(--vr-amber);
    font-weight: 900;
    white-space: nowrap;
}

.client-compact-list {
    display: grid;
    gap: 12px;
}

.client-compact-row {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.client-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    color: var(--vr-blue);
    border-radius: 8px;
    background: #edf5ef;
}

.client-icon::before {
    content: "";
    width: 22px;
    height: 22px;
    background: currentColor;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
}

.client-icon-camera::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3Z'/%3E%3Ccircle cx='12' cy='13' r='3'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3Z'/%3E%3Ccircle cx='12' cy='13' r='3'/%3E%3C/svg%3E");
}

.client-icon-drone::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 12h4'/%3E%3Cpath d='M12 10v4'/%3E%3Cpath d='M7 7l3 3'/%3E%3Cpath d='M17 7l-3 3'/%3E%3Cpath d='M7 17l3-3'/%3E%3Cpath d='M17 17l-3-3'/%3E%3Ccircle cx='5' cy='5' r='2'/%3E%3Ccircle cx='19' cy='5' r='2'/%3E%3Ccircle cx='5' cy='19' r='2'/%3E%3Ccircle cx='19' cy='19' r='2'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 12h4'/%3E%3Cpath d='M12 10v4'/%3E%3Cpath d='M7 7l3 3'/%3E%3Cpath d='M17 7l-3 3'/%3E%3Cpath d='M7 17l3-3'/%3E%3Cpath d='M17 17l-3-3'/%3E%3Ccircle cx='5' cy='5' r='2'/%3E%3Ccircle cx='19' cy='5' r='2'/%3E%3Ccircle cx='5' cy='19' r='2'/%3E%3Ccircle cx='19' cy='19' r='2'/%3E%3C/svg%3E");
}

.client-icon-parcel::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 7 6-4 6 4 6-4v14l-6 4-6-4-6 4Z'/%3E%3Cpath d='M9 3v14'/%3E%3Cpath d='M15 7v14'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 7 6-4 6 4 6-4v14l-6 4-6-4-6 4Z'/%3E%3Cpath d='M9 3v14'/%3E%3Cpath d='M15 7v14'/%3E%3C/svg%3E");
}

.client-icon-filter::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21v-7'/%3E%3Cpath d='M4 10V3'/%3E%3Cpath d='M12 21v-9'/%3E%3Cpath d='M12 8V3'/%3E%3Cpath d='M20 21v-5'/%3E%3Cpath d='M20 12V3'/%3E%3Cpath d='M2 14h4'/%3E%3Cpath d='M10 8h4'/%3E%3Cpath d='M18 16h4'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21v-7'/%3E%3Cpath d='M4 10V3'/%3E%3Cpath d='M12 21v-9'/%3E%3Cpath d='M12 8V3'/%3E%3Cpath d='M20 21v-5'/%3E%3Cpath d='M20 12V3'/%3E%3Cpath d='M2 14h4'/%3E%3Cpath d='M10 8h4'/%3E%3Cpath d='M18 16h4'/%3E%3C/svg%3E");
}

.client-farm-grid,
.client-drone-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    padding: 18px 20px 20px;
}

.client-farm-tile,
.client-drone-card {
    display: grid;
    gap: 18px;
    padding: 20px;
    box-shadow: none;
}

.client-farm-tile dl,
.client-drone-card dl {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.client-drone-card dl {
    grid-template-columns: 140px minmax(0, 1fr);
}

.client-farm-tile dt,
.client-drone-card dt {
    color: var(--vr-muted);
    font-weight: 900;
}

.client-farm-tile dd,
.client-drone-card dd {
    margin: 0;
    color: var(--vr-blue);
    font-size: 1.3rem;
    font-weight: 900;
}

.client-drone-card dd {
    font-size: 1rem;
    overflow-wrap: anywhere;
}

.client-tile-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.client-map-panel {
    overflow: hidden;
}

.client-readonly-map {
    height: 620px;
}

.client-detail-map {
    height: 360px;
    min-height: 360px;
}

.client-map-legend {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.client-map-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--vr-muted);
    font-weight: 800;
}

.legend-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.legend-camera {
    background: var(--vr-amber);
}

.legend-drone {
    background: var(--vr-blue);
}

.legend-detection {
    background: #c22727;
}

.client-detection-marker {
    background: transparent;
    border: 0;
}

.client-detection-dot {
    display: block;
    width: 24px;
    height: 24px;
    border: 4px solid var(--vr-white);
    border-radius: 50%;
    background: #c22727;
    box-shadow: 0 8px 14px rgba(14, 32, 29, .3);
}

.client-table-wrap {
    overflow-x: auto;
}

.client-table {
    min-width: 980px;
}

.client-detections-table {
    min-width: 1120px;
}

.client-filter-panel {
    padding: 20px;
}

.client-filter-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 18px;
}

.client-filter-toolbar-main {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    min-width: 0;
}

.client-filter-toolbar h2 {
    margin: 0 0 3px;
    color: var(--vr-blue);
    font-size: 1.2rem;
    line-height: 1.15;
}

.client-filter-toolbar p {
    margin: 0;
    color: var(--vr-muted);
    font-weight: 800;
}

.client-filter-chips {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 9px;
}

.client-filter-chip {
    display: inline-flex;
    max-width: 360px;
    min-height: 30px;
    align-items: center;
    padding: 6px 10px;
    color: var(--vr-blue);
    border: 1px solid rgba(21, 62, 77, .16);
    border-radius: 999px;
    background: #f8faf7;
    font-size: .86rem;
    font-weight: 900;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.client-filter-chip-muted {
    color: var(--vr-muted);
}

.client-filter-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    flex: 0 0 auto;
}

.client-filter-actions .btn {
    gap: 8px;
}

.client-filter-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    padding: 0 7px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .86);
    color: #102c24;
    font-size: .82rem;
    font-weight: 900;
}

.filter-modal-backdrop[hidden] {
    display: none;
}

.filter-modal {
    width: min(760px, 100%);
    padding: 0;
    text-align: left;
}

.filter-modal-header {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    padding: 24px 60px 20px 24px;
    border-bottom: 1px solid var(--vr-line);
}

.filter-modal-header h2 {
    margin: 0 0 5px;
    color: var(--vr-blue);
}

.filter-modal-header p {
    margin: 0;
    max-width: 560px;
    color: var(--vr-muted);
    font-weight: 800;
}

.filter-modal-form {
    padding: 22px 24px 24px;
}

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

.filter-modal-actions {
    justify-content: flex-end;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--vr-line);
}

.client-detection-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .42fr);
    gap: 18px;
}

.client-detail-list {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    gap: 12px 18px;
    margin: 0;
    padding: 20px;
}

.client-detail-list dt {
    color: var(--vr-muted);
    font-weight: 900;
}

.client-detail-list dd {
    margin: 0;
    color: var(--vr-blue);
    overflow-wrap: anywhere;
}

.client-profile-card,
.client-profile-identity {
    display: grid;
    align-content: start;
    gap: 18px;
}

.client-profile-card {
    padding: 20px;
}

.client-password-form {
    padding: 20px;
}

.client-profile-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 94px;
    height: 94px;
    overflow: hidden;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    color: var(--vr-blue);
    background: #f8faf7;
    font-size: 1.4rem;
    font-weight: 900;
}

.client-profile-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.client-drone-card-head {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.client-drone-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr);
    gap: 0;
    margin-bottom: 22px;
    overflow: hidden;
    border: 1px solid rgba(20, 55, 70, .18);
    border-radius: 8px;
    background: #143746;
    box-shadow: 0 18px 38px rgba(14, 32, 29, .12);
}

.client-drone-hero-copy {
    display: grid;
    align-content: center;
    gap: 18px;
    min-height: 390px;
    padding: 34px;
    color: var(--vr-white);
}

.client-drone-hero-copy .eyebrow {
    color: var(--vr-amber);
}

.client-drone-hero-copy h1 {
    margin: 0;
    color: var(--vr-white);
    font-size: clamp(2.9rem, 6vw, 5.2rem);
    line-height: .96;
}

.client-drone-hero-copy p:not(.eyebrow) {
    max-width: 680px;
    margin: 0;
    color: rgba(255, 255, 255, .78);
    font-size: 1.08rem;
    font-weight: 800;
}

.client-drone-hero-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.client-drone-hero-metrics article {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 8px;
    background: rgba(255, 255, 255, .08);
}

.client-drone-hero-metrics span,
.client-drone-hero-metrics small {
    color: rgba(255, 255, 255, .72);
    font-weight: 800;
}

.client-drone-hero-metrics strong {
    color: var(--vr-white);
    font-size: clamp(1.25rem, 2vw, 1.75rem);
    line-height: 1.05;
    overflow-wrap: normal;
    word-break: normal;
}

.client-drone-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.client-drone-hero .btn-secondary {
    color: var(--vr-white);
    border-color: rgba(255, 255, 255, .36);
    background: rgba(255, 255, 255, .08);
}

.client-drone-hero .btn-secondary:hover,
.client-drone-hero .btn-secondary:focus {
    color: var(--vr-white);
    border-color: rgba(255, 255, 255, .7);
    background: rgba(255, 255, 255, .15);
}

.client-drone-hero-media {
    position: relative;
    min-height: 390px;
    background: #dfe8df;
}

.client-drone-hero-media img,
.client-drone-card-media img,
.client-drone-video-shell img,
.client-drone-detection-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.client-drone-hero-media::after {
    position: absolute;
    inset: 0;
    content: "";
    background: linear-gradient(180deg, rgba(20, 55, 70, .03), rgba(20, 55, 70, .36));
}

.client-drone-signal-card {
    position: absolute;
    right: 20px;
    bottom: 20px;
    left: 20px;
    z-index: 1;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 14px;
    border-radius: 8px;
    color: var(--vr-blue);
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 14px 28px rgba(14, 32, 29, .18);
}

.client-drone-signal-card strong,
.client-drone-signal-card small {
    display: block;
}

.client-drone-signal-card small {
    color: var(--vr-muted);
    font-weight: 800;
}

.client-drone-ops-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 640px), 1fr));
    gap: 18px;
    margin-bottom: 18px;
}

.client-drone-ops-card {
    overflow: hidden;
    border: 1px solid var(--vr-line);
    border-radius: 8px;
    background: var(--vr-white);
    box-shadow: 0 16px 34px rgba(14, 32, 29, .08);
}

.client-drone-ops-top {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    min-height: 190px;
}

.client-drone-card-media {
    position: relative;
    overflow: hidden;
    background: #dfe8df;
}

.client-drone-live-badge {
    position: absolute;
    right: 12px;
    bottom: 12px;
    padding: 6px 10px;
    border-radius: 999px;
    color: var(--vr-blue);
    background: rgba(255, 255, 255, .92);
    font-size: .82rem;
    font-weight: 900;
}

.client-drone-card-summary {
    display: grid;
    align-content: center;
    gap: 10px;
    min-width: 0;
    padding: 22px;
}

.client-drone-card-summary h3 {
    margin: 0;
    color: var(--vr-blue);
    font-size: clamp(1.6rem, 3vw, 2.35rem);
    line-height: 1.02;
}

.client-drone-card-summary p,
.client-drone-primary-links span {
    margin: 0;
    color: var(--vr-muted);
    font-weight: 800;
}

.client-drone-primary-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
}

.client-drone-primary-links a {
    color: var(--vr-blue);
    font-weight: 900;
}

.client-drone-detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid var(--vr-line);
}

.client-drone-detail-grid div {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 14px 18px;
    border-right: 1px solid var(--vr-line);
    border-bottom: 1px solid var(--vr-line);
}

.client-drone-detail-grid div:nth-child(3n) {
    border-right: 0;
}

.client-drone-detail-grid span,
.client-drone-last-detection span,
.client-drone-last-detection small,
.client-drone-subheading span,
.client-drone-empty-block small,
.client-drone-mission-copy small,
.client-drone-history-meta strong {
    color: var(--vr-muted);
    font-weight: 800;
}

.client-drone-detail-grid strong,
.client-drone-last-detection strong,
.client-drone-empty-block strong,
.client-drone-mission-copy strong {
    color: var(--vr-blue);
    overflow-wrap: anywhere;
}

.client-drone-last-detection {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    padding: 18px;
    border-bottom: 1px solid var(--vr-line);
}

.client-drone-last-detection > div {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.client-drone-detection-media {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 94px;
    overflow: hidden;
    border-radius: 8px;
    color: var(--vr-blue);
    background: #e8eee8;
}

.client-drone-detection-empty {
    border: 1px dashed rgba(21, 62, 77, .24);
}

.client-drone-last-detection a,
.client-drone-mission-copy a {
    color: var(--vr-blue);
    font-weight: 900;
}

.client-drone-missions-strip {
    display: grid;
    gap: 12px;
    padding: 18px;
}

.client-drone-subheading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.client-drone-subheading h4 {
    margin: 0;
    color: var(--vr-blue);
    font-size: 1rem;
}

.client-drone-empty-block {
    display: grid;
    gap: 6px;
    padding: 14px;
    background: #f8faf7;
}

.client-drone-mission-row {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 12px;
    align-items: stretch;
    padding: 12px 0 0;
    border-top: 1px solid var(--vr-line);
}

.client-drone-mission-row:first-of-type {
    border-top: 0;
    padding-top: 0;
}

.client-drone-video-shell {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 102px;
    overflow: hidden;
    border-radius: 8px;
    color: var(--vr-white);
    background: #143746;
}

.client-drone-video-shell::after {
    position: absolute;
    inset: 0;
    content: "";
    background: rgba(20, 55, 70, .42);
}

.client-drone-video-shell small {
    position: absolute;
    right: 10px;
    bottom: 8px;
    z-index: 1;
    color: var(--vr-white);
    font-size: .78rem;
    font-weight: 900;
}

.client-drone-play {
    position: relative;
    z-index: 1;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .9);
}

.client-drone-play::before {
    position: absolute;
    top: 50%;
    left: 52%;
    width: 0;
    height: 0;
    content: "";
    transform: translate(-42%, -50%);
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-left: 14px solid var(--vr-blue);
}

.client-drone-mission-copy {
    display: grid;
    align-content: center;
    gap: 5px;
    min-width: 0;
}

.client-drone-mission-copy em {
    color: var(--vr-muted);
    font-style: normal;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.client-drone-history-panel .client-panel-header {
    margin-bottom: 0;
}

.client-drone-mission-timeline {
    display: grid;
}

.client-drone-history-card {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 18px;
    padding: 20px;
    border-top: 1px solid var(--vr-line);
}

.client-drone-history-card:first-child {
    border-top: 0;
}

.client-drone-history-body,
.client-drone-history-title {
    min-width: 0;
}

.client-drone-history-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.client-drone-history-title h3 {
    margin: 8px 0 2px;
    color: var(--vr-blue);
    font-size: 1.25rem;
}

.client-drone-history-title p {
    margin: 0;
    color: var(--vr-muted);
    font-weight: 800;
}

.client-drone-history-meta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.client-drone-history-meta span {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 10px;
    background: #f8faf7;
    color: var(--vr-blue);
    font-weight: 900;
    overflow-wrap: anywhere;
}

@media (max-width: 1100px) {
    .client-drone-hero {
        grid-template-columns: 1fr;
    }

    .client-drone-hero-copy {
        min-height: auto;
    }

    .client-drone-hero-media {
        min-height: 320px;
    }

    .client-drone-history-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .client-drone-hero-metrics,
    .client-drone-ops-top,
    .client-drone-detail-grid,
    .client-drone-last-detection,
    .client-drone-mission-row,
    .client-drone-history-card {
        grid-template-columns: 1fr;
    }

    .client-drone-detail-grid div,
    .client-drone-detail-grid div:nth-child(3n) {
        border-right: 0;
    }

    .client-drone-card-media {
        min-height: 220px;
    }

    .client-drone-detection-media {
        height: 170px;
    }

    .client-drone-video-shell {
        min-height: 160px;
    }

    .client-drone-history-title,
    .client-drone-subheading {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 560px) {
    .client-drone-hero-copy,
    .client-drone-card-summary,
    .client-drone-missions-strip,
    .client-drone-last-detection,
    .client-drone-history-card {
        padding: 16px;
    }

    .client-drone-hero-copy h1 {
        font-size: 3rem;
    }

    .client-drone-hero-media {
        min-height: 260px;
    }

    .client-drone-hero-actions,
    .client-drone-hero-actions .btn,
    .client-drone-history-title .btn {
        width: 100%;
    }

    .client-drone-history-meta {
        grid-template-columns: 1fr;
    }
}

.empty-state {
    margin: 0;
    color: var(--vr-muted);
    font-weight: 800;
}

@media (max-width: 980px) {
    .admin-shell {
        grid-template-columns: 1fr;
    }

    .admin-sidebar {
        position: static;
        height: auto;
    }

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

    .admin-main {
        padding: 26px 18px;
    }

    .admin-metrics,
    .admin-action-grid,
    .admin-form-grid,
    .client-portal-grid,
    .client-shell,
    .client-metrics,
    .client-dashboard-hero,
    .client-dashboard-grid,
    .client-dashboard-split,
    .client-detail-grid,
    .client-farm-showcase,
    .client-farm-showcase-grid,
    .client-profile-layout,
    .client-detection-layout,
    .farm-definition-layout,
    .farm-camera-edit-layout {
        grid-template-columns: 1fr;
    }

    .client-sidebar {
        position: static;
        height: auto;
    }

    .client-nav {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .client-main {
        padding: 26px 18px;
    }

    .client-farm-grid,
    .client-drone-grid,
    .client-detection-gallery {
        grid-template-columns: 1fr;
    }

    .client-drone-command {
        grid-template-columns: 1fr;
        grid-template-areas:
            "copy"
            "media"
            "list";
    }

    .client-drone-command-media {
        min-height: 300px;
    }

    .client-readonly-map {
        height: 500px;
    }

    .farm-map {
        height: 460px;
    }

    .map-tool-grid-parcel,
    .map-tool-grid-camera,
    .map-tool-grid-drone {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .map-tool-actions-inline {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }

    .logo-dropzone {
        grid-template-columns: 78px minmax(0, 1fr);
    }

    .logo-preview {
        width: 78px;
        height: 78px;
    }

    .logo-pick-button {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .client-portal-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .client-filter-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .client-filter-actions {
        justify-content: flex-start;
        width: 100%;
    }
}

@media (max-width: 560px) {
    .admin-page-header,
    .admin-page-header-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-nav {
        grid-template-columns: 1fr;
    }

    .client-page-header,
    .client-page-header-actions,
    .client-panel-header,
    .client-section-heading,
    .client-tile-footer,
    .client-hero-map-caption,
    .client-farm-showcase-title,
    .farm-map-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .client-nav {
        grid-template-columns: 1fr;
    }

    .client-main {
        padding: 22px 14px;
    }

    .client-metrics article,
    .client-panel-header,
    .client-card-list,
    .client-compact-list,
    .client-table-wrap,
    .client-farm-grid,
    .client-drone-grid,
    .client-farm-showcase-body,
    .client-drone-command-copy,
    .client-drone-command-list {
        padding: 16px;
    }

    .client-farm-card {
        grid-template-columns: 1fr 1fr;
    }

    .client-dashboard-hero {
        padding: 16px;
    }

    .client-hero-copy {
        min-height: auto;
    }

    .client-hero-map,
    .client-hero-map-shell,
    .client-farm-mini-map,
    .client-farm-map-link {
        min-height: 300px;
    }

    .client-farm-detection {
        grid-template-columns: 1fr;
    }

    .client-filter-toolbar-main,
    .filter-modal-header {
        grid-template-columns: 1fr;
    }

    .client-filter-actions,
    .client-filter-actions .btn,
    .filter-modal-actions,
    .filter-modal-actions .btn {
        width: 100%;
    }

    .filter-modal {
        max-height: calc(100vh - 32px);
        overflow-y: auto;
    }

    .filter-modal-header {
        padding: 22px 48px 18px 18px;
    }

    .filter-modal-form {
        padding: 18px;
    }

    .filter-modal-grid {
        grid-template-columns: 1fr;
    }

    .client-detection-thumb {
        width: 100%;
        height: 160px;
    }

    .client-drone-command-media {
        min-height: 240px;
    }

    .client-farm-tile dl,
    .client-drone-card dl,
    .client-farm-stats,
    .client-detail-list {
        grid-template-columns: 1fr;
    }

    .client-readonly-map,
    .client-detail-map {
        height: 380px;
        min-height: 380px;
    }

    .admin-form-card {
        padding: 18px;
    }

    .form-actions {
        justify-content: stretch;
    }

    .form-actions .btn,
    .form-actions button {
        width: 100%;
    }

    .client-portal-page {
        padding: 92px 16px 52px;
    }

    .client-portal-identity {
        align-items: flex-start;
        flex-direction: column;
    }

    .client-portal-detail dl {
        grid-template-columns: 1fr;
        gap: 4px 0;
    }

    .client-portal-detail dd {
        margin-bottom: 12px;
    }

    .farm-map-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .map-tool-actions,
    .map-tool-actions-inline {
        align-items: stretch;
        flex-direction: column;
        justify-content: stretch;
    }

    .map-tool-grid-parcel,
    .map-tool-grid-camera,
    .map-tool-grid-drone {
        grid-template-columns: 1fr;
    }

    .map-tool-actions .btn,
    .map-tool-actions-inline .btn,
    .map-tool-grid-parcel .btn {
        width: 100%;
    }

    .farm-map {
        height: 380px;
    }

    .form-row-split {
        grid-template-columns: 1fr;
    }
}

.admin-form-section-title {
    border-top: 1px solid rgba(17, 24, 39, 0.1);
    color: #111827;
    font-size: 1rem;
    margin: 6px 0 0;
    padding-top: 16px;
}

.field-hint {
    color: #64748b;
    display: block;
    font-size: 0.82rem;
    margin-top: 6px;
}

.readonly-metric {
    background: #f8fafc;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 8px;
    display: grid;
    gap: 4px;
    padding: 12px;
}

.readonly-metric span,
.table-note {
    color: #64748b;
    display: block;
    font-size: 0.84rem;
}

.client-header-actions,
.table-actions,
.client-card-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.client-card-actions {
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    margin-top: 14px;
    padding-top: 14px;
}

.btn-small {
    min-height: 34px;
    padding: 8px 12px;
}

.drone-mission-layout {
    align-items: start;
    grid-template-columns: minmax(0, 1fr) minmax(430px, .4fr);
}

.drone-mission-panel {
    min-width: 0;
}

.drone-mission-panel .client-panel-header {
    align-items: flex-start;
    background: #fbfdf9;
    padding: 22px 24px 20px;
}

.drone-mission-panel .client-panel-header p {
    max-width: 34ch;
    line-height: 1.55;
}

.drone-mission-form {
    gap: 0;
    padding: 20px 24px 24px;
}

.drone-mission-form .admin-form-grid {
    grid-template-columns: 1fr;
    gap: 16px;
}

.drone-mission-form .form-row {
    gap: 8px;
}

.drone-mission-form .form-row label {
    color: var(--vr-blue);
    font-size: .92rem;
    font-weight: 900;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.drone-mission-form .form-control {
    min-height: 50px;
    min-width: 0;
    padding: 12px 14px;
}

.drone-mission-form .form-control[readonly] {
    background: #f8faf7;
    color: var(--vr-blue);
    font-weight: 800;
}

.drone-mission-form textarea.form-control {
    min-height: 96px;
}

.drone-mission-form .form-actions {
    align-items: stretch;
    background: #fbfdf9;
    border-top: 1px solid var(--vr-line);
    gap: 10px;
    justify-content: stretch;
    margin: 20px -24px -24px;
    padding: 18px 24px;
}

.drone-mission-form .form-actions .btn,
.drone-mission-form .form-actions button {
    flex: 1 1 0;
    justify-content: center;
}

.mission-note {
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    margin-top: 18px;
    padding-top: 18px;
}

.mission-note h2 {
    font-size: 1rem;
    margin: 0 0 8px;
}

.json-pre-small {
    max-height: 180px;
    overflow: auto;
    white-space: pre-wrap;
}

@media (max-width: 760px) {
    .client-header-actions,
    .table-actions,
    .client-card-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .client-header-actions .btn,
    .table-actions .btn,
    .client-card-actions .btn {
        width: 100%;
    }

    .drone-mission-layout {
        grid-template-columns: 1fr;
    }

    .drone-mission-form .admin-form-grid {
        grid-template-columns: 1fr;
    }

    .drone-mission-form .form-actions {
        flex-direction: column;
    }
}