/*
Theme Name: NovaModus Terminal
Theme URI: https://novamodus.xyz
Description: Terminal-themed WordPress theme for payments, banking & digital assets advisory. Features a dark terminal aesthetic with responsive design, custom hero section, services grid, blog/news functionality, and contact form integration.
Version: 1.0.0
Requires at least: 5.0
Tested up to: 6.4
Requires PHP: 7.4
Author: Anthony Ralphs
Author URI: https://novamodus.xyz
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: novamodus-terminal
Tags: dark, terminal, fintech, business, one-column, custom-menu, custom-logo, editor-style, featured-images, sticky-post, threaded-comments, translation-ready

NovaModus Terminal WordPress Theme, (C) 2025
NovaModus Terminal is distributed under the terms of the GNU GPL.
*/

:root {
    --bg: #0b0f14;
    --panel: #0f141c;
    --panel-2: #0c1118;
    --text: #e6f1ff;
    --muted: #9aa4b2;
    --accent: #2af598;
    --accent-2: #00e1a6;
    --danger: #ff5f56;
    --warn: #ffbd2e;
    --ok: #27c93f;
    --border: #1b2533;
    --focus: rgba(42, 245, 152, 0.35);
    --shadow: 0 10px 30px rgba(0,0,0,0.5);
    --container-max: 1100px;
    --container-pad: 4vw;
    --nav-height: 56px;
    --space: clamp(10px, 1.6vw, 16px);
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
    margin: 0;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    background: var(--bg);
    color: var(--text);
    line-height: 1.6;
    letter-spacing: 0.2px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    padding-top: env(safe-area-inset-top, 0);
    padding-left: env(safe-area-inset-left, 0);
    padding-right: env(safe-area-inset-right, 0);
}

/* Background Grid Effect */
.bg-grid::before {
    content: "";
    position: fixed;
    inset: 0;
    background:
        linear-gradient(to bottom, rgba(255,255,255,0.02) 1px, transparent 1px) 0 0 / 100% 24px,
        linear-gradient(to right, rgba(255,255,255,0.02) 1px, transparent 1px) 0 0 / 24px 100%;
    pointer-events: none;
    z-index: -2;
}
.bg-grid::after {
    content: "";
    position: fixed;
    inset: 0;
    background: radial-gradient(1000px 600px at 20% 0%, rgba(42,245,152,0.06), rgba(0,0,0,0) 60%),
        radial-gradient(1000px 600px at 80% 100%, rgba(0,225,166,0.06), rgba(0,0,0,0) 60%);
    pointer-events: none;
    z-index: -1;
}

.container { 
    width: min(var(--container-max), 100%); 
    padding: 0 var(--container-pad); 
    margin: 0 auto; 
}

/* Header / Navigation */
header.nav {
    position: sticky; 
    top: 0; 
    z-index: 50;
    background: rgba(11,15,20,0.75);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--border);
    padding-top: env(safe-area-inset-top, 0);
}
.nav-inner { 
    display: flex; 
    align-items: center; 
    justify-content: space-between; 
    padding: 10px 0; 
    min-height: var(--nav-height); 
    position: relative; 
}
.brand { 
    color: var(--text); 
    font-weight: 700; 
    letter-spacing: 0.5px; 
    text-decoration: none;
}
.brand small { 
    color: var(--muted); 
    font-weight: 400; 
}

.menu-toggle {
    display: none;
    background: transparent; 
    color: var(--text); 
    border: 1px solid var(--border); 
    border-radius: 8px;
    padding: 8px 10px; 
    font-size: 0.95rem; 
    line-height: 1; 
    cursor: pointer;
}
.menu-toggle:focus-visible { 
    outline: 2px solid var(--accent); 
    outline-offset: 2px; 
}

nav.nav-links { 
    display: flex; 
    align-items: center; 
    gap: 18px; 
}
nav.nav-links a { 
    color: var(--muted); 
    text-decoration: none; 
    font-size: 0.95rem; 
    padding: 6px 2px; 
    border-radius: 6px; 
}
nav.nav-links a:hover, 
nav.nav-links a:focus-visible { 
    color: var(--text); 
    outline: none; 
    box-shadow: 0 0 0 3px var(--focus); 
}

/* Mobile Navigation */
@media (max-width: 820px) {
    .menu-toggle { display: inline-block; }
    nav.nav-links {
        position: absolute; 
        right: var(--container-pad); 
        top: calc(100% + 8px);
        background: #0b1219; 
        border: 1px solid var(--border); 
        border-radius: 12px; 
        box-shadow: var(--shadow);
        padding: 10px; 
        display: none; 
        flex-direction: column; 
        width: min(280px, 92vw);
    }
    nav.nav-links.open { display: flex; }
    nav.nav-links a { 
        padding: 10px 12px; 
        margin: 0; 
        width: 100%;
    }
}

