/*
Theme Name: Love Worcester Single Column (Pattern + Menu Fix 2)
Theme URI: https://worcester.love
Author: Love Worcester
Description: Single-column content; button-style menu with wrap; hero uses a cream patterned background; media centered in content.
Version: 1.0.3
Text Domain: loveworcester
*/

:root{
  --cream:#FDF3E3;
  --outline:#182225;
  --blue:#295972;
  --orange:#D86F31;
  --paper:#FFFFFF;
  --paper-tint:#FAF1E4;
  --dot:#E8D8BD; /* slightly darker dot for visibility */
}

html, body{
  background: var(--cream);
  color: var(--outline);
  margin:0;
  padding:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

a{ color: inherit; text-decoration: none; }
img{ max-width:100%; height:auto; display:block; }

/* Header + navigation (button-like items) */
header.site-header{
  display:flex; align-items:center; gap:16px;
  padding:18px 20px; border-bottom: 3px solid var(--outline);
  background: var(--paper-tint);
}
header .brand{ display:flex; align-items:center; gap:12px; }
header .brand img{ width:160px; height:auto; }

/* Primary nav: wraps onto new rows on narrow screens */
nav.primary{ 
  margin-left:auto; 
  display:flex; 
  flex-wrap:wrap; 
  column-gap:14px; 
  row-gap:10px;
  align-items:center;
}
nav.primary ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; column-gap:14px; row-gap:10px; }
nav.primary li{ list-style:none; margin:0; padding:0; }
nav.primary li a{
  display:inline-block;
  padding:8px 12px;
  border:2px solid var(--outline);
  border-radius:12px;
  background:#fff;
  line-height:1.2;
}
nav.primary li a:hover,
nav.primary li.current-menu-item > a,
nav.primary li.current_page_item > a{
  background: var(--orange);
  color:#fff;
  border-color: var(--outline);
}

/* Hero with cream patterned background */
section.hero{
  background: var(--cream) url('images/halftone-bg.png') top center repeat;
  border-bottom: 3px solid var(--outline);
  padding: 48px 20px;
  text-align:center;
}
section.hero h1{ font-size: clamp(28px, 4vw, 44px); margin:0 0 6px 0; }
section.hero p{ font-size: 18px; margin:0; color: var(--blue); }

.container{ max-width:1100px; margin:0 auto; padding: 20px; }

/* Single column grid defaults (site-wide) */
.lw-library-grid,
.wp-block-post-template,
.cards,
.grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:16px;
}

/* Card styling */
article.card{
  background:#fff; border:3px solid var(--outline); border-radius:16px;
  padding:16px; box-shadow: 4px 4px 0 var(--outline);
}
article.card h2, article.card h3{ margin:8px 0; }
article.card .meta{ color:#555; font-size: 0.9em; }

/* Center media in main content */
.entry img,
.entry .wp-block-image img,
.entry figure.wp-block-image,
.entry video,
.entry .wp-block-video video,
.entry audio,
.entry .wp-block-audio audio,
.entry iframe,
.entry .wp-block-embed__wrapper iframe {
  display:block;
  margin:14px auto;
  max-width:100%;
}
.entry audio,
.entry video,
.entry .wp-block-video video { width:100%; height:auto; }

/* Ensure legacy align classes don't break centering */
.entry .alignleft,
.entry .alignright { float:none; margin-left:auto; margin-right:auto; }

footer.site-footer{
  padding:24px 20px; text-align:center; border-top:3px solid var(--outline);
  background: var(--paper-tint); margin-top: 30px;
}

/* Small screens */
@media (max-width: 480px){
  header .brand img{ width: 140px; }
}