/* ============================================================
   BLOG - the approved design's own stylesheet.
   Generated by bin/build-page-template.php. Do not edit here:
   edit the design and rebuild, or the page stops matching what
   was signed off.

   Written out as authored and scoped by where it loads - only on
   the page using this template - so the selectors without a
   .pe-blog prefix cannot reach anything else.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500&family=Poppins:wght@400;500;600;700&display=swap');

/* theme reset - rule 10. Scoped, first, and deliberately not !important so the
   page's own rules below still take precedence in the normal way. */
.pe-blog h1,.pe-blog h2,.pe-blog h3,.pe-blog h4,.pe-blog h5,.pe-blog h6{text-transform:none;letter-spacing:normal;color:inherit}
.pe-blog p,.pe-blog ul,.pe-blog ol,.pe-blog li{margin:0}
.pe-blog a{text-decoration:none;color:inherit;box-shadow:none}
.pe-blog img,.pe-blog svg{max-width:100%;height:auto}

.pe-blog{
  --ink:#17233B; --navy:#204287; --navy-soft:#E8EFF8; --gold:#FFBB26;
  --navy-dk:#1B3873; --navy-lt:#224B9A; --blue:#2A6DF2; --title:#16305F;
  --line:#D9E6F5; --wash:#F8FAFF; --card:#F0F6FB; --card-2:#F8FAFF;
  --grey:#5A6B84; --paper:#FFFFFF;
  --display:'Playfair Display',Georgia,serif;
  --body:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  --r:12px;
  width:100%;max-width:100%;margin-left:auto;margin-right:auto;box-sizing:border-box;
  font-family:var(--body);color:var(--ink);line-height:1.62;font-size:16.5px}