/* Terminal Window */
.terminal { 
    background: linear-gradient(180deg, var(--panel), var(--panel-2)); 
    border: 1px solid var(--border); 
    border-radius: 12px; 
    box-shadow: var(--shadow); 
    overflow: hidden; 
}
.term-topbar { 
    display: flex; 
    align-items: center; 
    gap: 10px; 
    padding: calc(var(--space) * 0.8) calc(var(--space) * 0.9); 
    border-bottom: 1px solid var(--border); 
    background: #0a0f15; 
}
.dots { 
    display: inline-flex; 
    gap: 8px; 
    align-items: center; 
}
.dot { 
    width: 12px; 
    height: 12px; 
    border-radius: 50%; 
    display: inline-block; 
}
.dot.red { background: var(--danger); } 
.dot.yellow { background: var(--warn); } 
.dot.green { background: var(--ok); }
.term-title { 
    color: var(--muted); 
    font-size: 0.9rem; 
}
.term-body { 
    padding: calc(var(--space) * 1.2); 
}
.prompt-line { 
    display: flex; 
    align-items: baseline; 
    gap: calc(var(--space) * 0.8); 
    flex-wrap: wrap; 
}
.prompt { 
    color: var(--accent); 
    font-weight: 600; 
}
.typed { 
    color: var(--text); 
    position: relative; 
}
.typed::after { 
    content: ""; 
    display: inline-block; 
    width: 9px; 
    height: 1.2em; 
    background: var(--accent); 
    margin-left: 4px; 
    animation: blink 1s steps(1) infinite; 
    vertical-align: -2px; 
}
@keyframes blink { 50% { opacity: 0; } }

/* Hero Section */
.hero { 
    padding: calc(var(--space) * 2) 0 calc(var(--space) * 1.2); 
}
.hero h1 { 
    font-size: clamp(1.4rem, 2.3vw + 1rem, 2.4rem); 
    margin: calc(var(--space) * 0.8) 0 calc(var(--space) * 0.3); 
}
.hero p.sub { 
    color: var(--muted); 
    margin: 0 0 var(--space); 
    max-width: none; 
}

/* Buttons */
.btn-row { 
    display: flex; 
    gap: var(--space); 
    flex-wrap: wrap; 
    margin-top: var(--space); 
}
.btn { 
    display: inline-flex; 
    align-items: center; 
    justify-content: center; 
    padding: 10px 16px; 
    border-radius: 8px; 
    border: 1px solid var(--accent); 
    color: #02150d; 
    background: linear-gradient(180deg, var(--accent), var(--accent-2)); 
    text-decoration: none; 
    font-weight: 700; 
    letter-spacing: 0.3px; 
    box-shadow: 0 0 0 0 rgba(42,245,152,0.35); 
    transition: transform 0.06s ease, box-shadow 0.2s ease, filter 0.2s ease; 
    min-height: 44px; 
    cursor: pointer;
}
.btn:hover, 
.btn:focus-visible { 
    transform: translateY(-1px); 
    filter: brightness(1.03); 
    box-shadow: 0 8px 22px rgba(42,245,152,0.2); 
    outline: none; 
}
.btn.ghost { 
    background: transparent; 
    color: var(--accent); 
    border-color: var(--border); 
    box-shadow: none; 
}
.btn.ghost:hover, 
.btn.ghost:focus-visible { 
    border-color: var(--accent); 
    box-shadow: 0 0 0 4px var(--focus); 
}

/* Sections */
section { 
    padding: calc(var(--space) * 1.6) 0; 
    scroll-margin-top: calc(var(--nav-height) + 12px); 
}
section h3 { 
    font-size: 1.1rem; 
    color: var(--accent); 
    text-transform: uppercase; 
    letter-spacing: 1px; 
    margin-bottom: calc(var(--space) * 0.8); 
}
section h2 { 
    font-size: clamp(1.2rem, 1.4vw + 1rem, 2rem); 
    margin: 0 0 calc(var(--space) * 0.5); 
}
.muted { 
    color: var(--muted); 
}

/* Grid Layout */
.grid { 
    display: grid; 
    grid-template-columns: repeat(3, 1fr); 
    gap: var(--space); 
}
@media (max-width: 980px) { 
    .grid { 
        grid-template-columns: repeat(2, 1fr); 
    } 
}
@media (max-width: 640px) { 
    .grid { 
        grid-template-columns: 1fr; 
    } 
}

