/* #PlanWithIsaac — site-wide design QA pass, 14 October 2026.
   Visual system: cream / charcoal / sage, Manrope + Cormorant Garamond.
   Scoped changes preserve each page's content, forms, maps and routing. */
:root{
  --pwi-space-xs:8px; --pwi-space-sm:16px; --pwi-space-md:24px;
  --pwi-space-lg:36px; --pwi-space-xl:52px; --pwi-space-2xl:72px;
  --pwi-card-radius:18px;
}
.pwi-site-page a:focus-visible,
.pwi-site-page button:focus-visible,
.pwi-site-page select:focus-visible,
.pwi-site-page input:focus-visible,
.pwi-site-page summary:focus-visible{
  outline:3px solid #87997b;
  outline-offset:3px;
}
.pwi-site-page img{max-width:100%}
.pwi-site-page a, .pwi-site-page button{touch-action:manipulation}
.pwi-site-page .catalog-project,.pwi-site-page .pin{
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease
}
@media(prefers-reduced-motion:reduce){
 .pwi-site-page .catalog-project,.pwi-site-page .pin{transition:none}
}
/* Articles directory: root cause was a 90px empty spacer + an
   additional 40px footer margin + 56px footer padding. */
.pwi-layout-article-index .topicsend{display:none!important;height:0!important;padding:0!important;margin:0!important}
.pwi-layout-article-index main{padding-bottom:0!important}
.pwi-layout-article-index main + footer{margin-top:34px!important}
.pwi-layout-article-index footer{margin-top:16px!important;padding:38px 0 44px!important}
.pwi-layout-article-index .trow{padding-top:30px!important;padding-bottom:4px!important}
.pwi-layout-article-index .seemore{padding:17px 0 0!important}
.pwi-layout-article-index .trow:last-of-type{padding-bottom:8px!important}
.pwi-layout-article-index .trow-head{margin-bottom:18px!important}
.pwi-layout-article-index .trow-head .tag-line{line-height:1.55;font-family:'Manrope',sans-serif}
/* Consistent editorial container, including 1186px laptop screens. */
.pwi-layout-article-index .wrap,
.pwi-layout-article-topic .wrap{
  width:min(1120px,calc(100% - 64px))!important;
  max-width:none!important;
  padding-left:0!important;
  padding-right:0!important;
  margin-left:auto!important;
  margin-right:auto!important
}
.pwi-layout-article-index .track{gap:18px!important;grid-auto-columns:calc((100% - 36px)/3)!important}
.pwi-layout-article-index .pin,
.pwi-layout-article-topic .pin{padding:13px!important;border-radius:18px!important}
.pwi-layout-article-index .pin .body,
.pwi-layout-article-topic .pin .body{padding:16px 7px 6px!important}
.pwi-layout-article-index .pin h3,
.pwi-layout-article-topic .pin h3{
  font-family:'Manrope',sans-serif!important;
  font-weight:750!important;
  font-size:clamp(16px,1.38vw,18px)!important;
  letter-spacing:-.022em;
  line-height:1.35!important;
  display:block!important;
  -webkit-line-clamp:unset!important;
  overflow:visible!important;
  overflow-wrap:break-word
}
.pwi-layout-article-index .pin .body>p:not(.meta),
.pwi-layout-article-topic .pin .body>p:not(.meta){
  font-family:'Manrope',sans-serif!important;
  font-size:13.5px!important;
  line-height:1.65!important;
  color:#565e50!important;
  margin-top:9px!important;
  display:-webkit-box!important;
  -webkit-line-clamp:3!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
}
.pwi-layout-article-index .pin .meta,
.pwi-layout-article-topic .pin .meta{margin-top:auto!important;padding-top:14px!important;font-family:'Manrope',sans-serif!important}
.pwi-layout-article-index .pin .readmore,
.pwi-layout-article-topic .pin .readmore{
  min-height:36px;
  display:inline-flex!important;
  align-items:center!important;
  font-family:'Manrope',sans-serif!important;
  font-size:11px!important;
  letter-spacing:.075em!important;
  background:#eeece5!important;
  color:#1e211c!important;
  border:1px solid rgba(30,33,28,.14)!important;
}
.pwi-layout-article-index .pin:hover,
.pwi-layout-article-topic .pin:hover{box-shadow:0 12px 30px rgba(30,33,28,.07)!important}
.pwi-layout-article-topic .masonry,
.pwi-layout-article-topic .grid3{padding-bottom:38px!important}
.pwi-layout-article-topic footer{margin-top:16px!important;padding-top:36px!important}
.pwi-layout-article-topic .pagehead{padding-top:42px!important}
.pwi-layout-article-topic .pin h3{font-size:17px!important}
.pwi-layout-article-topic .pin .cover{aspect-ratio:1.43!important}
/* Editorial article detail pages: maintain a readable column and breathing space. */
.pwi-layout-article-detail h1{font-family:'Cormorant Garamond',Georgia,serif;letter-spacing:-.025em}
.pwi-layout-article-detail article p{line-height:1.8}
.pwi-layout-article-detail article img{height:auto}
.pwi-layout-article-detail main{padding-bottom:32px}
/* Launch and GLS directory: scale consistent with rest of PlanWithIsaac. */
.pwi-layout-catalog .catalog-hero{padding:clamp(48px,6.2vw,86px) 0 38px!important}
.pwi-layout-catalog .catalog-hero h1{font-family:'Cormorant Garamond',Georgia,serif!important;font-size:clamp(43px,5.5vw,70px)!important;line-height:1.04!important;letter-spacing:-.04em}
.pwi-layout-catalog .catalog-section{padding:clamp(38px,4.6vw,64px) 0!important}
.pwi-layout-catalog .catalog-head h2{font-family:'Cormorant Garamond',Georgia,serif!important}
.pwi-layout-catalog .catalog-project{padding:22px!important;border-radius:18px!important}
.pwi-layout-catalog .catalog-project h3,
.pwi-layout-catalog .catalog-fact strong{font-family:'Cormorant Garamond',Georgia,serif!important}
.pwi-layout-catalog .catalog-project h3{font-size:clamp(24px,2.7vw,29px)!important}
.pwi-layout-catalog .catalog-project p{line-height:1.65!important}
.pwi-layout-catalog .catalog-link{color:#3b513a!important}
.pwi-layout-catalog .catalog-quicknav a{min-height:38px;display:inline-flex;align-items:center}
/* Guides: oversized 92px headlines forced five cramped desktop lines. */
.pwi-layout-guide .hero{padding:clamp(47px,6vw,84px) 0 clamp(45px,5vw,68px)!important}
.pwi-layout-guide .hero h1{font-family:'Cormorant Garamond',Georgia,serif!important;font-size:clamp(44px,5vw,68px)!important;line-height:1.08!important;max-width:870px!important;letter-spacing:-.037em}
.pwi-layout-guide .hero-grid{grid-template-columns:minmax(0,1.26fr) minmax(0,.74fr)!important;gap:clamp(24px,4vw,62px)!important}
.pwi-layout-guide .section{padding:clamp(44px,5.4vw,74px) 0!important}
.pwi-layout-guide .lede{font-size:clamp(17px,1.8vw,20px)!important;line-height:1.7!important}
/* BTO guide uses same typography across main and detail, while its verified
   cartography and existing map interactions remain untouched. */
.pwi-layout-bto .section-header h2{letter-spacing:-.05em}
.pwi-layout-bto .sect{padding-top:clamp(42px,5vw,65px);padding-bottom:clamp(42px,5vw,65px)}
/* CPF tool: use shared branded accent, retaining all calculation states. */
.pwi-layout-tool{--accent:#344c3b!important;--accent-ink:#1e211c!important}
.pwi-layout-tool .btn.big{font-family:'Manrope',sans-serif;border-radius:999px}
.pwi-layout-tool .opt.sel{background:#e8eee5!important}
.pwi-layout-tool .linkish{color:#344c3b}
/* Mobile spacing: intentional edge padding, 2-column carousels on tablets,
   text stays legible without reducing type. */
@media(max-width:950px){
 .pwi-layout-article-index .track{grid-auto-columns:calc((100% - 18px)/2)!important}
 .pwi-layout-guide .hero-grid{grid-template-columns:1fr!important}
 .pwi-layout-catalog .catalog-hero h1{font-size:clamp(40px,6.5vw,59px)!important}
}
@media(max-width:640px){
 .pwi-layout-article-index .wrap,.pwi-layout-article-topic .wrap{width:calc(100% - 36px)!important}
 .pwi-layout-article-index .track{grid-auto-columns:87%!important;gap:12px!important}
 .pwi-layout-article-index .trow{padding-top:25px!important}
 .pwi-layout-article-index .seemore{padding-top:12px!important}
 .pwi-layout-article-index .pin h3,.pwi-layout-article-topic .pin h3{font-size:17px!important}
 .pwi-layout-article-index .pin .body>p:not(.meta),.pwi-layout-article-topic .pin .body>p:not(.meta){font-size:13px!important}
 .pwi-layout-article-topic .grid3{grid-template-columns:1fr!important;gap:14px!important}
 .pwi-layout-guide .hero h1{font-size:clamp(36px,9vw,51px)!important}
 .pwi-layout-catalog .catalog-hero{padding:44px 0 31px!important}
 .pwi-layout-catalog .catalog-hero h1{font-size:clamp(38px,9vw,50px)!important}
 .pwi-layout-catalog .catalog-section{padding:40px 0!important}
 .pwi-layout-catalog .catalog-project{padding:19px!important}
}
/* The BTO editorial section belongs to the same premium typographic family. */
.pwi-layout-bto .hero h1{font-family:'Cormorant Garamond',Georgia,serif!important;font-weight:550!important;font-size:clamp(52px,6vw,76px)!important;letter-spacing:-.043em!important;line-height:1.03!important}
.pwi-layout-bto .section-header h2,.pwi-layout-bto .help h2{font-family:'Cormorant Garamond',Georgia,serif!important;font-weight:600!important;letter-spacing:-.033em!important}
@media(max-width:640px){.pwi-layout-bto .hero h1{font-size:clamp(43px,10vw,56px)!important}.pwi-layout-bto .section-header h2{font-size:clamp(36px,8vw,44px)!important}}
