/* Brand appears first; the complete introduction gives way to the directory. */
.site-home { position: relative; }
.site-home .hero {
  position: fixed;
  inset: 0;
  z-index: 20;
  min-height: 100svh;
  background: linear-gradient(180deg, #748255, #424c32);
  animation: home-intro-exit .8s ease-in-out 3.4s both;
}
.site-home .hero__brand {
  animation: home-text-enter .9s cubic-bezier(.22, 1, .36, 1) .15s both;
}
.site-home .hero__tagline span {
  display: block;
  animation: home-text-enter .7s cubic-bezier(.22, 1, .36, 1) both;
}
.site-home .hero__tagline span:nth-child(1) { animation-delay: .9s; }
.site-home .hero__tagline span:nth-child(2) { animation-delay: 1.4s; }
.site-home .hero__tagline span:nth-child(3) { animation-delay: 1.9s; }
.site-home .directory {
  min-height: 100svh;
  background: linear-gradient(180deg, #64704b, #91a56e);
  animation: home-directory-enter .8s ease-out 3.6s both;
}
.site-home .directory__nav a:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 5px;
}
.home-skip-intro .site-home .hero { display: none; animation: none; }
.home-skip-intro .site-home .directory { animation: none; }
@keyframes home-text-enter {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes home-intro-exit {
  from { opacity: 1; visibility: visible; }
  to { opacity: 0; visibility: hidden; }
}
@keyframes home-directory-enter {
  from { opacity: 0; visibility: hidden; }
  to { opacity: 1; visibility: visible; }
}
@media (prefers-reduced-motion: reduce) {
  .site-home .hero { display: none; animation: none; }
  .site-home .hero__brand, .site-home .hero__tagline span,
  .site-home .directory { animation: none; }
}

/* Figma homepage 1225:153 — centred navigation on the brand gradient. */
.site-home .directory {
  position:relative;
  display:block;
  height:100svh;
  min-height:650px;
  padding:0;
  background:linear-gradient(-.436635deg,#8fa169 2.7353%,#4d5837 147.38%,#222719 232.03%);
}
.site-home .directory__content { position:relative; display:block; width:100%; height:100%; transition:width .45s ease; }
/* Move only the content column; the full-page background stays in place. */
.site-home[data-home-layout="left"] .directory__content { width:max(50%, 560px); max-width:100%; }
@media(max-width:600px) {
 .site-home[data-home-layout="left"] .directory__content { width:100%; }
}
@media(prefers-reduced-motion:reduce) {
 .site-home .directory__content { transition:none; }
}
.site-home .directory__eyebrow { position:absolute; top:2.364%; left:24px; right:24px; margin:0; color:#fff; font:600 10px/1.2 Inter,Arial,sans-serif; letter-spacing:3.8px; text-align:center; }
.site-home .directory__logo { position:absolute; top:13.258%; left:50%; transform:translateX(-50%); display:block; width:222px; height:76px; }
.site-home .directory__logo img { display:block; width:222px; height:76px; object-fit:cover; }
.site-home .directory__nav { position:absolute; top:34.327%; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:19px; width:max-content; max-width:calc(100% - 32px); }
.site-home .directory__nav a { color:#fff; font:500 23.419px/32px Manrope,Arial,sans-serif; letter-spacing:3.747px; padding-left:3.747px; transition:opacity .2s ease; }
.site-home .directory__nav a[href*="/collections/"] { font-weight:700; }
.site-home .directory__search { position:absolute; top:66.187%; left:50%; transform:translateX(-50%); width:319px; max-width:calc(100% - 48px); height:49px; border:1px solid #fff; }
.site-home .directory__search input { width:0; min-width:0; flex:1; padding:0 18px; border:0; border-radius:0; outline:none; box-shadow:none; appearance:none; font:400 20px/1.07 Inter,Arial,sans-serif; letter-spacing:0; color:#fff; }
.site-home .directory__search input::placeholder { color:rgba(255,255,255,.235); }
.site-home .directory__search input::-webkit-search-cancel-button { -webkit-appearance:none; appearance:none; width:16px; height:16px; margin:0 0 0 8px; cursor:pointer; background:center / 16px 16px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='m4 4 8 8M12 4l-8 8'/%3E%3C/svg%3E"); opacity:.7; }
.site-home .directory__search input::-webkit-search-cancel-button:hover { opacity:1; }
.site-home .directory__search:focus-within { outline:none; background:rgba(255,255,255,.06); }
.site-home .directory__search input:focus { border:0; outline:none; box-shadow:none; }
.site-home .directory__search .directory__submit { display:grid; place-items:center; flex:0 0 48px; align-self:stretch; padding:0; border:0; border-radius:0; color:#fff; background:transparent; cursor:pointer; transition:background .2s ease; }
.site-home .directory__submit:hover { background:rgba(255,255,255,.1); }
.site-home .directory__search .directory__submit:focus-visible { outline:none; background:rgba(255,255,255,.2); }
.site-home .directory__mark { position:absolute; top:80.437%; left:50%; transform:translateX(-50%); width:70px; height:70px; display:block; border:0; border-radius:0; }
.site-home .directory__mark-background { position:absolute; left:9.27%; top:3.42%; }
.site-home .directory__mark-crop { position:absolute; width:46px; height:39px; left:6px; top:3px; overflow:hidden; }
.site-home .directory__mark-crop img { position:absolute; width:230%; height:115%; left:-65%; top:-7.5%; max-width:none; }
@media(min-width:601px) and (max-height:800px) {
 .site-home .directory__nav { top:33%; gap:14px; }
 .site-home .directory__search { top:73%; }
 .site-home .directory__mark { top:86%; }
}
@media(max-width:600px) {
 .site-home .directory { min-height:740px; }
 .site-home .directory__eyebrow { top:24px; font-size:8px; line-height:1.8; letter-spacing:2.5px; }
 .site-home .directory__logo { top:15%; }
 .site-home .directory__nav { top:35%; gap:15px; }
 .site-home .directory__nav a { font-size:19px; line-height:28px; letter-spacing:3px; }
 .site-home .directory__search { top:69%; width:280px; }
 .site-home .directory__mark { top:83%; }
}

/* The supplied animation has a centered badge surrounded by black space. */
.site-home .directory__mark { overflow: hidden; }
.site-home .directory__mark-video { position: absolute; width: 310%; height: 310%; max-width: none; left: -105%; top: -105%; object-fit: contain; pointer-events: none; }

.site-home .directory__mark-video { visibility: hidden; }
.site-home .directory__mark-canvas { display: block; width: 100%; height: 100%; }

.site-home .directory__background { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.site-home .directory__background-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.48), rgba(0,0,0,.08)); pointer-events: none; }
@media (max-width: 600px) {
  /* Keep the mobile directory on its centered brand gradient. */
  .site-home .directory__background,
  .site-home .directory__background-shade { display: none; }
}