/* Website Styles - DaisyUI + Tailwind CSS */
/* Theme: corporate */

/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css?family=Inter%20or%20Poppins:400,500,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Playfair%20Display%20or%20Lora:400,500&display=swap');

/* Typography Variables */
:root {
  --font-primary: Inter or Poppins, sans-serif fallback (Helvetica Neue, Arial). Modern, clean, and tech-forward while remaining warm and accessible. Suggests both computational precision and human approachability.;
  --font-secondary: Playfair Display or Lora, serif fallback (Georgia, Times New Roman). Premium, contemplative, and spiritually grounded. Used for headings and emotional copy to suggest tradition, wisdom, and gravitas beneath the irreverent tone.;
}

/* 
 * Base styles wrapped in @layer base so Tailwind utilities can override them.
 * CSS Cascade Layers: unlayered styles beat layered styles, so we must use layers
 * to allow @layer utilities (Tailwind classes like h-10, xl:h-18) to win.
 */
@layer base {
  /* Critical: Global box-sizing reset */
  *, *::before, *::after {
    box-sizing: border-box;
  }

  /* Prevent horizontal overflow */
  html {
    overflow-x: hidden;
  }

  /* Global body styles */
  body {
    font-family: var(--font-secondary);
    margin: 0;
    padding: 0;
    line-height: 1.6;
    overflow-x: hidden;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
  }

  /* Main content container */
  main {
    flex: 1 0 auto;
    width: 100%;
  }

  /* Section containment - prevent overlaps and maintain structure */
  section {
    position: relative;
    width: 100%;
    overflow: visible;
    clear: both;
  }

  section + section {
    margin-top: 0;
  }

  /* Alternating section backgrounds for visual rhythm */
  /* Uses DaisyUI's base-200 surface — designed for contrast with base-content */
  main > section:nth-child(even) {
    background-color: var(--color-base-200);
  }

  /* Z-index management for sticky header */
  header {
    position: sticky;
    top: 0;
    z-index: 50;
  }

  footer {
    position: relative;
    z-index: 10;
    margin-top: auto;
  }

}

/* Text utilities for better typography */
.text-balance {
  text-wrap: balance;
}

.break-words {
  word-break: break-word;
  overflow-wrap: break-word;
}

/* Custom text shadow for hero sections */
.text-shadow-lg {
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3);
}

/* Note: Animation styles are now provided by the Core Plugin System */
/* See: src/core/plugins/scroll-animations-plugin.ts */
/* This allows animations to be updated without regenerating websites */

/* 
 * DaisyUI Extended Color Utilities
 * 
 * DaisyUI 5+ provides official extended utilities for Tailwind 4 compatibility:
 * - properties-extended.css: from-*, to-*, via-*, ring-*, fill-*, stroke-*, shadow-*, outline-*
 * - states-extended.css: hover:*, focus:*, active:* variants
 * - responsive-extended.css: sm:*, md:*, lg:*, xl:* breakpoint variants
 * 
 * These are included automatically by the Tailwind CSS compiler via getDaisyUIExtendedCss().
 * No hand-written utilities needed here - using official DaisyUI solution!
 */