/* Cards */
.card { 
    background: linear-gradient(180deg, #0c1118, #0a0f15); 
    border: 1px solid var(--border); 
    border-radius: 12px; 
    padding: clamp(14px, 3.2vw, 18px); 
    transition: border-color 0.15s ease, box-shadow 0.2s ease, transform 0.06s ease; 
}
.card:hover { 
    border-color: rgba(42,245,152,0.55); 
    box-shadow: 0 0 0 3px rgba(42,245,152,0.12); 
    transform: translateY(-1px); 
}
.card h4 { 
    margin: 0 0 6px; 
    font-size: 1.05rem; 
    color: var(--text); 
}
.card h4 a {
    color: var(--text);
    text-decoration: none;
}
.card h4 a:hover {
    color: var(--accent);
}
.card p { 
    margin: 0 0 10px; 
    color: var(--muted); 
    font-size: 0.95rem; 
}
.tag { 
    display: inline-block; 
    padding: 3px 8px; 
    border-radius: 999px; 
    border: 1px solid var(--border); 
    color: var(--accent); 
    font-size: 0.8rem; 
    margin-top: 6px; 
}

/* Lists */
.list { 
    list-style: none; 
    padding: 0; 
    margin: 0; 
}
.list li { 
    padding-left: 18px; 
    position: relative; 
    margin: calc(var(--space) * 0.6) 0; 
    color: var(--muted); 
}
.list li::before { 
    content: "$"; 
    position: absolute; 
    left: 0; 
    color: var(--accent); 
}

/* Contact Section */
.contact { 
    display: grid; 
    grid-template-columns: 1.1fr 0.9fr; 
    gap: var(--space); 
}
.contact.single { 
    grid-template-columns: 1fr; 
}
@media (max-width: 900px) { 
    .contact { 
        grid-template-columns: 1fr; 
    } 
}

/* Forms */
form .row { 
    display: grid; 
    grid-template-columns: 1fr 1fr; 
    gap: calc(var(--space) * 0.8); 
}
@media (max-width: 640px) { 
    form .row { 
        grid-template-columns: 1fr; 
    } 
}

label, 
.wpcf7 label, 
.gfield_label, 
.wpforms-field-label { 
    display: block; 
    font-size: 0.9rem; 
    color: var(--muted); 
    margin: 8px 0 6px; 
}

input[type="text"], 
input[type="email"], 
input[type="tel"], 
input[type="url"],
input[type="search"],
textarea, 
select,
.wpcf7 input[type="text"], 
.wpcf7 input[type="email"], 
.wpcf7 textarea, 
.wpcf7 select,
.gfield input, 
.gfield textarea, 
.gfield select,
.wpforms-field input, 
.wpforms-field textarea, 
.wpforms-field select {
    width: 100%; 
    color: var(--text); 
    background: #0b1117; 
    border: 1px solid var(--border); 
    border-radius: 10px;
    padding: 10px 12px; 
    outline: none; 
    transition: border-color 0.15s ease, box-shadow 0.2s ease; 
    min-height: 44px;
    font-family: inherit;
}

textarea, 
.wpcf7 textarea, 
.gfield textarea, 
.wpforms-field textarea { 
    min-height: 140px; 
    resize: vertical; 
}

input:focus, 
textarea:focus, 
select:focus,
.wpcf7 input:focus, 
.wpcf7 textarea:focus, 
.wpcf7 select:focus,
.gfield input:focus, 
.gfield textarea:focus, 
.gfield select:focus,
.wpforms-field input:focus, 
.wpforms-field textarea:focus, 
.wpforms-field select:focus {
    border-color: var(--accent); 
    box-shadow: 0 0 0 4px var(--focus);
}

.wpcf7-submit, 
.gform_button, 
.wpforms-submit,
button[type="submit"] { 
    display: inline-flex; 
    align-items: center; 
    justify-content: center; 
    padding: 10px 16px; 
    border-radius: 8px;
    border: 1px solid var(--accent); 
    color: #02150d; 
    background: linear-gradient(180deg, var(--accent), var(--accent-2));
    font-weight: 700; 
    letter-spacing: 0.3px; 
    cursor: pointer; 
    min-height: 44px;
    transition: transform 0.06s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.wpcf7-submit:hover, 
.gform_button:hover, 
.wpforms-submit:hover,
button[type="submit"]:hover {
    transform: translateY(-1px); 
    filter: brightness(1.03); 
    box-shadow: 0 8px 22px rgba(42,245,152,0.2);
}

.help { 
    font-size: 0.85rem; 
    color: var(--muted); 
}

.note { 
    border: 1px dashed var(--border); 
    border-radius: 10px; 
    padding: 12px; 
    color: var(--muted); 
    background: #0a1016; 
}
.note.success, 
.wpcf7-mail-sent-ok { 
    border-color: rgba(39,201,63,0.6); 
    background: #0d1a12; 
    color: #c9f3d0; 
}
.note.error, 
.wpcf7-validation-errors { 
    border-color: #7a2a2a; 
    background: #160d0d; 
    color: #ffc2c2; 
}

/* Section Spacing */
#about .card { 
    margin-top: var(--space); 
}
#services .grid { 
    margin-top: var(--space); 
}
#contact .contact { 
    margin-top: var(--space); 
}

