/* Brand-story layout overrides: scoped to the archive page. */
.brand-archive{display:block;width:100%;overflow:hidden;background:#fff;color:#26352d}
.brand-archive img{display:block;max-width:100%}
.brand-story-hero,.brand-story-footer{position:relative;width:100%;min-height:420px;overflow:hidden;background:#edf0ef}
.brand-story-hero>img,.brand-story-footer>img,.brand-story-wash{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.brand-story-hero-copy,.brand-story-footer>div:last-child{position:relative;width:min(1080px,calc(100% - 48px));margin:0 auto;padding:110px 0}
.brand-story-hero-copy strong{display:block;color:var(--green);font-size:22px}
.brand-story-wordmark{width:220px;max-height:58px;object-fit:contain;object-position:left;margin:0 0 14px}
.brand-story-wordmark-wrap{display:flex;align-items:flex-start;gap:4px;width:max-content}.brand-story-wordmark-wrap sup{color:#1b2520;font-size:14px;font-weight:700;line-height:1;margin-top:2px;transform:translateY(-9px)}
.brand-story-hero-copy>p:last-child{max-width:650px;color:#49584f;font-size:18px;line-height:1.8}
.brand-story-section{display:block;width:min(1080px,calc(100% - 48px));margin:0 auto;padding:76px 0;border-bottom:1px solid var(--line)}
.brand-story-section h1,.brand-story-section h2{margin:0 0 24px;font-size:36px;line-height:1.3}
.brand-story-section h3{margin:0 0 10px;font-size:23px}
.brand-story-section p{max-width:880px;color:#536159;font-size:17px;line-height:1.95}
.brand-design-archive{--buff-green:#47a847;--f-yellow:#fcb330;--f-orange:#f26620;--buff-black:#232323;--f-grey:#efefef;width:100%;max-width:none;padding-left:max(24px,calc((100% - 1080px)/2));padding-right:max(24px,calc((100% - 1080px)/2));background:#efefef}
.brand-design-archive blockquote{margin:0;padding-left:16px;border-left:4px solid var(--gold);color:#637066;line-height:1.8}
.brand-design-archive>.eyebrow{color:#f26620}.brand-design-archive>h2{color:#232323}.brand-design-archive .brand-design-slide{border-color:#d9d9d9}.brand-design-archive .brand-design-slide img{background:#efefef}.brand-design-archive .brand-carousel-dots{color:#232323}
.brand-credit-line{display:flex;align-items:center;justify-content:space-between;gap:48px;width:min(880px,100%);min-height:280px;margin:18px auto 38px;padding:10px 54px 0;box-sizing:border-box;border:0;border-radius:0;background:none!important;box-shadow:none!important;overflow:hidden}
.brand-credit{font-size:18px!important;font-weight:700;color:#232323!important;display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
.brand-credit::after{display:none}
.brand-credit-line::after{display:none}
.designer-pose-carousel{position:relative;width:220px;height:270px;flex:0 0 auto}
.designer-pose-carousel img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;opacity:0;animation:designerPoseCycle 12s infinite ease-in-out}
.designer-pose-carousel img:nth-child(1){animation-delay:0s}.designer-pose-carousel img:nth-child(2){animation-delay:4s}.designer-pose-carousel img:nth-child(3){animation-delay:8s}
@keyframes designerPoseCycle{0%,28%{opacity:1;transform:translateX(0) translateY(0) scale(1)}33%,95%{opacity:0;transform:translateX(8px) translateY(2px) scale(.99)}100%{opacity:1;transform:translateX(0) translateY(0) scale(1)}}
.brand-long-copy{max-width:880px;margin:30px auto 0}
.brand-timeline{width:min(880px,100%);border-left:2px solid #d7e6dc;margin:30px auto 0}
.brand-timeline>div{position:relative;padding:0 0 42px 30px}
.brand-timeline>div:before{content:"";position:absolute;left:-8px;top:6px;width:14px;height:14px;border-radius:50%;background:var(--green)}
.brand-timeline time{display:block;color:var(--green);font-size:14px;margin-bottom:8px}
.brand-timeline p{margin:0 0 16px;font-size:15px}
.brand-timeline img{width:100%;max-width:620px;max-height:350px;object-fit:contain;background:#eef0ef;border-radius:8px}
.brand-timeline img.portrait{max-width:300px;max-height:500px;background:#303335}
.brand-store-card{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}
.brand-store-card h2{grid-column:1/-1}
.brand-store-card img{width:100%;height:260px;object-fit:cover;border-radius:8px}
.brand-store-option{display:grid;gap:16px;padding:18px;border:1px solid #dfe9e2;border-radius:14px;background:#fff;box-shadow:0 12px 30px rgba(37,74,52,.06)}
.brand-store-option img{height:300px;object-position:center top}.brand-store-option p{margin:0 0 8px}.brand-store-option .eyebrow{margin:0;color:var(--gold);font-size:13px;font-weight:700;letter-spacing:.08em}
.brand-store-card p{font-size:16px}
.brand-story-footer{min-height:300px}
.brand-story-footer>div:last-child{padding:75px 0}
.brand-story-footer h2{position:relative;margin:0;font-size:34px}
.brand-story-footer p{position:relative;max-width:620px;color:#536159;font-size:17px;line-height:1.8}
.brand-hero-tiles{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;height:100%;overflow:hidden}
.brand-story-hero{background:#dfcf96}
.brand-hero-empty{background:#dfcf96}
.brand-hero-tiles img{display:block;width:100%;height:100%;object-fit:cover;object-position:center center}
.brand-hero-tiles img:first-of-type{clip-path:inset(0 0 0 15%)}
.brand-story-hero .brand-story-wash{background:linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.76) 48%,rgba(255,255,255,.12) 76%)}
.brand-story-footer .brand-story-wash{background:linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.76) 58%,rgba(255,255,255,.22))}
.brand-design-archive{width:100%;max-width:none}
.brand-carousel{max-width:1080px;margin:34px auto 0}
.brand-carousel-viewport{overflow:hidden;border-radius:10px;overscroll-behavior-inline:contain}
.brand-design-grid{display:flex;gap:18px;margin:0;padding:2px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.brand-design-grid::-webkit-scrollbar{display:none}
.brand-design-slide{flex:0 0 100%;min-width:0;scroll-snap-align:start;background:#fff;border:1px solid #e2e8e3;border-radius:10px;overflow:hidden}
.brand-design-slide img{width:100%;height:clamp(320px,42vw,520px);object-fit:contain;background:#eef1ef;border-radius:0}
.brand-design-slide figcaption{min-height:48px;padding:12px 16px;color:#59675e;font-size:14px;line-height:1.5}
.brand-carousel-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:18px}
.brand-carousel-arrow{width:42px;height:42px;border:1px solid #47a847;border-radius:50%;background:#fff;color:#47a847;font-size:28px;line-height:1;cursor:pointer}
.brand-carousel-arrow:hover,.brand-carousel-arrow:focus-visible{background:var(--green);color:#fff;outline:2px solid #a9cfb8;outline-offset:2px}
.brand-carousel-dots{display:flex;align-items:center;gap:9px}
.brand-carousel-dots button{width:9px;height:9px;padding:0;border:0;border-radius:999px;background:#bdc9c1;cursor:pointer;transition:width .18s,background .18s}
.brand-carousel-dots button[aria-current="true"]{width:25px;background:var(--green)}
.brand-story-footer>img{object-position:center 42%}
.mascot-pair{position:relative!important;display:flex;align-items:center;gap:34px;width:min(1080px,calc(100% - 48px))!important;margin:0 auto!important;padding:48px 0!important}.mascot-characters{display:flex;align-items:flex-end;justify-content:center;gap:10px;flex:0 0 260px;height:220px}.mascot-characters img{width:125px;height:220px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 18px 20px rgba(25,49,39,.2))}.mascot-pair>div{position:relative}.mascot-pair h2{color:#1c2a23}.mascot-pair p{color:#405247!important}
.mascot-symbol-note{max-width:650px;margin-top:22px;padding:18px 22px;border-left:4px solid #fcb330;background:rgba(255,255,255,.72)}.mascot-symbol-note strong{display:block;margin-bottom:7px;color:#232323;font-size:17px}.mascot-symbol-note p{margin:0;font-size:15px!important;line-height:1.8!important}
@media(max-width:760px){
  .brand-hero-tiles{display:none}
  .brand-story-hero{background:#dfcf96 url('/static/website/brand-story/brand-hero-tile-3.webp') right top/auto 600px no-repeat}
  .brand-story-hero-copy,.brand-story-footer>div:last-child{width:calc(100% - 36px);padding:76px 0}
  .brand-story-section{width:calc(100% - 36px);padding:54px 0}
  .brand-design-archive{padding-left:18px;padding-right:18px}
  .brand-story-section h1,.brand-story-section h2{font-size:29px}
  .brand-story-section p{font-size:16px}
  .brand-store-card{grid-template-columns:1fr;gap:18px}
  .brand-store-card h2{grid-column:auto}
  .brand-store-card img{height:260px}
  .brand-story-footer h2{font-size:28px}
  .brand-credit-line{min-height:220px;margin:12px auto 28px;padding:8px 10px 0;gap:18px;background:transparent}.designer-pose-carousel{width:150px;height:215px}.brand-credit{font-size:16px!important}
  .mascot-pair{width:calc(100% - 36px)!important;gap:12px;padding:34px 0!important}.mascot-characters{flex-basis:150px;height:150px;gap:4px}.mascot-characters img{width:73px;height:150px}.mascot-symbol-note{margin-top:16px;padding:14px 16px}.mascot-symbol-note strong{font-size:15px}.mascot-symbol-note p{font-size:13px!important}
  .brand-design-archive{padding-left:18px;padding-right:18px}
  .brand-carousel{margin-top:26px}
  .brand-design-slide{flex-basis:100%}
  .brand-design-slide img{height:clamp(220px,62vw,340px)}
  .brand-carousel-controls{gap:14px}
  .brand-carousel-arrow{width:38px;height:38px}
}
@media(prefers-reduced-motion:reduce){.brand-design-grid{scroll-behavior:auto}.brand-carousel-dots button{transition:none}.designer-pose-carousel img{animation:none}.designer-pose-carousel img:first-child{opacity:1}}
.brand-story-footer{background:linear-gradient(135deg,#f4f8f5,#eef3f0)}
.brand-story-footer>img{opacity:0}
.brand-story-footer .brand-story-wash{background:transparent}