/* ==========================================================================
   1. CORE ASSETS & IMPORTS
   ========================================================================== */

/* Force Bootstrap Icons to Swap (Lighthouse Optimization) */
/* Overrides default behavior to prevent render blocking */
@font-face {
    font-family: "bootstrap-icons";
    src: url("fonts/bootstrap-icons.woff2") format("woff2"),
         url("fonts/bootstrap-icons.woff") format("woff");
    font-display: swap; 
    font-style: normal;
    font-weight: normal;
}

/* ==========================================================================
   2. DESIGN TOKENS (ROOT VARIABLES)
   ========================================================================== */

/* MODERN MID-FI OVERRIDES */
:root {
    
    /* SYSTEM FONT STACK (Zero Latency)
       Uses native OS fonts to score 100/100 on performance and feel "native".
       - Mac/iOS: San Francisco
       - Windows: Segoe UI
       - Android: Roboto
    */
    --bs-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    
    /* ARCHITECTURAL RADII 
       Defines the "Rounded Mid-Fi" look across the site.
    */
    --bs-border-radius: 0.75rem;       /* 12px standard radius */
    --bs-border-radius-lg: 1rem;       /* 16px large radius */
    --bs-border-radius-xl: 1.5rem;     /* 24px extra large radius */
    
    /* COLOR PALETTE
       Soft monochrome scale with high contrast text.
    */
    --bs-body-bg: #ffffff;
    --bs-body-color: #1a1a1a;
    --bs-primary: #111111;             /* Deep Black/Gray as primary */
    --bs-primary-rgb: 17, 17, 17;
    --bs-light: #f3f4f6;               /* Slate-ish light gray */
    --bs-border-color: #e5e7eb;        /* Subtle borders */
    --bs-secondary: #585858;
}

/* Helper override to force secondary color consistency */
.text-secondary { color: var(--bs-secondary) !important; }

/* ==========================================================================
   3. GLOBAL TYPOGRAPHY & UI COMPONENTS
   ========================================================================== */

/* Headings */
/* Enforces system font stack and bold architectural weight on all headers */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--bs-body-font-family);
    font-weight: 800;
    letter-spacing: -0.025em; 
}

/* Buttons */
/* Converts standard Bootstrap buttons to "Pill" shapes */
.btn {
    padding: 0.625rem 1.25rem;
    font-weight: 600;
    border-radius: 50rem;
}

/* Dropdowns */
/* Adds soft shadows and removes harsh borders for floating menus */
.dropdown-menu {
    border: 1px solid rgba(0,0,0,0.05);
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.1);
    padding: 0.5rem;
    border-radius: 1rem;
    margin-top: 0.5rem !important; /* Visual separation from nav */
}

.dropdown-item {
    border-radius: 0.5rem;
    padding: 0.5rem 1rem;
}

/* Navbar Links */
.navbar-nav .nav-link {
    font-weight: 600;
    color: #4b5563; /* Medium gray */
    transition: color 0.2s ease;
}

.navbar-nav .nav-link.active, 
.navbar-nav .nav-link:hover {
    color: #000;
}

/* FOR NESTED SUBMENUS */
@media (min-width: 992px) {
    .dropdown-submenu:hover > .dropdown-menu {
        display: block;
    }
    .dropdown-submenu > .dropdown-menu {
        display: none;
        margin-top: -8px !important; /* Align tops */
    }
}


/* ==========================================================================
   4. GALLERY COMPONENT
   ========================================================================== */

/* Zoom Animation Utility */
/* Used on the new utility-based gallery grid */
.group-hover-zoom {
  cursor: pointer;
}
.group-hover-zoom img {
  transition: transform 0.4s ease;
}
.group-hover-zoom:hover img {
  transform: scale(1.05);
}

/* Legacy / Custom Gallery Card Styles */
/* Fallback styles for non-utility HTML structures */
.gallery-card {
  display: block;
  text-decoration: none;
}

.gallery-image {
  position: relative;
  border-radius: 1.25rem;
  overflow: hidden;
}

