/* Public identity presentation. All rules stay within this page. */
.brand-page{background:var(--ivory);color:var(--navy);overflow-x:clip;font-family:Jost,sans-serif}
.brand-page .brand-inner{width:90%;max-width:1400px;margin:0 auto}
.brand-page p{max-width:70ch;font-size:19px;line-height:1.65;margin:0 0 24px}
.brand-page h1,.brand-page h2,.brand-page h3{font-family:Jost,sans-serif;font-weight:500;letter-spacing:-.025em;line-height:1.13}
.brand-page h1{font-size:clamp(42px,6vw,90px);margin:50px 0 35px;max-width:20ch}
.brand-page h2{font-size:clamp(32px,4vw,58px);margin:0 0 25px;max-width:26ch}
.brand-page h3{font-size:27px;margin:30px 0 16px}
.brand-page figure{margin:0;min-width:0}.brand-page img{display:block;max-width:100%;height:auto}
.brand-page figcaption{font-size:16px;font-weight:500;margin:20px 0 12px}
.brand-page .brand-cover{position:relative;isolation:isolate;background:var(--navy);color:var(--ivory);padding:75px 0 95px;overflow:hidden}
.brand-page .brand-cover:after{content:none}
.brand-page .brand-cover-logo{width:450px;max-width:60%;max-height:240px;object-fit:contain;object-position:left center}
.brand-page .brand-cover h1 span{color:var(--yellow)}
.brand-page .brand-cover p{font-size:clamp(23px,3vw,34px);margin-bottom:0}
.brand-page .brand-opening{padding:100px 0 75px;max-width:1000px}
.brand-page .brand-opening p{font-size:clamp(21px,2.2vw,30px);line-height:1.6;max-width:61ch}
.brand-page .brand-section{padding:75px 0;border-top:1px solid #18184b28}
.brand-page .brand-lead{font-size:22px;max-width:65ch;margin-bottom:45px}
.brand-page .brand-principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:50px}
.brand-page .brand-principles h3{color:var(--red);margin-top:0}
.brand-page .brand-palette{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px;margin:0 0 38px}
.brand-page .brand-palette dt{font-size:19px;font-weight:500}
.brand-page .brand-palette dt span{display:block;aspect-ratio:1.2;border:1px solid #18184b25;margin-bottom:20px}
.brand-page .brand-palette dd{margin:10px 0 0;font-size:15px;line-height:1.65}
.brand-page .brand-signatures{--brand-panel:clamp(120px,15vw,210px);display:grid;grid-template-columns:1fr 1.25fr;gap:55px;align-items:start}
.brand-page .brand-signatures figure{background:#fff;padding:25px;overflow:hidden}
.brand-page .brand-signature-art{padding-top:18px}
.brand-page .brand-signature-art img{max-width:none;object-fit:contain}
.brand-page .brand-signature-vertical img{width:calc(var(--brand-panel)*1.08955224);transform:translateY(calc(var(--brand-panel)*-.04477612))}
.brand-page .brand-signature-horizontal img{width:calc(var(--brand-panel)*2.35501913);transform:translateY(calc(var(--brand-panel)*-.08007065))}
.brand-page .brand-signatures p{font-size:17px;margin:15px 0 0}
.brand-page .brand-backgrounds{display:grid;grid-template-columns:1.3fr 1fr;gap:55px;align-items:start;margin-bottom:35px}
.brand-page .brand-dark-example{background:#070707;padding:40px;min-height:320px;display:flex;align-items:center;justify-content:center}
.brand-page .brand-dark-example img{width:100%;max-height:250px;object-fit:contain}
.brand-page .brand-light-example{padding:25px;min-height:320px;display:flex;align-items:center;justify-content:center}
.brand-page .brand-light-example img{width:270px;max-height:270px;object-fit:contain}
.brand-page .brand-type-display{display:flex;align-items:center;gap:60px;margin-bottom:40px}
.brand-page .brand-type-display>span{font-size:180px;font-weight:700;line-height:1}
.brand-page .brand-type-display>div p:first-child{font-size:clamp(28px,4vw,56px);font-weight:700;line-height:1.1;margin-bottom:22px}
.brand-page .brand-type-display>div p:last-child{font-size:22px;margin:0}
.brand-page .brand-glyphs{font-size:30px;line-height:1.8;overflow-wrap:anywhere;max-width:100%}
.brand-page .brand-numerals{font-size:29px}
.brand-page .brand-sweep-example{position:relative;min-height:340px;background:var(--navy);overflow:hidden;margin:35px 0}
.brand-page .brand-sweep-example img{position:absolute;object-fit:contain;width:105%;height:auto;left:-2%;top:30px}
.brand-page .brand-sweep-example img:nth-child(2){width:60%;left:45%;top:42%}
.brand-page .brand-sweep-example img:nth-child(3){width:88%;left:-5%;top:60%}
.brand-page .brand-reveal-example{background:#fff;min-height:250px;display:grid;place-items:center;position:relative;isolation:isolate;overflow:hidden;margin:40px 0 30px;padding:30px}
.brand-page .brand-reveal-example:before{content:'';position:absolute;inset:10%;background:url('brand/brush-red-white.png') center/100% auto no-repeat;z-index:-1}
.brand-page .brand-reveal-example span{color:#fff;font-weight:700;font-size:clamp(26px,5.3vw,78px);text-transform:uppercase;line-height:1;white-space:nowrap;letter-spacing:-.025em}
.brand-page .brand-rhythm-examples{display:grid;grid-template-columns:1fr 1fr;gap:35px;margin:45px 0 30px}
.brand-page .brand-rhythm-examples>div{min-height:330px;padding:40px;display:flex;flex-direction:column;justify-content:center}
.brand-page .brand-rhythm-examples p{font-size:clamp(30px,4vw,57px);line-height:1.2;font-weight:700;text-transform:uppercase;margin:0}
.brand-page .brand-movement{background:var(--navy);color:white}
.brand-page .brand-movement p span{display:block;position:relative;isolation:isolate;margin-top:20px}
.brand-page .brand-movement p span:before{content:'';position:absolute;inset:-25px -25px;background:url('brand/brush-red.png') center/contain no-repeat;z-index:-1}
.brand-page .brand-every{background:#fff}
.brand-page .brand-every>span{display:block;font-size:19px;margin-top:24px;padding:0 0 34px;position:relative;width:max-content;max-width:100%}
.brand-page .brand-every>span:before{content:'';position:absolute;left:-5%;top:auto;bottom:0;width:110%;height:auto;aspect-ratio:1228/216;background:url('brand/brush-yellow.png') center/contain no-repeat;pointer-events:none}
.brand-page .brand-posters{display:grid;grid-template-columns:1fr 1fr;gap:50px;margin-bottom:35px}
.brand-page .brand-posters img{width:100%;max-height:850px;object-fit:contain}
.brand-page .brand-social-panels{display:grid;grid-template-columns:1fr 1fr;gap:60px;max-width:1040px;margin:0 auto 40px}
.brand-page .brand-social-panels figure{width:100%;max-width:470px;justify-self:center}
.brand-page .brand-social-panels figcaption{margin-top:0;margin-bottom:18px}
.brand-page .brand-social-panels img{width:100%;height:auto}
.brand-page .brand-merchandise{display:grid;gap:35px}
.brand-page .brand-merchandise img{width:100%;height:auto}
.brand-page .brand-downloads ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 50px;margin:35px 0 0;padding:0}
.brand-page .brand-downloads li{border-bottom:1px solid #18184b25}
.brand-page .brand-downloads a{display:block;text-decoration:underline;text-underline-offset:5px;font-size:18px;padding:17px 0}
.brand-page a:focus-visible{outline:3px solid var(--red);outline-offset:5px}
.brand-page .brand-closing{background:var(--navy);color:var(--ivory);padding:75px 0 60px}
.brand-page .brand-closing h2{max-width:20ch}
.brand-page .brand-closing-name{font-size:26px;margin-top:55px;margin-bottom:0;font-weight:500}
@media(max-width:1000px){.brand-page .brand-principles{gap:25px}.brand-page .brand-palette{grid-template-columns:repeat(3,minmax(0,1fr))}.brand-page .brand-signatures{gap:25px;--brand-panel:clamp(100px,14vw,150px)}.brand-page .brand-signatures figure{padding:18px}.brand-page .brand-backgrounds{gap:30px}.brand-page .brand-rhythm-examples>div{padding:30px}.brand-page .brand-rhythm-examples p{font-size:36px}.brand-page .brand-type-display{gap:35px}}
@media(max-width:760px){.brand-page .brand-inner{width:88%}.brand-page .brand-cover{padding:45px 0 75px}.brand-page .brand-cover-logo{max-width:90%;width:330px}.brand-page h1{margin-top:35px}.brand-page .brand-opening{padding:60px 0 45px}.brand-page .brand-section{padding:50px 0}.brand-page .brand-lead{font-size:20px;margin-bottom:32px}.brand-page p{font-size:17px}.brand-page .brand-principles,.brand-page .brand-signatures,.brand-page .brand-backgrounds,.brand-page .brand-rhythm-examples,.brand-page .brand-posters,.brand-page .brand-social-panels,.brand-page .brand-downloads ul{grid-template-columns:1fr}.brand-page .brand-principles{gap:12px}.brand-page .brand-principles h3{margin-bottom:12px}.brand-page .brand-palette{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 18px}.brand-page .brand-palette dt{font-size:17px}.brand-page .brand-signatures{--brand-panel:min(180px,30vw);gap:30px}.brand-page .brand-backgrounds{gap:25px}.brand-page .brand-dark-example{min-height:230px;padding:30px}.brand-page .brand-type-display{gap:25px;flex-wrap:wrap}.brand-page .brand-type-display>span{font-size:120px}.brand-page .brand-type-display>div p:first-child{font-size:38px}.brand-page .brand-glyphs{font-size:25px}.brand-page .brand-numerals{font-size:24px}.brand-page .brand-sweep-example{min-height:220px}.brand-page .brand-reveal-example{min-height:160px;padding:15px}.brand-page .brand-reveal-example span{font-size:clamp(20px,5.6vw,40px)}.brand-page .brand-rhythm-examples>div{min-height:280px}.brand-page .brand-rhythm-examples p{font-size:40px}.brand-page .brand-posters{gap:30px}.brand-page .brand-social-panels{gap:40px;max-width:440px}.brand-page .brand-downloads ul{gap:0}.brand-page .brand-closing{padding:55px 0}.brand-page .brand-closing-name{font-size:24px}}

/* The cover gesture follows the headline, 30% wider than its text field. */
.brand-page .brand-cover h1{position:relative;isolation:auto;z-index:auto}
.brand-page .brand-cover h1:after{content:'';display:block;position:absolute;left:-8%;top:52%;width:130%;max-width:1100px;height:auto;aspect-ratio:2049/417;background:url('brand/brush-red-white.png') center/contain no-repeat;transform:translateY(-12%) rotate(-3deg);z-index:-1;pointer-events:none}


.brand-page .brand-cover h1 span{color:#fff}.brand-page .brand-signatures figure{background:transparent}.brand-page .brand-signatures img{mix-blend-mode:darken}