/* ═══════════════════════════════════════════════════════
   V3 DARK THEME OVERRIDE — applies to all non-home pages
   Matches the homepage (index.php) V3 design system
═══════════════════════════════════════════════════════ */

/* ── Token overrides ── */
:root {
  --green-dark: #a8e063;
  --green-main: #a8e063;
  --green-soft: #c5ed8e;
  --green-light: rgba(168, 224, 99, 0.1);
  --text-dark: #f0f4f0;
  --text-muted: #6b7f6b;
  --white: #f0f4f0;
  --surface-base: #060a06;
  --surface-card: #111a11;
  --surface-soft: #0d140d;
  --line-soft: rgba(168, 224, 99, 0.1);
  --line-mid: rgba(168, 224, 99, 0.2);
  --ink-strong: #f0f4f0;
  --ink-muted: #6b7f6b;
}

/* ── Global body ── */
body {
  background: #060a06 !important;
  color: #f0f4f0 !important;
  font-family: 'Inter', sans-serif !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.section-title,
.about-page-header h1,
.contact-page-header h1 {
  font-family: 'Syne', sans-serif !important;
  color: #f0f4f0 !important;
}

/* ── Hero spacer (shows as part of page-header band) ── */
.hero-spacer {
  background: #060a06 !important;
  height: 0 !important;
}

body:not(.home-page) .hero-spacer {
  background: #060a06 !important;
}

/* ── Page header banner ── */
.about-page-header,
.contact-page-header {
  background: linear-gradient(135deg, #060a06 0%, #0d140d 60%, #111a11 100%) !important;
  border-bottom: 1px solid rgba(168, 224, 99, 0.15) !important;
  position: relative;
  overflow: hidden;
}

.about-page-header::before,
.contact-page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(168, 224, 99, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(168, 224, 99, 0.04) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
}

.about-page-header h1,
.contact-page-header h1 {
  color: #f0f4f0 !important;
}

.about-page-header p,
.contact-page-header p {
  color: rgba(168, 224, 99, 0.7) !important;
  opacity: 1 !important;
}

/* ── Sections ── */
.about-main,
.team-section,
.services-section,
.blog-section,
.certificate-section,
.client-carousel-section,
.quality-section,
.info-section,
.form-section,
.map-section,
.stats-strip {
  background: #060a06 !important;
}

.about-main::before,
.team-section::before,
.services-section::before,
.blog-section::before,
.certificate-section::before {
  display: none !important;
}

/* ── About container / quality container ── */
.about-container,
.quality-container {
  background: #111a11 !important;
  border-color: rgba(168, 224, 99, 0.12) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4) !important;
}

.about-tag {
  background: rgba(168, 224, 99, 0.1) !important;
  border-color: rgba(168, 224, 99, 0.3) !important;
  color: #a8e063 !important;
}

.about-left h2 {
  color: #f0f4f0 !important;
}

.about-left p,
.about-right p,
.quality-right p {
  color: #6b7f6b !important;
}

.quality-right h2 {
  color: #f0f4f0 !important;
}

/* About highlight cards */
.about-highlight {
  background: #0d140d !important;
  border-color: rgba(168, 224, 99, 0.12) !important;
}

.about-highlight span {
  background: rgba(168, 224, 99, 0.1) !important;
  color: #a8e063 !important;
}

.about-highlight strong {
  color: #f0f4f0 !important;
}

.about-highlight p {
  color: #6b7f6b !important;
}

/* ── Section eyebrow / titles ── */
.section-eyebrow {
  color: #a8e063 !important;
}

.section-subtitle {
  color: #6b7f6b !important;
}

/* ── Stat cards ── */
.stat-card {
  background: #111a11 !important;
  border-color: rgba(168, 224, 99, 0.1) !important;
  box-shadow: none !important;
}

.stat-card:hover {
  background: rgba(168, 224, 99, 0.04) !important;
}

.stat-card h3 {
  color: #f0f4f0 !important;
}

.stat-card p {
  color: #6b7f6b !important;
}

.stat-icon {
  background: rgba(168, 224, 99, 0.1) !important;
  color: #a8e063 !important;
}

/* ── Team ── */
.team-card {
  background: #111a11 !important;
  border: 1px solid rgba(168, 224, 99, 0.1) !important;
  box-shadow: none !important;
}

.team-card:hover {
  border-color: rgba(168, 224, 99, 0.25) !important;
}

.team-info {
  border-top-color: rgba(168, 224, 99, 0.1) !important;
}

.team-info h4 {
  color: #f0f4f0 !important;
}

.team-info span {
  color: #a8e063 !important;
}

.team-social {
  background: linear-gradient(transparent, rgba(6, 10, 6, 0.9)) !important;
}

.team-social a {
  background: #a8e063 !important;
  color: #060a06 !important;
}

.team-social a:hover {
  background: #f0f4f0 !important;
}

/* ── Services ── */
.service-card {
  background: #111a11 !important;
  border-color: rgba(168, 224, 99, 0.1) !important;
}

.service-card:hover {
  border-color: rgba(168, 224, 99, 0.25) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4) !important;
}

