/* FoxTalk public brand guidelines page. Scoped to page-brand.hbs. */
.ft-brand-page{--fb-green:#123B32;--fb-ink:#0B1613;--fb-bone:#FAF7F0;--fb-ivy:#2B5B4C;--fb-gold:#A9854F;--fb-parchment:#F1E7D8;--fb-line:#d9d7cb;background:var(--fb-bone);color:var(--fb-ink);font-family:Arial,Inter,sans-serif;line-height:1.55}
.ft-brand-page *{box-sizing:border-box}
.ft-brand-page .ft-brand-container{max-width:1240px}
.ft-brand-page a{color:inherit;text-decoration:none}
.ft-brand-page :where(h1,h2,h3,p){margin-top:0}
.ft-brand-identity-strip{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:18px 0;border-bottom:1px solid var(--fb-line)}
.ft-brand-identity-strip p{font:italic 17px/1.4 Georgia,serif;margin:0}
.ft-brand-identity-strip span{font:700 10px/1.5 Inter,Arial,sans-serif;letter-spacing:.11em;text-transform:uppercase;color:#5f655f;text-align:right}
.ft-brand-hero{padding:72px 0 66px;border-bottom:1px solid #aab2ab}
.ft-brand-eyebrow,.ft-brand-section-top span,.ft-brand-specimen-label{font-family:Inter,Arial,sans-serif;font-weight:700;letter-spacing:.15em;text-transform:uppercase}
.ft-brand-eyebrow{display:flex;align-items:center;gap:18px;font-size:11px;color:var(--fb-ivy)}
.ft-brand-eyebrow:after{content:"";display:block;width:42px;border-top:1px solid var(--fb-gold)}
.ft-brand-hero h1{font:500 clamp(48px,5vw,77px)/1.08 Georgia,serif;letter-spacing:-.048em;color:var(--fb-green);margin:18px 0 14px}
.ft-brand-hero>p:nth-of-type(1){font:italic 18px/1.4 Georgia,serif;color:#56615b;margin:0 0 22px}
.ft-brand-intro{max-width:770px;font:19px/1.65 Georgia,serif;color:#343e39;margin-bottom:26px}
.ft-brand-hero-actions{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.ft-brand-button{display:inline-flex;justify-content:center;align-items:center;gap:15px;padding:14px 18px;font:700 12px/1.2 Inter,Arial,sans-serif;letter-spacing:.01em;border:1px solid var(--fb-green);transition:background-color .16s ease,color .16s ease}
.ft-brand-button-primary{background:var(--fb-green);color:#fffefa!important}
.ft-brand-button-primary:hover{background:#082d27}
.ft-brand-text-link{font:700 12px/1.3 Inter,Arial,sans-serif;border-bottom:1px solid var(--fb-gold);padding-bottom:5px}
.ft-brand-text-link span{font-size:16px}
.ft-brand-section{padding:44px 0 56px;border-bottom:1px solid #d6d4ca;scroll-margin-top:28px}
.ft-brand-last-section{border-bottom:none;padding-bottom:80px}
.ft-brand-section-top{display:flex;align-items:baseline;gap:25px;margin-bottom:21px}
.ft-brand-section-top:after{content:"";height:1px;background:#b6b9b1;flex:1;order:1;align-self:center}
.ft-brand-section-top h2{font:500 clamp(27px,3vw,35px)/1.16 Georgia,serif;letter-spacing:-.03em;margin:0;white-space:nowrap}
.ft-brand-section-top span{color:#6f736d;font-size:10px;order:2;white-space:nowrap}
.ft-brand-section-intro{max-width:860px;font:17px/1.58 Georgia,serif;color:#424943;margin:0 0 24px}
.ft-brand-logo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.ft-brand-logo-card{background:#fffefa;border:1px solid #dddcd4;display:flex;flex-direction:column;min-width:0}
.ft-brand-logo-heading{display:flex;align-items:center;gap:11px;padding:17px 19px 5px;font-family:Inter,Arial,sans-serif}
.ft-brand-logo-heading span{font-size:11px;color:var(--fb-gold);font-weight:700}
.ft-brand-logo-heading h3{font:700 11px/1.4 Inter,Arial,sans-serif;letter-spacing:.105em;text-transform:uppercase;margin:0}
.ft-brand-logo-stage{height:205px;display:flex;align-items:center;justify-content:center;padding:28px 26px}
.ft-brand-logo-stage img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block}
.ft-brand-logo-stage-round img{max-height:167px;max-width:167px;border-radius:50%}
.ft-brand-logo-bottom{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 19px;padding:14px 0 19px;border-top:1px solid #e1e0d7}
.ft-brand-logo-bottom p{font:12px/1.2 Inter,Arial,sans-serif;margin:0;color:#646c66}
.ft-brand-logo-bottom a{font:700 12px/1.2 Inter,Arial,sans-serif;color:var(--fb-green);border-bottom:1px solid #8fa296;padding-bottom:4px;white-space:nowrap}
.ft-brand-logo-bottom a:hover,.ft-brand-text-link:hover{color:var(--fb-ivy);border-color:var(--fb-green)}
.ft-brand-logo-bottom a span{font-size:15px}
.ft-brand-note{font:14px/1.6 Inter,Arial,sans-serif;color:#59625a;margin:18px 0 0;max-width:930px}
.ft-brand-colors-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ft-brand-color-card{display:grid;grid-template-columns:78px 1fr;min-height:116px;border:1px solid #dfddd3;background:#fffefa}
.ft-brand-color-chip{height:100%;border-right:1px solid #e1ded4}
.ft-brand-color-details{padding:15px 13px 13px}
.ft-brand-color-details h3{font:600 16px/1.25 Georgia,serif;margin:0 0 4px}
.ft-brand-color-details code{font:13px/1.25 ui-monospace,Consolas,monospace;color:var(--fb-ivy);background:transparent}
.ft-brand-color-details p{font:12px/1.45 Inter,Arial,sans-serif;margin:9px 0 0;color:#59635e}
.ft-brand-type-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;background:#fffefa;border:1px solid #deddd4}
.ft-brand-type-example{padding:33px 36px;min-width:0}
.ft-brand-type-example+ .ft-brand-type-example{border-left:1px solid #deddd4}
.ft-brand-specimen-label{font-size:10px;color:var(--fb-ivy);display:block;margin:0 0 22px}
.ft-brand-serif-sample{font:500 clamp(29px,3.2vw,43px)/1.16 Georgia,serif;letter-spacing:-.025em;min-height:106px}
.ft-brand-sans-sample{font:500 clamp(22px,2.4vw,30px)/1.3 Arial,sans-serif;letter-spacing:-.025em;min-height:106px}
.ft-brand-type-meta{font:13px/1.55 Inter,Arial,sans-serif;color:#71756e;border-top:1px solid #e2e0d7;padding-top:16px}
.ft-brand-rules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border-top:1px solid var(--fb-line)}
.ft-brand-rule{display:grid;grid-template-columns:38px 1fr;gap:16px;border-bottom:1px solid var(--fb-line);padding:22px 24px 22px 0;align-items:start}
.ft-brand-rule:nth-child(odd){border-right:1px solid var(--fb-line)}
.ft-brand-rule:nth-child(even){padding-left:24px}
.ft-brand-rule span{font:700 11px/1.7 Inter,Arial,sans-serif;color:var(--fb-gold)}
.ft-brand-rule p{font:15px/1.6 Georgia,serif;margin:0;color:#333d36}
.ft-brand-description-box{background:#fffefa;border-left:4px solid var(--fb-green);padding:25px 29px;margin-bottom:19px}
.ft-brand-description-box span{font:700 10px/1.2 Inter,Arial,sans-serif;letter-spacing:.13em;color:var(--fb-ivy);text-transform:uppercase}
.ft-brand-description-box p{font:500 clamp(23px,3vw,32px)/1.25 Georgia,serif;letter-spacing:-.015em;margin:12px 0 0}
.ft-brand-body-paragraph{font:17px/1.7 Georgia,serif;max-width:900px;margin-bottom:16px;color:#343d35}
.ft-brand-contact-note{font:14px/1.7 Inter,Arial,sans-serif;color:#3e5548;background:#f1eee5;border-left:2px solid var(--fb-gold);padding:18px 23px;margin-top:25px;max-width:900px}
.ft-brand-page a:focus-visible{outline:3px solid var(--fb-gold);outline-offset:3px}
@media(max-width:980px){.ft-brand-section-top span{display:none}.ft-brand-logo-grid{gap:12px}.ft-brand-logo-heading{padding:14px 13px 5px}.ft-brand-logo-bottom{margin:0 13px}.ft-brand-color-card{grid-template-columns:57px 1fr}}
@media(max-width:760px){.ft-brand-identity-strip span{display:none}.ft-brand-hero{padding:45px 0 42px}.ft-brand-intro{font-size:17px}.ft-brand-section{padding:33px 0 40px}.ft-brand-logo-grid{grid-template-columns:1fr}.ft-brand-logo-card{max-width:100%}.ft-brand-logo-stage{height:190px}.ft-brand-logo-stage-round img{max-height:160px;max-width:160px}.ft-brand-colors-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ft-brand-type-grid{grid-template-columns:1fr}.ft-brand-type-example+ .ft-brand-type-example{border-left:none;border-top:1px solid #deddd4}.ft-brand-type-example{padding:25px 23px}.ft-brand-serif-sample,.ft-brand-sans-sample{min-height:0}.ft-brand-rules{grid-template-columns:1fr}.ft-brand-rule:nth-child(odd){border-right:none}.ft-brand-rule:nth-child(even){padding-left:0}.ft-brand-last-section{padding-bottom:56px}}
@media(max-width:430px){.ft-brand-page .ft-brand-container{width:calc(100% - 36px)}.ft-brand-colors-grid{grid-template-columns:1fr}.ft-brand-color-card{min-height:96px}.ft-brand-hero h1{font-size:46px}.ft-brand-section-top h2{white-space:normal}.ft-brand-logo-bottom{flex-wrap:wrap}.ft-brand-hero-actions{gap:18px}}
