/* Editorial campaign artwork and copy, followed directly by the category tiles. */
.gear-shop-page .xfg-shop-hero {
    position:relative; display:block; height:clamp(350px,35vw,680px); min-height:0;
    overflow:hidden; background:#191b1e;
}
.gear-shop-page .xfg-shop-hero__image {
    position:absolute; inset:0; width:100%; height:100%; aspect-ratio:auto;
    background:none; transform:none;
}
.gear-shop-page .xfg-shop-hero__image > img {
    display:block; width:100%; height:100%; object-fit:cover; object-position:center top;
}
.gear-shop-page .xfg-shop-hero__image::after {
    content:""; display:block; position:absolute; inset:0;
    background:linear-gradient(90deg,#05060750, #05060720 38%,transparent 62%);
}
.gear-shop-page .xfg-shop-hero__inner {
    display:flex; position:relative; align-items:center; justify-content:flex-start;
    width:min(1440px,calc(100% - 80px)); height:100%; min-height:0; margin:auto;
    padding:20px 0; background:transparent; text-align:left;
}
.gear-shop-page .xfg-shop-hero__copy {
    display:block; width:46%; max-width:500px; padding:0;
}
.gear-shop-page .xfg-shop-hero__copy > p {
    display:inline-block; padding:4px 7px; margin:0 0 12px; background:#ecc568; color:#181817;
    font:700 10px/1.2 "XFG Condensed","Arial Narrow",sans-serif; letter-spacing:.7px;
}
.gear-shop-page .xfg-shop-hero h1 {
    max-width:none; margin:0; font-size:clamp(30px,3.1vw,44px); line-height:1.05;
    letter-spacing:0; text-transform:none;
}
.gear-shop-page .xfg-shop-hero__copy > span {
    max-width:340px; margin:16px 0 0; color:#f0efeb; font:14px/1.5 "Segoe UI",sans-serif;
}
.gear-shop-page .xfg-shop-hero__copy > a {
    min-height:42px; margin-top:18px; padding:10px 18px; font-size:14px;
    letter-spacing:.2px; text-transform:none;
}
.gear-shop-page .xfg-shop-hero__note {
    display:block; margin-top:14px; color:#d1d0cd; font:10px/1.5 "Segoe UI",sans-serif;
}
.gear-shop-page .shop-entry-cards { padding-top:28px; }
@media(max-width:1000px) {
    .gear-shop-page .xfg-shop-hero__inner { width:calc(100% - 56px); }
    .gear-shop-page .xfg-shop-hero__copy > span { max-width:310px; font-size:13px; }
}
@media(max-width:700px) {
    .gear-shop-page .xfg-shop-hero { display:grid; grid-template-rows:auto auto; height:auto; min-height:0; }
    .gear-shop-page .xfg-shop-hero__image { position:relative; inset:auto; width:100%; height:auto; aspect-ratio:16 / 9; }
    .gear-shop-page .xfg-shop-hero__image > img { object-position:76% 44%; }
    .gear-shop-page .xfg-shop-hero__image::after { display:none; }
    .gear-shop-page .xfg-shop-hero__inner { display:block; width:100%; height:auto; min-height:0; padding:20px 16px 24px; text-align:center; }
    .gear-shop-page .xfg-shop-hero__copy { display:block; width:100%; max-width:none; padding:0; text-align:center; }
    /* Keep the phone campaign scale after the shared shop type rules load. */
    .gear-shop-page.xfg-shop-home .xfg-shop-hero .xfg-shop-hero__inner { padding:20px 16px 24px; }
    .gear-shop-page.xfg-shop-home .xfg-shop-hero .xfg-shop-hero__copy > p {
        margin:0 0 12px; padding:3px 7px; font:600 14px/18px var(--shop-display); letter-spacing:.3px;
    }
    .gear-shop-page.xfg-shop-home .xfg-shop-hero h1 { font:600 24px/1.1 var(--shop-display); letter-spacing:0; }
    .gear-shop-page.xfg-shop-home .xfg-shop-hero .xfg-shop-hero__copy > span {
        max-width:330px; margin:12px auto 0; font:400 18px/22px var(--shop-display); letter-spacing:0;
    }
    .gear-shop-page.xfg-shop-home .xfg-shop-hero .xfg-shop-hero__copy > a {
        min-height:36px; margin-top:16px; padding:6px 16px; font:600 18px/22px var(--shop-display); letter-spacing:0;
    }
    .gear-shop-page .shop-entry-cards { padding-top:24px; }
}