.gallery-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.gallery-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding: 1.25rem;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.55),
    rgba(0, 0, 0, 0) 60%
  );
}

.gallery-title {
  color: #ffffff;
  font-weight: 600;
  line-height: 1.3;
}

.gallery-card:hover img {
  transform: scale(1.05);
}

/* ==========================================================================
   5. FORM SYSTEM
   ========================================================================== */

/* Layout */
.form-field {
    margin-bottom: 1.5rem;
    position: relative;
}

/* Input Styling */
/* Overrides default Bootstrap inputs for a taller, softer tactile feel */
.formwrapper .form-control,
.formwrapper .form-select {
    display: block;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    font-weight: 500;
    line-height: 1.5;
    color: var(--bs-body-color);
    background-color: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 0.5rem;
    transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

/* Focus State */
/* Replaces blue glow with a neutral, soft ring */
.formwrapper .form-control:focus,
.formwrapper .form-select:focus {
    background-color: #ffffff;
    border-color: var(--bs-primary);
    outline: 0;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.05); 
}

/* Labels & Helper Text */
.formwrapper .form-label {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: #374151;
    letter-spacing: -0.01em;
}

.formwrapper .form-text {
    margin-top: 0.5rem;
    font-size: 0.8rem;
    color: #6b7280;
}

/* Form Actions (Submit Area) */
.form-actions {
    margin-top: 2rem;
}

.form-actions .btn {
    width: 100%;
    padding: 0.875rem 1.5rem;
    font-weight: 700;
    border-radius: 50rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.85rem;
}

/* Honeypot Hiding Strategy (ADDED) */
/* Visually hides the anti-bot field without using display:none */
input[name="company_website"] {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    height: 0;
    width: 0;
    z-index: -1;
}

/* ==========================================================================
   6. VALIDATION (PARSLEY JS)
   ========================================================================== */

/* Success State */
/* Simple Green Border */
.form-control.parsley-success,
.form-select.parsley-success,
textarea.parsley-success {
    border-color: #10b981 !important;
    background-image: none !important;
}

/* Error State */
/* Red Border + Animation */
.form-control.parsley-error,
.form-select.parsley-error,
textarea.parsley-error {
    border-color: #ef4444 !important;
    background-image: none !important;
    animation: shake 0.4s cubic-bezier(.36,.07,.19,.97) both;
}

/* Error Messages */
.parsley-errors-list {
    margin: 0.5rem 0 0;
    padding: 0;
    list-style-type: none;
    font-size: 0.8rem;
    font-weight: 600;
    color: #ef4444;
    opacity: 0;
    transform: translateY(-5px);
    transition: all 0.3s ease;
}

.parsley-errors-list.filled {
    opacity: 1;
    transform: translateY(0);
}

@keyframes shake {
  10%, 90% { transform: translate3d(-1px, 0, 0); }
  20%, 80% { transform: translate3d(2px, 0, 0); }
  30%, 50%, 70% { transform: translate3d(-4px, 0, 0); }
  40%, 60% { transform: translate3d(4px, 0, 0); }
}

/* ==========================================================================
   7. UTILITIES & ANIMATIONS
   ========================================================================== */

/* Hover Lift Effect (Cards/Buttons) */
.hover-lift {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.hover-lift:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.1) !important;
}

/* Typography Utilities */
.fw-extra-bold {
    font-weight: 800;
}
.tracking-tight {
    letter-spacing: -0.03em;
}

/* White Button Variant */
.btn-white {
    background-color: #ffffff;
    border-color: #ffffff;
    color: #000000;
}
.btn-white:hover {
    background-color: #f8f9fa;
    border-color: #f8f9fa;
    color: #000000;
}

/* Layout Helpers (ADDED) */
/* Ensures 404/401 pages are centered vertically */
.min-vh-50 {
    min-height: 50vh;
}

/* Social Icon Hover (ADDED) */
/* Used in Footer for high-contrast hover state */
.hover-dark:hover {
    color: #000 !important;
}