/**
 * Your Socials — Global production styles
 * Shared across all pages: hero spacing, WhatsApp, sections, brand fixes
 */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

@import url('./ui-refine.css');
@import url('./header.css');
@import url('./hero-pages.css');
@import url('./responsive-polish.css');
@import url('./footer.css');

:root {
  --brand-primary: #0D9488;
  --brand-primary-dark: #0F766E;
  --brand-deep: #134E4A;
  --brand-accent: #BE185D;
  --brand-cta: #005F73;
  --brand-gold: #FBBF24;
  --nav-height: 72px;
  --section-py: 4rem;
  --section-py-md: 6rem;
  /* Unified hero + header palette */
  --hero-overlay-gradient: linear-gradient(
    135deg,
    rgba(15, 118, 110, 0.93) 0%,
    rgba(19, 78, 74, 0.88) 45%,
    rgba(30, 41, 59, 0.92) 100%
  );
  --nav-gradient: linear-gradient(135deg, #0f766e 0%, #134e4a 55%, #0f172a 100%);
  --nav-gradient-simple: linear-gradient(135deg, #0f766e 0%, #134e4a 100%);
  --cta-gradient: linear-gradient(135deg, #06b6d4 0%, #0891b2 50%, #0d9488 100%);
  --cta-shadow: 0 4px 20px rgba(6, 182, 212, 0.4);
  --cta-shadow-hover: 0 8px 28px rgba(6, 182, 212, 0.5);
}

body {
  font-family: 'Plus Jakarta Sans', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* ── Hero spacing (text not cramped under navbar) ── */
.hero {
  padding-top: calc(var(--nav-height) + 2rem);
  min-height: 100vh;
  height: 100vh;
}

.service-hero {
  padding-top: 0;
}

.service-hero-inner {
  padding-top: calc(var(--nav-height) + 1rem) !important;
  padding-bottom: 3rem !important;
}

@media (min-width: 768px) {
  .service-hero-inner {
    padding-top: calc(var(--nav-height) + 1.5rem) !important;
    padding-bottom: 4rem !important;
  }
}

/* Extra space when navbar sits above hero section */
.navbar + section.service-hero .service-hero-inner,
.service-hero > .navbar ~ .service-hero-inner {
  padding-top: calc(var(--nav-height) + 1.25rem) !important;
}

@media (min-width: 768px) {
  .navbar + section.service-hero .service-hero-inner,
  .service-hero > .navbar ~ .service-hero-inner {
    padding-top: calc(var(--nav-height) + 2rem) !important;
  }
}

/* About / team hero sections */
.page-hero {
  padding-top: calc(var(--nav-height) + 1.5rem) !important;
  padding-bottom: 2rem !important;
}

/* Portfolio hero */
.portfolio-hero {
  padding-top: 0 !important;
}

.portfolio-hero .service-hero-inner {
  padding-top: calc(var(--nav-height) + 2rem) !important;
}

/* ── Section spacing standard ── */
.section-standard {
  padding-top: var(--section-py);
  padding-bottom: var(--section-py);
}

@media (min-width: 768px) {
  .section-standard {
    padding-top: var(--section-py-md);
    padding-bottom: var(--section-py-md);
  }
}

/* Remove legacy spacer hack if any remain */
.hiddenn {
  display: none !important;
}

/* ── WhatsApp floating button (vertically centered, right side) ── */
.floating-whatsapp,
.whatsapp-float {
  position: fixed;
  right: 24px;
  top: 50%;
  bottom: auto !important;
  transform: translateY(-50%);
  width: 56px;
  height: 56px;
  background-color: #25D366;
  color: #ffffff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
  z-index: 9999;
  text-decoration: none;
  transition: transform 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
}

.floating-whatsapp:hover,
.whatsapp-float:hover {
  background-color: #20ba5a;
  transform: translateY(-50%) scale(1.08);
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.45);
}

@media (max-width: 768px) {
  .floating-whatsapp,
  .whatsapp-float {
    right: 16px;
    width: 50px;
    height: 50px;
    font-size: 24px;
  }
}

/* Contact page fixed bottom whatsapp → center on screen */
.contact-whatsapp-fixed {
  position: fixed !important;
  right: 24px !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  z-index: 9999;
}

/* ── Navbar consistency (sticky handled in responsive.css) ── */
.navbar {
  z-index: 1000;
}

/* ── Quote button fix (no nested anchor in button) ── */
.quote-btn a {
  color: inherit;
  text-decoration: none;
}

/* ── Empty tailwind class cleanup ── */
.bg-\[\] {
  background: transparent;
}