/* Directory-site look "modern" (U4, D-080, D-085): the app's design language laid over style.css. Loaded after it, only when a
   site's look is "modern" (site.json `look`, else network.json `theme.directories`); "classic" sites do not load it and do not
   change. Same tokens as the app's design system (app/app/globals.css) and the storefront; one accent, from network `theme.accent`. */
:root{
  --bg:#F5F6F8;--panel:#FFFFFF;--panel2:#F2F4F7;--line:#E4E7EC;--line2:#CBD2DC;
  --text:#101828;--body:#344054;--muted:#667085;--dim:#98A2B3;
  --accent:#3B5BDB;--accent-hi:color-mix(in srgb,var(--accent) 82%,black);--on-accent:#FFFFFF;
  --good:#157F4A;--input-bg:#FFFFFF;--head-bg:rgba(255,255,255,.94);
  --glow:transparent;--glow-strong:rgba(16,24,40,.28);
  --accent-soft:color-mix(in srgb,var(--accent) 10%,white);--accent-border:color-mix(in srgb,var(--accent) 45%,white);--accent-border2:color-mix(in srgb,var(--accent) 50%,white);
  --good-soft:#BFE3CE;--callout-bg:color-mix(in srgb,var(--accent) 7%,white);
  --radius:12px;--radius-sm:8px;--shadow-1:0 1px 2px rgba(16,24,40,.05);--shadow-2:0 12px 32px rgba(16,24,40,.12);
}
body{font-size:15px}
/* header: plain brand, sentence-case navigation, no monospace labels */
.brand-mark{width:30px;height:30px;border-radius:8px;background:#101828;color:#fff;font:600 12px var(--sans)}
.brand-name{font:600 15px var(--sans);letter-spacing:0}
.brand-sub{font:400 12px var(--sans);text-transform:none;letter-spacing:0;color:var(--muted)}
.nav{gap:4px}
.nav a{font:500 14px var(--sans);text-transform:none;letter-spacing:0;color:var(--muted);padding:6px 12px;border-radius:var(--radius-sm)}
.nav a:hover{color:var(--text);background:var(--panel2);text-decoration:none}
.nav a.cta{background:#101828;border:1px solid #101828;color:#fff;border-radius:var(--radius-sm);padding:6px 14px}
.nav a.cta:hover{background:#1F2A44;color:#fff}
/* type */
.eyebrow,.kicker{font:500 13px var(--sans);letter-spacing:0;text-transform:none;color:var(--accent)}
h1{font-weight:600;letter-spacing:-.025em;max-width:22ch}
h2{font-weight:600;letter-spacing:-.015em}
.lede{color:var(--muted)}
.sec-note{color:var(--muted)}
.hero{background:var(--panel);border-bottom:1px solid var(--line)}
.stat b{font:600 22px var(--sans);color:var(--text)}
.stat span{font:400 13px var(--sans);text-transform:none;letter-spacing:0;color:var(--muted)}
/* buttons */
.btn{border-radius:var(--radius-sm);background:#101828;border-color:#101828;color:#fff;font-weight:500;padding:10px 16px}
.btn:hover{background:#1F2A44;color:#fff;text-decoration:none}
.btn-ghost{background:var(--panel);border-color:var(--line2);color:var(--text)}
.btn-ghost:hover{background:var(--panel2);border-color:var(--line2);color:var(--text)}
/* cards and panels */
.card,.panel{border-radius:var(--radius);box-shadow:var(--shadow-1)}
.card{padding:18px}
.card:hover{border-color:var(--line2);box-shadow:var(--shadow-2)}
.card.featured{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),var(--shadow-2)}
.card-photo{margin:-18px -18px 0;border-radius:var(--radius) var(--radius) 0 0}
.card-mono{font:600 32px var(--sans);letter-spacing:.04em}
.badge-featured{font:600 12px var(--sans);letter-spacing:0;text-transform:none;border-radius:999px;padding:2px 10px;top:-11px}
.rank{font:500 18px var(--sans)}
.chip{font:500 12px var(--sans);letter-spacing:0;text-transform:none;border-radius:999px;padding:2px 10px;background:var(--panel2);border-color:var(--line)}
.chip.yes{background:#E7F6EE;border-color:var(--good-soft)}
.chip.amber{background:var(--accent-soft)}
.link,.link-plain{font:500 13px var(--sans);letter-spacing:0}
.crumbs{font:13px var(--sans)}
.hero-img{border-radius:var(--radius);box-shadow:var(--shadow-2)}
.spec{font:13px var(--sans)}
.spec th{font:500 13px var(--sans);text-transform:none;letter-spacing:0;color:var(--muted)}
.callout{border-left-color:var(--accent);border-radius:0 var(--radius-sm) var(--radius-sm) 0}
.notice{font:13px var(--sans);border-style:solid;background:var(--panel2)}
/* forms */
.lead-form label{font:500 13px var(--sans);text-transform:none;letter-spacing:0;color:var(--text)}
.lead-form input,.lead-form select,.lead-form textarea{border-radius:var(--radius-sm)}
.lead-form label.opt{border-radius:var(--radius-sm);font-size:14px}
.progress-label{font:500 13px var(--sans);text-transform:none;letter-spacing:0}
.hero-credit,.photo-credit{font:12px var(--sans)}
/* footer */
.site-foot{background:var(--panel);margin-top:48px}
.site-foot p{font:13px/1.65 var(--sans);color:var(--muted)}
.site-foot a{font:500 13px var(--sans);text-transform:none;letter-spacing:0}
.net-label{color:var(--body)}