/*
Theme Name: Monetiq Studio
Theme URI: https://monetiq.studio
Author: Monetiq Studio
Description: Custom WordPress theme for Monetiq Studio marketing agency. Identical to the original React application.
Version: 1.1
Text Domain: monetiq-studio
*/

/* Tailwind CSS is loaded via CDN in header.php */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap');

:root {
  --neon-orange: #FF5F1F;
  --paper: #F5F5F5;
  --electric-blue: #7DF9FF;
}

body {
  font-family: 'Inter', sans-serif;
  background-color: var(--paper);
  color: #000;
  overflow-x: hidden;
}

/* Custom Selection */
::selection {
  background-color: var(--neon-orange);
  color: #fff;
}

/* Neobrutalism utility classes */
.shadow-neo {
  box-shadow: 4px 4px 0px 0px rgba(0,0,0,1);
}

.shadow-neo-lg {
  box-shadow: 8px 8px 0px 0px rgba(0,0,0,1);
}

/* Marquee Animation */
@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.animate-marquee {
  display: inline-flex;
  animation: marquee 20s linear infinite;
}

/* WP CF7 Overrides */
.wpcf7-form-container {
  width: 100%;
}
.wpcf7-form {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  width: 100%;
}
.wpcf7-form p {
  margin: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.wpcf7-form label {
  font-weight: 900;
  text-transform: uppercase;
  font-size: 0.875rem;
  color: #000;
}
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form select,
.wpcf7-form textarea {
  width: 100%;
  padding: 1.25rem;
  border: 4px solid #000;
  font-weight: 900;
  text-transform: uppercase;
  font-size: 1rem;
  background: #fff;
  box-shadow: 4px 4px 0px 0px rgba(0,0,0,1);
  transition: all 0.2s;
}
.wpcf7-form input[type="text"]::placeholder,
.wpcf7-form input[type="email"]::placeholder,
.wpcf7-form textarea::placeholder {
  color: #ccc;
}
.wpcf7-form input[type="text"]:focus,
.wpcf7-form input[type="email"]:focus,
.wpcf7-form select:focus,
.wpcf7-form textarea:focus {
  outline: none;
  background: #fafafa;
  transform: translate(-1px, -1px);
  box-shadow: 6px 6px 0px 0px rgba(0,0,0,1);
}
.wpcf7-form input[type="submit"] {
  width: 100%;
  background-color: #000;
  color: #fff;
  padding: 1.5rem;
  font-weight: 900;
  text-transform: uppercase;
  border: 4px solid #000;
  cursor: pointer;
  transition: all 0.3s;
  box-shadow: 6px 6px 0px 0px #FF5F1F;
  font-size: 1.25rem;
  margin-top: 1rem;
}
.wpcf7-form input[type="submit"]:hover {
  background-color: #FF5F1F;
  transform: translate(2px, 2px);
  box-shadow: none;
}

/* Mobile & Retina Scaling */
@media (max-width: 640px) {
  .shadow-neo {
    box-shadow: 3px 3px 0px 0px rgba(0,0,0,1);
  }
  .shadow-neo-lg {
    box-shadow: 6px 6px 0px 0px rgba(0,0,0,1);
  }
  .wpcf7-form input[type="text"],
  .wpcf7-form input[type="email"],
  .wpcf7-form textarea {
    padding: 1rem;
    border-width: 3px;
  }
  .wpcf7-form input[type="submit"] {
    padding: 1.25rem;
    border-width: 3px;
  }
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  /* Retina specific tweaks if needed */
  .border-4 {
    border-width: 4px;
  }
}
