:root { --ink:#29252a; --muted:#746d76; --accent:#7a3b63; --soft:#f7f1f5; --line:#e5dfe3; }
* { box-sizing:border-box; }
body { max-width:1180px; margin:0 auto; padding:0 24px; color:var(--ink); background:#fffdfd; font-family:Georgia,'Times New Roman',serif; line-height:1.65; }
header.site-header { position:sticky; top:0; background:#fffdfd; z-index:1100; transition:transform 300ms cubic-bezier(0.4,0,0.2,1); border-bottom:1px solid var(--line); font-family:system-ui,sans-serif; }
header.site-header.header-hidden { transform:translateY(-100%); }
.header-top { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:26px 0; flex-wrap:wrap; }
a { color:var(--accent); } a:hover { color:#4f2540; } header a { text-decoration:none; }
.site-title { flex:0 0 auto; color:var(--ink); font-size:1.15rem; font-weight:700; }
.header-search-desktop { flex:1 1 auto; display:flex; justify-content:center; }
.primary-nav { display:flex; gap:20px; font-size:.95rem; }
.mobile-nav-toggle { display:none; }
.header-search-mobile { display:none; }
.category-nav { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px 12px; font-size:.8rem; text-align:right; }
main { min-width:0; padding:48px 0 64px; } h1,h2,h3,h4 { line-height:1.2; } h1 { margin:.3rem 0 1rem; font-size:clamp(2rem,5vw,3.4rem); } h2 { margin:0 0 .5rem; font-size:1.55rem; } p { margin-top:0; }
.site-layout { display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:64px; }
.category-sidebar { align-self:start; margin-top:48px; padding-left:24px; border-left:1px solid var(--line); font-family:system-ui,sans-serif; }
.category-sidebar h2 { margin-bottom:1rem; font-size:1rem; }
.category-sidebar nav { display:flex; flex-direction:column; gap:.55rem; font-size:.9rem; }
.category-sidebar a { text-decoration:none; }
.hero { max-width:700px; padding:32px 0 58px; } .hero h1 { max-width:540px; } .hero-intro { max-width:620px; color:var(--muted); font-size:1.2rem; }
.eyebrow { margin-bottom:.5rem; color:var(--accent); font-family:system-ui,sans-serif; font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.button-link { display:inline-block; margin-top:1rem; padding:.7rem 1rem; border-radius:4px; color:#fff; background:var(--accent); font-family:system-ui,sans-serif; font-size:.9rem; text-decoration:none; } .button-link:hover { color:#fff; background:#4f2540; }
.page-heading { display:block; margin-bottom:36px; padding:0 0 20px; } .page-heading p:last-child { color:var(--muted); }
.section-heading { display:flex; justify-content:space-between; align-items:baseline; gap:20px; margin-bottom:8px; } .section-heading a { font-family:system-ui,sans-serif; font-size:.9rem; }
.post-card { margin:0; padding:25px 0 27px; border-bottom:1px solid var(--line); } .post-card h2 { margin-bottom:.45rem; } .post-card h2 a { text-decoration:none; }
.post-meta { margin-bottom:.45rem; color:var(--muted); font-family:system-ui,sans-serif; font-size:.8rem; } .post-excerpt { max-width:760px; margin-bottom:.8rem; color:var(--muted); }
.post-categories { display:flex; flex-wrap:wrap; gap:8px; font-family:system-ui,sans-serif; font-size:.76rem; } .post-categories a,.category-grid a { text-decoration:none; }
.post-categories a { padding:.18rem .55rem; border-radius:999px; background:var(--soft); } .post-categories-detail { margin:1rem 0 2rem; }
.post-content { max-width:760px; margin-top:2.2rem; color:#302c30; font-size:1.1rem; line-height:1.85; } .post-content::after { content:''; display:table; clear:both; }
.post-content p { margin:0 0 1.25rem; } .post-content h1,.post-content h2,.post-content h3,.post-content h4 { margin:2.5rem 0 1rem; }
.post-content ul,.post-content ol { margin:1rem 0 1.5rem; padding-left:2rem; } .post-content li { margin-bottom:.5rem; }
.post-content blockquote { margin:2rem 0; padding:1rem 1.5rem; border-left:4px solid var(--accent); color:var(--muted); font-style:italic; }
.post-content img { display:block; max-width:100%; height:auto; margin:2rem auto; } .post-content .aligncenter { margin-right:auto; margin-left:auto; }
.post-content .alignleft { float:left; max-width:50%; margin:0 2rem 1rem 0; } .post-content .alignright { float:right; max-width:50%; margin:0 0 1rem 2rem; }
.post-content figure { max-width:100%; margin:2rem 0; } .post-content figure img { margin:0 auto; } .post-content iframe,.post-content video { display:block; max-width:100%; margin:2rem auto; }
.post-content iframe { width:100%; min-height:360px; border:0; } .post-content table { display:block; max-width:100%; margin:2rem 0; overflow-x:auto; border-collapse:collapse; }
.post-content th,.post-content td { padding:.7rem; border:1px solid var(--line); text-align:left; } .post-content a { overflow-wrap:anywhere; }
.pagination { display:grid; grid-template-columns: auto 1fr auto; align-items:center; gap:8px; margin-top:38px; font-family:system-ui,sans-serif; }
.pagination-nav-wrapper { display:contents; }
.pagination-nav-wrapper > :nth-child(1) { grid-column:1; grid-row:1; }
.pagination-nav-wrapper > :nth-child(2) { display:none; }
.pagination-nav-wrapper > :nth-child(3) { grid-column:3; grid-row:1; }
.pagination-pages { grid-column:2; grid-row:1; display:flex; flex-wrap:wrap; justify-content:center; gap:3px; }
.pagination a,.pagination button,.pagination-current,.pagination-disabled { padding:.45rem .65rem; white-space:nowrap; }
.pagination button { border:1px solid var(--line); border-radius:3px; background:#fff; color:var(--ink); cursor:pointer; }
.pagination button:hover { background:var(--soft); }
.pagination-ellipsis { padding:.45rem .35rem; color:var(--muted); }
.pagination-current { border-radius:3px; color:#fff; background:var(--accent); } .pagination-disabled { color:#aaa; }
.pagination-info { color:var(--muted); font-size:.95rem; }
@media (max-width:767px) {
  body { padding:0 16px; }
  header.site-header { padding:0; }
  .header-top { flex-direction:row; justify-content:space-between; align-items:center; gap:12px; padding:12px 0; }
  .header-top .site-title { flex:1 1 auto; }
  .header-top .primary-nav { display:none; }
  .header-top .mobile-nav-toggle { flex-shrink:0; }
  .site-layout { display:block; }
  .category-sidebar { display:none; }

  /* Hide desktop search, show mobile search full-width */
  .header-search-desktop { display:none !important; }
  .header-search-mobile { display:block !important; width:100%; padding:0 0 12px 0; }
  .header-search-mobile .search-box { display:flex; gap:6px; align-items:center; width:100%; }
  .header-search-mobile .search-box input { flex:1; padding:.35rem .5rem; font-size:.85rem; }
  .header-search-mobile .search-box button { padding:.35rem .5rem; font-size:.8rem; white-space:nowrap; flex-shrink:0; }

  /* Mobile navigation toggle button - SHOW ON MOBILE */
  .mobile-nav-toggle { display:inline-flex !important; align-items:center; gap:8px; background:none; border:0; color:var(--accent); font-size:.95rem; cursor:pointer; padding:.15rem .25rem; transition:color 200ms ease; flex-shrink:0; }
  .mobile-nav-toggle:hover { color:#4f2540; }

  /* Hamburger icon */
  .hamburger { display:inline-block; width:22px; height:16px; position:relative; }
  .hamburger span { display:block; position:absolute; left:0; right:0; height:2px; background:var(--ink); border-radius:2px; transition:all 300ms cubic-bezier(0.4,0,0.2,1); }
  .hamburger span:nth-child(1) { top:0; }
  .hamburger span:nth-child(2) { top:7px; }
  .hamburger span:nth-child(3) { bottom:0; }

  /* Screen-reader only */
  .visually-hidden { position:absolute !important; height:1px; width:1px; overflow:hidden; clip:rect(1px, 1px, 1px, 1px); white-space:nowrap; border:0; padding:0; margin:-1px; }

  /* Full-screen navigation overlay */
  .mobile-nav-panel[hidden] { display:none; }
  .mobile-nav-panel { position:fixed; inset:0; background:rgba(0,0,0,0); display:flex; align-items:flex-start; justify-content:center; padding-top:0; z-index:1000; transition:background 240ms cubic-bezier(0.4,0,0.2,1); }
  .mobile-nav-panel.open { background:rgba(0,0,0,0.35); }
  .mobile-nav-panel-inner { position:relative; background:#fffdfd; width:100%; height:100%; overflow:auto; padding:12px 18px; box-shadow:0 10px 30px rgba(0,0,0,0); transform:translateY(-100%); transition:transform 300ms cubic-bezier(0.4,0,0.2,1), box-shadow 300ms cubic-bezier(0.4,0,0.2,1); }
  .mobile-nav-panel.open .mobile-nav-panel-inner { transform:translateY(0); box-shadow:0 10px 30px rgba(0,0,0,0.2); }
  .mobile-nav-close { background:none; border:0; font-size:1.4rem; color:var(--muted); cursor:pointer; transition:color 200ms ease; padding:0; }
  .mobile-nav-close:hover { color:var(--ink); }

  .mobile-nav-panel-header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:6px 4px 12px; border-bottom:1px solid var(--line); margin-bottom:12px; }
  .mobile-nav-panel-header h2 { margin:0; font-size:1.15rem; }

  .nav-section { display:flex; flex-direction:column; gap:8px; margin-bottom:20px; }
  .nav-section-title { margin:0 0 8px; font-size:.8rem; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; font-weight:600; }
  .nav-section-link, .nav-category-link { display:block; padding:.6rem .6rem; border-radius:4px; color:var(--ink); text-decoration:none; transition:background 200ms ease; }
  .nav-section-link:hover, .nav-category-link:hover { background:var(--soft); }
  .nav-section-link { font-weight:500; font-size:1.05rem; }
  .nav-category-link { font-size:.95rem; }

  main { padding-top:32px; }
  .section-heading { display:block; }
  .section-heading a { display:inline-block; margin-bottom:8px; }
  .post-content { font-size:1rem; line-height:1.75; }
  .post-content .alignleft,.post-content .alignright { float:none; max-width:100%; margin:1.5rem auto; }
  .pagination { display:flex; flex-direction:column; gap:12px; margin-top:20px; }
  .pagination-nav-wrapper { display:flex !important; gap:12px; justify-content:space-between; align-items:center; width:100%; }
  .pagination-nav-wrapper > :nth-child(2) { display:inline !important; flex:1; text-align:center; }
  .pagination-pages { display:flex; flex-wrap:wrap; justify-content:center; gap:3px; width:100%; }
  .pagination a,.pagination button,.pagination-current,.pagination-disabled { padding:.5rem .65rem; font-size:.9rem; }
  .pagination-info { font-size:.85rem; }
}

/* Related posts */
.related-posts { margin-top:3rem; border-top:1px solid var(--line); padding-top:20px; }
.related-posts h3 { margin:0 0 12px; font-size:1.1rem; }
.related-grid { display:flex; gap:14px; flex-wrap:wrap; }
.related-card { flex:1 1 220px; padding:12px; border-radius:6px; background:var(--soft); }
.related-card h4 { margin:0 0 .5rem; }
.related-excerpt { margin:0 0 .5rem; color:var(--muted); }
.related-meta { margin:0; font-size:.85rem; color:var(--muted); }

/* Search box */
.search-box { display:flex; gap:8px; align-items:center; }
.search-box input[type="search"] { padding:.5rem .6rem; border:1px solid var(--line); border-radius:6px; font-size:1rem; transition:border-color 200ms ease, box-shadow 200ms ease; min-width:200px; }
.search-box input[type="search"]:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(122,59,99,0.1); }
.search-box button { padding:.5rem .7rem; border:0; background:var(--accent); color:#fff; border-radius:6px; cursor:pointer; transition:background 200ms ease; font-weight:500; }
.search-box button:hover { background:#4f2540; }
.search-box button:active { transform:scale(0.98); }

.header-search-desktop .search-box input { min-width:250px; }
.header-search-desktop .search-box button { padding:.5rem 1rem; }

/* Search results container */
#global-search-results { margin:20px 0; padding:20px 0; border-top:1px solid var(--line); }
#global-search-results .post-list { margin-bottom:20px; }

/* Search success message */
.search-success-message { padding:16px; margin:0 0 24px; background:rgba(122,59,99,0.08); border-radius:6px; border-left:4px solid var(--accent); }
.search-success-message p { margin:0; color:var(--ink); font-size:.95rem; }
.search-success-message strong { font-weight:600; color:var(--accent); }
#search-results { margin-top:18px; }