/* Six photographed materials, each with its own surface and response to light. */
.metal-card{--surface-x:50%;--surface-y:0%;--metal-edge:#b6b8b2;--engraving-color:#454a43;--engraving-light:#ffffff66;filter:drop-shadow(4px 25px 25px #0008)}
.card-face{background-image:none;box-shadow:inset 0 .7px 0 #ffffff66,inset 0 -.8px .4px #0006,0 1px 0 #62665c,0 2px 0 #2c302b;border-width:.7px}
.card-front:before{background-image:url('assets/nfc/material-atlas.webp');background-size:300% 200%;background-position:var(--surface-x) var(--surface-y);opacity:1;mix-blend-mode:normal}
.card-front .card-brush{display:none}
.card-sheen{inset:0;background:radial-gradient(ellipse at 20% 5%,#ffffff60,transparent 65%);opacity:.14;mix-blend-mode:soft-light;transform:translateX(calc(var(--sheen-x,0%) * .3))}
.card-front:after{box-shadow:inset 0 0 3px #00000013;inset:0}
.engraving{filter:drop-shadow(0 .45px .2px var(--engraving-light)) drop-shadow(0 -.35px .15px #0004)}
.engraving-rule{opacity:.25}.card-person{font-weight:400;letter-spacing:.11em}.card-role{opacity:.7;letter-spacing:.1em}
.metal-card[data-finish=gold]{--surface-x:0%;--surface-y:0%;--metal-base:#b29b6e;--metal-edge:#c4b692;--engraving-color:#5b4c31;--engraving-light:#eadbb266}
.metal-card[data-finish=silver]{--surface-x:50%;--surface-y:0%;--metal-base:#9a9b95;--metal-edge:#c5c7be;--engraving-color:#454a43;--engraving-light:#ffffff66}
.metal-card[data-finish=black]{--surface-x:100%;--surface-y:0%;--metal-base:#1d201d;--metal-edge:#4c5149;--engraving-color:#b7b7a9;--engraving-light:#e0e0ca30}
.metal-card[data-finish=matte-black]{--surface-x:0%;--surface-y:100%;--metal-base:#222421;--metal-edge:#3e423a;--engraving-color:#a4a89a;--engraving-light:#b5baab20}
.metal-card[data-finish=white]{--surface-x:50%;--surface-y:100%;--metal-base:#e2e2d9;--metal-edge:#ecece3;--engraving-color:#6b6d62;--engraving-light:#ffffff88}
.metal-card[data-finish=matte-white]{--surface-x:100%;--surface-y:100%;--metal-base:#d9dbd0;--metal-edge:#d9ddd0;--engraving-color:#717568;--engraving-light:#ffffff55}
.metal-card[data-finish^=matte] .card-face{background-image:none;box-shadow:inset 0 .5px 0 #ffffff20,inset 0 -.5px 0 #0004,0 1px 0 #4c5146}
.metal-card[data-finish^=matte] .card-front:before,.metal-card[data-finish=white] .card-front:before{opacity:1}
.metal-card[data-finish^=matte] .card-sheen{opacity:.025}
.metal-card[data-finish=black] .card-sheen{opacity:.08}
.card-back{background-image:url('assets/nfc/material-atlas.webp')!important;background-size:300% 200%;background-position:var(--surface-x) var(--surface-y)}
.card-back .card-brush{display:none}
.card-nfc-id{position:absolute;left:7%;top:8%;display:flex;align-items:center;gap:6px;color:var(--engraving-color);opacity:.65;filter:drop-shadow(0 .4px .2px var(--engraving-light))}
.card-nfc-id svg{width:19px;height:18px}.card-nfc-id>span{font-size:8px;line-height:1.2;letter-spacing:.15em}.card-nfc-id small{display:block;font-size:4px;letter-spacing:.12em;margin-top:3px}
.hero-copy{top:22%}.hero-copy h1{font-size:clamp(32px,4vw,58px);letter-spacing:.025em;line-height:1.6}.hero-description{margin-bottom:20px}
.hero-destinations{display:flex;gap:8px;list-style:none;padding:0;margin:0 0 19px;flex-wrap:wrap}
.hero-destinations li{font-size:10px;letter-spacing:.05em;border:1px solid #a7b6a533;border-radius:3px;padding:7px 11px;color:#c0c9bd;background:#a0b09305}
.hero-tap-flow{display:flex;align-items:center;gap:12px;color:#b5c1b0;font-size:10px;letter-spacing:.025em;line-height:1.8;margin:0}
.hero-tap-flow b{font-weight:400;color:#697965;padding:0 8px}.tap-icon{display:block;width:22px;flex-shrink:0}.tap-icon svg{display:block;width:22px;height:22px}
.swatch i{border-radius:50%;background-image:url('assets/nfc/material-atlas.webp');background-size:300% 200%;background-position:var(--surface-x) var(--surface-y)}
.swatch[data-finish=gold]{--surface-x:0%;--surface-y:0%}.swatch[data-finish=silver]{--surface-x:50%;--surface-y:0%}.swatch[data-finish=black]{--surface-x:100%;--surface-y:0%}.swatch[data-finish=matte-black]{--surface-x:0%;--surface-y:100%}.swatch[data-finish=white]{--surface-x:50%;--surface-y:100%}.swatch[data-finish=matte-white]{--surface-x:100%;--surface-y:100%}
@media(max-width:900px) and (min-width:601px){.hero-copy{top:20%}.hero-copy h1{font-size:34px}.hero-tap-flow{font-size:9px}.hero-tap-flow b{padding:0 3px}.hero-destinations li{font-size:9px;padding:6px 8px}}
@media(max-width:600px){.hero-copy{top:16%;left:8%;right:5%}.hero-copy h1{font-size:29px;margin-bottom:15px;line-height:1.65}.hero-copy .eyebrow{margin-bottom:14px}.hero-description{font-size:10px;line-height:1.9;margin-bottom:14px}.hero-destinations{gap:6px;margin-bottom:12px}.hero-destinations li{font-size:8px;padding:5px 8px}.hero-tap-flow{font-size:8px;gap:8px}.hero-tap-flow b{padding:0 4px}.tap-icon,.tap-icon svg{width:19px;height:19px}.card-nfc-id svg{width:13px;height:13px}.card-nfc-id>span{font-size:5px}.card-nfc-id small{font-size:3px;margin-top:2px}.card-nfc-id{gap:4px}}
@media(max-width:360px){.hero-copy h1{font-size:25px}.hero-copy{top:15%}.hero-description{font-size:9px}.hero-destinations li{font-size:7px}.hero-tap-flow{font-size:7px;gap:6px}.hero-tap-flow b{padding:0 3px}}
@media(max-width:600px) and (max-height:720px){.hero-copy{top:15%}.hero-copy h1{font-size:25px}.hero-copy .eyebrow{margin-bottom:10px}.hero-description{margin-bottom:10px;font-size:9px}.hero-destinations{margin-bottom:10px}.hero-tap-flow{font-size:7px}}
@media(min-width:361px) and (max-width:600px) and (min-height:721px){.hero-description{font-size:11px}.hero-destinations li{font-size:9px}.hero-tap-flow{font-size:9px}}