/* ==========================================================================
   Firnie blocks for the grown site: breadcrumbs, section heads, card grids,
   detail pages, FAQ, related links, articles, four-column footer.
   Loaded by layout.php after styles.css.
   ========================================================================== */
.crumbs{margin:-6px 0 22px;font-size:12px}
.crumbs ol{display:flex;flex-wrap:wrap;gap:0;margin:0;padding:0;list-style:none;color:#5d6270}
.crumbs li+li:before{content:"/";padding:0 9px;color:#8b91a0}
.crumbs a{color:#4b505d;text-decoration:none}
.crumbs a:hover{color:var(--brand-dark);text-decoration:underline}
.crumbs [aria-current]{color:#22252b;font-weight:600}
.page-archive .crumbs,.page-blog .crumbs{max-width:1050px}

.section-head{margin:0 0 32px;max-width:760px}
.section-head h2{font-size:clamp(26px,3vw,40px);letter-spacing:-1.5px;line-height:1.15;font-weight:500;margin:0}
.section-head__lede{font-size:16px;line-height:1.6;color:#5f6570;margin:14px 0 0;max-width:620px}
main>section+section.cardgrid,main>section+section.faq,main>section+section.related,main>section+section.postlist{margin-top:72px}
main>section.cardgrid:first-child,main>section.postlist:first-child{margin-top:0}

/* cards */
.cardgrid__items{display:grid;gap:18px;grid-template-columns:repeat(3,1fr)}
.cols-2 .cardgrid__items{grid-template-columns:repeat(2,1fr)}
.cols-4 .cardgrid__items{grid-template-columns:repeat(4,1fr)}
.card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line-soft);border-radius:16px;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.card:hover,.card:focus-within{border-color:#b9bdf3;box-shadow:0 10px 30px #2029511a}
.card__strip{display:flex;height:96px}
.card__strip span{flex:1}
.card__media{position:relative;aspect-ratio:1.4;background:#d6d9dd;overflow:hidden}
.card__media picture{display:block;width:100%;height:100%}
.card__media img{width:100%;height:100%;object-fit:cover}
.card__body{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1}
.card__tag{font-size:11px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:#555d99;margin:0 0 9px}
.card h3{font-size:21px;letter-spacing:-.6px;line-height:1.2;font-weight:600;margin:0}
.card__link{color:inherit;text-decoration:none}
.card__link:after{content:"";position:absolute;inset:0}
.card__text{font-size:14px;line-height:1.6;color:#5f6570;margin:10px 0 16px}
.card__more{margin-top:auto;font-size:13px;font-weight:700;color:var(--brand-dark)}
.card__more--second{position:relative;z-index:1;margin-top:8px;text-decoration:none}
.card__more--second:hover{text-decoration:underline}
.card:hover .card__more:not(.card__more--second){text-decoration:underline}
.cardgrid--steps .card{padding:26px 24px}
.cardgrid--steps .card__body{padding:0}
.card__num{font-size:34px;line-height:1;font-weight:500;letter-spacing:-1px;color:var(--brand);margin-bottom:20px}

/* detail pages */
.detail{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:start;margin:14px 0 64px}
.detail__lede{font-size:18px;line-height:1.6;color:#555b68;margin:20px 0 28px;max-width:560px}
.facts{margin:0;border-top:1px solid var(--line)}
.facts>div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.facts dt{font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#5f6572}
.facts dd{margin:0;font-size:14px;line-height:1.6;color:#2f333b}
.facts a{color:var(--brand-dark)}
.swatch-panel{position:relative;display:flex;gap:10px;aspect-ratio:1.1;border-radius:20px;overflow:hidden}
.swatch-panel span{border-radius:16px}
.swatch-panel__main{flex:3;box-shadow:inset 0 0 0 1px #00000010}
.swatch-panel__side{flex:1;box-shadow:inset 0 0 0 1px #00000010}
.detail__visual--photo{position:relative;aspect-ratio:1.25;border-radius:20px;overflow:hidden;background:#d6d9dd}
.detail__visual--photo picture{display:block;width:100%;height:100%}
.detail__visual--photo img{width:100%;height:100%;object-fit:cover}
.detail__caption{font-size:12px;color:#5f6572;margin:12px 4px 0;letter-spacing:.3px}
.detail__visual--photo+.detail__caption{display:none}

/* prose pages & articles */
.prose{padding:0;margin:0 0 56px}
.prose .wrap-narrow{margin:0;max-width:760px}
.article{max-width:760px;margin:14px 0 0}
.prose-body,.prose .wrap-narrow{font-size:17px;line-height:1.75;color:#33373f}
.prose-body h2,.prose .wrap-narrow h2{font-size:clamp(24px,2.6vw,32px);letter-spacing:-1px;line-height:1.2;font-weight:600;margin:2em 0 .6em;color:#22252b}
.prose-body h3,.prose .wrap-narrow h3{font-size:20px;letter-spacing:-.4px;font-weight:600;margin:1.6em 0 .5em}
.prose-body p,.prose-body li,.prose .wrap-narrow p,.prose .wrap-narrow li{margin:0 0 1.1em}
.prose-body ul,.prose-body ol,.prose .wrap-narrow ul,.prose .wrap-narrow ol{padding-left:1.3em;margin:0 0 1.2em}
.prose-body a,.prose .wrap-narrow a{color:var(--brand-dark);text-underline-offset:3px}
.prose-body a:hover{color:var(--brand)}
.prose-body blockquote{margin:1.6em 0;padding:4px 0 4px 22px;border-left:3px solid var(--brand);color:#3a3f4b;font-size:19px;line-height:1.6}
.article h1{font-size:clamp(32px,4vw,52px);letter-spacing:-2px;margin:0}
.article__lede{font-size:19px;line-height:1.6;color:#555b68;margin:20px 0 34px}
.article__head{padding-bottom:26px;margin-bottom:34px;border-bottom:1px solid var(--line)}
.article__head .journal-meta{margin-bottom:14px}

/* FAQ */
.faq{max-width:860px}
.faq__item{border-top:1px solid var(--line)}
.faq__item:last-child{border-bottom:1px solid var(--line)}
.faq__item summary{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:20px 0;font-size:18px;font-weight:600;letter-spacing:-.3px;cursor:pointer;list-style:none}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary:hover{color:var(--brand-dark)}
.faq__plus{font-size:24px;font-weight:400;color:var(--brand);transition:transform .2s;flex-shrink:0}
.faq__item[open] .faq__plus{transform:rotate(45deg)}
.faq__answer{padding:0 0 22px;max-width:700px;font-size:15px;line-height:1.7;color:#4a4f5b}
.faq__answer p{margin:0 0 .8em}
.faq__answer a{color:var(--brand-dark)}

/* related */
.related__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:0 40px}
.related__list li{border-top:1px solid var(--line)}
.related__list a{display:grid;grid-template-columns:1fr auto;gap:2px 16px;padding:18px 0;text-decoration:none;color:#292d35}
.related__label{font-weight:700;font-size:16px}
.related__text{grid-column:1;font-size:13px;line-height:1.55;color:#5f6570}
.related__list b{grid-row:1/3;grid-column:2;align-self:center;font-size:19px;font-weight:400}
.related__list a:hover .related__label{color:var(--brand)}
.related__list li:nth-last-child(-n+2){border-bottom:1px solid var(--line)}

/* blog list */
.postlist .journal-list{margin-top:0;grid-template-columns:repeat(3,1fr)}
.postlist--index .journal-feature+.journal-list{margin-top:55px}
.journal-entry{position:relative}
.journal-entry h3{font-size:22px;line-height:1.22;letter-spacing:-.7px;font-weight:600;margin:0}
.postlist .journal-entry:nth-child(3n+1){padding-left:0;border-left:0}
.postlist .journal-entry:not(:nth-child(3n+1)){padding-left:30px;border-left:1px solid #dfe1e7}
.postlist .journal-entry .entry-link{margin-top:10px}
.postlist__all{margin-top:18px}
.journal-feature h2 a{color:inherit}

/* footer */
.site-footer{display:block;padding-top:40px}
.site-footer__top{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px;align-items:start}
.site-footer__brand p{max-width:260px;line-height:1.6;margin:10px 0 8px}
.footer-logo{font-size:30px;font-weight:800;letter-spacing:-2px;color:#272930!important;text-decoration:none}
.footer-logo span{color:#404eea;font-size:32px;margin-left:5px}
.site-footer__col{display:flex;flex-direction:column;gap:9px;align-items:flex-start}
.site-footer__title{margin-bottom:6px!important}
.site-footer__col a{font-size:13px}
.site-footer__bar{display:flex;justify-content:space-between;gap:20px;margin-top:38px;padding-top:20px;border-top:1px solid var(--line)}

@media(max-width:1000px){
  .cardgrid__items,.cols-4 .cardgrid__items{grid-template-columns:repeat(2,1fr)}
  .detail{grid-template-columns:1fr;gap:28px}
  .site-footer__top{grid-template-columns:1fr 1fr}
  .postlist .journal-list{grid-template-columns:1fr}
  .postlist .journal-entry,.postlist .journal-entry:not(:nth-child(3n+1)){padding:25px 0;border-left:0}
  .related__list{grid-template-columns:1fr}
  .related__list li:nth-last-child(2){border-bottom:0}
}
@media(max-width:720px){
  .cardgrid__items,.cols-2 .cardgrid__items,.cols-4 .cardgrid__items{grid-template-columns:1fr}
  main>section+section.cardgrid,main>section+section.faq,main>section+section.related,main>section+section.postlist{margin-top:54px}
  .facts>div{grid-template-columns:1fr;gap:4px}
  .swatch-panel{aspect-ratio:1.4}
  .prose-body,.prose .wrap-narrow{font-size:16px}
  .site-footer__top{grid-template-columns:1fr;gap:0}
  .site-footer__brand{margin-bottom:12px}
  .site-footer__bar{flex-direction:column;gap:6px}
  .faq__item summary{font-size:16px}
}
.project{position:relative}
.prose-body li,.prose .wrap-narrow li{margin:0 0 .45em}.prose-body ul,.prose .wrap-narrow ul{margin-bottom:1.3em}
.card__strip--thin{height:8px}

/* photos: article cover, blog cards, detail caption */
.article__cover{margin:0 0 38px;border-radius:18px;overflow:hidden;background:#d6d9dd;aspect-ratio:1.78;position:relative}
.article__cover picture{display:block;width:100%;height:100%}
.article__cover img{width:100%;height:100%;object-fit:cover}
.journal-entry__img{aspect-ratio:1.5;border-radius:12px;overflow:hidden;background:#d6d9dd;margin-bottom:16px;position:relative}
.journal-entry__img picture{display:block;width:100%;height:100%}
.journal-entry__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.journal-entry:hover .journal-entry__img img{transform:scale(1.04)}
.feature-photo{aspect-ratio:1.3;border-radius:12px;overflow:hidden;background:#ffffff22;align-self:stretch}
.feature-photo picture{display:block;width:100%;height:100%}
.feature-photo img{width:100%;height:100%;object-fit:cover}
.journal-feature:has(.feature-photo){grid-template-columns:95px minmax(0,1fr) minmax(0,.7fr)}
.detail__caption{display:flex;align-items:center;gap:9px}
.detail__visual--photo+.detail__caption{display:flex}
.detail__dot{width:14px;height:14px;border-radius:50%;border:1px solid #00000022;flex-shrink:0}
@media(max-width:1000px){.journal-feature:has(.feature-photo){grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.journal-entry__img img{transition:none}}