.service-card h3 {
  color: #f0f4f0 !important;
}

.service-card p {
  color: #6b7f6b !important;
}

.service-icon {
  background: rgba(168, 224, 99, 0.1) !important;
  color: #a8e063 !important;
}

.service-card:hover .service-icon {
  background: #a8e063 !important;
  color: #060a06 !important;
}

.service-link {
  color: #a8e063 !important;
}

.service-media {
  border-color: rgba(168, 224, 99, 0.1) !important;
}

.services-empty {
  background: rgba(168, 224, 99, 0.04) !important;
  border-color: rgba(168, 224, 99, 0.15) !important;
  color: #6b7f6b !important;
}

/* ── Blog ── */
.blog-card {
  background: #111a11 !important;
  border-color: rgba(168, 224, 99, 0.1) !important;
  box-shadow: none !important;
}

.blog-card:hover {
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4) !important;
}

.blog-content h3 {
  color: #f0f4f0 !important;
}

.blog-content p {
  color: #6b7f6b !important;
}

.blog-date {
  color: #a8e063 !important;
}

.blog-link {
  color: #a8e063 !important;
}

.blog-placeholder {
  background: rgba(168, 224, 99, 0.04) !important;
  color: #a8e063 !important;
}

/* ── Certificates ── */
.certificate-section {
  background: #060a06 !important;
}

.certificate-card {
  background: #111a11 !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
}

.certificate-overlay {
  background: rgba(168, 224, 99, 0.85) !important;
}

.certificate-overlay span {
  color: #060a06 !important;
}

/* ── Client carousel ── */
.client-carousel-section {
  background: #0d140d !important;
}

.carousel-slide img {
  filter: grayscale(0%) brightness(1) !important;
}

.carousel-slide img:hover {
  filter: grayscale(0%) brightness(1) !important;
}

/* ── Content card (view pages) ── */
.content-card {
  background: #111a11 !important;
  border-color: rgba(168, 224, 99, 0.12) !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.4) !important;
}

/* ── Rich content ── */
.rich-content {
  color: #b0bfb0 !important;
}

.rich-content h1,
.rich-content h2,
.rich-content h3,
.rich-content h4,
.rich-content h5,
.rich-content h6 {
  color: #f0f4f0 !important;
}

.rich-content strong,
.rich-content b {
  color: #f0f4f0 !important;
}

.rich-content a {
  color: #a8e063 !important;
}

.rich-content a:hover {
  color: #c5ed8e !important;
}

.rich-content blockquote {
  border-left-color: #a8e063 !important;
  background: rgba(168, 224, 99, 0.06) !important;
  color: #6b7f6b !important;
}

.rich-content code {
  background: rgba(168, 224, 99, 0.1) !important;
  color: #a8e063 !important;
}

.rich-content th {
  background: #a8e063 !important;
  color: #060a06 !important;
}

.rich-content td {
  border-color: rgba(168, 224, 99, 0.1) !important;
}

