/*
Theme Name: Newspaperly Constructivist
Template: newspaperly
Version: 1.0.0
*/
:root {
  --c-navy: #1a2a3a;
  --c-blue: #3a4f6f;
  --c-cream: #f0e6d3;
  --c-red: #c44536;
  --c-white: #faf6f0;
  --c-grey: #6b7b8d;
}
*, *::before, *::after { border-radius: 0 !important; }
body {
  font-family: "Noto Sans TC", sans-serif;
  background: var(--c-cream);
  color: var(--c-navy);
  line-height: 1.8;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background: radial-gradient(circle at 20% 80%, rgba(26,42,58,.03) 1px, transparent 1px),
    radial-gradient(circle at 80% 20%, rgba(26,42,58,.03) 1px, transparent 1px);
  background-size: 40px 40px, 60px 60px;
  pointer-events: none;
  z-index: 0;
}
body > * { position: relative; z-index: 1; }
h1,h2,h3,h4,h5,h6 { font-family: "Noto Serif TC", serif; font-weight: 900; color: var(--c-navy); }
a { color: var(--c-red); text-decoration: none; transition: all .2s; }
a:hover { color: #9e3628; }
::selection { background: var(--c-red); color: var(--c-cream); }
header, .site-header {
  background: var(--c-navy) !important;
  border-bottom: 6px solid var(--c-red) !important;
  position: relative;
  overflow: hidden;
}
header::before, .site-header::before {
  content: "";
  position: absolute;
  top: -50%; right: -10%;
  width: 200px; height: 400%;
  background: repeating-linear-gradient(45deg, transparent, transparent 8px, rgba(196,69,54,.15) 8px, rgba(196,69,54,.15) 16px);
  pointer-events: none;
}
header::after, .site-header::after {
  content: "";
  position: absolute;
  top: 50%; left: 2%;
  transform: translateY(-50%);
  width: 40px; height: 40px;
  border: 4px solid var(--c-red);
  pointer-events: none;
}
.site-title, .site-title a {
  font-family: "Noto Serif TC", serif !important;
  font-weight: 900 !important;
  font-size: 2.2rem !important;
  color: var(--c-cream) !important;
  letter-spacing: .08em !important;
  position: relative; z-index: 1;
  padding-left: 60px !important;
  border-bottom: none !important;
}
.site-description {
  color: var(--c-red) !important;
  font-size: .9rem !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  position: relative; z-index: 1;
}
nav, .main-navigation {
  background: var(--c-blue) !important;
  border-bottom: 4px solid var(--c-navy) !important;
}
.main-navigation a, nav a {
  color: var(--c-cream) !important;
  font-family: "Noto Serif TC", serif !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  font-size: .85rem !important;
  padding: 12px 20px !important;
  border-bottom: none !important;
}
.main-navigation a:hover, nav a:hover {
  background: var(--c-red) !important;
}
.menu-toggle, button.menu-toggle {
  background: var(--c-red) !important;
  color: var(--c-cream) !important;
  border: none !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}
.site-content, #content, .container {
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 40px 20px !important;
}
article, .post, .hentry {
  background: var(--c-white) !important;
  border: 4px solid var(--c-navy) !important;
  box-shadow: 6px 6px 0 var(--c-navy) !important;
  margin-bottom: 40px !important;
  padding: 0 !important;
  position: relative;
  overflow: hidden;
  transition: transform .2s, box-shadow .2s;
}
article:hover { transform: translate(-2px,-2px); box-shadow: 8px 8px 0 var(--c-navy) !important; }
article::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 6px; height: 100%;
  background: var(--c-red);
  z-index: 2;
}
.entry-title, article h2, .post-title {
  font-family: "Noto Serif TC", serif !important;
  font-weight: 900 !important;
  font-size: 1.8rem !important;
  color: var(--c-navy) !important;
  padding: 25px 30px 0 36px !important;
  border-bottom: none !important;
}
.entry-title a { color: var(--c-navy) !important; border-bottom: none !important; }
.entry-title a:hover { color: var(--c-red) !important; }
.entry-meta, .post-meta {
  font-size: .8rem !important;
  color: var(--c-grey) !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  padding: 0 30px 0 36px !important;
}
.entry-meta a { color: var(--c-red) !important; }
.cat-links a, .tag-links a {
  background: var(--c-navy) !important;
  color: var(--c-cream) !important;
  padding: 3px 10px !important;
  font-size: .7rem !important;
  text-transform: uppercase !important;
  display: inline-block !important;
  margin: 2px !important;
  border-bottom: none !important;
}
.cat-links a:hover { background: var(--c-red) !important; }
.read-more, .more-link, a.more-link {
  display: inline-block !important;
  background: var(--c-red) !important;
  color: var(--c-cream) !important;
  padding: 10px 24px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  border: none !important;
  box-shadow: 3px 3px 0 var(--c-navy) !important;
  margin-top: 15px !important;
}
.read-more:hover, .more-link:hover {
  background: var(--c-navy) !important;
  box-shadow: 4px 4px 0 var(--c-red) !important;
}
.widget {
  background: var(--c-white) !important;
  border: 4px solid var(--c-navy) !important;
  box-shadow: 3px 3px 0 var(--c-navy) !important;
  padding: 0 !important;
  margin-bottom: 30px !important;
  overflow: hidden;
}
.widget-title, .widget h2, .widget h3 {
  background: var(--c-navy) !important;
  color: var(--c-cream) !important;
  font-family: "Noto Serif TC", serif !important;
  font-weight: 900 !important;
  font-size: .9rem !important;
  text-transform: uppercase !important;
  letter-spacing: .15em !important;
  padding: 12px 18px !important;
  margin: 0 !important;
  border-bottom: 3px solid var(--c-red) !important;
}
.widget ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.widget li { padding: 10px 18px !important; border-bottom: 1px solid #d9ccb8 !important; }
.widget li:last-child { border-bottom: none !important; }
.widget li a { color: var(--c-navy) !important; border-bottom: none !important; }
.widget li a:hover { color: var(--c-red) !important; }
.search-form { padding: 18px !important; }
input[type="search"] {
  border: 2px solid var(--c-blue) !important;
  background: var(--c-cream) !important;
  padding: 10px 14px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
input[type="search"]:focus { border-color: var(--c-red) !important; outline: none !important; }
.search-submit, input[type="submit"] {
  background: var(--c-red) !important;
  color: var(--c-cream) !important;
  border: none !important;
  padding: 10px 20px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  margin-top: 8px !important;
  width: 100% !important;
}
.search-submit:hover { background: var(--c-navy) !important; }
footer, .site-footer, #colophon {
  background: var(--c-navy) !important;
  color: var(--c-cream) !important;
  border-top: 6px solid var(--c-red) !important;
  padding: 40px 20px !important;
  position: relative;
  overflow: hidden;
}
footer::before, .site-footer::before {
  content: "";
  position: absolute;
  top: -50%; left: -5%;
  width: 150px; height: 400%;
  background: repeating-linear-gradient(-45deg, transparent, transparent 6px, rgba(196,69,54,.1) 6px, rgba(196,69,54,.1) 12px);
  pointer-events: none;
}
footer a, .site-footer a { color: var(--c-cream) !important; }
footer a:hover { color: var(--c-red) !important; }
.site-info {
  font-size: .8rem !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  text-align: center !important;
  position: relative; z-index: 1;
}
.single .entry-title, .page .entry-title {
  font-size: 2.4rem !important;
  border-bottom: 4px solid var(--c-red) !important;
  padding-bottom: 20px !important;
}
.entry-content { font-size: 1.05rem !important; line-height: 1.9 !important; }
.entry-content blockquote {
  border-left: 6px solid var(--c-red) !important;
  background: rgba(58,79,111,.05) !important;
  padding: 20px 25px !important;
  margin: 30px 0 !important;
  font-style: italic !important;
}
.entry-content h2 { border-bottom: 2px solid var(--c-blue) !important; padding-bottom: 10px !important; margin-top: 40px !important; }
.entry-content h3 { color: var(--c-red) !important; margin-top: 30px !important; }
.page-numbers, .nav-links a {
  display: inline-block !important;
  padding: 10px 16px !important;
  margin: 4px !important;
  border: 2px solid var(--c-blue) !important;
  color: var(--c-navy) !important;
  font-weight: 700 !important;
}
.page-numbers:hover { background: var(--c-navy) !important; color: var(--c-cream) !important; }
.page-numbers.current { background: var(--c-red) !important; color: var(--c-cream) !important; border-color: var(--c-red) !important; }
@keyframes slideInLeft { from { opacity:0; transform:translateX(-30px); } to { opacity:1; transform:translateX(0); } }
article { animation: slideInLeft .4s ease forwards; }
article:nth-child(2) { animation-delay: .1s; }
article:nth-child(3) { animation-delay: .2s; }
@media (max-width:768px) {
  .site-title { font-size: 1.6rem !important; padding-left: 20px !important; }
  .entry-title, article h2 { font-size: 1.4rem !important; }
  article::before { width: 4px; }
}

/* === CRITICAL FIXES === */
/* Force header background - override parent theme image/gradient */
.flavor-flavor .flavor-flavor-flavor,
.flavor-flavor .flavor-flavor-flavor .flavor-flavor,
body .flavor-flavor-flavor,
.flavor-flavor-flavor .site-branding,
.custom-header,
.flavor-flavor .custom-header,
body .custom-header,
body header.flavor-flavor-flavor,
.flavor-flavor-flavor,
#flavor-flavor-flavor,
.site-header .custom-header-media,
.site-header .custom-header-media img,
.site-branding,
body .site-branding {
  background: var(--c-navy) !important;
  background-color: #1a2a3a !important;
  background-image: none !important;
}
.custom-header-media, .custom-header-media img,
.wp-custom-header, .wp-custom-header img {
  display: none !important;
}
.site-branding {
  background: #1a2a3a !important;
  padding: 30px 20px !important;
  position: relative;
  z-index: 10;
}
/* Make title VERY visible */
.site-title,
.site-title a,
body .site-title,
body .site-title a,
h1.site-title,
h1.site-title a,
p.site-title,
p.site-title a,
.site-branding .site-title,
.site-branding .site-title a {
  color: #f0e6d3 !important;
  font-size: 2.5rem !important;
  font-weight: 900 !important;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.5) !important;
  font-family: "Noto Serif TC", serif !important;
  display: block !important;
  position: relative;
  z-index: 20;
}
/* Hide any header image overlay */
.flavor-flavor img,
#flavor-flavor img,
.site-header img:not(.custom-logo),
header img:not(.custom-logo) {
  display: none !important;
}
/* Fix main content - ensure posts show up in the main column */
.flavor-flavor .site-main,
#primary, .content-area,
main, .site-main {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}
@media (min-width: 769px) {
  #primary, .content-area, main.site-main {
    width: 65% !important;
    float: left !important;
  }
  #secondary, .widget-area, aside {
    width: 30% !important;
    float: right !important;
  }
}
/* Hide the fake Find Us / Hours widget specifically */
.widget_flavor_flavor,
.widget_flavor_flavor_flavor,
.widget_newspaperly_flavor,
.widget_flavor_flavor_flavor_flavor,
#flavor_flavor-2,
#flavor_flavor-3,
.widget:has(> .widget-title:contains("Find")),
.textwidget:has(strong:contains("Address")) {
  display: none !important;
}
