.tf-about-page { margin: 0; color: #282826; background: #fff; font-family: "Manrope", Arial, sans-serif; }
.tf-about-wrap { box-sizing: border-box; width: 100%; max-width: 1260px; margin: 0 auto; padding: 32px 32px 56px; font-size: 16px; line-height: 1.75; }
.tf-about-wrap *, .tf-about-footer { box-sizing: border-box; }
.tf-about-wrap a { color: inherit; text-decoration: none; }
.tf-about-wrap :is(a, button):focus-visible { outline: 2px solid #33332e; outline-offset: 5px; }

.tf-about-hero { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 32px; }
.tf-about-copy { padding: 0; }
.tf-about-copy h1 { margin: 0 0 18px; font: 500 40px/1.2 "Manrope", Arial, sans-serif; letter-spacing: -.04em; }
.tf-about-lead { max-width: 26em; margin: 0 0 16px; font-size: 24px; font-weight: 500; line-height: 1.45; letter-spacing: -.025em; }
.tf-about-intro { max-width: 72ch; margin: 0; color: #676763; font-size: 16px; line-height: 1.75; }
.tf-about-hero-image { align-self: center; aspect-ratio: 16 / 10; margin: 0; overflow: hidden; border-radius: 8px; background: #f2f2ef; }
.tf-about-hero-image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 68% center; }

.tf-about-origin { margin-top: 24px; }
.tf-about-origin p { max-width: 72ch; margin: 0; color: #676763; font-size: 16px; line-height: 1.75; }
.tf-about-origin p + p { margin-top: 12px; }
.tf-about-section { padding-top: 32px; }
.tf-about-section > h2 { margin: 0 0 20px; font: 500 26px/1.3 "Manrope", Arial, sans-serif; letter-spacing: -.025em; }

#TFAboutCustomers { text-align: center; }
.tf-about-audiences { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.tf-about-audience-card { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 24px; border-radius: 8px; background: #f7f6f4; }
.tf-about-audience-card--consumer { background: #fff5f4; }
.tf-about-audiences h3 { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin: 0 0 14px; font-size: 22px; font-weight: 500; line-height: 1.35; letter-spacing: -.015em; }
.tf-about-audience-badge { display: inline-flex; padding: 6px 12px; border-radius: 8px; background: #fff; color: #a44349; font-size: 13px; font-weight: 600; line-height: 1.4; letter-spacing: .04em; }
.tf-about-audiences p { max-width: 72ch; margin: 0 0 16px; color: #676763; font-size: 16px; line-height: 1.75; }
.tf-about-audiences a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; max-width: 100%; margin-top: auto; padding: 10px 20px; border-radius: 8px; background: #fff; font-size: 14px; font-weight: 500; line-height: 1.5; text-align: center; text-decoration: none; }
.tf-about-audiences a:is(:hover, :focus-visible) { color: #ff0000; text-decoration: none; text-shadow: none; box-shadow: none; }

.tf-about-contact { display: flex; flex-direction: column; align-items: center; gap: 20px; padding: 32px 0 0; text-align: center; }
.tf-about-contact h2 { margin: 0 0 14px; font: 500 26px/1.35 "Manrope", Arial, sans-serif; letter-spacing: -.025em; }
.tf-about-contact p { max-width: 72ch; margin: 0 auto 14px; color: #676763; font-size: 16px; line-height: 1.75; }
.tf-about-email { font-size: 15px; text-decoration: none; overflow-wrap: anywhere; }
.tf-about-actions { display: flex; flex-direction: column; align-items: stretch; width: 190px; max-width: 100%; }
.tf-about-button { display: flex; align-items: center; justify-content: center; min-height: 46px; padding: 12px 24px; border: 1px solid #282826; border-radius: 8px; background: #282826; color: #fff !important; font-size: 14px; font-weight: 500; text-align: center; text-decoration: none; }
.tf-about-button:hover { background: #454540; }
.tf-about-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; width: calc(100% - 64px); max-width: 1196px; margin: 22px auto 0; padding: 30px 0; border: 0; color: #74746f; font-size: 13px; }
.tf-about-footer > a { color: #282826; font: 400 28px/1 "Times New Roman", Times, serif; letter-spacing: -.04em; text-decoration: none; }

@media (min-width: 750px) and (max-width: 999px) {
  .tf-about-wrap { padding-inline: 24px; }
  .tf-about-hero { gap: 32px; }
  .tf-about-audience-card { padding: 24px; }
}

@media (max-width: 749px) {
  .tf-about-wrap { padding: 24px 16px 40px; font-size: 15px; }
  .tf-about-hero { grid-template-columns: 1fr; gap: 20px; }
  .tf-about-copy h1 { margin-bottom: 16px; font-size: 32px; }
  .tf-about-lead { margin-bottom: 16px; font-size: 22px; }
  .tf-about-intro, .tf-about-origin p, .tf-about-audiences p, .tf-about-contact p { font-size: 15px; }
  .tf-about-hero-image { aspect-ratio: 16 / 11; }
  .tf-about-origin { margin-top: 20px; }
  .tf-about-section { padding-top: 28px; }
  .tf-about-section > h2 { margin-bottom: 18px; font-size: 24px; }
  .tf-about-audiences { grid-template-columns: 1fr; gap: 16px; }
  .tf-about-audience-card { padding: 20px; border-radius: 8px; }
  .tf-about-audiences h3 { font-size: 21px; }
  .tf-about-contact { padding: 28px 0 0; }
  .tf-about-contact h2 { font-size: 24px; }
  .tf-about-footer { width: calc(100% - 32px); padding: 26px 0; }
}
/* Neutral editorial About page, aligned with the rest of the storefront. */
html[data-font-choice="E"] body.tf-about-page{background:#fdfcfb;color:#302b29}
.tf-about-hero{gap:0;align-items:stretch;background:#faf8f6;border-radius:18px;overflow:hidden;box-shadow:0 8px 28px #49352a08}
.tf-about-copy{padding:32px;align-self:center}
.tf-about-copy h1{font-weight:400;letter-spacing:-.045em}
.tf-about-lead{font-weight:400;font-size:25px;color:#852332}
.tf-about-intro{font-size:14px;color:#796b63;line-height:1.8}
.tf-about-hero-image{border-radius:0;align-self:stretch;aspect-ratio:auto;min-height:340px;background:#fff}
.tf-about-hero-image img{object-position:65% center}
.tf-about-origin{background:#fdfbf9;border-radius:16px;padding:26px 30px;margin-top:22px;box-shadow:0 5px 20px #49352a06}
.tf-about-origin p{font-size:14px;color:#796b63;line-height:1.8}
.tf-about-section>h2{font-weight:400;letter-spacing:-.035em;text-align:left!important}
.tf-about-section>h2#TFAboutCustomers{font-weight:700;text-align:center!important}
.tf-about-audiences{gap:18px}
.tf-about-audience-card,.tf-about-audience-card--consumer{background:#faf8f6;border-radius:16px;padding:26px;box-shadow:0 7px 24px #49352a08}
.tf-about-audiences h3{font-weight:400;font-size:23px;color:#852332;align-self:stretch;align-items:center;text-align:center}
.tf-about-audience-badge{border-radius:999px;background:#f2e6dd;color:#852332;font-size:11px;padding:6px 13px}
.tf-about-audiences p{font-size:14px;color:#796b63;line-height:1.8}
.tf-about-audiences a{background:#852332;color:#fff;border-radius:999px;font-size:12px;padding:10px 22px;align-self:center}
.tf-about-audiences a:is(:hover,:focus-visible){background:#68202d;color:#fff}
.tf-about-contact{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:28px;margin-top:28px;padding:30px;background:#852332;border-radius:16px;text-align:left}
.tf-about-contact>div:first-child{max-width:760px;min-width:0}
.tf-about-contact h2{color:#fdfbf9;font-weight:400;font-size:28px}
.tf-about-contact p{color:#ecd9d2;font-size:14px;margin:0 0 14px}
.tf-about-contact .tf-about-email{color:#fdfbf9;font-size:13px}
.tf-about-actions{flex:0 0 170px}
.tf-about-contact .tf-about-button{background:#f2e6dd;color:#64202c!important;border-color:#f2e6dd;border-radius:999px;font-size:12px}
.tf-about-contact .tf-about-button:hover{background:#fdfbf9;border-color:#fdfbf9}
.tf-about-wrap :is(a,button):focus-visible{outline-color:#852332}
.tf-about-contact :is(a,button):focus-visible{outline-color:#f2e6dd}
@media(max-width:999px){.tf-about-copy{padding:26px}.tf-about-hero-image{min-height:360px}}
@media(max-width:749px){
 .tf-about-hero{gap:0}
 .tf-about-copy{padding:24px 20px}
 .tf-about-lead{font-size:22px}
 .tf-about-hero-image{aspect-ratio:16/10;min-height:0}
 .tf-about-origin{padding:22px 20px}
 .tf-about-audience-card{padding:22px 20px}
 .tf-about-contact{flex-direction:column;align-items:flex-start;padding:24px 20px;gap:20px}
 .tf-about-contact h2{font-size:25px}
 .tf-about-actions{flex:0 0 auto;width:100%}
}
@media(forced-colors:active){.tf-about-contact{background:Canvas;border:1px solid CanvasText}.tf-about-contact :is(h2,p,.tf-about-email){color:CanvasText}}
