@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;500;600;700;800&family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;700&display=swap");
/* Fall 2026 hub nav (rendered by sitenav.js), loaded by every page, old and new.
   Two looks on html[data-look]: cat (Catalyst: Noto Sans, grey type, pill buttons, blue and indigo)
   and dtd (Dot Think: Space Grotesk caps, Inter, black and white, cyan / magenta / yellow dots).
   Never put a star-slash inside these comments. */
.hn{--hn-font:"Noto Sans",system-ui,sans-serif;--hn-ink:#5F6062;--hn-accent:#00A7E1;--hn-r:999px;
  position:relative;z-index:1000;color:#000;font-family:var(--hn-font);line-height:1.4;text-align:left;}
[data-look=dtd] .hn{--hn-font:Inter,system-ui,sans-serif;--hn-ink:#0A0A0A;--hn-accent:#00C2F3;--hn-r:0;}
.hn *{box-sizing:border-box;}
.hn p{margin:0;max-width:none;}
.hn-wrap{max-width:1240px;margin:0 auto;padding:0 32px;display:flex;align-items:center;gap:20px;}

/* Bar */
.hn-bar{background:#fff;border-bottom:1px solid #E3E4E5;}
.hn-bar .hn-wrap{height:58px;}
.hn-brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--hn-ink);}
.hn-brand img{display:block;height:28px;width:auto;}
.hn-brand span{padding-left:14px;border-left:1px solid #CCC;font-size:15px;font-weight:600;white-space:nowrap;}
.hn-dtd{display:none !important;}
/* Catalyst is the client: its logo leads in both looks. The DTD logo sits in the footer. */
[data-look=dtd] .hn-brand span{font-family:"Space Grotesk",sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:13px;}
.hn-tabs{display:none;margin-left:auto;align-items:center;gap:6px;}
.hn-tab{padding:8px 14px;font-size:16px;font-weight:600;text-decoration:none;color:var(--hn-ink);border-radius:var(--hn-r);}
.hn-tab:hover{color:#000;background:#F2F3F4;}
.hn-tab.on{background:var(--hn-ink);color:#fff;}
[data-look=dtd] .hn-tab{font-family:"Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.06em;font-size:14px;}
.hn-out{display:inline-block;margin-left:6px;padding:8px 16px;font-size:15px;font-weight:600;text-decoration:none;color:#fff;background:var(--hn-accent);border-radius:var(--hn-r);}
.hn-out + .hn-out{background:#270089;}
.hn-out:hover{filter:brightness(.92);}
[data-look=dtd] .hn-out{background:#fff;color:#000;box-shadow:inset 0 0 0 2px #000;font-family:"Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.06em;font-size:13px;}
[data-look=dtd] .hn-out:hover{background:#FFE14D;filter:none;}
.hn-toggle{display:flex;align-items:center;gap:10px;margin-left:auto;padding:8px 4px 8px 10px;font:inherit;font-size:15px;font-weight:600;color:var(--hn-ink);background:none;border:0;cursor:pointer;}
.hn-tabs + .hn-toggle{margin-left:4px;}
.hn-burger{position:relative;width:20px;height:14px;}
.hn-burger i{position:absolute;left:0;width:100%;height:2px;background:currentColor;}
.hn-burger i:nth-child(1){top:0;}.hn-burger i:nth-child(2){top:6px;}.hn-burger i:nth-child(3){top:12px;}

/* Dot Think credit: Catalyst CT × Dot Think lockup in the bar, agency-style footer on every page */
.hn-by{display:flex;align-items:center;gap:12px;text-decoration:none;color:#9A9C9E;white-space:nowrap;}
.hn-by span{font-size:18px;font-weight:300;line-height:1;}
.hn-by img{display:block;height:15px;width:auto;}
.hn-foot{margin-top:64px;border-top:1px solid #D9DCE0;background:#fff;color:#5F6062;font-family:Inter,system-ui,sans-serif;font-size:13px;line-height:1.5;text-align:left;}
.hn-foot .hn-wrap{min-height:72px;padding-top:18px;padding-bottom:18px;gap:16px 24px;flex-wrap:wrap;}
.hn-foot-logo img{display:block;height:18px;width:auto;}
.hn-foot p{margin:0;}
.hn-foot-prep{color:#0A0A0A;}
.hn-foot-prep a{color:#0A0A0A;text-decoration:underline;text-decoration-color:#00C2F3;text-decoration-thickness:2px;text-underline-offset:3px;}
.hn-foot-prep a:hover{background:#FFE14D;}
.hn-foot-legal{margin-left:auto !important;}

/* Context bar */
.hn-ctx{background:#F4F5F6;border-bottom:1px solid #E3E4E5;font-size:14px;}
.hn-ctx .hn-wrap{min-height:44px;padding-top:7px;padding-bottom:7px;flex-wrap:wrap;gap:6px 10px;}
.hn-ctx a{font-weight:600;text-decoration:none;color:#0075A0;}
.hn-ctx a:hover{text-decoration:underline;}
.hn-sep{color:#999;}
.hn-arch{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;background:#000;color:#fff;padding:3px 8px;border-radius:var(--hn-r);}
.hn-ctx a.hn-now{margin-left:auto;padding:5px 14px;background:#000;color:#fff;border-radius:var(--hn-r);}
.hn-ctx a.hn-now:hover{text-decoration:none;background:#270089;}

/* Draft preview bar (?draft) */
.hn-draft{background:#E6007E;color:#fff;font-size:14px;}
.hn-draft .hn-wrap{min-height:40px;gap:14px;}
.hn-draft a{margin-left:auto;color:#fff;font-weight:700;}

/* The three labels (also used on the overview) */
.lb{display:inline-block;padding:3px 10px;font:700 11px/1.4 var(--hn-font,"Noto Sans",sans-serif);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;border-radius:var(--hn-r,999px);}
.lb-approved{background:#00A7E1;color:#00222E;}
.lb-review{background:#F8971D;color:#2B1600;}
.lb-upcoming{background:transparent;color:#5F6062;box-shadow:inset 0 0 0 1.5px #B5B7B9;}
[data-look=dtd] .lb{font-family:"Space Grotesk",sans-serif;}
[data-look=dtd] .lb-approved{background:#00C2F3;color:#000;}
[data-look=dtd] .lb-review{background:#FFE14D;color:#000;}
[data-look=dtd] .lb-upcoming{color:#000;box-shadow:inset 0 0 0 1.5px #000;}

/* Drawer */
.hn-scrim{position:fixed;inset:0;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s .25s;}
.hn-drawer{position:fixed;top:0;bottom:0;right:0;width:min(340px,88vw);overflow-y:auto;overscroll-behavior:contain;background:#fff;box-shadow:-12px 0 40px -12px rgba(0,0,0,.35);transform:translateX(100%);visibility:hidden;transition:transform .25s ease,visibility 0s .25s;}
.hn.open .hn-scrim{opacity:1;visibility:visible;transition:opacity .25s;}
.hn.open .hn-drawer{transform:none;visibility:visible;transition:transform .25s ease;}
html.hn-lock{overflow:hidden;}
.hn-dhead{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;height:72px;padding:0 8px 0 20px;background:#fff;border-bottom:1px solid #E3E4E5;}
.hn-dhead .hn-brand img{height:28px;}
.hn-close{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;color:#000;background:none;border:0;cursor:pointer;}
.hn-close svg{width:18px;height:18px;}
.hn-sec{padding:10px 0;border-bottom:1px solid #E3E4E5;}
.hn-sec .hn-out{display:block;margin:6px 20px;text-align:center;}
.hn-head{padding:4px 20px 6px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#7F8081;}
.hn-grp summary{display:flex;align-items:center;gap:8px;padding:8px 44px 8px 20px;position:relative;cursor:pointer;list-style:none;font-size:15px;font-weight:700;color:#000;}
.hn-grp summary i{width:10px;height:10px;border-radius:50%;flex:none;}
.hn-grp summary small{font-weight:500;color:#7F8081;font-size:13px;}
.hn-grp summary::-webkit-details-marker{display:none;}
.hn-grp summary::after{content:"";position:absolute;right:22px;top:50%;width:7px;height:7px;margin-top:-6px;border-right:2px solid #000;border-bottom:2px solid #000;transform:rotate(45deg);}
.hn-grp[open] summary::after{margin-top:-2px;transform:rotate(-135deg);}
.hn-grp summary:hover,.hn-drawer a.hn-item:hover{background:#F4F5F6;}
.hn-list{padding:0 0 8px;}
.hn-drawer .hn-item{display:block;padding:5px 20px 5px 35px;border-left:3px solid transparent;font-size:14px;line-height:1.35;text-decoration:none;color:#000;}
.hn-drawer .hn-item.is-off{color:#999;}
.hn-drawer .hn-item.active{border-left-color:var(--hn-accent);background:#F4F5F6;font-weight:700;}
.hn-drawer .hn-item.hn-big{padding-left:17px;font-size:16px;font-weight:800;}
.hn-drawer .hn-item.hn-plain{padding-left:20px;margin-top:6px;}
.hn a:focus-visible,.hn button:focus-visible,.hn summary:focus-visible{outline:2px solid #00A7E1;outline-offset:2px;}

@media (min-width:980px){ .hn-tabs{display:flex;} }
@media (max-width:520px){ .hn-wrap{padding:0 18px;} .hn-brand span{display:none;} .hn-by{gap:8px;} .hn-by img{height:12px;} .hn-foot .hn-wrap{flex-direction:column;align-items:flex-start;gap:8px;} .hn-foot-legal{margin-left:0 !important;} .hn-ctx a.hn-now{margin-left:0;} }
@media (prefers-reduced-motion: reduce){ .hn-scrim,.hn-drawer,.hn.open .hn-scrim,.hn.open .hn-drawer{transition:none;} }