/* Suspended, drilled glass cards. Rope and body share the same fixed pivot. */
.hero-note.pendant{--rope-length:280px;--swing:0deg;--twist:0deg;--pitch:0deg;top:78px!important;height:calc(var(--rope-length) + 340px);padding:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;transform-origin:50% 0;transform:perspective(1300px) rotateZ(var(--swing));pointer-events:none;transition:none;transform-style:preserve-3d;z-index:7}
.pendant-rope{position:absolute;left:calc(50% - 10px);top:0;width:20px;height:var(--rope-length);overflow:visible;pointer-events:none;filter:drop-shadow(2px 2px 1px rgba(41,47,41,.13))}
.pendant-anchor{position:absolute;top:-2px;left:calc(50% - 2px);width:4px;height:4px;background:#545a52;border-radius:50%;box-shadow:inset 0 1px 1px #a9afa2}
.pendant-card{position:absolute;left:0;top:calc(var(--rope-length) - 18px);width:100%;transform-origin:50% 18px;transform-style:preserve-3d;transform:rotateY(var(--twist)) rotateX(var(--pitch));pointer-events:auto;touch-action:pan-y;cursor:grab;outline-offset:8px;border-radius:13px}
.pendant-card:active{cursor:grabbing}
.pendant-card:focus-visible{outline:1px solid #474f47}
.pendant-face{width:100%;border-radius:13px;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform-style:preserve-3d}
.pendant-front{position:relative;transform:translateZ(3px)}
.pendant-back{position:absolute;inset:0;transform:rotateY(180deg) translateZ(3px);pointer-events:none}
.pendant-glass,.pendant-laminate{position:absolute;inset:0;border-radius:13px;pointer-events:none;mask-image:radial-gradient(circle 7px at 50% 18px,transparent 96%,#000 100%);-webkit-mask-image:radial-gradient(circle 7px at 50% 18px,transparent 96%,#000 100%)}
.pendant-glass{background:linear-gradient(124deg,rgba(255,255,255,.64),rgba(235,241,234,.23) 48%,rgba(253,255,250,.42));border:1px solid rgba(249,255,244,.94);backdrop-filter:blur(19px) saturate(.58);-webkit-backdrop-filter:blur(19px) saturate(.58);box-shadow:inset 1px 1px 1px rgba(255,255,255,.95),inset -1px -1px 2px rgba(71,88,71,.32),2px 5px 2px rgba(66,78,65,.1),10px 20px 28px -15px rgba(39,47,38,.23)}
.pendant-back .pendant-glass{background:linear-gradient(136deg,rgba(255,255,255,.69),rgba(225,233,224,.38) 55%,rgba(255,255,255,.56))}
.pendant-laminate{border:1px solid rgba(115,136,112,.35);background:rgba(207,220,203,.1);box-shadow:1px 1px 0 rgba(85,104,82,.15)}
.layer-1{transform:translateZ(-2px)}.layer-2{transform:translateZ(-.7px)}.layer-3{transform:translateZ(.7px)}.layer-4{transform:translateZ(2px)}
.pendant-copy{position:relative;padding:50px 24px 26px;transform:translateZ(.2px)}
.pendant-eyelet{position:absolute;left:calc(50% - 8px);top:10px;width:16px;height:16px;border-radius:50%;border:1px solid rgba(255,255,255,.9);box-shadow:inset 1px 1px 1px rgba(53,68,51,.6),1px 1px 1px rgba(70,87,68,.3);transform:translateZ(3.5px);pointer-events:none}
.pendant-knot{position:absolute;left:calc(50% - 16px);top:-1px;width:32px;height:48px;transform:translateZ(5px);pointer-events:none;filter:drop-shadow(1px 2px .7px rgba(35,40,34,.2))}
.pendant .note-mark{margin-bottom:19px}.pendant .note-eyebrow{line-height:1.5}.pendant .note-body{max-width:none}
.pendant .note-link{position:relative;z-index:2}
.pendant-card[data-back=true] .pendant-front{pointer-events:none}
@media(min-width:1400px){.pendant-copy{padding:52px 26px 28px}}
@media(max-width:1100px){.pendant-copy{padding:43px 17px 21px}.pendant .note-mark{margin-bottom:14px}}
@media(min-width:701px) and (max-width:900px){.pendant-copy{padding:40px 15px 19px}}
@media(max-width:700px){.hero-note.pendant{top:70px!important}.pendant-copy{padding:36px 12px 17px}.pendant-face,.pendant-glass,.pendant-laminate,.pendant-card{border-radius:10px}.pendant .note-eyebrow{font-size:8px}.pendant .note-body{font-size:10px}.pendant-knot{width:26px;height:39px;left:calc(50% - 13px);top:2px}.pendant-glass{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}}
@media(prefers-reduced-motion:reduce){.hero-note.pendant,.pendant-card{will-change:auto}}
@supports not (backdrop-filter:blur(1px)){.pendant-glass{background:rgba(245,248,242,.92)}}