.pe-blog *,.pe-blog *::before,.pe-blog *::after{box-sizing:border-box}
.pe-blog .wrap{max-width:1140px;margin:0 auto;padding:0 24px}
.pe-blog .eyebrow{font-family:var(--body);font-size:11.5px;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--gold);margin-bottom:14px}
.pe-blog :focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}
.pe-blog .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- hero ---------- */
.pe-blog .hero{background:linear-gradient(150deg,var(--navy-dk) 0%,var(--navy) 52%,var(--navy-lt) 100%);color:#fff;padding:54px 0 50px}
.pe-blog .hero .orgname{font-family:var(--display);font-size:clamp(1.5rem,2.5vw,1.95rem);font-weight:700;color:#fff;letter-spacing:-.005em;margin:0 0 6px;line-height:1}
.pe-blog .hero .orgname span{color:var(--gold)}
.pe-blog .hero .heroeyebrow{font-family:var(--body);font-size:11.5px;font-weight:600;letter-spacing:.17em;text-transform:uppercase;color:#9FC0EC;margin:0 0 30px;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.18);max-width:60ch}
.pe-blog .hero h1{font-family:var(--display);font-size:clamp(2.1rem,4.4vw,3.2rem);font-weight:600;color:#fff;max-width:22ch;letter-spacing:-.015em;margin:0;line-height:1.13}
.pe-blog .hero h1 .h1-lead{color:var(--gold);font-weight:700}
.pe-blog .hero-lead{color:#DCE8FA;font-size:16.5px;margin-top:18px;max-width:56ch}

/* ---------- controls ---------- */
.pe-blog .controls{background:#fff;border-bottom:1px solid var(--line)}
.pe-blog .controls .wrap{padding-top:16px;padding-bottom:16px;display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center}
.pe-blog .chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.pe-blog .chip{font-family:var(--body);font-size:14px;font-weight:600;color:var(--navy);background:#fff;border:1px solid var(--line);border-radius:40px;padding:8px 15px;cursor:pointer;min-height:38px}
.pe-blog .chip:hover{border-color:var(--blue);color:var(--blue)}
.pe-blog .chip[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.pe-blog .srch{margin-left:auto;position:relative;flex:0 1 300px;min-width:200px}
.pe-blog .srch input{font-family:var(--body);font-size:16px;color:var(--ink);background:var(--card-2);border:1px solid #C7D8EE;border-radius:8px;padding:10px 14px 10px 38px;width:100%;min-height:42px}
.pe-blog .srch input:focus{outline:2px solid var(--blue);outline-offset:1px;border-color:var(--blue);background:#fff}
.pe-blog .srch svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:15px;height:15px;fill:none;stroke:var(--grey);stroke-width:2;stroke-linecap:round;pointer-events:none}

/* ---------- cards ---------- */
.pe-blog .section{padding:38px 0 60px}
.pe-blog .count{font-size:14.5px;color:var(--grey);margin-bottom:20px}
.pe-blog .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:20px;list-style:none;margin:0;padding:0}
.pe-blog .card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px 24px 22px;display:flex;flex-direction:column;transition:border-color .16s ease,box-shadow .16s ease}
.pe-blog .card:hover{border-color:#B9D0EC;box-shadow:0 10px 26px rgba(11,30,70,.08)}
.pe-blog .card h3{font-family:var(--display);font-size:1.24rem;font-weight:600;color:var(--title);line-height:1.3;margin:0;letter-spacing:-.006em}
.pe-blog .card h3 a{color:inherit}
.pe-blog .card h3 a:hover{color:var(--blue)}
.pe-blog .card .ex{font-size:15px;color:var(--grey);margin-top:11px;line-height:1.62}
.pe-blog .card .meta{margin-top:auto;padding-top:16px;display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.pe-blog .card time{font-size:12.8px;color:var(--grey)}
.pe-blog .card .more{font-size:14.6px;font-weight:600;color:var(--navy);border-bottom:1.5px solid var(--gold);padding-bottom:1px;white-space:nowrap}
.pe-blog .card .more:hover{color:var(--blue);border-bottom-color:var(--blue)}
.pe-blog .empty{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:30px 26px;text-align:center;color:var(--grey);font-size:16px;display:none}
.pe-blog .empty.on{display:block}

/* ---------- load more ---------- */
.pe-blog .more-wrap{margin-top:34px;text-align:center;display:none}
.pe-blog .more-wrap.on{display:block}
.pe-blog .loadmore{font-family:var(--body);background:var(--navy);color:#fff;border:1px solid var(--navy);border-radius:8px;padding:14px 34px;font-size:15.5px;font-weight:700;cursor:pointer;min-height:48px}
.pe-blog .loadmore:hover{background:var(--navy-lt)}
.pe-blog .remaining{display:block;margin-top:11px;font-size:13.5px;color:var(--grey)}
.pe-blog .pe-blog .status{font-size:13.5px;color:var(--grey);margin-top:22px;text-align:center}
.pe-blog .notice{display:none;margin-top:24px;background:#FFF8E8;border:1px solid rgba(176,124,0,.32);border-left:4px solid var(--gold);border-radius:var(--r);padding:18px 22px;font-size:15px;color:#6E4E00;line-height:1.6}
.pe-blog .notice.on{display:block}
.pe-blog .loading{display:flex;align-items:center;justify-content:center;gap:11px;margin-top:26px;font-size:14.5px;color:var(--grey)}
.pe-blog .loading span{width:15px;height:15px;border:2px solid var(--line);border-top-color:var(--blue);border-radius:50%;animation:pe-spin .7s linear infinite}
@keyframes pe-spin{to{transform:rotate(360deg)}}
.pe-blog .loading[hidden]{display:none}

/* ---------- closing ---------- */
.pe-blog .close{background:linear-gradient(140deg,var(--navy-dk),var(--navy-lt));color:#fff;padding:52px 0}
.pe-blog .close h2{font-family:var(--display);font-size:clamp(1.6rem,2.8vw,2.2rem);font-weight:600;margin:0 0 12px;color:#fff}
.pe-blog .close p{color:#DCE8FA;max-width:62ch}
.pe-blog .cta-row{display:flex;flex-wrap:wrap;gap:13px;margin-top:24px}
.pe-blog .btn{border-radius:8px!important;padding:13px 26px!important;font-weight:700;font-size:15px!important;display:inline-block;min-height:44px;line-height:1.3}
.pe-blog .btn-gold{background:var(--gold)!important;color:var(--ink)!important;border:1px solid var(--gold)!important}
.pe-blog .btn-gold:hover{filter:brightness(.95)}
.pe-blog .btn-ghost{background:transparent!important;color:#fff!important;border:1px solid rgba(255,255,255,.45)!important}
.pe-blog .btn-ghost:hover{background:rgba(255,255,255,.1)!important}

@media (max-width:760px){
  .pe-blog .hero{padding:44px 0 40px}
  .pe-blog .hero .heroeyebrow{white-space:normal;letter-spacing:.13em}
  .pe-blog .srch{margin-left:0;flex:1 1 100%}
}
@media (max-width:430px){
  .pe-blog .wrap{padding-left:16px;padding-right:16px}
  .pe-blog .grid{grid-template-columns:1fr}
  .pe-blog .card{padding:20px}
}
@media (prefers-reduced-motion:reduce){
  .pe-blog .card{transition:none}
  .pe-blog .loading span{animation:none}
}

/* ---------- direct answer ---------- */
.pe-blog .section h2{font-family:var(--display);font-size:clamp(1.45rem,2.5vw,1.95rem);font-weight:600;color:var(--title);letter-spacing:-.01em;line-height:1.25;margin:0 0 18px}
.pe-blog .answer{background:var(--card-2);border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:var(--r);padding:24px 28px;max-width:80ch}
.pe-blog .answer p{font-size:16.4px;line-height:1.68}
.pe-blog .answer p + p{margin-top:13px}
.pe-blog .answer p:first-child{font-weight:600;color:var(--navy)}

.pe-blog .byline{max-width:80ch;margin-top:16px;font-size:14.6px;line-height:1.62;color:var(--grey);padding-top:15px;border-top:1px solid var(--line)}.pe-blog .byline b{color:var(--navy);font-weight:600}
/* ---------- FAQ ---------- */
.pe-blog .faq{max-width:860px}
.pe-blog .faq details{border-bottom:1px solid var(--line)}
.pe-blog .faq summary{list-style:none;cursor:pointer;padding:17px 34px 17px 0;font-family:var(--body);font-weight:600;font-size:16.4px;position:relative;color:var(--navy)}
.pe-blog .faq summary::-webkit-details-marker{display:none}
.pe-blog .faq summary h3{font:inherit;margin:0;display:inline;letter-spacing:inherit;color:inherit}
.pe-blog .faq summary::after{content:"";position:absolute;right:6px;top:50%;width:9px;height:9px;border-right:2px solid var(--blue);border-bottom:2px solid var(--blue);transform:translateY(-70%) rotate(45deg);transition:transform .18s ease}
.pe-blog .faq details[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.pe-blog .faq .ans{padding:0 0 18px}
.pe-blog .faq .ans p{color:var(--grey);font-size:15.8px;line-height:1.66}
@media (prefers-reduced-motion:reduce){.pe-blog .faq summary::after{transition:none}}