/* Shared glass surfaces for contact, service discovery, and legal documents. */
.contact-overlay, .mobile-search-overlay, .legal-modal {
    --dialog-border: rgba(255, 255, 255, 0.29);
    --dialog-line: rgba(255, 255, 255, 0.19);
    --service-rgb: 245, 60, 75;
}
[data-interest="pentest"] { --service-rgb: 245, 60, 75; }
[data-interest="satellite"] { --service-rgb: 70, 145, 255; }
[data-interest="quantum"] { --service-rgb: 160, 100, 255; }
[data-interest="ai"] { --service-rgb: 30, 215, 145; }
.contact-overlay-panel, .mobile-search-dialog, .legal-modal-box {
    border: 1px solid var(--dialog-border);
    border-radius: 20px;
    background:
        radial-gradient(ellipse at 30% 0%, rgba(245, 60, 75, 0.075), transparent 55%),
        linear-gradient(150deg, #0e0e11, #07080a 75%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 28px 90px rgba(0, 0, 0, 0.6);
}
.contact-overlay-close, .mobile-search-close, .legal-modal-close {
    width: 44px; height: 44px; min-width: 44px; min-height: 44px;
    border: 1px solid var(--dialog-line); border-radius: 12px;
    background: rgba(255, 255, 255, 0.03); color: #e9edf3;
}
.contact-overlay-close:hover, .mobile-search-close:hover, .legal-modal-close:hover,
.contact-overlay-close:focus-visible, .mobile-search-close:focus-visible, .legal-modal-close:focus-visible {
    border-color: var(--accent); background: rgba(245, 60, 75, 0.09); color: var(--accent-light);
    box-shadow: 0 0 18px rgba(245, 60, 75, 0.12);
}
.contact-overlay :focus-visible, .mobile-search-overlay :focus-visible, .legal-modal :focus-visible { outline-color: var(--accent); }
/* These surfaces receive initial touch focus without highlighting an action. */
.contact-overlay-panel:focus, .legal-modal-box:focus { outline: none; }
.contact-direct-actions { margin-top: 12px; gap: 14px; }
.contact-action-btn {
    border-color: var(--dialog-border); background: rgba(255, 255, 255, 0.025);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    transition: border-color 0.25s, background 0.25s, box-shadow 0.25s, transform 0.25s;
}
.contact-action-btn:hover, .contact-action-btn:focus-visible {
    border-color: var(--accent); background: rgba(245, 60, 75, 0.06); transform: translateY(-1px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 0 22px rgba(245, 60, 75, 0.12);
}
.contact-action-btn:hover svg, .contact-action-btn:focus-visible svg { color: var(--accent-light); }
.contact-form { gap: 18px; }
.form-group { gap: 8px; }
.form-group label { color: #b8c1ce; font-size: 0.74rem; letter-spacing: 0.06em; }
.form-group:focus-within label { color: var(--accent-light); }
.form-group input, .form-group select, .form-group textarea, .service-picker-trigger {
    border: 1px solid var(--dialog-border); border-radius: 10px;
    background-color: rgba(0, 0, 0, 0.25); color: #f4f6fa;
    box-shadow: none;
    transition: border-color 0.2s;
}
.form-group input:hover, .form-group textarea:hover, .service-picker-trigger:hover { border-color: rgba(245, 60, 75, 0.6); }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus, .service-picker-trigger:focus-visible,
.service-picker-trigger[aria-expanded="true"] {
    outline: none; border-color: var(--accent);
    box-shadow: none;
}
.form-group input::placeholder, .form-group textarea::placeholder { color: #aeb7c4; }

/* The service picker shares search colours while retaining one native form value. */
.service-picker { position: relative; min-width: 0; }
.service-picker-trigger {
    display: flex; width: 100%; align-items: center; gap: 12px;
    min-height: 52px; padding: 12px 14px; text-align: left; font-size: 16px;
    color: #aeb7c4; cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.service-picker-trigger.has-value { color: #f4f6fa; }
.service-picker-trigger.has-value::before {
    content: ''; width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%;
    background: rgb(var(--service-rgb));
}
.service-picker-value { flex: 1; min-width: 0; }
.service-picker-trigger svg { flex-shrink: 0; color: #c6cfda; transition: transform 0.2s; }
.service-picker-trigger[aria-expanded="true"] svg { transform: rotate(180deg); }
.service-picker-options {
    position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 15;
    padding: 6px; overflow-y: auto; overscroll-behavior: contain;
    border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 12px;
    background: linear-gradient(145deg, #151319, #0a0b0f);
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.service-picker.opens-up .service-picker-options { top: auto; bottom: calc(100% + 8px); }
.service-picker-group + .service-picker-group { margin-top: 6px; border-top: 1px solid rgba(255, 255, 255, 0.14); }
.service-picker-group-label { padding: 12px; color: #c6cfda; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; }
.service-picker-value, .service-picker-option span { overflow-wrap: anywhere; }
.service-picker-option {
    display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 12px;
    border: 1px solid transparent; border-radius: 8px;
    color: #e3e8ef; cursor: pointer; font-size: 0.91rem; line-height: 1.4;
}
.service-picker-option::before {
    content: ''; width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%;
    background: rgb(var(--service-rgb));
}
.service-picker-option span { flex: 1; }
.service-picker-option:hover, .service-picker-option.is-active {
    border-color: rgba(var(--service-rgb), 0.65);
    background: linear-gradient(110deg, rgba(var(--service-rgb), 0.25), rgba(var(--service-rgb), 0.055));
}
.service-picker-option[aria-selected="true"]::after { content: '✓'; color: #fff; }

/* Service colours sit within the shared red-accented interface. */
.mobile-search-dialog { width: min(640px, 100%); }
/* Keep the border on the scrolling shell so its corners cannot be clipped by a parent radius. */
.mobile-search-panel {
    padding: 24px;
    border: 0;
    border-radius: inherit;
    background: transparent;
    box-shadow: none;
    -webkit-mask-image: none;
    mask-image: none;
}
.mobile-search-head { margin-bottom: 20px; }
.mobile-search-kicker { font-family: var(--font-display); font-size: 1.15rem; letter-spacing: 0.01em; text-transform: none; }
.nav-service-search-mobile-overlay .service-search-shell {
    min-height: 54px; border: 1px solid var(--dialog-border); border-radius: 12px;
    padding-inline: 16px; background: rgba(0, 0, 0, 0.3);
}
.nav-service-search-mobile-overlay .service-search-shell:focus-within {
    border-color: var(--accent); box-shadow: none;
}
.service-search-icon { color: var(--accent-light); }
.nav-service-search-mobile-overlay .service-search-dropdown {
    margin-top: 18px; padding: 6px; max-height: min(52dvh, 430px);
    border: 1px solid var(--dialog-line); border-radius: 14px;
    background: rgba(0, 0, 0, 0.22); box-shadow: none;
    scrollbar-color: var(--scrollbar-thumb) rgba(255, 255, 255, 0.04);
}
.service-search-results { gap: 5px; }
.nav-service-search-mobile-overlay .service-search-result { align-items: center; padding: 15px 14px; border-radius: 9px; }
.service-search-result-label { font-weight: 500; line-height: 1.4; }
.service-search-result-meta { font-size: 0.65rem; letter-spacing: 0.06em; color: #aab4c1; }
.service-search-result-arrow {
    width: 32px; height: 32px; border-radius: 9px; color: #e3e8ef;
    border-color: rgba(var(--service-rgb), 0.48);
    background: linear-gradient(135deg, rgba(var(--service-rgb), 0.38), rgba(var(--service-rgb), 0.15));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
}
.service-search-result:hover, .service-search-result.is-active {
    border-color: rgba(var(--service-rgb), 0.58);
    background: linear-gradient(110deg, rgba(var(--service-rgb), 0.21), rgba(var(--service-rgb), 0.035));
}
.service-search-result:hover .service-search-result-arrow,
.service-search-result.is-active .service-search-result-arrow {
    border-color: rgba(var(--service-rgb), 0.85); background: rgba(var(--service-rgb), 0.36); color: #fff;
    box-shadow: 0 0 18px rgba(var(--service-rgb), 0.18);
}

/* Legal copy is unchanged; hierarchy, spacing, and boundaries are refined. */
.legal-modal-box { width: min(760px, 100%); max-height: min(86dvh, 860px, 100%); }
.legal-tabs { padding: 16px 76px 16px 20px; gap: 8px; border-bottom: 1px solid var(--dialog-line); background: rgba(255, 255, 255, 0.02); }
.legal-tab {
    min-height: 44px; margin: 0; padding: 10px 15px; border: 1px solid transparent; border-radius: 10px;
    font-size: 0.84rem; text-transform: none; letter-spacing: 0; white-space: nowrap;
}
.legal-tab.active { border-color: rgba(245, 60, 75, 0.55); background: rgba(245, 60, 75, 0.10); color: #fff; }
.legal-tab:hover { color: #fff; border-color: var(--accent); background: rgba(245, 60, 75, 0.07); }
.legal-modal-close { top: 16px; right: 16px; }
.legal-content { padding: 28px 32px 36px; min-height: 0; scroll-padding-top: 24px; }
.legal-content h2 { font-size: clamp(1.5rem, 4vw, 1.9rem); font-weight: 500; margin-bottom: 8px; }
.legal-content h3 { font-size: 1.02rem; margin-top: 28px; margin-bottom: 10px; font-weight: 500; }
.legal-content p, .legal-content ul li { font-size: 0.91rem; line-height: 1.8; color: #c9d0db; overflow-wrap: anywhere; }
.legal-content .legal-updated { font-size: 0.73rem; color: #a4afbd; margin-bottom: 26px; }
.legal-content ul li { padding-left: 18px; }
.legal-content ul li::before { width: 4px; height: 4px; border-radius: 50%; background: #9daabd; top: 0.8em; }
.legal-email { color: #f0f4fa; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, 0.35); text-underline-offset: 3px; }
.legal-email:hover { color: var(--accent-light); text-decoration-color: var(--accent); }
@media (max-width: 480px) {
    .mobile-search-panel { padding: 16px; }
    .mobile-search-head { margin-bottom: 16px; }
    .nav-service-search-mobile-overlay .service-search-result { padding: 12px 10px; }
    .contact-overlay-panel { padding-inline: 16px; }
    .legal-tabs { padding: 12px 58px 12px 12px; gap: 4px; }
    .legal-tab { font-size: 0.73rem; padding-inline: 8px; }
    .legal-modal-close { top: 12px; right: 8px; }
    .legal-content { padding: 24px 20px 28px; }
}

/* One close button everywhere: identical glyph, size, box, colour and hover. */
.panel-close, .contact-overlay-close, .mobile-search-close, .legal-modal-close {
    display: flex !important; align-items: center !important; justify-content: center !important;
    width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important;
    padding: 0 !important; margin: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important; border-radius: 12px !important;
    background: rgba(255, 255, 255, 0.03) !important; color: #e9edf3 !important;
    font-family: var(--font-body) !important; font-size: 1.6rem !important; font-weight: 300 !important; line-height: 1 !important;
    cursor: pointer; transition: border-color 0.3s, background 0.3s, color 0.3s, opacity 0.3s;
}
.panel-close:hover, .contact-overlay-close:hover, .mobile-search-close:hover, .legal-modal-close:hover,
.panel-close:focus-visible, .contact-overlay-close:focus-visible, .mobile-search-close:focus-visible, .legal-modal-close:focus-visible {
    border-color: var(--accent) !important; background: rgba(245, 60, 75, 0.09) !important; color: var(--accent-light) !important;
    box-shadow: 0 0 18px rgba(245, 60, 75, 0.12);
}
/* Inter's × ink sits a touch low: lift it so it reads centred. */
.panel-close, .contact-overlay-close, .mobile-search-close, .legal-modal-close { padding-bottom: 3px !important; }
/* Sit each close button on the container's content inset, not in the corner. */
.contact-overlay-panel { padding-top: 88px; }
.contact-overlay-close { top: 28px; right: 36px; }
.legal-modal-close { top: 16px; right: 20px; }
.panel.active .panel-close { top: 32px; right: 28px; }
@media (max-width: 768px) {
    .panel.active .panel-close { top: max(32px, calc(20px + env(safe-area-inset-top))); right: 20px; }
}
@media (max-width: 480px) {
    .contact-overlay-panel { padding-top: 76px; }
    .contact-overlay-close { top: 20px; right: 16px; }
    .legal-modal-close { top: 12px; right: 12px; }
    .panel.active .panel-close { top: max(14px, env(safe-area-inset-top)); right: 14px; }
}