/* MOTIV directory — site 2.53.0. Approved design (handoffs/motiv-directory, 2026-10-04);
   only the asset paths and the footer link below are Build's. */
@font-face{font-family:Manrope;src:url('/assets/directory/Manrope-Regular.ttf') format('truetype');font-weight:400;font-display:swap}@font-face{font-family:Manrope;src:url('/assets/directory/Manrope-Medium.ttf') format('truetype');font-weight:500;font-display:swap}@font-face{font-family:Manrope;src:url('/assets/directory/Manrope-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
:root{color-scheme:light;--ink:#141719;--paper:#fff;--gray:#d9dcdf;--muted:#5c6266}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif;font-size:16px;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:6px}.skip{position:fixed;top:-100px;left:20px;background:white;padding:12px;z-index:4}.skip:focus{top:20px}.directory{min-height:100svh;display:grid;grid-template-columns:46% 54%}.brand-panel{background:var(--ink);color:white;display:flex;flex-direction:column;justify-content:space-between;padding:44px 48px 36px;min-height:100svh;overflow:hidden;position:relative}.brand-top{display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:1}.brand-top img{width:141px;height:auto}.brand-label{font-size:.75rem;letter-spacing:.12em;white-space:nowrap}.brand-art{display:flex;align-items:center;justify-content:center;padding:90px 0;flex:1}.brand-art img{width:100%;max-width:440px;height:auto;filter:brightness(0) invert(1);animation:arrive 900ms ease both}.brand-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:.875rem;letter-spacing:.02em}.brand-bottom i{font-style:normal;opacity:.4;padding:0 9px}.edition{font-size:.75rem;letter-spacing:.12em;color:var(--gray)}.content-panel{padding:68px clamp(32px,5vw,84px) 28px;display:flex;flex-direction:column;justify-content:center}.eyebrow{font-size:.75rem;font-weight:600;letter-spacing:.14em;margin:0 0 19px;color:var(--muted)}h1{font-size:clamp(2.3rem,3.5vw,3.5rem);font-weight:500;letter-spacing:-.055em;line-height:1.1;margin:0 0 14px}.intro-copy{color:var(--muted);margin:0;font-size:1rem}.intro{padding-bottom:39px}.destinations{border-top:1px solid var(--gray)}.destination{position:relative;display:grid;grid-template-columns:30px 1fr auto;gap:15px;align-items:center;padding:27px 0 30px;border-bottom:1px solid var(--gray);transition:background .18s,padding .18s}.number{font-size:.75rem;color:var(--muted);align-self:start;margin-top:4px}.audience{font-size:.75rem;letter-spacing:.12em;font-weight:600;color:var(--muted)}h2{font-size:2.4rem;line-height:1.15;font-weight:500;letter-spacing:-.05em;margin:7px 0 8px}.description{font-size:.9375rem;color:var(--muted)}.visit{font-size:.875rem;border:1px solid var(--gray);border-radius:100px;padding:10px 16px;transition:background .18s,color .18s}.destination:hover .visit,.destination:focus-visible .visit{background:var(--ink);color:white;border-color:var(--ink)}.destination:hover{background:#d9dcdf30}.footer{margin-top:35px}.footer-main{display:flex;justify-content:space-between;align-items:center;gap:20px}.socials{display:flex;flex-direction:column;gap:8px}.footer-label{font-size:.75rem;letter-spacing:.13em;color:var(--muted);font-weight:600}.pending{border:0;background:none;padding:0}.social{font-size:.875rem;display:flex;gap:9px;align-items:center}.pending-tag{font-size:.75rem;letter-spacing:.06em;border:1px solid var(--gray);padding:2px 5px;border-radius:3px;color:var(--muted)}.merch{display:flex;align-items:center;gap:9px;font-size:.875rem;padding:10px 0}.merch svg{width:20px;height:20px}.merch:hover span,.social:hover{text-decoration:underline;text-underline-offset:4px}.footer-bottom{border-top:1px solid var(--gray);margin-top:26px;padding-top:20px;display:flex;justify-content:space-between;gap:18px;font-size:.75rem;letter-spacing:.04em;color:var(--muted)}dialog{border:1px solid var(--gray);padding:36px;max-width:430px;width:calc(100% - 40px);color:var(--ink);border-radius:6px}dialog::backdrop{background:#14171999}dialog h2{font-size:1.7rem}dialog p{line-height:1.6;color:var(--muted)}.close{position:absolute;right:12px;top:8px;border:0;background:none;font-size:1.6rem;width:36px;height:36px}.dismiss{border:0;background:var(--ink);color:white;padding:12px 20px;margin-top:10px;border-radius:3px}@keyframes arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1450px){.content-panel{padding-top:80px;padding-bottom:36px}.destination{padding-top:34px;padding-bottom:34px}.intro{padding-bottom:44px}.footer{margin-top:44px}}
@media(max-width:1100px){.brand-panel{padding:32px}.brand-label{display:none}.content-panel{padding:42px 32px 26px}.brand-bottom{flex-wrap:wrap}.brand-art{padding:80px 0}.destination{grid-template-columns:20px 1fr;gap:12px}.visit{display:none}.audience{font-size:.75rem}}
@media(max-width:720px){.directory{display:block}.brand-panel{min-height:0;padding:26px 24px 22px}.brand-top img{width:115px}.brand-label{display:block;font-size:.75rem;letter-spacing:.09em}.brand-art{padding:35px 0 33px}.brand-art img{width:145px}.brand-bottom{display:none}.content-panel{padding:32px 24px 24px}.intro{padding-bottom:28px}.eyebrow{font-size:.75rem;margin-bottom:14px}h1{font-size:2.4rem}.destination{grid-template-columns:22px 1fr auto;gap:12px;padding:23px 0}.visit{display:block;padding:9px 12px;font-size:.875rem}h2{font-size:2rem;margin:5px 0 7px}.audience{font-size:.75rem}.description{font-size:.875rem;line-height:1.5;display:block}.footer{margin-top:29px}.footer-main{gap:12px}.footer-bottom{font-size:.75rem}.footer-label{font-size:.75rem}}
@media(max-width:380px){.visit{display:none}.destination{grid-template-columns:22px 1fr}.brand-label{display:none}.footer-main{align-items:flex-start;flex-direction:column}.footer-bottom{font-size:.75rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

.social-icons{display:flex;align-items:center;gap:7px}.social-icon{position:relative;display:flex;width:36px;height:36px;align-items:center;justify-content:center;border-radius:50%;transition:background .18s}.social-icon svg{width:19px;height:19px}.social-icon:hover{background:var(--gray)}.founder-badge{position:absolute;right:-2px;bottom:0;font-size:12px;font-weight:600;background:white;border-radius:50%;width:16px;height:16px;text-align:center}.footer-label{font-size:.75rem}.footer-main{gap:12px}

.footer-bottom a{color:inherit;text-decoration:underline;text-underline-offset:3px}
/* Build, text enlargement (WCAG 1.4.4/1.4.10): wrap only when a label no longer fits.
   At default text size nothing moves — proved by a pixel diff at 360/390/768/1280/1440. */
.brand-top{min-width:0}.brand-label{white-space:normal;text-align:right;min-width:0}
.destination-copy{min-width:0;overflow-wrap:anywhere}.visit{white-space:nowrap}
.destination{grid-template-columns:30px minmax(0,1fr) auto}
@media(max-width:1100px){.destination{grid-template-columns:20px minmax(0,1fr)}}
@media(max-width:720px){.destination{grid-template-columns:22px minmax(0,1fr) auto}}
@media(max-width:380px){.destination{grid-template-columns:22px minmax(0,1fr)}}

/* 2.82.0 · one screen, no scroll (rcw-deptpanels; Bode 2026-10-18: "everything on the directory should show on a single
   page no scroll and full page"). Spacing and type follow the screen HEIGHT so the whole directory fits from 360x640 to
   1920x1080. A window too short to hold it (a phone on its side, big text) keeps normal scrolling — nothing is ever cut off. */
.directory{height:100svh;min-height:0}
.brand-panel{min-height:0;height:100%;padding:clamp(22px,4.8vh,44px) 48px clamp(20px,4vh,36px)}
.brand-art{padding:0;min-height:0}
.brand-art img{max-height:min(46vh,440px);width:auto;max-width:min(100%,440px)}
.content-panel{min-height:0;height:100%;padding-top:clamp(18px,5.5vh,80px);padding-bottom:clamp(14px,3.2vh,36px)}
.intro{padding-bottom:clamp(12px,3.6vh,44px)}
.eyebrow{margin-bottom:clamp(8px,1.8vh,19px)}
h1{font-size:min(clamp(2.3rem,3.5vw,3.5rem),6.4vh);margin-bottom:clamp(6px,1.4vh,14px)}
.destination{padding:clamp(10px,2.7vh,34px) 0}
h2{font-size:min(2.4rem,5.2vh);margin:clamp(2px,.6vh,7px) 0 clamp(2px,.7vh,8px)}
.footer{margin-top:clamp(12px,3.4vh,44px)}
.footer-bottom{margin-top:clamp(8px,2.2vh,26px);padding-top:clamp(8px,1.8vh,20px)}
@media(max-width:1100px){.brand-panel{padding:clamp(20px,4vh,32px)}}
@media(max-width:720px){
 .directory{display:flex;flex-direction:column}
 .brand-panel{height:auto;flex:none;padding:clamp(14px,2.6vh,26px) 24px clamp(10px,2vh,22px)}
 .brand-art{padding:clamp(6px,1.6vh,33px) 0 0}
 .brand-art img{width:auto;height:clamp(34px,8vh,99px)}
 .content-panel{flex:1;height:auto;padding:clamp(12px,2.6vh,32px) 24px clamp(10px,2vh,24px);justify-content:space-between}
 .intro{padding-bottom:clamp(8px,2vh,28px)}
 h1{font-size:min(2.4rem,5.4vh)}
 .intro-copy{font-size:min(1rem,2.3vh)}
 .destination{padding:clamp(8px,1.9vh,23px) 0}
 h2{font-size:min(2rem,4.4vh);margin:clamp(1px,.4vh,5px) 0 clamp(1px,.5vh,7px)}
 .description{line-height:1.35;font-size:min(.875rem,2.1vh)}
 .footer{margin-top:clamp(8px,2vh,29px)}
 .social-icon{width:clamp(30px,5vh,36px);height:clamp(30px,5vh,36px)}
 .footer-main{gap:6px}
}
@media(max-width:720px) and (max-height:760px){.brand-art{display:none}.brand-panel{padding-bottom:clamp(12px,2.4vh,22px)}}
@media(max-height:560px),(max-width:720px) and (max-height:600px){.directory{height:auto;min-height:100svh}.brand-panel,.content-panel{height:auto}}
@media(max-width:380px){.footer-bottom>span:last-child{display:none}}
