@font-face{font-family:"DM Sans";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/dm-sans-0.ttf") format("truetype")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/dm-sans-1.ttf") format("truetype")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/dm-sans-2.ttf") format("truetype")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/dm-sans-3.ttf") format("truetype")}
#sf-brand-library{--bg:#f8f7f4;--paper:#ffffff;--ink:#232725;--muted:#626a60;--line:#e3e4dd;--accent:#783d45;--display:"DM Sans",sans-serif;--body:"DM Sans",sans-serif;--space:8px;--gutter:clamp(20px,4.4vw,64px);--content:1360px;--radius:4px;--ease:cubic-bezier(.2,.65,.3,1)}
#sf-brand-library [hidden]{display:none!important}
#sf-brand-library *{ box-sizing: border-box; }
#sf-brand-library{ scroll-behavior: smooth; scroll-padding-top: 110px; }
#sf-brand-library{ margin: 0; background: var(--bg); color: var(--ink); font-family: "DM Sans", sans-serif; font-size: 15px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
#sf-brand-library img{ display: block; max-width: 100%; }
#sf-brand-library button,#sf-brand-library input{ font: inherit; }
#sf-brand-library a{ color: inherit; text-underline-offset: 4px; text-decoration-thickness: 1px; }
#sf-brand-library button,#sf-brand-library a{ -webkit-tap-highlight-color: transparent; }
#sf-brand-library :focus-visible{ outline: 2px solid var(--accent); outline-offset: 5px; }
#sf-brand-library ::selection{ background: var(--accent); color: var(--paper); }
#sf-brand-library .shell{ width: min(1280px, calc(100% - 112px)); margin-inline: auto; }
#sf-brand-library .skip-link{ position: fixed; left: 20px; top: 14px; padding: 12px 20px; z-index: 100; color: var(--paper); background: var(--ink); transform: translateY(-180%); }
#sf-brand-library .skip-link:focus{ transform: translateY(0); }
#sf-brand-library .topbar{ position: sticky; top: 0; z-index: 30; border-bottom: 1px solid var(--line); background: var(--bg); }
#sf-brand-library .topbar__inner{ min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
#sf-brand-library .brandmark{ display: inline-flex; gap: 13px; align-items: center; text-decoration: none; }
#sf-brand-library .seal{ width: 37px; height: 37px; display: grid; place-items: center; background: var(--accent); color: var(--paper); font-size: 14px; font-weight: 600; letter-spacing: -1px; }
#sf-brand-library .brandmark__text{ font-size: 17px; font-weight: 600; letter-spacing: -.5px; line-height: 1.2; }
#sf-brand-library .brandmark__descriptor{ display: block; margin-top: 5px; font-size: 12px; color: var(--muted); font-weight: 400; letter-spacing: .1px; }
#sf-brand-library .header-nav{ display: flex; align-items: center; gap: 34px; font-size: 14px; }
#sf-brand-library .header-nav a{ text-decoration: none; }
#sf-brand-library .header-nav a:hover{ color: var(--accent); }
#sf-brand-library .back span{ display: inline-block; margin-left: 11px; font-size: 16px; }
#sf-brand-library .breadcrumb{ display: flex; align-items: center; gap: 13px; padding-block: 28px; font-size: 12px; color: var(--muted); }
#sf-brand-library .breadcrumb a{ text-decoration: none; }
#sf-brand-library .breadcrumb a:hover{ color: var(--ink); }
#sf-brand-library .breadcrumb [aria-current]{ color: var(--ink); }
#sf-brand-library .hero{ padding-bottom: 68px; }
#sf-brand-library .hero-grid{ display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr); gap: clamp(42px, 5vw, 76px); align-items: center; }
#sf-brand-library .hero-media{ position: relative; overflow: hidden; background: var(--paper); aspect-ratio: 1.065; }
#sf-brand-library .hero-media > img{ width: 100%; height: 100%; object-fit: cover; object-position: center; }
#sf-brand-library .hero-fit-contain > img{ object-fit: contain; padding: 24px; }
#sf-brand-library .hero-fit-cover > img{ object-fit: cover; padding: 0; }
#sf-brand-library .hero-media--logo,#sf-brand-library .hero-media--word{ display: grid; place-items: center; padding: 72px; background: var(--paper); }
#sf-brand-library .hero-media--logo > img{ width: 68%; height: 40%; object-fit: contain; }
#sf-brand-library .hero-media--word .wordmark{ font-size: clamp(30px, 4.2vw, 62px); line-height: 1.1; font-weight: 500; letter-spacing: -2px; text-align: center; overflow-wrap: anywhere; }
#sf-brand-library .image-note{ position: absolute; bottom: 13px; left: 16px; max-width: calc(100% - 32px); color: var(--muted); font-size: 12px; line-height: 1.5; opacity: 0; transition: opacity .2s; background: var(--paper); padding: 4px 8px; pointer-events: none; }
#sf-brand-library .hero-media:hover .image-note,#sf-brand-library .hero-media:focus-within .image-note{ opacity: 1; }
#sf-brand-library .hero-copy{ min-width: 0; padding-block: 16px; }
#sf-brand-library .hero-identity{ display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 27px; }
#sf-brand-library .logo-slot{ min-width: 0; height: 38px; display: flex; align-items: center; }
#sf-brand-library .logo-slot img{ height: 34px; width: auto; max-width: 154px; object-fit: contain; object-position: left center; }
#sf-brand-library .logo-slot .wordmark{ font-size: 16px; font-weight: 500; letter-spacing: -.5px; }
#sf-brand-library .profile-kicker{ white-space: nowrap; font-size: 12px; color: var(--muted); }
#sf-brand-library h1{ margin: 0; font-size: clamp(36px, 4.3vw, 59px); font-weight: 500; line-height: 1.08; letter-spacing: -2.6px; overflow-wrap: anywhere; }
#sf-brand-library .meta-line{ margin: 15px 0 0; font-size: 12px; color: var(--muted); line-height: 1.6; }
#sf-brand-library .style-signature{ margin: 26px 0 0; font-size: 20px; font-weight: 400; line-height: 1.42; letter-spacing: -.45px; }
#sf-brand-library .intro{ margin: 20px 0 0; max-width: 420px; color: var(--muted); font-size: 14px; line-height: 1.8; }
#sf-brand-library .tags{ display: flex; align-items: center; flex-wrap: wrap; margin-top: 20px; row-gap: 6px; }
#sf-brand-library .tag{ display: inline-flex; align-items: center; font-size: 12px; line-height: 1.7; color: var(--muted); }
#sf-brand-library .tag:not(:last-child)::after{ content: "·"; padding: 0 10px; color: var(--accent); }
#sf-brand-library .hero-anchor{ display: flex; justify-content: space-between; align-items: center; max-width: 226px; margin-top: 31px; padding-block: 10px; border-bottom: 1px solid var(--ink); font-size: 12px; font-weight: 500; text-decoration: none; }
#sf-brand-library .hero-anchor span{ color: var(--accent); font-size: 18px; }
#sf-brand-library .hero-anchor:hover{ color: var(--accent); border-color: var(--accent); }
#sf-brand-library .content-grid{ display: grid; grid-template-columns: 180px minmax(0, 900px); gap: clamp(48px, 5.5vw, 90px); align-items: start; padding-top: 60px; border-top: 1px solid var(--line); }
#sf-brand-library .toc{ position: sticky; top: 125px; padding-top: 7px; }
#sf-brand-library .toc-label{ margin: 0 0 22px; color: var(--ink); font-size: 12px; font-weight: 500; }
#sf-brand-library .toc nav{ display: flex; flex-direction: column; gap: 0; }
#sf-brand-library .toc nav a{ display: flex; gap: 13px; align-items: center; position: relative; padding: 9px 0; color: var(--muted); font-size: 12px; text-decoration: none; line-height: 1.5; transition: color .15s; }
#sf-brand-library .toc nav a span{ width: 15px; font-size: 11px; opacity: .65; }
#sf-brand-library .toc nav a:hover,#sf-brand-library .toc nav a[aria-current]{ color: var(--accent); }
#sf-brand-library .toc nav a[aria-current]{ font-weight: 600; }
#sf-brand-library .toc nav a[aria-current]::before{ content: ""; position: absolute; left: -12px; top: 16px; width: 4px; height: 4px; border-radius: 50%; background: var(--accent); }
#sf-brand-library .toc-back{ display: flex; justify-content: space-between; align-items: center; margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; text-decoration: none; }
#sf-brand-library .article{ min-width: 0; }
#sf-brand-library .article > section{ padding-bottom: 68px; scroll-margin-top: 118px; }
#sf-brand-library .article > section + section{ padding-top: 48px; border-top: 1px solid var(--line); }
#sf-brand-library .section-head{ display: flex; align-items: baseline; gap: 19px; margin-bottom: 31px; }
#sf-brand-library .section-head > span{ flex: 0 0 18px; color: var(--accent); font-size: 12px; font-weight: 500; }
#sf-brand-library h2{ margin: 0; font-size: clamp(24px, 2.4vw, 32px); line-height: 1.2; font-weight: 500; letter-spacing: -1px; }
#sf-brand-library .section-intro{ color: var(--muted); font-size: 14px; margin: -14px 0 30px 37px; }
#sf-brand-library .fact-grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 44px; margin: 0; }
#sf-brand-library .fact{ padding: 19px 0 22px; border-bottom: 1px solid var(--line); }
#sf-brand-library .fact dt{ font-size: 12px; color: var(--muted); line-height: 1.4; }
#sf-brand-library .fact dd{ margin: 9px 0 0; font-size: 16px; font-weight: 500; line-height: 1.4; overflow-wrap: anywhere; }
#sf-brand-library .fact dd a{ font-size: 14px; font-weight: 400; text-decoration: none; }
#sf-brand-library .fact dd a:hover{ color: var(--accent); }
#sf-brand-library .style-panel{ display: grid; grid-template-columns: 1.05fr 1fr; gap: 44px; }
#sf-brand-library .style-copy p{ margin: 0; font-size: 25px; line-height: 1.42; letter-spacing: -.6px; }
#sf-brand-library .style-copy .tags{ margin-top: 26px; }
#sf-brand-library .style-notes ul{ list-style: none; padding: 0; margin: 0; }
#sf-brand-library .style-notes li{ position: relative; margin: 0; padding: 0 0 16px 17px; color: var(--muted); font-size: 13px; line-height: 1.75; }
#sf-brand-library .style-notes li::before{ content: ""; position: absolute; left: 0; top: 9px; width: 4px; height: 4px; background: var(--accent); }
#sf-brand-library .product-grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
#sf-brand-library .product-card{ min-width: 0; }
#sf-brand-library .product-media{ position: relative; aspect-ratio: 4 / 3; background: var(--paper); overflow: hidden; }
#sf-brand-library .product-media img{ width: 100%; height: 100%; object-fit: cover; transition: transform .45s cubic-bezier(.2,.65,.25,1); }
#sf-brand-library .product-fit-contain img,#sf-brand-library .product-media.product-fit-contain img{ object-fit: contain; padding: 18px; }
#sf-brand-library .product-card:hover .product-media img{ transform: scale(1.025); }
#sf-brand-library .product-media .wordmark{ font-size: 25px; font-weight: 500; letter-spacing: -1px; }
#sf-brand-library .product-copy{ padding: 23px 0 0; }
#sf-brand-library .product-copy h3{ margin: 0; font-size: 23px; font-weight: 500; letter-spacing: -.65px; line-height: 1.25; }
#sf-brand-library .product-copy p{ margin: 12px 0 0; color: var(--muted); font-size: 13px; line-height: 1.75; }
#sf-brand-library .product-copy > a{ display: inline-block; margin-top: 15px; padding-bottom: 3px; font-size: 12px; font-weight: 500; text-decoration: none; border-bottom: 1px solid var(--line); }
#sf-brand-library .product-copy > a:hover{ color: var(--accent); border-color: var(--accent); }
#sf-brand-library .product-source{ margin-top: 15px; color: var(--muted); font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
#sf-brand-library .product-source a{ color: inherit; }
#sf-brand-library .pending-panel{ display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 36px; padding: 35px; background: var(--paper); align-items: center; }
#sf-brand-library .pending-panel .logo-slot{ height: 90px; justify-content: center; }
#sf-brand-library .pending-panel .logo-slot img{ max-width: 140px; max-height: 65px; height: auto; object-position: center; }
#sf-brand-library .pending-panel h3{ margin: 0; font-size: 21px; font-weight: 500; letter-spacing: -.5px; line-height: 1.35; }
#sf-brand-library .pending-panel p{ margin: 12px 0 0; color: var(--muted); font-size: 13px; line-height: 1.8; }
#sf-brand-library .proof-list,#sf-brand-library .sources{ list-style: none; padding: 0; margin: 0; }
#sf-brand-library .proof-list li{ display: grid; grid-template-columns: 37px minmax(0, 1fr); gap: 0; padding: 20px 0; border-bottom: 1px solid var(--line); }
#sf-brand-library .proof-list li:first-child{ border-top: 1px solid var(--line); }
#sf-brand-library .proof-list b{ padding-top: 4px; color: var(--muted); font-size: 12px; font-weight: 400; }
#sf-brand-library .proof-list p{ margin: 0; font-size: 15px; line-height: 1.65; }
#sf-brand-library .faq-list details{ border-top: 1px solid var(--line); }
#sf-brand-library .faq-list details:last-child{ border-bottom: 1px solid var(--line); }
#sf-brand-library .faq-list summary{ position: relative; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 23px 0; list-style: none; cursor: pointer; font-size: 15px; font-weight: 500; letter-spacing: -.2px; line-height: 1.5; }
#sf-brand-library .faq-list summary::-webkit-details-marker{ display: none; }
#sf-brand-library .faq-list summary::after{ content: "+"; flex: 0 0 20px; color: var(--muted); font-size: 22px; font-weight: 400; line-height: 1; text-align: center; }
#sf-brand-library .faq-list details[open] summary::after{ content: "−"; color: var(--accent); }
#sf-brand-library .faq-list details p{ margin: -2px 38px 25px 0; font-size: 14px; line-height: 1.85; color: var(--muted); }
#sf-brand-library .sources li{ display: grid; grid-template-columns: 37px minmax(0, 1fr); padding: 22px 0; border-bottom: 1px solid var(--line); }
#sf-brand-library .sources li:first-child{ border-top: 1px solid var(--line); }
#sf-brand-library .source-index{ color: var(--muted); font-size: 12px; padding-top: 3px; }
#sf-brand-library .sources strong{ display: block; font-size: 14px; font-weight: 500; line-height: 1.65; }
#sf-brand-library .sources span:not(.source-index){ display: inline-block; margin-top: 7px; font-size: 12px; color: var(--muted); }
#sf-brand-library .sources span:not(.source-index) + span:not(.source-index)::before{ content: "·"; margin: 0 8px; }
#sf-brand-library .sources a{ display: block; width: fit-content; margin-top: 9px; color: var(--accent); font-size: 12px; text-decoration: none; }
#sf-brand-library .sources a:hover{ text-decoration: underline; }
#sf-brand-library .reference-note{ max-width: 630px; margin: 24px 0 0 37px; color: var(--muted); font-size: 12px; line-height: 1.8; }
#sf-brand-library .related{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 28px; }
#sf-brand-library .related-card{ display: grid; grid-template-columns: 84px minmax(0, 1fr) auto; gap: 16px; align-items: center; min-width: 0; padding: 0 0 16px; border-bottom: 1px solid var(--line); text-decoration: none; }
#sf-brand-library .related-thumb{ display: grid; place-items: center; width: 84px; height: 84px; background: var(--paper); overflow: hidden; }
#sf-brand-library .related-thumb img{ width: 100%; height: 100%; object-fit: cover; }
#sf-brand-library .related-thumb img.logo{ object-fit: contain; padding: 13px; }
#sf-brand-library .related-card strong{ display: block; font-size: 15px; font-weight: 500; letter-spacing: -.3px; line-height: 1.4; }
#sf-brand-library .related-card small{ display: block; margin-top: 7px; color: var(--muted); font-size: 12px; line-height: 1.5; }
#sf-brand-library .related-card > b{ font-weight: 400; color: var(--muted); }
#sf-brand-library .related-card:hover strong,#sf-brand-library .related-card:hover > b{ color: var(--accent); }
#sf-brand-library .sourcing-section{ padding-top: 42px !important; padding-bottom: 70px !important; }
#sf-brand-library .cta{ display: grid; grid-template-columns: 1fr 1fr; gap: 44px; padding: 34px 0 0; }
#sf-brand-library .eyebrow{ margin: 0 0 15px; font-size: 12px; font-weight: 400; color: var(--accent); }
#sf-brand-library .cta h2{ max-width: 350px; font-size: 31px; line-height: 1.2; letter-spacing: -1.1px; }
#sf-brand-library .cta p:not(.eyebrow){ margin: 0; color: var(--muted); font-size: 13px; line-height: 1.8; }
#sf-brand-library .button{ display: inline-flex; align-items: center; gap: 26px; margin-top: 22px; padding: 13px 17px; border: 1px solid var(--accent); background: var(--accent); color: var(--paper); font-size: 12px; text-decoration: none; transition: background .15s, color .15s; }
#sf-brand-library .button:hover{ background: var(--bg); color: var(--accent); }
#sf-brand-library footer{ border-top: 1px solid var(--line); padding: 31px 0; }
#sf-brand-library .footer-inner{ display: flex; align-items: center; justify-content: space-between; gap: 24px; font-size: 12px; color: var(--muted); }
#sf-brand-library .footer-inner > a{ text-decoration: none; }
#sf-brand-library .footer-inner > a:first-child{ color: var(--ink); font-size: 14px; font-weight: 500; }
#sf-brand-library .footer-inner > a:first-child span{ margin-left: 9px; color: var(--muted); font-weight: 400; font-size: 12px; }
#sf-brand-library .footer-inner p{ margin: 0; }
#sf-brand-library .footer-inner > a:last-child span{ margin-left: 12px; }
#sf-brand-library .image-expand{ position: absolute; right: 14px; bottom: 14px; display: grid; place-items: center; width: 33px; height: 33px; border: 1px solid var(--line); background: var(--paper); color: var(--ink); cursor: pointer; opacity: 0; transition: opacity .2s; }
#sf-brand-library .image-expand svg{ width: 14px; height: 14px; }
#sf-brand-library .product-media:hover .image-expand,#sf-brand-library .image-expand:focus-visible{ opacity: 1; }
#sf-brand-library .image-viewer{ width: min(1080px, calc(100% - 40px)); max-height: calc(100vh - 40px); padding: 56px 36px 26px; border: 0; background: var(--paper); color: var(--ink); }
#sf-brand-library .image-viewer::backdrop{ background: color-mix(in srgb, var(--ink) 78%, transparent); }
#sf-brand-library .image-viewer img{ width: 100%; max-height: calc(100vh - 180px); object-fit: contain; }
#sf-brand-library .viewer-close{ position: absolute; right: 18px; top: 15px; display: grid; place-items: center; width: 30px; height: 30px; border: 0; background: none; color: var(--ink); font-size: 27px; cursor: pointer; }
#sf-brand-library .viewer-caption{ margin: 20px 0 0; font-size: 13px; color: var(--muted); text-align: center; }
#sf-brand-library .hero-grid:has(.hero-media--logo),#sf-brand-library .hero-grid:has(.hero-media--word){ grid-template-columns: 210px minmax(0, 1fr); gap: 60px; max-width: 1168px; }
#sf-brand-library .hero-grid:has(.hero-media--logo) .hero-media,#sf-brand-library .hero-grid:has(.hero-media--word) .hero-media{ aspect-ratio: 1.15; padding: 30px; }
#sf-brand-library .hero-grid:has(.hero-media--logo) .hero-media > img{ width: 100%; height: 100%; object-fit: contain; }
#sf-brand-library .hero-grid:has(.hero-media--word) .hero-media .wordmark{ font-size: 28px; letter-spacing: -1px; }
#sf-brand-library .hero-grid:has(.hero-media--logo) .hero-copy,#sf-brand-library .hero-grid:has(.hero-media--word) .hero-copy{ max-width: 790px; }
#sf-brand-library .hero-grid:has(.hero-media--logo) .hero-identity,#sf-brand-library .hero-grid:has(.hero-media--word) .hero-identity{ display: none; }
#sf-brand-library .hero-grid:has(.hero-media--logo) h1,#sf-brand-library .hero-grid:has(.hero-media--word) h1{ font-size: 44px; letter-spacing: -1.8px; }
#sf-brand-library .hero-grid:has(.hero-media--logo) .intro,#sf-brand-library .hero-grid:has(.hero-media--word) .intro{ max-width: 710px; }
@media (min-width: 1600px) {#sf-brand-library .hero-grid{ gap: 86px; }
#sf-brand-library .hero-media{ aspect-ratio: 1.15; }
}
@media (max-width: 1080px) {#sf-brand-library .shell{ width: calc(100% - 64px); }
#sf-brand-library .hero-grid{ gap: 40px; grid-template-columns: 1.12fr 1fr; }
#sf-brand-library h1{ font-size: 43px; letter-spacing: -1.8px; }
#sf-brand-library .hero-identity{ margin-bottom: 21px; gap: 14px; }
#sf-brand-library .logo-slot img{ max-width: 120px; height: 29px; }
#sf-brand-library .style-signature{ font-size: 18px; margin-top: 22px; }
#sf-brand-library .hero-anchor{ margin-top: 24px; }
#sf-brand-library .hero-media{ aspect-ratio: .94; }
#sf-brand-library .content-grid{ grid-template-columns: 150px minmax(0, 1fr); gap: 42px; }
#sf-brand-library .style-panel{ gap: 28px; }
#sf-brand-library .style-copy p{ font-size: 22px; }
#sf-brand-library .related{ grid-template-columns: 1fr; }
}
@media (max-width: 820px) {#sf-brand-library .topbar__inner{ min-height: 76px; }
#sf-brand-library .hero-grid{ grid-template-columns: 1fr; gap: 35px; }
#sf-brand-library .hero-media{ aspect-ratio: 1.35; }
#sf-brand-library .hero-copy{ padding: 0; max-width: 610px; }
#sf-brand-library .hero-identity{ margin-bottom: 22px; }
#sf-brand-library .profile-kicker{ margin-left: auto; }
#sf-brand-library .logo-slot img{ max-width: 140px; height: 32px; }
#sf-brand-library h1{ font-size: 48px; }
#sf-brand-library .style-signature{ max-width: 540px; font-size: 21px; }
#sf-brand-library .intro{ max-width: 570px; font-size: 14px; }
#sf-brand-library .hero-anchor{ margin-top: 22px; }
#sf-brand-library .hero{ padding-bottom: 48px; }
#sf-brand-library .content-grid{ grid-template-columns: 1fr; gap: 38px; padding-top: 28px; }
#sf-brand-library .toc{ position: static; padding: 0; }
#sf-brand-library .toc-label{ margin-bottom: 12px; }
#sf-brand-library .toc nav{ display: flex; flex-direction: row; overflow-x: auto; gap: 25px; padding-bottom: 12px; scrollbar-width: thin; }
#sf-brand-library .toc nav a{ flex: 0 0 auto; font-size: 12px; gap: 8px; padding: 4px 0; }
#sf-brand-library .toc nav a[aria-current]::before{ display: none; }
#sf-brand-library .toc-back{ display: none; }
#sf-brand-library .article > section{ scroll-margin-top: 96px; padding-bottom: 47px; }
#sf-brand-library .article > section + section{ padding-top: 38px; }
#sf-brand-library .related{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 540px) {#sf-brand-library .shell{ width: calc(100% - 40px); }
#sf-brand-library .topbar__inner{ min-height: 72px; }
#sf-brand-library .header-nav{ gap: 18px; font-size: 12px; }
#sf-brand-library .header-nav a:first-child{ display: none; }
#sf-brand-library .brandmark{ gap: 10px; }
#sf-brand-library .seal{ width: 32px; height: 32px; font-size: 13px; }
#sf-brand-library .brandmark__text{ font-size: 15px; }
#sf-brand-library .brandmark__descriptor{ font-size: 12px; margin-top: 4px; }
#sf-brand-library .breadcrumb{ padding-block: 21px; font-size: 12px; gap: 10px; }
#sf-brand-library .hero-grid{ gap: 27px; }
#sf-brand-library .hero-media{ aspect-ratio: 1.15; }
#sf-brand-library .hero-fit-contain > img{ padding: 18px; }
#sf-brand-library .hero-media--logo,#sf-brand-library .hero-media--word{ padding: 36px; }
#sf-brand-library .hero-media--logo > img{ width: 75%; }
#sf-brand-library .hero-identity{ margin-bottom: 20px; }
#sf-brand-library .logo-slot{ height: 32px; }
#sf-brand-library .logo-slot img{ height: 29px; max-width: 132px; }
#sf-brand-library h1{ font-size: 40px; line-height: 1.1; letter-spacing: -1.8px; }
#sf-brand-library .meta-line{ margin-top: 12px; font-size: 12px; }
#sf-brand-library .style-signature{ margin-top: 23px; font-size: 20px; line-height: 1.4; }
#sf-brand-library .intro{ font-size: 14px; margin-top: 16px; }
#sf-brand-library .hero-anchor{ max-width: 215px; margin-top: 25px; }
#sf-brand-library .tags{ margin-top: 17px; }
#sf-brand-library .tag{ font-size: 12px; }
#sf-brand-library .hero{ padding-bottom: 40px; }
#sf-brand-library .content-grid{ gap: 29px; }
#sf-brand-library .section-head{ gap: 12px; margin-bottom: 25px; }
#sf-brand-library .section-head > span{ flex-basis: 16px; font-size: 11px; }
#sf-brand-library h2{ font-size: 25px; letter-spacing: -.7px; }
#sf-brand-library .section-intro{ margin-left: 28px; font-size: 13px; }
#sf-brand-library .fact-grid{ column-gap: 20px; }
#sf-brand-library .fact{ padding: 17px 0 20px; }
#sf-brand-library .fact dt{ font-size: 12px; }
#sf-brand-library .fact dd{ font-size: 14px; line-height: 1.5; margin-top: 8px; }
#sf-brand-library .fact dd a{ font-size: 13px; }
#sf-brand-library .style-panel{ grid-template-columns: 1fr; gap: 27px; }
#sf-brand-library .style-copy p{ font-size: 24px; }
#sf-brand-library .style-notes li{ font-size: 13px; }
#sf-brand-library .style-copy .tags{ margin-top: 20px; }
#sf-brand-library .product-grid{ grid-template-columns: 1fr; gap: 35px; }
#sf-brand-library .product-media{ aspect-ratio: 4 / 3; }
#sf-brand-library .product-copy{ padding-top: 20px; }
#sf-brand-library .product-copy h3{ font-size: 23px; }
#sf-brand-library .product-copy p{ font-size: 13px; }
#sf-brand-library .product-source{ margin-top: 13px; }
#sf-brand-library .image-expand{ opacity: 1; width: 30px; height: 30px; right: 11px; bottom: 11px; }
#sf-brand-library .pending-panel{ grid-template-columns: 1fr; gap: 22px; padding: 26px; }
#sf-brand-library .pending-panel .logo-slot{ height: 62px; justify-content: flex-start; }
#sf-brand-library .pending-panel .logo-slot img{ object-position: left center; }
#sf-brand-library .pending-panel h3{ font-size: 20px; }
#sf-brand-library .proof-list li,#sf-brand-library .sources li{ grid-template-columns: 28px minmax(0, 1fr); }
#sf-brand-library .proof-list p{ font-size: 14px; }
#sf-brand-library .faq-list summary{ font-size: 14px; padding-block: 21px; }
#sf-brand-library .faq-list details p{ margin-right: 20px; font-size: 13px; }
#sf-brand-library .sources strong{ font-size: 13px; }
#sf-brand-library .reference-note{ margin-left: 28px; }
#sf-brand-library .related{ grid-template-columns: 1fr; gap: 18px; }
#sf-brand-library .related-card{ grid-template-columns: 80px minmax(0, 1fr) auto; }
#sf-brand-library .related-thumb{ width: 80px; height: 80px; }
#sf-brand-library .cta{ grid-template-columns: 1fr; gap: 24px; padding-top: 9px; }
#sf-brand-library .cta h2{ font-size: 29px; max-width: 300px; }
#sf-brand-library .sourcing-section{ padding-top: 34px !important; padding-bottom: 45px !important; }
#sf-brand-library .button{ margin-top: 21px; }
#sf-brand-library .footer-inner{ flex-wrap: wrap; gap: 16px; }
#sf-brand-library .footer-inner > a:first-child{ flex-basis: 100%; }
#sf-brand-library .footer-inner > a:last-child{ margin-left: auto; }
#sf-brand-library .image-viewer{ padding: 45px 16px 20px; }
#sf-brand-library .image-viewer img{ max-height: calc(100vh - 160px); }
}
@media (prefers-reduced-motion: reduce) {#sf-brand-library{ scroll-behavior: auto; }
#sf-brand-library *,#sf-brand-library *::before,#sf-brand-library *::after{ transition: none !important; animation: none !important; }
}
@media (max-width: 820px) {#sf-brand-library .hero-grid:has(.hero-media--logo),#sf-brand-library .hero-grid:has(.hero-media--word){ grid-template-columns: 130px minmax(0, 1fr); gap: 32px; }
#sf-brand-library .hero-grid:has(.hero-media--logo) .hero-media,#sf-brand-library .hero-grid:has(.hero-media--word) .hero-media{ padding: 20px; }
#sf-brand-library .hero-grid:has(.hero-media--logo) h1,#sf-brand-library .hero-grid:has(.hero-media--word) h1{ font-size: 35px; letter-spacing: -1.3px; }
}
@media (max-width: 540px) {#sf-brand-library .hero-grid:has(.hero-media--logo),#sf-brand-library .hero-grid:has(.hero-media--word){ grid-template-columns: 1fr; gap: 24px; }
#sf-brand-library .hero-grid:has(.hero-media--logo) .hero-media,#sf-brand-library .hero-grid:has(.hero-media--word) .hero-media{ width: 150px; height: 92px; padding: 18px; aspect-ratio: auto; }
#sf-brand-library .hero-grid:has(.hero-media--logo) h1,#sf-brand-library .hero-grid:has(.hero-media--word) h1{ font-size: 37px; letter-spacing: -1.5px; }
#sf-brand-library .hero-grid:has(.hero-media--word) .hero-media .wordmark{ font-size: 19px; letter-spacing: -.5px; }
}
#sf-brand-library .seal{border-radius:6px 2px 6px 2px;font:25px/1 Georgia,serif;width:36px;height:40px}
#sf-brand-library .brandmark__text{font-size:21px;font-weight:700;letter-spacing:-.8px}
#sf-brand-library .brandmark__descriptor{font-size:8px;letter-spacing:2.3px;font-weight:500;margin-top:5px}
#sf-brand-library .logo-slot img{mix-blend-mode:multiply}
#sf-brand-library .image-note{font-size:10px}
#sf-brand-library .product-source{font-size:11px}
@media(max-width:540px){#sf-brand-library .seal{width:31px;height:35px;font-size:23px}
#sf-brand-library .brandmark__text{font-size:18px}
#sf-brand-library .brandmark__descriptor{font-size:7px;letter-spacing:1.8px}
}
#sf-brand-library .hero-fit-cover{aspect-ratio:var(--media-ratio,1.4)}
#sf-brand-library .logo-slot img{width:140px;height:50px;max-width:140px}
#sf-brand-library .logo-slot{height:50px}
#sf-brand-library .logo-slot img.logo-fit-cover{object-fit:cover;object-position:center}
@media(max-width:540px){#sf-brand-library .logo-slot img{width:112px;height:40px;max-width:112px}
#sf-brand-library .logo-slot{height:40px}
}
#sf-brand-library .toc{min-width:0}
@media(max-width:820px){#sf-brand-library .content-grid{grid-template-columns:minmax(0,1fr)}
#sf-brand-library .toc nav{max-width:100%}
}
#sf-brand-library .intro{font-size:15px;line-height:1.8;color:var(--muted)}
#sf-brand-library .meta-line,#sf-brand-library .profile-kicker{font-size:12px;line-height:1.7}
#sf-brand-library .style-signature{font-size:21px;line-height:1.45}
#sf-brand-library .toc nav a{min-height:39px;font-size:13px}
#sf-brand-library .toc nav a:hover,#sf-brand-library .toc nav a[aria-current]{color:var(--accent)}
#sf-brand-library .toc nav a:focus-visible{outline-offset:3px}
#sf-brand-library .toc-back{font-size:12px;min-height:44px}
#sf-brand-library .fact dt{font-size:13px}
#sf-brand-library .fact dd{font-size:17px}
#sf-brand-library .style-notes li,#sf-brand-library .product-copy p{font-size:14px;line-height:1.75}
#sf-brand-library .product-copy>a{font-size:12px;min-height:35px;display:inline-flex;align-items:center}
#sf-brand-library .product-source{font-size:12px;line-height:1.7}
#sf-brand-library .reference-note{font-size:12px;line-height:1.8}
#sf-brand-library .sources strong{font-size:14px}
#sf-brand-library .sources span:not(.source-index),#sf-brand-library .sources a{font-size:12px}
#sf-brand-library .sources a{min-height:30px;display:inline-flex;align-items:center}
#sf-brand-library .faq-list details p{font-size:14px}
#sf-brand-library .cta p:not(.eyebrow){font-size:14px}
#sf-brand-library .hero-anchor{font-size:13px;min-height:44px;max-width:250px}
#sf-brand-library .header-nav a{min-height:44px;display:inline-flex;align-items:center;font-size:13px}
#sf-brand-library .image-expand{width:40px;height:40px;background:var(--paper)}
#sf-brand-library .viewer-close{width:44px;height:44px;right:12px;top:9px}
#sf-brand-library .related-card{transition:background .15s,border-color .15s}
#sf-brand-library .related-card:hover,#sf-brand-library .related-card:focus-visible{border-color:var(--accent)}
#sf-brand-library .button{min-height:46px;font-size:13px}
@media(max-width:540px){#sf-brand-library .intro{font-size:14px}
#sf-brand-library .style-signature{font-size:20px}
#sf-brand-library .fact dt{font-size:12px}
#sf-brand-library .fact dd{font-size:15px}
#sf-brand-library .product-copy p,#sf-brand-library .style-notes li,#sf-brand-library .faq-list details p{font-size:14px}
#sf-brand-library .product-source,#sf-brand-library .reference-note{font-size:12px}
#sf-brand-library .sources strong{font-size:14px}
#sf-brand-library .sources span:not(.source-index),#sf-brand-library .sources a{font-size:12px}
#sf-brand-library .header-nav a{font-size:12px}
#sf-brand-library .hero-anchor{font-size:13px}
}
@media(hover:none),(pointer:coarse){#sf-brand-library .image-expand{opacity:1;width:44px;height:44px}
#sf-brand-library .toc nav a{min-height:44px}
#sf-brand-library .product-copy>a,#sf-brand-library .sources a{min-height:44px}
}
#sf-brand-library .toc-toggle{ display: none; }
#sf-brand-library .toc nav[hidden]{ display: none; }
#sf-brand-library .toc-toggle__icon{ width: 18px; height: 18px; flex: 0 0 18px; transition: transform .18s; }
#sf-brand-library .toc-toggle[aria-expanded="true"] .toc-toggle__icon{ transform: rotate(180deg); }
#sf-brand-library .hero-media:hover .image-expand,#sf-brand-library .hero-media:focus-within .image-expand{ opacity: 1; }
@media (max-width: 820px) {#sf-brand-library .breadcrumb{ flex-wrap: wrap; gap: 4px 10px; min-width: 0; line-height: 1.6; }
#sf-brand-library .breadcrumb a,#sf-brand-library .breadcrumb [aria-current]{ max-width: 100%; overflow-wrap: anywhere; }
#sf-brand-library .breadcrumb a{ display: inline-flex; align-items: center; min-height: 44px; }
#sf-brand-library .hero-identity{ flex-wrap: wrap; row-gap: 10px; }
#sf-brand-library .toc{ position: static; top: auto; }
#sf-brand-library .toc nav{ flex-wrap: wrap; gap: 0 20px; overflow: visible; padding-bottom: 0; }
#sf-brand-library .toc nav a{ min-height: 44px; max-width: 100%; white-space: normal; }
#sf-brand-library .toc--enhanced{ border-block: 1px solid var(--line); }
#sf-brand-library .toc--enhanced .toc-label{ display: none; }
#sf-brand-library .toc--enhanced .toc-toggle{ display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; min-height: 52px; padding: 12px 0; border: 0; background: transparent; color: var(--ink); font-size: 15px; font-weight: 500; text-align: left; cursor: pointer; }
#sf-brand-library .toc-toggle__title{ min-width: 0; }
#sf-brand-library .toc-toggle__count{ margin-left: auto; color: var(--muted); font-size: 12px; font-weight: 400; }
#sf-brand-library .toc--enhanced nav{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 18px; padding: 0 0 14px; }
#sf-brand-library .toc--enhanced nav[hidden]{ display: none; }
#sf-brand-library .toc--enhanced nav a{ padding: 10px 0; font-size: 14px; align-items: flex-start; }
#sf-brand-library .toc--enhanced nav a span{ flex: 0 0 16px; }
#sf-brand-library .toc-toggle:focus-visible,#sf-brand-library .toc nav a:focus-visible{ outline-offset: 2px; }
#sf-brand-library .section-head h2,#sf-brand-library .product-copy h3,#sf-brand-library .sources strong,#sf-brand-library .related-card strong{ min-width: 0; overflow-wrap: anywhere; }
#sf-brand-library .hero-copy .direct-answer > p:not(.answer-citations){ font-size: 16px; line-height: 1.75; }
#sf-brand-library .hero-copy .answer-citations{ overflow-wrap: anywhere; }
#sf-brand-library .fact-source,#sf-brand-library .faq-citations,#sf-brand-library .editorial-note{ overflow-wrap: anywhere; }
#sf-brand-library .product-source a,#sf-brand-library .sources a{ min-height: 44px; max-width: 100%; }
#sf-brand-library .image-expand{ width: 44px; height: 44px; opacity: 1; }
#sf-brand-library .viewer-close{ width: 48px; height: 48px; }
}
@media (max-width: 540px) {#sf-brand-library{ font-size: 16px; line-height: 1.75; }
#sf-brand-library .shell{ width: calc(100% - 32px); }
#sf-brand-library .breadcrumb{ padding-block: 10px 16px; font-size: 11px; letter-spacing: .15px; }
#sf-brand-library .breadcrumb [aria-current]{ line-height: 1.5; }
#sf-brand-library .hero-grid{ gap: 22px; }
#sf-brand-library .hero-media{ aspect-ratio: 1.55; max-height: 300px; }
#sf-brand-library .hero-fit-cover{ aspect-ratio: var(--media-ratio, 1.55); }
#sf-brand-library .hero-fit-cover > img,#sf-brand-library .hero-fit-contain > img{ object-fit: contain; }
#sf-brand-library .hero-fit-contain > img{ padding: 14px; }
#sf-brand-library .hero-identity{ gap: 12px; margin-bottom: 16px; }
#sf-brand-library .logo-slot{ min-width: 0; max-width: calc(100% - 102px); }
#sf-brand-library .logo-slot .wordmark{ overflow-wrap: anywhere; line-height: 1.35; }
#sf-brand-library .logo-slot img{ max-width: 100%; }
#sf-brand-library h1{ font-size: clamp(32px, 9.4vw, 40px); line-height: 1.12; letter-spacing: -1px; }
#sf-brand-library .hero-grid:has(.hero-media--logo) h1,#sf-brand-library .hero-grid:has(.hero-media--word) h1{ font-size: clamp(30px, 9.4vw, 39px); letter-spacing: -1px; }
#sf-brand-library .hero-grid:has(.hero-media--logo) .hero-media,#sf-brand-library .hero-grid:has(.hero-media--word) .hero-media{ width: 160px; height: 88px; max-width: 100%; padding: 16px; }
#sf-brand-library .meta-line{ font-size: 12px; margin-top: 10px; }
#sf-brand-library .style-signature{ font-size: 20px; line-height: 1.5; margin-top: 20px; }
#sf-brand-library .intro{ font-size: 16px; line-height: 1.75; }
#sf-brand-library .hero-copy .direct-answer h2{ font-size: 14px; line-height: 1.5; }
#sf-brand-library .hero-copy .answer-citations{ font-size: 12px; line-height: 1.6; }
#sf-brand-library .hero-copy .answer-citations .reference-link,#sf-brand-library .fact dd .fact-source .reference-link,#sf-brand-library .faq-list .faq-citations .reference-link{ display: inline-block; min-height: 44px; max-width: 100%; padding-block: 10px; line-height: 1.6; overflow-wrap: anywhere; }
#sf-brand-library .hero-anchor{ width: 100%; max-width: 100%; min-height: 48px; margin-top: 18px; padding-block: 12px; font-size: 14px; }
#sf-brand-library .hero{ padding-bottom: 30px; }
#sf-brand-library .content-grid{ gap: 30px; padding-top: 22px; }
#sf-brand-library .section-head{ gap: 10px; align-items: flex-start; margin-bottom: 22px; }
#sf-brand-library .section-head > span{ padding-top: 4px; flex-basis: 16px; }
#sf-brand-library h2{ font-size: 25px; line-height: 1.24; letter-spacing: -.65px; }
#sf-brand-library .section-intro{ font-size: 16px; line-height: 1.7; margin: -8px 0 24px; }
#sf-brand-library .article > section{ padding-bottom: 36px; scroll-margin-top: 100px; }
#sf-brand-library .article > section + section{ padding-top: 32px; }
#sf-brand-library .fact-grid{ grid-template-columns: minmax(0, 1fr); gap: 12px; }
#sf-brand-library .fact{ min-width: 0; padding: 18px; border: 1px solid var(--line); background: var(--paper); }
#sf-brand-library .fact dt{ font-size: 12px; line-height: 1.5; }
#sf-brand-library .fact dd{ font-size: 17px; line-height: 1.5; margin-top: 6px; }
#sf-brand-library .fact dd > a{ display: inline-flex; align-items: center; min-height: 44px; font-size: 16px; max-width: 100%; }
#sf-brand-library .fact dd .fact-source{ margin-top: 4px; font-size: 12px; }
#sf-brand-library .fact dd .fact-source .reference-link{ font-size: 12px; }
#sf-brand-library .style-panel{ gap: 20px; }
#sf-brand-library .style-copy p{ font-size: 22px; line-height: 1.5; letter-spacing: -.45px; }
#sf-brand-library .style-notes li{ padding-bottom: 14px; font-size: 16px; line-height: 1.75; }
#sf-brand-library .style-notes li::before{ top: 11px; }
#sf-brand-library .product-grid{ gap: 30px; }
#sf-brand-library .product-media{ aspect-ratio: 4 / 3; }
#sf-brand-library .product-fit-contain img,#sf-brand-library .product-media.product-fit-contain img{ padding: 14px; }
#sf-brand-library .product-copy{ padding-top: 16px; }
#sf-brand-library .product-copy h3{ font-size: 23px; line-height: 1.3; }
#sf-brand-library .product-copy p{ font-size: 16px; line-height: 1.7; margin-top: 10px; }
#sf-brand-library .product-copy > a{ min-height: 44px; max-width: 100%; margin-top: 10px; padding-block: 8px; font-size: 14px; }
#sf-brand-library .product-source{ margin-top: 4px; font-size: 12px; }
#sf-brand-library .product-source a{ display: inline-flex; align-items: center; max-width: 100%; overflow-wrap: anywhere; }
#sf-brand-library .image-expand{ right: 10px; bottom: 10px; width: 44px; height: 44px; background: var(--paper); }
#sf-brand-library .image-expand svg{ width: 17px; height: 17px; }
#sf-brand-library .pending-panel{ gap: 16px; padding: 20px; }
#sf-brand-library .pending-panel p,#sf-brand-library .proof-list p{ font-size: 16px; line-height: 1.75; }
#sf-brand-library .article .discovery-note p{ font-size: 16px; line-height: 1.75; }
#sf-brand-library .proof-list li{ padding-block: 18px; }
#sf-brand-library .faq-list summary{ min-height: 56px; padding-block: 18px; font-size: 16px; line-height: 1.6; gap: 16px; }
#sf-brand-library .faq-list details p{ font-size: 16px; line-height: 1.75; margin-right: 0; margin-bottom: 22px; }
#sf-brand-library .faq-list .faq-citations{ font-size: 12px; line-height: 1.6; margin-top: -8px; }
#sf-brand-library .sources li{ padding-block: 18px; }
#sf-brand-library .sources strong{ font-size: 16px; line-height: 1.65; }
#sf-brand-library .sources a{ font-size: 14px; margin-top: 6px; min-height: 44px; }
#sf-brand-library .reference-note,#sf-brand-library .editorial-note{ margin-left: 0; font-size: 12px; line-height: 1.8; }
#sf-brand-library .related{ gap: 16px; }
#sf-brand-library .related-card{ grid-template-columns: 72px minmax(0, 1fr) 16px; gap: 13px; padding-bottom: 16px; }
#sf-brand-library .related-thumb{ width: 72px; height: 72px; }
#sf-brand-library .related-card strong{ font-size: 17px; line-height: 1.4; }
#sf-brand-library .related-card small{ font-size: 13px; line-height: 1.65; margin-top: 5px; overflow-wrap: anywhere; }
#sf-brand-library .cta{ gap: 18px; }
#sf-brand-library .cta h2{ font-size: 29px; max-width: 100%; }
#sf-brand-library .cta p:not(.eyebrow){ font-size: 16px; line-height: 1.75; }
#sf-brand-library .button{ justify-content: space-between; width: 100%; min-height: 50px; gap: 16px; padding: 13px 16px; font-size: 14px; }
#sf-brand-library .image-viewer{ width: calc(100% - 24px); max-width: 100%; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); margin: auto; padding: max(60px, calc(env(safe-area-inset-top) + 52px)) 12px max(18px, env(safe-area-inset-bottom)); overflow-y: auto; overscroll-behavior: contain; }
#sf-brand-library .image-viewer img{ max-height: calc(100vh - 160px); max-height: calc(100dvh - 160px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
#sf-brand-library .viewer-close{ right: max(8px, env(safe-area-inset-right)); top: max(8px, env(safe-area-inset-top)); width: 48px; height: 48px; font-size: 30px; }
#sf-brand-library .viewer-caption{ margin-top: 14px; font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
}
@media (max-width: 360px) {#sf-brand-library .toc--enhanced nav{ grid-template-columns: minmax(0, 1fr); }
#sf-brand-library .hero-identity{ gap: 8px; }
#sf-brand-library .related-card{ grid-template-columns: 62px minmax(0, 1fr) 14px; gap: 11px; }
#sf-brand-library .related-thumb{ width: 62px; height: 62px; }
#sf-brand-library .fact{ padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {#sf-brand-library .toc-toggle__icon{ transition: none; }
}