/* One-screen, apparel-first welcome: bold type, a bigger family photograph, and the original heart. */
.hero{height:min(100svh,980px);min-height:660px;aspect-ratio:auto;background:#173427}
.hero::after{inset:18px;border-color:#e2c88e88}
.scene{object-position:center 57%}
.shade{background:linear-gradient(90deg,#071d14e8 0%,#0b241ad1 30%,#0c251a85 49%,#0b241a20 70%,transparent 88%),linear-gradient(0deg,#0b211747,transparent 26%)}
.copy{top:24%;left:7%;width:min(43%,640px)}
.question{max-width:none;font-size:clamp(31px,2.8vw,44px);line-height:1.04;letter-spacing:-.035em;white-space:nowrap}
.words{font:600 clamp(11px,.92vw,14px)/1.35 "Avenir Next",Arial,sans-serif;letter-spacing:.16em;color:#f0d9aa;margin-top:22px}
.hero-tagline{margin:16px 0 0;color:#fff3d7;font-size:clamp(16px,1.35vw,21px);line-height:1.25;letter-spacing:.025em}
.collection-link{bottom:8.5%;font-size:clamp(18px,1.5vw,24px)}
.plaid-footer{display:none}
@media(max-width:760px){
  .hero{height:100svh;min-height:680px;max-height:950px;padding:0;aspect-ratio:auto}
  .hero::after{inset:9px;border-color:#e2c88e8c}
  .scene{inset:40% 0 0;width:100%;height:60%;object-fit:cover;object-position:74% 50%;z-index:0}
  .shade{inset:0;height:100%;background:linear-gradient(180deg,#183326 0%,#183326 26%,#183326f2 34%,#183326c9 41%,#18332627 56%,#18332610 100%);z-index:1}
  .brand{top:15px;left:22px;width:106px;gap:4px;z-index:3}
  .brand span{font-size:9px;letter-spacing:.16em}
  .copy{top:12.5%;left:23px;right:22px;width:auto;max-width:440px;text-align:left;z-index:2}
  .greeting{font-size:11px;letter-spacing:.18em;margin:0 0 9px}
  .question{max-width:none;font-size:clamp(21px,5.55vw,26px);line-height:1.05;letter-spacing:-.035em;white-space:nowrap}
  .words{max-width:95%;font-size:9px;letter-spacing:.09em;margin-top:11px;line-height:1.45}
  .hero-tagline{font-size:15px;margin-top:8px;line-height:1.2}
  .collection-link{left:23px;top:35%;bottom:auto;transform:none;min-height:42px;gap:9px;z-index:3;font-size:17px;text-underline-offset:5px}
  .collection-link img{width:22px;height:32px}
}
@media(max-width:390px){
  .hero{min-height:650px}
  .copy{top:12%;left:20px;right:18px}
  .question{font-size:clamp(20px,5.4vw,23px)}
  .hero-tagline{font-size:14px}
  .collection-link{left:20px;top:36%;font-size:16px}
}
@media(max-height:740px) and (max-width:760px){
  .hero{min-height:620px}
  .copy{top:11%}
  .question{font-size:clamp(20px,5vw,23px)}
}