/* ==========================================================
   THE UNALOME PROJECT — Minimal Essential Styles
   Philosophy: Elementor handles 80%, CSS handles edge cases
   50 lines. No bloat. No !important wars.
   ========================================================== */

/* =====================
   FONTS — Load Once
   ===================== */
@import url('https://fonts.googleapis.com/css2?family=Gloock&family=Source+Serif+4:opsz,wght@8..60,300;8..60,400&family=Inter:wght@300;400;500&family=JetBrains+Mono:wght@300;400&display=swap');

/* =====================
   GRAIN OVERLAY — The Signature
   3.5% noise texture for depth
   ===================== */
body:not(.wp-admin):not(.login):not(.elementor-editor-active)::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 9999;
  opacity: 0.035;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='2.5' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
  background-repeat: repeat;
}

/* =====================
   MAX-WIDTH — Readability Constraint
   680px for body text (65-75 characters)
   ===================== */
.entry-content,
.article-body,
.post-content,
.elementor-widget-text-editor .elementor-widget-container,
.elementor-text-editor,
main article p,
main article ul,
main article ol {
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
}

/* =====================
   NAVIGATION — Always Uppercase
   The only forced typography rule
   ===================== */
nav a,
.menu a,
.nav-menu a,
header a,
.site-header a,
.elementor-nav-menu a {
  text-transform: uppercase;
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 13px;
  letter-spacing: 0.02em;
}

/* =====================
   ADMIN BAR — Spacing Adjustment
   When logged in, admin bar appears at top
   ===================== */
body.admin-bar {
  padding-top: 32px;
}

body.admin-bar::before {
  top: 32px;
  height: calc(100% - 32px);
}

@media screen and (max-width: 782px) {
  body.admin-bar {
    padding-top: 46px;
  }
  
  body.admin-bar::before {
    top: 46px;
    height: calc(100% - 46px);
  }
}

/* =====================
   ZERO BORDER RADIUS — Philosophical Constraint
   No rounded corners anywhere
   ===================== */
* {
  border-radius: 0 !important;
}

/* ==========================================================
   END — That's it. 50 lines. Everything else is Elementor.
   ========================================================== */