/* Shared by the three content directories; the download homepage keeps its theme. */
@font-face{font-family:"Directory Handwriting";src:url('../assets_z7bjvg1p7ucl/fonts_xqu8a7lw9lrb/directory-handwriting.ttf?v=20260913b') format('truetype');font-display:swap}
.directory-page{--bg:#fffaf4;--surface:#fffdf9;--surface-raised:#fff;--text:#512e22;--muted:#806b5d;--subtle:#887466;--border:#e9ded2;--accent:#ed5b1d;--accent-ink:#b33e13;--accent-hover:#c54513;--accent-soft:#ffead8;--focus:#bb4c20;--news-panel:var(--surface);--news-line:var(--border);--news-muted:var(--muted);--news-accent:var(--accent);background:var(--bg);color:var(--text)}
.directory-page .site-header{min-height:80px;background:var(--surface);padding-inline:36px}
.directory-page .site-header .brand{font-size:22px}
.directory-page .button,.directory-page .button-outline{border-radius:10px}
.directory-page .button-outline{border-color:var(--border)}
.directory-page .button-outline:hover{background:var(--accent-soft)}
.directory-page main.page-wrap{padding-top:0;padding-inline:36px}
.directory-page .directory-hero{position:relative;isolation:isolate;min-height:265px;margin:0 -36px 24px;padding:42px 36px 30px;background:#fff8ee url('../assets_z7bjvg1p7ucl/directory-hero.webp?v=57d2a300f226') right center/auto 100% no-repeat;border:0}
.directory-page .directory-hero> *{position:relative}
.directory-page .directory-hero h1{color:var(--text)}
.directory-page .site-footer{font-size:12px}
.directory-page input,.directory-page select{color-scheme:light}
.directory-page a,.directory-page button{touch-action:manipulation}
.directory-page .mobile-only{display:none}
@media(max-width:780px){
 .directory-page .site-header{padding:10px 18px 0;gap:0 8px;min-height:108px}
 .directory-page .site-header .brand{font-size:19px}
 .directory-page .site-header .button{padding:9px 10px;font-size:12px;min-height:44px}
 .directory-page .site-nav{gap:0;justify-content:space-between}
 .directory-page .site-nav a{font-size:13px}
 .directory-page .site-nav a[href='./#how']{display:none}
 .directory-page main.page-wrap{padding-inline:18px;padding-top:0}
 .directory-page .directory-hero{margin:0 -18px 18px;padding:25px 18px;min-height:176px;background-size:auto 100%;background-position:right center}
 .directory-page .site-footer{padding-inline:18px;overflow-wrap:anywhere}
 .directory-page .mobile-only{display:inline-flex}
}

/* Shared final layer, loaded after each page's selected design.
   The artwork spans the hero so its waves continue beneath the copy. */
.selected-design.directory-page header.site-header{max-width:1440px;min-height:80px;padding-inline:36px}
.selected-design.directory-page main.page-wrap{max-width:1440px;padding-inline:36px;padding-top:0}
.selected-design.directory-page main.page-wrap > .directory-hero{
 display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;min-height:360px;height:auto;aspect-ratio:2.2;
 margin:0 -36px 24px;padding:clamp(48px,6vw,86px) 36px 32px;background:var(--bg);overflow:hidden;
}
.selected-design.directory-page .directory-hero .directory-hero-copy{
 position:relative;z-index:1;width:40%;max-width:none;padding:0;margin:0;
}
.selected-design.directory-page .directory-hero .directory-hero-art{
 position:absolute;inset:0;transform:none;
 display:block;width:100%;max-width:none;height:100%;container-type:size;pointer-events:none;
}
.selected-design.directory-page .directory-hero :is(#news-title,#page-title,#finance-title){
 font-size:clamp(42px,4.4vw,64px);line-height:1.25;max-width:none;width:auto;
 margin:8px 0 14px;white-space:normal;background:transparent;
}
.selected-design.directory-page #page-title span{display:block}
.selected-design.directory-page .directory-hero :is(.news-lead,.yt-lead,.finance-lead){
 text-wrap:pretty; max-width:100%;width:auto;font-size:20px;line-height:1.8;background:transparent;
}
.selected-design.directory-page .directory-hero :is(.news-stats,.selected-hero-stats,.finance-totals){
 max-width:100%;margin-top:24px;font-size:16px;line-height:1.7;gap:8px 12px;background:transparent;
}
.selected-design.directory-page .finance-totals :is(strong,span){font-size:16px}
.selected-design.directory-page .directory-hero :is(.yt-eyebrow,.finance-eyebrow){font-size:15px;letter-spacing:1px}
.selected-design.directory-page .site-nav a{white-space:nowrap}
.selected-design.directory-page :is(input,select,button,a):focus-visible{outline:3px solid var(--focus);outline-offset:3px}
@media(min-width:781px) and (max-width:1000px){
 .selected-design.directory-page header.site-header{display:grid;grid-template-columns:1fr auto;gap:0 16px;padding-bottom:0}
 .selected-design.directory-page .site-header .site-nav{grid-row:2;grid-column:1/-1;justify-content:center;width:100%}
 .selected-design.directory-page .site-nav a[aria-current=page]::after{bottom:0}
 .selected-design.directory-page .directory-hero .directory-hero-copy{width:40%}
 .selected-design.directory-page .directory-hero :is(#news-title,#page-title,#finance-title){font-size:40px}
}
@media(max-width:780px){
 .selected-design.directory-page main.page-wrap{padding-inline:18px}
 .selected-design.directory-page header.site-header{min-height:110px;padding-inline:18px}
 .selected-design.directory-page .site-header .brand img{width:36px;height:36px;flex:none}
 .selected-design.directory-page .site-nav a{font-size:13px}
 .selected-design.directory-page main.page-wrap > .directory-hero{
  display:flex;flex-direction:row;align-items:flex-start;gap:0;min-height:max(440px,calc(210px + 53vw));height:auto;aspect-ratio:auto;
  margin:0 -18px 18px;padding:22px 18px;background:var(--bg);
 }
 .selected-design.directory-page .directory-hero .directory-hero-copy{width:100%;padding:0;max-width:none}
 .selected-design.directory-page .directory-hero .directory-hero-art{
  position:absolute;inset:auto 0 0;transform:none;width:100%;max-width:none;height:auto;aspect-ratio:1721/914;
  margin:0;
 }
 .selected-design.directory-page .directory-hero :is(#news-title,#page-title,#finance-title){
  font-size:32px;line-height:1.3;max-width:100%;margin:6px 0 12px;
 }
 .selected-design.directory-page #page-title span{display:inline}
 .selected-design.directory-page .directory-hero :is(.news-lead,.yt-lead,.finance-lead){font-size:14px;line-height:1.75;max-width:100%}
 .selected-design.directory-page .directory-hero :is(.news-stats,.selected-hero-stats,.finance-totals){
  max-width:100%;margin-top:16px;font-size:12px;gap:4px 10px;
 }
 .selected-design.directory-page .finance-lead{text-wrap:balance}
 .selected-design.directory-page .finance-lead br{display:none}
 .selected-design.directory-page .news-stats>span:last-child{width:auto}
 .selected-design.directory-page .finance-totals :is(strong,span){font-size:12px}
 .selected-design.directory-page :is(input[type=search],select){font-size:16px}
 .selected-design.directory-page .yt-result-count{display:block;font-size:12px;line-height:1.6;margin:6px 0 12px}
 .selected-design.directory-page .yt-channel-art.is-avatar img{padding:8px}
 .selected-design.directory-page .yt-channel-intro{font-size:14px}
 .selected-design.directory-page .yt-channel-meta{font-size:12px}
 .selected-design.directory-page .finance-result-heading{
  position:static;width:auto;height:auto;overflow:visible;clip-path:none;margin-bottom:12px;gap:12px;
 }
 .selected-design.directory-page .finance-result-heading h2{font-size:18px}
 .selected-design.directory-page .finance-result-heading p{font-size:12px}
 .selected-design.directory-page :is(.finance-card,.finance-card:first-child){grid-template-columns:48px minmax(0,1fr);gap:8px 12px;padding:18px 0}
 .selected-design.directory-page .finance-logo{width:48px;height:48px;grid-row:1/4}
 .selected-design.directory-page .finance-card h3{font-size:16px;align-self:start;overflow-wrap:anywhere}
 .selected-design.directory-page .finance-card .finance-description{grid-column:2;grid-row:2;font-size:14px;line-height:1.7}
 .selected-design.directory-page .finance-card-top{grid-column:2;grid-row:3;font-size:12px}
 .selected-design.directory-page .finance-card-actions{grid-column:2;grid-row:4;align-self:start;display:flex;flex-direction:row;align-items:center;gap:16px;padding-top:2px}
 .selected-design.directory-page .finance-open{font-size:13px;padding-inline:14px;width:auto;flex:none}
 .selected-design.directory-page .finance-source{font-size:12px;min-height:44px;white-space:nowrap;width:auto;flex:none}
 .selected-design.directory-page .finance-brand-link{font-size:12px}
 .selected-design.directory-page .finance-card-actions .finance-source{margin-top:2px}
}
@media(max-width:360px){
 .selected-design.directory-page .site-header .brand{font-size:17px;gap:5px}
 .selected-design.directory-page .site-header .button{padding-inline:8px;font-size:11px}
 .selected-design.directory-page .site-nav a{font-size:12px}
 .selected-design.directory-page .directory-hero :is(#news-title,#page-title,#finance-title){font-size:30px}
}

/* Finance uses the same outer gutter as the other directories. */
.selected-design.directory-page :is(.finance-workspace,.finance-how,.finance-notes){margin-inline:0}

.selected-design.directory-page .brand-mark{display:block;width:44px;height:44px;overflow:hidden;border-radius:9px;flex-shrink:0}
.selected-design.directory-page .brand .brand-mark img{display:block;width:66px;height:66px;max-width:none;margin:-11px;border-radius:0}
@media(max-width:780px){
 .selected-design.directory-page .brand-mark{width:36px;height:36px}
 .selected-design.directory-page .brand .brand-mark img{width:54px;height:54px;margin:-9px}
}