/* MUFA Journal & Blog Stylesheet - 100% fidelity to blog.html */
nav [aria-current=page]{color:var(--brown)}
nav [aria-current=page]:after{transform:scaleX(1)}
.blog-heading{padding:28px 0 45px}
.blog-breadcrumb{display:flex;gap:14px;font-size:12px;color:var(--muted);margin-bottom:40px;flex-wrap:wrap}
.blog-heading-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:10%;align-items:end}
.blog-heading h1{font-size:clamp(43px,5vw,70px);margin:0}
.blog-heading-grid>p{font:23px/1.6 Georgia,serif;max-width:360px;margin:0}
.blog-feature{display:grid;grid-template-columns:1.5fr 1fr;background:#eee7df;text-decoration:none}
.blog-feature .blog-photo{height:420px;overflow:hidden;background:#ded6c9;position:relative}
.blog-feature .blog-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.blog-feature:hover .blog-photo img{transform:scale(1.03)}
.blog-feature>div{padding:45px;align-self:center}
.blog-feature h2{font-size:37px;margin:12px 0 0}
.blog-feature h2 a{color:inherit;text-decoration:none}
.blog-feature h2 a:hover{color:var(--brown)}
.blog-feature .eyebrow{font-size:9px;letter-spacing:2px;margin:0;color:var(--brown)}
.blog-feature>div>p:not(.eyebrow){font-size:14px;color:var(--muted);margin-top:22px;line-height:1.6}
.blog-feature .text-link{display:inline-flex;align-items:center;gap:6px;margin-top:20px;font-size:13px;color:var(--brown);font-weight:500}
.blog-list{padding:70px 0}
.blog-list-top{display:flex;justify-content:space-between;align-items:center;gap:25px}
.blog-list-top h2{font-size:36px;margin:0}
.blog-search{width:310px}
.blog-search span{font-size:11px;display:block;margin-bottom:5px;color:var(--muted)}
.blog-search input{background:transparent;width:100%;border:1px solid var(--line);padding:10px 14px;font-family:inherit;font-size:13px;color:inherit;outline:none;border-radius:0}
.blog-search input:focus{border-color:var(--brown)}
.blog-filters{display:flex;gap:10px;flex-wrap:wrap;margin:28px 0 20px}
.blog-filters button{border:1px solid var(--line);background:transparent;color:var(--brown);padding:10px 19px;font-size:13px;cursor:pointer;transition:.3s;font-family:inherit}
.blog-filters [aria-pressed=true],.blog-filters button:hover{background:var(--brown);color:white;border-color:var(--brown)}
#blog-count{font-size:12px;color:var(--muted);margin-bottom:22px}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:45px 25px}
.blog-card[hidden]{display:none !important}
.blog-card-cover{position:relative;display:block;overflow:hidden;background:#ded6c9;text-decoration:none}
.blog-card .blog-photo,.blog-type-cover{height:265px;position:relative;overflow:hidden}
.blog-card .blog-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.blog-card-cover:hover .blog-photo img{transform:scale(1.05)}
.blog-read{position:absolute;right:15px;bottom:15px;padding:9px 15px;background:#faf8f5e8;font-size:12px;color:var(--brown);opacity:0;transform:translateY(10px);transition:.4s;pointer-events:none}
.blog-card-cover:hover .blog-read,.blog-card-cover:focus-visible .blog-read{opacity:1;transform:none}
.blog-meta{display:flex;justify-content:space-between;gap:10px;font-size:9px;letter-spacing:.6px;text-transform:uppercase;color:var(--brown);margin:18px 0 12px}
.blog-meta span:last-child{color:var(--muted)}
.blog-card h3{font-size:26px;line-height:1.3;margin:0}
.blog-card h3 a{color:inherit;text-decoration:none}
.blog-card h3 a:hover{color:var(--brown)}
.blog-card>p{font-size:13px;color:var(--muted);margin-top:14px;line-height:1.6}
.blog-card .text-link{font-size:12px;margin-top:16px;display:inline-flex;align-items:center;gap:4px;color:var(--brown);text-decoration:none}
.blog-type-cover{background:#ded6c9;padding:25px;display:flex;flex-direction:column;justify-content:space-between}
.blog-type-cover>span{font-size:9px;letter-spacing:2px;color:var(--brown)}
.blog-type-cover p{font:31px/1.3 Georgia,serif;margin:0}
.blog-cta{padding:45px;background:#eee7df;display:grid;grid-template-columns:1fr 1fr;gap:12%;align-items:center;margin-bottom:70px}
.blog-cta h2{font-size:40px;margin:0}
.blog-cta .eyebrow{font-size:9px;letter-spacing:2px;margin-bottom:8px;color:var(--brown)}
.blog-cta>div>p:not(.eyebrow){font-size:14px;color:var(--muted);margin-bottom:23px;line-height:1.6}
#blog-empty{text-align:center;padding:60px 20px}
#blog-empty h3{font-size:24px;margin-bottom:10px}
#blog-empty p{font-size:14px;color:var(--muted);margin:15px 0 25px}
.journal-heading{padding:30px 0 40px}
.journal-heading h1{font-size:clamp(38px,4.3vw,62px);max-width:1000px;margin:0 0 15px}
.journal-heading>p:last-child{font-size:17px;color:var(--muted);max-width:790px;margin-top:25px;line-height:1.7}
.journal-cover{height:450px!important;overflow:hidden;position:relative}
.journal-cover img{width:100%;height:100%;object-fit:cover;display:block}
.blog-type-cover.journal-cover{padding:45px}
.blog-type-cover.journal-cover p{font-size:60px}
.journal-body{width:88%;max-width:780px;margin:40px auto 65px}
.journal-toc{display:flex;flex-direction:column;gap:12px;background:#eee7df;padding:25px;margin:0 0 40px}
.journal-toc>p{font-size:10px;letter-spacing:2px;color:var(--brown);margin-bottom:7px;font-weight:600}
.journal-toc a{font-size:14px;color:inherit;text-decoration:none}
.journal-toc a:after{display:none}
.journal-toc a:hover{color:var(--brown)}
.journal-body section{margin-bottom:35px}
.journal-body h2{font-size:31px;margin-bottom:18px}
.journal-body section>p{font-size:16px;line-height:1.95;color:#6d6257}
.journal-body img{max-width:100%;height:auto;margin:25px 0;border-radius:2px}
.journal-end{padding:25px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:40px 0 20px}
.journal-end>p{font:25px/1.4 Georgia,serif;margin:0;color:var(--brown)}
.blog-related{padding-bottom:65px}
.blog-related h2{font-size:32px;margin-bottom:30px}
.blog-related .blog-grid{grid-template-columns:repeat(2,1fr)}

.blog-list .blog-grid{align-items:stretch;row-gap:48px}
.blog-list .blog-card{display:flex;flex-direction:column}
.blog-list .blog-card[hidden]{display:none !important}
.blog-list .blog-card>p{flex:1}
.blog-list .blog-card>.text-link{align-self:flex-start}
.blog-pagination{display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid var(--line);padding-top:28px;margin-top:48px}
.blog-pagination[hidden]{display:none !important}
.blog-pagination>p,.blog-page-limit{font-size:11px;letter-spacing:.5px;color:var(--muted);margin:0}
.blog-page-controls,#blog-page-numbers{display:flex;align-items:center;gap:8px}
.blog-page-controls button{min-width:44px;height:44px;border:1px solid var(--line);background:transparent;color:var(--brown);font-size:13px;transition:background .3s,color .3s,border-color .3s;cursor:pointer;font-family:inherit}
.blog-page-controls button:hover:not(:disabled){background:#ece2d7;border-color:var(--brown)}
.blog-page-controls button[aria-current=page]{background:var(--brown);border-color:var(--brown);color:#fff}
.blog-page-controls button[aria-current=page]:hover{background:#755033;color:#fff}
.blog-page-controls .blog-page-direction{padding:0 17px;display:flex;gap:12px;align-items:center}
.blog-page-controls button:disabled{opacity:.35;cursor:default}
.blog-page-gap{font-size:13px;color:var(--muted);padding:0 5px}

@media(max-width:1000px){
  .blog-feature>div{padding:30px}
  .blog-feature h2{font-size:31px}
  .blog-grid{grid-template-columns:repeat(2,1fr)}
  .blog-heading-grid{gap:6%}
}

@media(max-width:680px){
  .blog-heading{padding:20px 0 30px}
  .blog-breadcrumb{margin-bottom:28px;font-size:11px}
  .blog-heading-grid{grid-template-columns:1fr;gap:25px}
  .blog-heading h1{font-size:43px;letter-spacing:-1px}
  .blog-heading-grid>p{font-size:21px;max-width:none}
  .blog-feature{grid-template-columns:1fr}
  .blog-feature .blog-photo{height:280px}
  .blog-feature>div{padding:27px}
  .blog-feature h2{font-size:32px}
  .blog-list{padding:40px 0}
  .blog-list-top{flex-direction:column;align-items:start;gap:20px}
  .blog-list-top h2{font-size:32px}
  .blog-search{width:100%}
  .blog-filters{gap:7px}
  .blog-filters button{padding:9px 13px;font-size:12px}
  .blog-grid,.blog-related .blog-grid{grid-template-columns:1fr;gap:35px}
  .blog-card h3{font-size:28px}
  .blog-card .blog-photo,.blog-type-cover{height:285px}
  .blog-read{opacity:1;transform:none}
  .blog-cta{grid-template-columns:1fr;gap:25px;padding:28px;margin-bottom:45px}
  .blog-cta h2{font-size:34px}
  .journal-heading{padding-top:20px}
  .journal-heading h1{font-size:38px;letter-spacing:-1px}
  .journal-heading>p:last-child{font-size:15px}
  .journal-cover{height:300px!important}
  .blog-type-cover.journal-cover{padding:25px}
  .blog-type-cover.journal-cover p{font-size:39px}
  .journal-body{margin-top:25px}
  .journal-toc{position:static;display:flex!important;box-shadow:none;padding:22px}
  .journal-body h2{font-size:28px}
  .blog-related{padding-bottom:45px}
  .blog-pagination{flex-wrap:wrap;gap:18px;margin-top:35px;padding-top:22px}
  .blog-page-controls{order:3;flex-basis:100%;justify-content:center;gap:6px}
  .blog-page-limit{margin-left:auto}
  .blog-page-controls button{min-width:40px;height:42px}
  .blog-page-controls .blog-page-direction{padding:0 12px;gap:8px}
  #blog-page-numbers{gap:5px}
  .blog-list .blog-grid{row-gap:35px}
}