.rich-content tr:nth-child(even) td {
  background: rgba(168, 224, 99, 0.04) !important;
}

.rich-content hr {
  border-top-color: rgba(168, 224, 99, 0.1) !important;
}

/* Detail page */
.detail-page-title {
  color: #f0f4f0 !important;
}

.detail-page-meta {
  color: #6b7f6b !important;
}

.detail-page-actions {
  border-top-color: rgba(168, 224, 99, 0.1) !important;
}

.detail-page-container {
  background: transparent !important;
}

/* ── Buttons ── */
.btn-primary {
  background: #a8e063 !important;
  color: #060a06 !important;
  border-radius: 8px !important;
}

.btn-primary:hover {
  background: #f0f4f0 !important;
}

.btn-outline-sm {
  color: #a8e063 !important;
  border-color: rgba(168, 224, 99, 0.4) !important;
}

.btn-outline-sm:hover {
  background: rgba(168, 224, 99, 0.06) !important;
}

/* ── Contact page ── */
.offices-col,
.details-col,
.form-section-inner,
.map-card,
.contact-form-card {
  background: #111a11 !important;
  border-color: rgba(168, 224, 99, 0.12) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.3) !important;
}

.offices-col h2,
.details-col h2,
.form-section-inner h2 {
  color: #f0f4f0 !important;
}

.map-section-title {
  color: #f0f4f0 !important;
}

.map-section-sub {
  color: #6b7f6b !important;
}

.form-subtitle {
  color: #6b7f6b !important;
}

.office-item {
  border-bottom-color: rgba(168, 224, 99, 0.08) !important;
}

.office-icon,
.detail-card-icon,
.map-badge {
  background: rgba(168, 224, 99, 0.1) !important;
  color: #a8e063 !important;
}

.office-text h4,
.map-card-header h4 {
  color: #f0f4f0 !important;
}

.office-text p,
.map-card-header p {
  color: #6b7f6b !important;
}

.detail-card {
  border-color: rgba(168, 224, 99, 0.1) !important;
  border-left-color: #a8e063 !important;
}

.detail-card-body h4 {
  color: #6b7f6b !important;
}

.detail-card-body p,
.detail-card-body a {
  color: #6b7f6b !important;
}

.map-card-header {
  border-bottom-color: rgba(168, 224, 99, 0.08) !important;
}

/* Form inputs */
.form-field label {
  color: #a8e063 !important;
}

.form-field input,
.form-field textarea {
  background: #0d140d !important;
  border-color: rgba(168, 224, 99, 0.2) !important;
  color: #f0f4f0 !important;
}

.form-field input::placeholder,
.form-field textarea::placeholder {
  color: #4a5c4a !important;
}

.form-field input:focus,
.form-field textarea:focus {
  border-color: #a8e063 !important;
  box-shadow: 0 0 0 3px rgba(168, 224, 99, 0.12) !important;
}

.form-field input.is-error,
.form-field textarea.is-error {
  border-color: #f87171 !important;
}

.form-error {
  color: #f87171 !important;
}

.form-error-banner {
  background: rgba(248, 113, 113, 0.1) !important;
  border-color: rgba(248, 113, 113, 0.3) !important;
  color: #f87171 !important;
}

.btn-submit {
  background: #a8e063 !important;
  color: #060a06 !important;
  border-radius: 8px !important;
}

.btn-submit:hover {
  box-shadow: 0 10px 24px rgba(168, 224, 99, 0.25) !important;
}

.required-mark {
  color: #f87171 !important;
}

.success-box {
  background: rgba(168, 224, 99, 0.06) !important;
  border-color: rgba(168, 224, 99, 0.25) !important;
}

.success-box .success-icon {
  color: #a8e063 !important;
}

.success-box h2 {
  color: #f0f4f0 !important;
}

.success-box p {
  color: #6b7f6b !important;
}

.success-box a {
  background: #a8e063 !important;
  color: #060a06 !important;
  border-radius: 8px !important;
}