/* Post Meta */
.post-meta {
    color: var(--muted);
    font-size: 0.9rem;
    margin: calc(var(--space) * 0.5) 0;
}
.post-meta a {
    color: var(--accent);
    text-decoration: none;
}
.post-meta a:hover {
    text-decoration: underline;
}

/* Pagination */
.pagination {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-top: calc(var(--space) * 2);
}
.pagination a,
.pagination span {
    padding: 8px 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text);
    text-decoration: none;
    transition: all 0.2s ease;
}
.pagination a:hover {
    border-color: var(--accent);
    background: rgba(42,245,152,0.1);
}
.pagination .current {
    background: var(--accent);
    color: #02150d;
    border-color: var(--accent);
}

/* 404 Page */
.error-404 {
    text-align: center;
    padding: calc(var(--space) * 4) 0;
}
.error-404 h1 {
    font-size: 4rem;
    color: var(--accent);
    margin: 0;
}

/* Comments */
.comments-area {
    margin-top: calc(var(--space) * 2);
}
.comment-list {
    list-style: none;
    padding: 0;
}
.comment {
    margin-bottom: var(--space);
    padding: var(--space);
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 12px;
}

/* Footer */
.footer { 
    padding: calc(var(--space) * 1.5) 0 calc(var(--space) * 2.5 + env(safe-area-inset-bottom, 0)); 
    color: var(--muted); 
    text-align: center; 
    border-top: 1px solid var(--border); 
    margin-top: var(--space); 
}

/* Accessibility */
:focus-visible { 
    outline: 2px solid var(--accent); 
    outline-offset: 2px; 
}

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

/* Motion Preferences */
@media (prefers-reduced-motion: reduce) {
    * { 
        animation-duration: 0.001ms !important; 
        animation-iteration-count: 1 !important; 
        transition-duration: 0.001ms !important; 
    }
    .typed::after { 
        animation: none !important; 
    }
}

/* WordPress Core Alignment */
.alignleft {
    float: left;
    margin-right: var(--space);
}
.alignright {
    float: right;
    margin-left: var(--space);
}
.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* CF7 Response Messages - Terminal Theme */
.wpcf7 form .wpcf7-response-output {
    display: block;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 0.95rem;
    line-height: 1.6;
    letter-spacing: 0.2px;
    border-radius: 10px;
    padding: 12px;
    margin: calc(var(--space) * 0.8) 0 0;
    transition: border-color 0.15s ease, box-shadow 0.2s ease;
    color: var(--muted); 
}

/* Success - matches .note.success */
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form .wpcf7-response-output.wpcf7-mail-sent-ok {
    border: 1px solid rgba(39,201,63,0.6);
    background: #0d1a12;
    color: var(--muted); 
}

/* Validation Errors - matches .note.error */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form .wpcf7-response-output.wpcf7-validation-errors {
    border: 1px solid #7a2a2a;
    background: #160d0d;
    color: #ffc2c2;
}

/* Acceptance Missing (terms checkbox) */
.wpcf7 form .wpcf7-response-output.wpcf7-acceptance-missing {
    border: 1px solid rgba(255,189,46,0.6);
    background: #1a1610;
    color: #ffe4a8;
}

/* Spam/Aborted */
.wpcf7 form .wpcf7-response-output.wpcf7-aborted,
.wpcf7 form .wpcf7-response-output.wpcf7-spam-blocked {
    border: 1px dashed var(--border);
    background: #0a1016;
    color: var(--muted);
}

/* Optional: Add terminal-style prompt prefix to success messages */
.wpcf7 form.sent .wpcf7-response-output::before {
    content: "$ ";
    color: var(--muted); 
    font-weight: 600;
    margin-right: 4px;
}

/* Optional: Add error indicator to validation messages */
.wpcf7 form.invalid .wpcf7-response-output::before {
    content: "! ";
    color: var(--danger);
    font-weight: 600;
    margin-right: 4px;
}

/* After successful send, return fields to neutral look */
.wpcf7 form.sent input,
.wpcf7 form.sent textarea,
.wpcf7 form.sent select {
  border-color: var(--border) !important;
  box-shadow: none !important;
}

/* Neutralize autofill tint */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--text);
  transition: background-color 9999s ease-out 0s;
  caret-color: var(--text);
}

/* Override 1Password focus/filled styles */
input[data-com-onepassword-filled] {
  background-color: #0b1117 !important;
  border-color: var(--border) !important;
  box-shadow: none !important;
}

section#contact .wpcf7 form input.wpcf7-form-control[data-com-onepassword-filled="dark"] {
  background-color: #0b1117 !important;
  box-shadow: 0 0 0 1000px #0b1117 inset !important;
}