/* Fullscreen mineral layers. CSS owns geometry; the controller reads it.
   The original CollectionsCta reveal algorithm is preserved in motion/layers.js. */
.soul-layers{position:relative;z-index:4;background:var(--quartz-copper);color:var(--light)}
.soul-layers__stage{position:relative}
.soul-layer{--layer-shade:39 21 16;--shade-opacity:.16;--layer-bleed:max(10svh,190px);position:relative;min-height:100svh;overflow:clip;isolation:isolate;background:var(--quartz-copper)}
.soul-layer--ametista{--layer-shade:35 21 40;background:var(--mauve)}
.soul-layer--agata{--layer-shade:15 29 48;background:var(--agate)}
.soul-layer__media{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.soul-layer__image{position:absolute;inset:calc(var(--layer-bleed)*-1) 0;transform-origin:50% 50%}
.soul-layer__image img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:100% 50%}
.soul-layer__media::after{content:'';position:absolute;inset:0;background:rgb(var(--layer-shade) / var(--shade-opacity));pointer-events:none}
.soul-layer__content{position:relative;z-index:2;display:flex;align-items:center;max-width:1600px;min-height:100svh;margin:0 auto;padding:90px var(--gutter);pointer-events:none}
.soul-layer__copy{width:47%;max-width:620px;margin-left:auto}
.soul-layer__eyebrow{color:#f1e7dd;margin-bottom:26px;font-size:10px;letter-spacing:.14em}
.soul-layer__title{font-family:var(--font-display);font-size:clamp(54px,5.1vw,88px);font-weight:500;line-height:1.03;letter-spacing:-.035em;text-wrap:balance;margin:0 0 29px}
.soul-layer__description{max-width:470px;font-size:17px;line-height:1.85;color:#f0ebe5;text-wrap:pretty}
.soul-layer__action{margin-top:34px;pointer-events:auto}
.soul-layer__action .crystal-button__surface{background:rgb(31 42 61 / .16)}
.soul-layer__action .crystal-button:hover .crystal-button__surface{background:rgb(31 42 61 / .30)}
.soul-layer__action .crystal-button:focus-visible .crystal-button__surface{background:rgb(31 42 61 / .56)}
.soul-layer .split-word{font:inherit;line-height:inherit;display:inline-block}
.soul-layers.is-layered{height:500svh}
.is-layered .soul-layers__stage{position:sticky;top:0;height:101svh;overflow:hidden}
.is-layered .soul-layer{isolation:auto;background:transparent;position:absolute;inset:0;width:100%;height:100%;min-height:0;overflow:visible;pointer-events:none}
.is-layered .soul-layer:first-child{position:relative}
.is-layered .soul-layer__media{z-index:1;clip-path:inset(var(--reveal,100%) 0 0 0);will-change:clip-path}
.is-layered .soul-layer:first-child .soul-layer__media{--reveal:0%}
.is-layered .soul-layer__image{will-change:transform}
.is-layered .soul-layer__content{position:absolute;inset:0;width:100%;height:100%;min-height:0;will-change:opacity}
.is-layered .soul-layer:not(.is-active) .soul-layer__action{pointer-events:none}
@media(max-width:1100px){.soul-layer__copy{width:49%}.soul-layer__title{font-size:clamp(48px,5.5vw,68px)}.soul-layer__description{font-size:16px}}
@media(max-width:767px){
  .soul-layer{--shade-opacity:.48}
  .soul-layer__image img{object-position:33% 50%}
  .soul-layer__content{align-items:flex-end;padding:76px var(--gutter) 12svh}
  .soul-layer__copy{width:100%;max-width:540px;margin:0}
  .soul-layer__eyebrow{font-size:9px;margin-bottom:24px;letter-spacing:.11em}
  .soul-layer__title{font-size:clamp(38px,11.2vw,66px);line-height:1.05;margin-bottom:24px;text-wrap:balance}
  .soul-layer__description{font-size:15px;line-height:1.85;max-width:430px}
  .soul-layer__action{margin-top:29px}
}
@media(max-height:600px) and (min-width:768px){.soul-layer__content{padding-top:42px;padding-bottom:42px}.soul-layer__eyebrow{margin-bottom:15px}.soul-layer__title{font-size:clamp(42px,4.3vw,64px);margin-bottom:18px}.soul-layer__description{font-size:15px;line-height:1.65}.soul-layer__action{margin-top:20px}}
@media(max-height:540px) and (max-width:767px){.soul-layer__content{padding-top:30px;padding-bottom:36px}.soul-layer__title{font-size:34px}.soul-layer__eyebrow{margin-bottom:14px}.soul-layer__description{font-size:14px;line-height:1.65}}
@media(prefers-reduced-motion:reduce){.soul-layer__image{will-change:auto}.soul-layer__media{will-change:auto}}

/* A stable large viewport covers the phone even when browser chrome retracts.
   Copy stays in the safe small viewport; the end is the actual sticky travel. */
@media(max-width:950px){
  .soul-layers.is-layered{height:500lvh}
  .is-layered .soul-layers__stage{height:calc(100lvh + 1px)}
  .is-layered .soul-layer__content{height:100svh;max-height:100%}
}
