/* Publication navigation and editorial layouts. */
/* The original ribbon extends behind the initial home navigation. */
.home-page .hero{overflow:visible}
.home-page .ribbon-surround{inset:-190px 0 0;mask-image:linear-gradient(to bottom,#000 85%,transparent)}
.home-page .hero-ribbon{object-fit:cover;object-position:left center}
/* Anchor static artwork to the page when native menus grow the header. */
html:not(.enhanced) .home-page{background:url('art/hero-ribbon.svg') left -130px/auto 900px no-repeat}
html:not(.enhanced) .home-page .ribbon-surround{visibility:hidden}
.home-page .site-header:not(.is-compact),
.home-page .site-header:not(.is-compact) .nav-shell{background:transparent}
/* A smaller opening, achieved with layout rather than scaled text. */
.hero{padding-top:8px}
.hero-presentation{padding-block:8px 16px}
.hero-presentation>.rail{max-width:1080px}
.editorial-frame{min-height:0;padding:8px}
.editorial-stage{min-height:0}
.editorial-sheet{width:90%;min-height:0;margin-block:40px;padding:36px 32px 28px}
.hero-copy h1{font-size:48px;line-height:1.1}
.hero-copy .eyebrow{margin-bottom:12px}
.hero-copy .lede{margin-top:18px;font-size:18px;line-height:1.6}
.hero-copy .button{margin-top:20px}
.sheet-footer{margin-top:22px;padding-top:12px}
.glass-sheet{height:calc(100% - 52px)}
.motion-toggle{right:18px;bottom:18px}
@media(max-width:767px){
 .hero{padding-top:6px}
 .hero-presentation{padding-block:6px 12px}
 .editorial-frame{padding:6px}
 .editorial-sheet{width:96%;margin-block:24px 16px;padding:20px 12px 14px}
 .hero-copy h1{font-size:30px;line-height:1.12}
 .hero-copy .lede{margin-top:14px;font-size:16px}
 .hero-copy .button{margin-top:18px;padding-inline:18px;gap:14px}
 .sheet-footer{gap:6px 12px;margin-top:18px;padding-top:10px}
 .glass-sheet{height:calc(100% - 42px)}
 .motion-toggle{top:10px;right:10px;bottom:auto}
}
.site-header .primary-nav{gap:12px}
.site-header .nav-group{position:relative}
.site-header .nav-group summary{display:flex;align-items:center;justify-content:flex-start;gap:8px;min-height:44px;padding:0 8px;list-style:none;font-size:13px;font-weight:400;color:#5e5e5e;cursor:pointer;white-space:nowrap;border-radius:8px}
.site-header .nav-group summary::-webkit-details-marker{display:none}
.site-header .nav-chevron{width:12px;height:12px;transform:rotate(0deg);transition:transform 200ms cubic-bezier(.4,0,.2,1)}
.site-header .nav-group[open] .nav-chevron{transform:rotate(180deg)}
.site-header .primary-nav>a{padding:0 8px;white-space:nowrap;border-radius:8px}
.site-header [aria-current]{color:#263020!important;background:#f0f5e3;font-weight:500!important}
.site-header .nav-group[open]>summary,.site-header .primary-nav a:hover{background:#f6f8ef;color:var(--ink)}
.site-header .nav-panel{position:absolute;right:0;top:calc(100% + 9px);width:350px;padding:9px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 14px 36px #23330d12;max-height:calc(100dvh - 110px);overflow-y:auto;overscroll-behavior:contain}
.site-header .nav-panel a{padding:10px 13px;border-radius:8px;min-height:46px;line-height:1.5}
.site-header .nav-panel a:first-child{font-weight:500;color:var(--ink);border-bottom:1px solid var(--line);border-radius:8px 8px 0 0;margin-bottom:4px}
.site-header.is-compact .nav-shell{width:min(900px,calc(100% - 48px))}
.site-header.is-compact .primary-nav{gap:8px}
html.enhanced .site-header.is-compact .nav-shell{background:#fff}
@media(max-width:1100px){
 .site-header{height:auto;min-height:74px;background:#fffffff7}
 .site-header .nav-shell{flex-wrap:wrap}
 .site-header .primary-nav{width:100%;display:flex;flex-direction:column;align-items:stretch;gap:0;padding-bottom:12px}
 .site-header .nav-group summary,.site-header .primary-nav>a{min-height:48px;padding:10px 12px}
 .site-header .nav-panel{position:static;width:auto;max-height:none;padding:0 0 8px 10px;margin:0 12px 8px;border:0;border-left:2px solid #d5e5af;border-radius:0;box-shadow:none;overflow:visible}
 .site-header .nav-panel a{min-height:48px;white-space:normal}
 html.enhanced .site-header{height:74px;background:transparent}
 html.enhanced .site-header .nav-shell{position:relative;background:#fffffff7}
 html.enhanced .site-header .menu-toggle{display:inline-flex}
 html.enhanced .site-header .primary-nav{position:absolute;left:-1px;right:-1px;top:calc(100% + 8px);width:auto;padding:8px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 12px 24px #0000000c;max-height:calc(100dvh - 100px);overflow-y:auto;overscroll-behavior:contain}
 .site-header.is-compact .nav-shell{width:calc(100% - 48px);min-height:56px;margin-top:16px;padding-inline:15px;border-radius:999px}
 .site-header.is-compact .primary-nav{gap:0}
}
@media(max-width:767px){
 .site-header.is-compact .nav-shell{width:calc(100% - 24px);margin-top:10px}
}

/* New home entry points reuse the publication's rail, type and lime accents. */
.home-start .section-heading,.home-guides .section-heading{max-width:720px}
.text-link{display:inline-flex;gap:16px;align-items:center;min-height:44px;font-size:14px;font-weight:500;text-decoration:underline;text-underline-offset:5px}
.home-start .text-link,.home-resources .text-link{margin-top:20px}
.pathways{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:28px}
.pathway{position:relative;display:block;padding:30px 28px 56px;border:1px solid #e3e8d8;border-radius:16px;background:linear-gradient(120deg,#f6f8f0,#fff)}
.pathway .eyebrow{display:block;margin-bottom:26px}
.pathway h3{margin-bottom:16px;max-width:280px}
.pathway-arrow{position:absolute;bottom:20px;right:28px;font-size:24px}
.pathway:hover{border-color:#b7c898}
.more-software{padding-bottom:40px;margin-top:-28px}
.home-guides{background:var(--surface)}
.guide-directory{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 60px;margin-top:32px}
.guide-directory>a{position:relative;padding:28px 40px 32px 0;border-top:1px solid #dedfd9}
.guide-directory h3{font-size:24px;margin-bottom:12px}
.guide-directory p{font-size:16px;line-height:1.75}
.guide-directory>a>span{position:absolute;right:4px;top:28px;font-size:24px}
.home-guides .text-link{margin-top:24px}
.home-resources{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:100px;align-items:start}
.resource-list{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.resource-list a{display:flex;justify-content:space-between;gap:20px;align-items:center;min-height:88px;padding:22px 4px;border-bottom:1px solid var(--line);font-size:18px;font-weight:500}
.resource-list a>span{font-size:24px}
.resource-list a:hover,.guide-directory a:hover h3{text-decoration:underline;text-underline-offset:5px}

/* Long-form and directory pages. These selectors never affect the hero. */
.content-page{padding-block:16px 64px;overflow-wrap:anywhere}
.breadcrumbs{font-size:12px;color:#62665d}
.breadcrumbs ol{display:flex;align-items:center;flex-wrap:wrap;gap:0 10px;list-style:none;padding:0;margin:0}
.breadcrumbs li{display:flex;align-items:center;gap:10px;min-height:32px;max-width:100%}
.breadcrumbs li+li::before{content:'/';color:#7b8272}
.breadcrumbs a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:3px}
.page-intro{padding:24px 0 32px;margin-bottom:36px;border-bottom:1px solid var(--line)}
.page-intro .eyebrow{color:#566344;margin-bottom:18px}
.page-intro h1{max-width:1050px;font-size:clamp(36px,4vw,56px);line-height:1.14;letter-spacing:-.035em;text-wrap:balance;text-align:left}
.about-office{max-width:800px;margin:0 0 32px}
.about-office img{width:100%;height:auto;object-fit:contain;border-radius:16px}
.about-office figcaption{margin-top:10px;font-size:16px;line-height:1.65;color:#53584e}
.page-description{max-width:72ch;font-size:18px;line-height:1.75;margin-top:18px}
.content-page[data-kind="hub"] .page-intro{padding:32px;border:1px solid #e3e8d8;border-radius:20px;background:linear-gradient(110deg,#f6f8f0,#fff)}
.article-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:48px;align-items:start}
.contents{position:sticky;top:112px;max-height:calc(100dvh - 144px);overflow-y:auto;padding-right:20px;font-size:12px;line-height:1.7}
.contents .eyebrow{margin-bottom:14px}
.contents ol{list-style:none;margin:0;padding:0;border-left:1px solid #dde5ce}
.contents li a{display:block;padding:9px 0 9px 16px;font-size:13px;line-height:1.55;color:#51564a}
.contents .toc-h3 a{padding-left:26px;font-size:12px}
.contents a:hover{text-decoration:underline;text-underline-offset:4px}
.contents .editorial-note{font-size:12px;margin-top:30px;padding-top:20px;border-top:1px solid var(--line)}
.contents>a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:3px}
.prose{width:100%;max-width:72ch;min-width:0;font-size:16px;line-height:1.75;color:#33382f}
.prose p{color:#53584e;line-height:1.75;margin-block:18px}
.prose h2{font-size:32px;line-height:1.25;letter-spacing:-.025em;color:var(--ink);margin:36px 0 18px;scroll-margin-top:112px}
.prose h3{font-size:23px;line-height:1.35;color:var(--ink);margin:32px 0 15px;scroll-margin-top:112px}
.prose h4{font-size:18px;line-height:1.5;margin:26px 0 12px}
.prose>:first-child,.prose>section:first-child>:first-child{margin-top:0}
.prose ul,.prose ol{padding-left:25px;margin-block:18px 26px}
.prose li{margin-block:10px;padding-left:4px}
.prose li::marker{color:#71834f}
.prose a:not(.button){text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;color:#304222}
.prose a:hover:not(.button){text-decoration-thickness:2px}
.prose strong{color:#31382a}
.prose blockquote,.prose aside{margin:28px 0;padding:22px 26px;border-left:3px solid #bdd77d;background:#f6f8ef}
.prose blockquote p:first-child,.prose aside p:first-child{margin-top:0}
.prose blockquote p:last-child,.prose aside p:last-child{margin-bottom:0}
.prose dl{margin:26px 0}.prose dt{font-weight:600;margin-top:18px}.prose dd{margin:6px 0 18px}
.prose code{font-size:.95em;overflow-wrap:anywhere}
.table-scroll{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;margin:28px 0;border:1px solid #dfe4d6;border-radius:10px}
.prose table{width:100%;min-width:620px;border-collapse:collapse;text-align:left;font-size:15px;line-height:1.7}
.prose caption{text-align:left;padding:18px 20px;font-weight:500;color:#3e4a2f;background:#fafbf8}
.prose th,.prose td{padding:16px 18px;vertical-align:top;border-bottom:1px solid #e6e9e0}
.prose th{font-weight:600;color:#344326;background:#f3f6ec}
.prose tr:last-child td{border-bottom:0}
.template-resource{margin-top:36px;padding-top:16px;border-top:1px solid var(--line)}
.template-resource .button{margin-block:8px 20px}
.prose pre{max-width:100%;white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal;user-select:text;background:#f7f8f3;border:1px solid #e2e7d6;border-radius:12px;padding:26px;font:16px/1.8 ui-monospace,SFMono-Regular,Consolas,monospace;color:#344029;margin-block:20px 0}
.hub-directory{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 60px;margin-bottom:44px}
.hub-directory>a,.related-grid>a{position:relative;padding:28px 30px 30px 0;border-top:1px solid #dde3d4}
.hub-directory .eyebrow,.related-grid .eyebrow{display:block;font-size:11px;margin-bottom:12px}
.hub-directory h3,.related-grid h3{font-size:24px;margin-bottom:14px}
.hub-directory p,.related-grid p{font-size:16px;line-height:1.75}
.reading-arrow{position:absolute;right:0;top:24px;font-size:23px;color:#5c6f3a}
.hub-directory a:hover h3,.related-grid a:hover h3{text-decoration:underline;text-underline-offset:5px}
.related-reading{margin-top:56px;padding-top:32px;border-top:1px solid var(--line)}
.related-reading h2{font-size:36px}.related-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 60px;margin-top:36px}
.content-footer{width:100%;padding-block:28px 20px;background:#181a17;color:#f4f6ef}
.content-footer .footer-main{grid-template-columns:1.4fr 1fr 1.2fr;gap:40px;padding-bottom:20px}
.content-footer .brand,.content-footer .footer-heading{color:#f4f6ef}
.content-footer .brand img{filter:grayscale(1) invert(1)}
.content-footer p,.content-footer .footer-links a{color:#c6cdc0}
.content-footer .footer-brand p{margin-top:12px}
.content-footer .footer-heading{font-size:12px;margin-block:0 8px}
.content-footer .footer-links a{min-height:44px;display:flex;align-items:center;font-size:14px;line-height:1.5;padding-block:6px}
.content-footer .footer-bottom{padding-top:12px;border-color:#41473d}
.content-footer .footer-bottom p{font-size:12px}
.content-footer a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.content-footer a:focus-visible{outline-color:#d5ee8b}
@media(max-width:767px){
 .content-footer{padding-block:20px 18px}
 .content-footer .footer-main{grid-template-columns:1fr 1fr;gap:16px 24px;padding-bottom:16px}
 .content-footer .footer-brand p{max-width:100%;margin-top:10px}
}
.privacy-note{padding:22px 24px;margin-bottom:26px;border:1px solid var(--line);border-radius:12px;background:#fafbf8}
.privacy-note p{font-size:14px;line-height:1.75}
.privacy-note a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:1100px){
 .article-layout{grid-template-columns:190px minmax(0,1fr);gap:36px}
 .home-resources{gap:48px}
 .pathways{gap:18px}.pathway{padding:26px 23px 56px}
 .hub-directory,.related-grid,.guide-directory{column-gap:36px}
}
@media(max-width:900px){
 .article-layout{grid-template-columns:minmax(0,1fr);gap:28px}
 .contents{position:static;max-height:none;padding:22px 24px;border:1px solid #e2e7d7;border-radius:12px;background:#fafbf7}
 .contents ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px;border-left:0}
 .contents li a,.contents .toc-h3 a{padding:10px 0;min-height:44px}
 .contents .editorial-note{margin-top:16px;padding-top:16px}
 .prose{margin-inline:auto}
 .pathways{grid-template-columns:1fr}.pathway{padding-right:50px}.pathway h3{max-width:none}
 .pathway .eyebrow{margin-bottom:12px}
 .home-resources{grid-template-columns:1fr;gap:32px}
}
@media(max-width:600px){
 .content-page{padding-block:12px 44px}
 .page-intro{padding-block:20px 24px;margin-bottom:24px}
 .page-intro h1{font-size:36px;line-height:1.15}
 .page-description{font-size:16px;line-height:1.75;margin-top:20px}
 .content-page[data-kind="hub"] .page-intro{padding:28px 22px;border-radius:16px}
 .contents{padding:20px}.contents ol{grid-template-columns:1fr}
 .prose h2{font-size:28px;margin-top:32px}.prose h3{font-size:22px}
 .prose pre{padding:20px;font-size:16px}
 .hub-directory,.related-grid,.guide-directory{grid-template-columns:1fr}
 .hub-directory{margin-bottom:44px}
 .related-reading{margin-top:40px;padding-top:28px}.related-reading h2{font-size:30px}
 .guide-directory{margin-top:32px}
 .resource-list a{font-size:16px;min-height:76px}
 .more-software{margin-top:-20px;padding-bottom:28px}
 .privacy-note{padding:20px}
}
@media print{
 .content-page .contents,.site-header,.template-resource .button{display:none!important}
 .article-layout{display:block}.prose{max-width:100%}.table-scroll{overflow:visible}.prose table{min-width:0}
 .content-page{padding-bottom:20px}.related-reading{break-before:auto}
}