/*
Theme Name: mammoth69
Theme URI: https://mammoth69.com
Author: mammoth69 Inc.
Author URI: https://mammoth69.com
Description: Official theme for mammoth69 Inc. - Creative Production Company
Version: 1.0.0
License: Private
Text Domain: mammoth69
*/

/* ============================================================
   Base / Reset
============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  margin: 0;
  padding: 0;
  background: #000;
  color: #fff;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  overflow-x: hidden;
}

a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; }
button { cursor: pointer; background: none; border: none; padding: 0; font: inherit; color: inherit; }
ul, ol { list-style: none; margin: 0; padding: 0; }
::selection { background: #dc2626; color: #fff; }

/* ============================================================
   No Scrollbar
============================================================ */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* ============================================================
   Animations
============================================================ */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.animate-in { animation: fadeIn 0.8s ease-out both; }

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}
.animate-pulse { animation: pulse 4s cubic-bezier(0.4,0,0.6,1) infinite; }

/* ============================================================
   Mobile Menu Transition
============================================================ */
#mobile-menu {
  transition: transform 0.7s cubic-bezier(0.9,0,0.1,1);
  transform: translateX(100%);
}
#mobile-menu.open {
  transform: translateX(0);
}

/* ============================================================
   Header scroll state
============================================================ */
#site-header {
  transition: background 0.5s, box-shadow 0.5s, border-color 0.5s;
}
#site-header.scrolled {
  background: rgba(0,0,0,0.95);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255,255,255,0.1);
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.5);
}

/* ============================================================
   Nav underline hover
============================================================ */
.nav-link::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  height: 2px;
  width: 0;
  background: #dc2626;
  transition: width 0.3s;
}
.nav-link:hover::after,
.nav-link.active::after {
  width: 100%;
}
.nav-link.active { color: #dc2626; }

/* ============================================================
   Works filter active state
============================================================ */
.works-filter-btn { position: relative; }
.works-filter-btn::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  height: 2px;
  width: 0;
  background: #dc2626;
  transition: width 0.3s;
}
.works-filter-btn.active::after { width: 100%; }
.works-filter-btn.active { color: #dc2626; }

/* ============================================================
   FAQ Accordion
============================================================ */
.faq-answer { display: none; }
.faq-item.open .faq-answer { display: block; }

/* ============================================================
   Contact Form Dropdown
============================================================ */
.subject-dropdown-list { display: none; }
.subject-dropdown-list.open { display: block; }

/* ============================================================
   Gradient BG orbs
============================================================ */
.bg-orb-tr {
  position: fixed;
  top: 0; right: 0;
  width: 40vw; height: 40vw;
  background: rgba(220,38,38,0.1);
  filter: blur(15vw);
  pointer-events: none;
  z-index: 0;
  border-radius: 50%;
  animation: pulse 4s cubic-bezier(0.4,0,0.6,1) infinite;
}
.bg-orb-bl {
  position: fixed;
  bottom: 0; left: 0;
  width: 30vw; height: 30vw;
  background: rgba(220,38,38,0.05);
  filter: blur(12vw);
  pointer-events: none;
  z-index: 0;
  border-radius: 50%;
}

/* ============================================================
   Custom Tailwind overrides / extras
============================================================ */
.works-card-img {
  filter: grayscale(100%);
  transition: filter 0.7s, transform 0.7s;
}
.works-card:hover .works-card-img {
  filter: grayscale(0%);
  transform: scale(1.05);
}

.service-img {
  filter: grayscale(100%);
  transition: filter 1s, transform 1s;
}
.service-section:hover .service-img {
  filter: grayscale(0%);
  transform: scale(1.05);
}

/* ============================================================
   Responsive Container
============================================================ */
.container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 767px) {
  .container { padding-left: 1.25rem; padding-right: 1.25rem; }
}
@media (min-width: 768px) {
  .container { max-width: 1400px; padding-left: 2.5rem; padding-right: 2.5rem; }
}

/* ============================================================
   WordPress core styles override (no default block padding)
============================================================ */
.wp-block-image img { height: auto; }
p { margin: 0; }


.text-transparent {
padding-right: 30px;
}