.mel-materials-page{--mel-directory-navy: #0c243e;--mel-directory-sage: #58776f;--mel-directory-mist: #dce8e8;--mel-directory-paper: #f4f7f6;--mel-directory-line: #d6dfdd;--mel-directory-gold: #a8792d;color:var(--mel-directory-navy);background:var(--mel-directory-paper)}.mel-materials-shell{width:min(100% - 64px,1500px);margin-inline:auto}.mel-materials-hero{min-height:570px;padding-top:clamp(72px,7vw,112px);position:relative;overflow:hidden;background-color:#f5f8f8;background-image:linear-gradient(90deg,#f7f9f9fc,#f7f9f9f7 38%,#f7f9f9b0 59%,#f7f9f914),var(--mel-materials-hero-desktop);background-position:center,center;background-repeat:no-repeat;background-size:cover;border-bottom:1px solid rgba(12,36,62,.14)}.mel-materials-hero:before{width:280px;height:2px;position:absolute;top:clamp(42px,4vw,66px);left:0;content:"";background:linear-gradient(90deg,var(--mel-directory-sage),rgba(88,119,111,0));pointer-events:none}.mel-materials-hero__grid{min-height:390px;padding-bottom:52px;position:relative;z-index:1;display:flex;align-items:flex-end}.mel-materials-hero__copy{width:min(100%,760px)}.mel-materials-eyebrow,.mel-materials-group__header>div>p,.mel-materials-record__label{margin:0;color:var(--mel-directory-sage);font-size:11px;font-weight:700;letter-spacing:.2em;line-height:1.4;text-transform:uppercase}.mel-materials-hero h1{max-width:760px;margin:18px 0 20px;font-family:var(--font-heading-family);font-size:clamp(52px,5.4vw,82px);font-weight:400;letter-spacing:-.045em;line-height:.98;text-wrap:balance}.mel-materials-intro{max-width:650px;margin:0;color:#465767;font-size:clamp(16px,1.15vw,19px);line-height:1.65}.mel-materials-record{width:min(100%,600px);margin-top:30px;padding:14px 18px;display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:18px;color:var(--mel-directory-navy);background:#ffffffb8;border:1px solid rgba(88,119,111,.28);border-radius:999px;box-shadow:0 12px 34px #0c243e12;-webkit-backdrop-filter:blur(16px) saturate(1.12);backdrop-filter:blur(16px) saturate(1.12)}.mel-materials-record__label{max-width:80px;padding-right:16px;border-right:1px solid rgba(12,36,62,.15)}.mel-materials-record__total{display:flex;align-items:baseline;gap:8px}.mel-materials-record__total strong{font-family:var(--font-heading-family);font-size:40px;font-weight:400;line-height:.8}.mel-materials-record__total small{color:#52626f;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}.mel-materials-record__breakdown{display:flex;justify-content:flex-end;gap:18px;color:#52626f;font-size:11px;letter-spacing:.04em;text-transform:uppercase}.mel-materials-record__breakdown span{white-space:nowrap}.mel-materials-record__breakdown strong{margin-right:3px;color:var(--mel-directory-gold)}.mel-materials-jump{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,1fr);background:#fffc;border:1px solid rgba(12,36,62,.14);border-bottom:0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.mel-materials-jump a{min-height:68px;padding:0 26px;display:flex;align-items:center;justify-content:space-between;color:var(--mel-directory-navy);font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;transition:background-color .18s ease,color .18s ease}.mel-materials-jump a+a{border-left:1px solid rgba(12,36,62,.14)}.mel-materials-jump a:hover,.mel-materials-jump a:focus-visible{color:#fff;background:var(--mel-directory-navy);outline:0}.mel-materials-jump span{color:var(--mel-directory-gold)}.mel-materials-catalog{padding-block:clamp(68px,7vw,108px)}.mel-materials-group{scroll-margin-top:24px}.mel-materials-group+.mel-materials-group{margin-top:clamp(76px,8vw,124px)}.mel-materials-group__header{margin-bottom:30px;padding-bottom:20px;display:flex;align-items:end;justify-content:space-between;gap:40px;border-bottom:1px solid var(--mel-directory-navy)}.mel-materials-group__header h2{margin:7px 0 0;font-family:var(--font-heading-family);font-size:clamp(34px,3vw,48px);font-weight:400;letter-spacing:-.025em;line-height:1}.mel-materials-group__header>p{max-width:420px;margin:0;color:#596977;font-size:14px;line-height:1.55;text-align:right}.mel-materials-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}.mel-material-card{min-width:0;min-height:128px;padding:20px;position:relative;display:grid;grid-template-columns:80px minmax(0,1fr);align-items:center;gap:18px;color:var(--mel-directory-navy);background:#fff;border:1px solid #dbe3e1;border-radius:8px;box-shadow:0 1px #0c243e05;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}.mel-material-card:after{width:24px;height:24px;position:absolute;right:14px;bottom:12px;content:"\2197";display:grid;place-items:center;color:var(--mel-directory-sage);font-size:13px;border:1px solid rgba(88,119,111,.28);border-radius:50%;opacity:0;transform:translate(-3px,3px);transition:opacity .18s ease,transform .18s ease}.mel-material-card:hover,.mel-material-card:focus-visible{z-index:1;border-color:#58776fb3;box-shadow:0 16px 38px #0c243e17;outline:0;transform:translateY(-2px)}.mel-material-card:hover:after,.mel-material-card:focus-visible:after{opacity:1;transform:translate(0)}.mel-material-directory-thumb{width:80px;height:80px;overflow:visible;display:flex;align-items:center;justify-content:center;background:#fff;border:0;border-radius:0}.mel-materials-page .mel-material-menu-thumb--v4,.mel-materials-page .mel-material-directory-thumb{background:#fff!important;border:0!important;border-radius:0!important;box-shadow:none!important}.mel-material-directory-thumb img,.mel-material-directory-thumb>.mel-gem{width:100%;height:100%;display:block;object-fit:contain;object-position:center;background:#fff;border:0;border-radius:0}.mel-material-directory-thumb>.mel-gem{width:66px;height:66px;flex:0 0 66px;background-color:#fff;background-image:var(--mel-gem-sprite);background-repeat:no-repeat;background-size:500% 400%;border-radius:0}.mel-material-directory-thumb>.mel-gem--mood{background-position:25% 0}.mel-material-directory-thumb>.mel-gem--opal{background-position:50% 0}.mel-material-directory-thumb>.mel-gem--ruby{background-position:75% 0}.mel-material-directory-thumb>.mel-gem--amazonite{background-position:0 33.333%}.mel-material-directory-thumb>.mel-gem--peridot{background-position:25% 33.333%}.mel-material-directory-thumb>.mel-gem--sapphire{background-position:50% 33.333%}.mel-material-directory-thumb>.mel-gem--diamond{background-position:100% 33.333%}.mel-material-directory-thumb>.mel-gem--pearl{background-position:75% 66.667%}.mel-material-directory-thumb>.mel-gem--green-onyx{background-position:0 100%}.mel-material-directory-thumb>.mel-gem--labradorite{background-position:25% 100%}.mel-material-directory-thumb>.mel-gem--pink-quartz{background-position:50% 100%}.mel-material-card__copy{min-width:0;display:block}.mel-material-card__copy strong{display:block;font-size:13px;font-weight:700;letter-spacing:.06em;line-height:1.35;text-transform:uppercase}.mel-material-card__copy>span{margin-top:8px;display:flex;align-items:center;gap:5px;color:#68746f;font-size:11px;line-height:1.3}.mel-material-card:hover .mel-material-card__copy>span,.mel-material-card:focus-visible .mel-material-card__copy>span{color:var(--mel-directory-gold)}.mel-materials-back{width:max-content;margin:68px 0 0 auto;padding-bottom:5px;display:flex;gap:10px;color:var(--mel-directory-navy);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid currentColor}@media(max-width:900px){.mel-materials-shell{width:min(100% - 40px,1500px)}.mel-materials-hero{min-height:540px}.mel-materials-hero__grid{min-height:360px}.mel-materials-hero__copy{width:min(100%,650px)}.mel-materials-record{width:min(100%,570px)}.mel-materials-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mel-material-card{min-height:118px;padding:16px;grid-template-columns:70px minmax(0,1fr);gap:14px}.mel-material-directory-thumb{width:70px;height:70px}}@media(max-width:640px){.mel-materials-shell{width:min(100% - 28px,1500px)}.mel-materials-hero{min-height:610px;padding-top:46px;background-image:linear-gradient(180deg,#f7f9f9fc,#f7f9f9f0 47%,#f7f9f966 76%,#f7f9f90f),var(--mel-materials-hero-mobile);background-position:center,center bottom}.mel-materials-hero:before{width:150px;top:28px}.mel-materials-hero__grid{min-height:474px;padding-bottom:96px;align-items:flex-start}.mel-materials-hero h1{max-width:340px;margin-block:12px 16px;font-size:clamp(42px,13.5vw,58px);line-height:.98}.mel-materials-intro{max-width:345px;font-size:15px;line-height:1.55}.mel-materials-record{width:100%;margin-top:22px;padding:12px 14px;grid-template-columns:auto auto 1fr;gap:10px;border-radius:14px}.mel-materials-record__label{max-width:58px;padding-right:10px;font-size:8px;letter-spacing:.14em}.mel-materials-record__total{gap:5px}.mel-materials-record__total strong{font-size:32px}.mel-materials-record__total small{display:none}.mel-materials-record__breakdown{flex-direction:column;align-items:flex-end;gap:2px;font-size:8px;letter-spacing:.03em}.mel-materials-jump{width:100%;grid-template-columns:repeat(2,1fr);border-inline:0;border-bottom:0}.mel-materials-jump a{min-height:62px;padding-inline:14px;font-size:9px;letter-spacing:.08em}.mel-materials-catalog{padding-block:58px 74px}.mel-materials-group+.mel-materials-group{margin-top:72px}.mel-materials-group__header{margin-bottom:20px;padding-bottom:18px;display:block}.mel-materials-group__header h2{font-size:36px}.mel-materials-group__header>p{margin-top:12px;font-size:13px;text-align:left}.mel-materials-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mel-material-card{min-height:166px;padding:14px 10px 15px;display:flex;flex-direction:column;justify-content:center;gap:10px;text-align:center;border-radius:6px}.mel-material-card:after{display:none}.mel-material-directory-thumb{width:76px;height:76px;flex:0 0 76px}.mel-material-card__copy strong{min-height:27px;display:flex;align-items:center;justify-content:center;font-size:10px;letter-spacing:.045em}.mel-material-card__copy>span{margin-top:5px;justify-content:center;font-size:9px}.mel-materials-back{margin-top:52px}}@media(prefers-reduced-motion:reduce){.mel-material-card,.mel-material-card:after,.mel-materials-jump a{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/mel-materials-directory.css.map */