Returns · Sirena

caling-stroke; } .td-tag { max-width: 26em; margin: 4px auto 0; font-size: 15px; line-height: 1.45; color: var(--ay-soft); text-wrap: balance; } .td-mid { position: relative; z-index: 2; flex: 1 1 auto; min-height: 300px; margin-bottom: -58px; } .td-hero-stage { position: absolute; inset: 0; } .td-hero-stage > * { position: absolute; inset: 0; } /* the rings here are the ripples': a stage's own halo keeps only its glow, as moonlight on the water */ .td-hero-stage .st-stage[data-light="halo"]::after { display: none; } .td-hero-stage .st-stage[data-light="halo"]::before { outline: 0; } .td-staff-waves { position: absolute; left: 0; right: 0; top: 50%; height: 72px; margin-top: -36px; pointer-events: none; background: color-mix(in srgb, var(--st-accent) 62%, var(--ay-ground)); -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'480'%20height%3D'72'%20viewBox%3D'0%200%20480%2072'%3E%3Cpath%20d%3D'M0%2012%20Q120%200%20240%2012%20T480%2012'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2024%20Q120%2012%20240%2024%20T480%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2036%20Q120%2024%20240%2036%20T480%2036'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2048%20Q120%2036%20240%2048%20T480%2048'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2060%20Q120%2048%20240%2060%20T480%2060'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3C%2Fsvg%3E") 0 0 / 480px 72px repeat-x; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'480'%20height%3D'72'%20viewBox%3D'0%200%20480%2072'%3E%3Cpath%20d%3D'M0%2012%20Q120%200%20240%2012%20T480%2012'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2024%20Q120%2012%20240%2024%20T480%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2036%20Q120%2024%20240%2036%20T480%2036'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2048%20Q120%2036%20240%2048%20T480%2048'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2060%20Q120%2048%20240%2060%20T480%2060'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3C%2Fsvg%3E") 0 0 / 480px 72px repeat-x; animation: td-staff 48s linear infinite; } .st-hero[data-hero="tide-shore"] .td-rings { width: min(74vw, 46svh); } .td-sea { position: relative; z-index: 1; padding: 64px var(--g) 22px; background: var(--td-sea); } .td-sea::before { content: ""; position: absolute; left: 0; right: 0; bottom: calc(100% - 1px); height: 44px; background: var(--td-sea); -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'600'%20height%3D'44'%20viewBox%3D'0%200%20600%2044'%3E%3Cpath%20d%3D'M0%2022%20Q150%202%20300%2022%20T600%2022%20V44%20H0%20Z'%2F%3E%3C%2Fsvg%3E") 0 100% / 340px 28px repeat-x; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'600'%20height%3D'44'%20viewBox%3D'0%200%20600%2044'%3E%3Cpath%20d%3D'M0%2022%20Q150%202%20300%2022%20T600%2022%20V44%20H0%20Z'%2F%3E%3C%2Fsvg%3E") 0 100% / 340px 28px repeat-x; animation: td-tide-s 40s linear infinite; } .td-sea::after { content: ""; position: absolute; z-index: -1; left: 0; right: 0; bottom: calc(100% + 6px); height: 44px; background: color-mix(in srgb, var(--td-sea) 52%, var(--ay-ground)); -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'860'%20height%3D'44'%20viewBox%3D'0%200%20860%2044'%3E%3Cpath%20d%3D'M0%2024%20Q215%208%20430%2024%20T860%2024%20V44%20H0%20Z'%2F%3E%3C%2Fsvg%3E") 0 100% / 500px 28px repeat-x; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'860'%20height%3D'44'%20viewBox%3D'0%200%20860%2044'%3E%3Cpath%20d%3D'M0%2024%20Q215%208%20430%2024%20T860%2024%20V44%20H0%20Z'%2F%3E%3C%2Fsvg%3E") 0 100% / 500px 28px repeat-x; animation: td-tide-far-s 64s linear infinite; } .td-sea-in { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 16px; max-width: 1240px; margin: 0 auto; } .td-sea-words { grid-column: 1 / -1; min-width: 0; } .td-sea-title { display: flex; align-items: center; min-height: 44px; margin-top: 2px; } .td-sea-title .st-d { display: block; font-size: clamp(28px, 7.6vw, 40px); line-height: 1.04; } .td-sea-line { margin-top: 4px; font-family: var(--d-face); font-style: italic; font-weight: 400; font-size: 17px; line-height: 1.35; color: var(--ay-soft); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .td-sea-price { margin-top: 8px; font-size: 15px; } .td-sea-price .st-sample-price { font-size: 11.5px; } .td-sea-btn { justify-self: end; margin-top: 8px; } @media (min-width: 900px) { .st-hero[data-hero="tide-shore"] { height: calc(100svh - var(--nav-h)); min-height: 640px; max-height: 1100px; padding-top: 2svh; } .td-name-wave { width: min(100%, 1000px, calc(25svh * 1200 / 270)); } .td-name { font-size: clamp(56px, calc(8vw * var(--d-scale)), 128px); } .td-tag { font-size: 16px; } .td-mid { min-height: 0; margin-bottom: -66px; } .td-staff-waves { height: 108px; margin-top: -54px; -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'480'%20height%3D'72'%20viewBox%3D'0%200%20480%2072'%3E%3Cpath%20d%3D'M0%2012%20Q120%200%20240%2012%20T480%2012'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2024%20Q120%2012%20240%2024%20T480%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2036%20Q120%2024%20240%2036%20T480%2036'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2048%20Q120%2036%20240%2048%20T480%2048'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2060%20Q120%2048%20240%2060%20T480%2060'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3C%2Fsvg%3E") 0 0 / 720px 108px repeat-x; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'480'%20height%3D'72'%20viewBox%3D'0%200%20480%2072'%3E%3Cpath%20d%3D'M0%2012%20Q120%200%20240%2012%20T480%2012'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2024%20Q120%2012%20240%2024%20T480%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2036%20Q120%2024%20240%2036%20T480%2036'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2048%20Q120%2036%20240%2048%20T480%2048'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2060%20Q120%2048%20240%2060%20T480%2060'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3C%2Fsvg%3E") 0 0 / 720px 108px repeat-x; animation-name: td-staff-l; animation-duration: 64s; } .st-hero[data-hero="tide-shore"] .td-rings { width: min(40vw, 54svh); } .td-sea { padding: 70px var(--g) 26px; } .td-sea::before { -webkit-mask-size: 600px 44px; mask-size: 600px 44px; animation-name: td-tide; animation-duration: 70s; } .td-sea::after { bottom: calc(100% + 8px); -webkit-mask-size: 860px 44px; mask-size: 860px 44px; animation-name: td-tide-far; animation-duration: 110s; } .td-sea-in { grid-template-columns: minmax(0, 1fr) auto auto; gap: 0 28px; } .td-sea-words { grid-column: 1; } .td-sea-title .st-d { font-size: clamp(30px, 2.8vw, 46px); } .td-sea-price { margin: 0; font-size: 17px; text-align: right; } .td-sea-btn { margin: 0; } } .td-staff { --td-line: color-mix(in srgb, var(--st-accent) 46%, var(--ay-ground)); } .td-staff-head { margin-bottom: calc(var(--sec) * 0.32); text-align: center; font-size: clamp(38px, calc(9vw * var(--d-scale)), 104px); } .td-notes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px var(--st-gap); margin: 0; padding: 0; list-style: none; } .td-note-link { display: grid; justify-items: center; gap: 2px; text-align: center; color: inherit; text-decoration: none; } .td-note-pic { position: relative; display: block; width: 100%; aspect-ratio: 1; } .td-note-pic .td-pebble { width: 86%; } @media (min-width: 900px) { .td-note-pic .td-pebble { width: 80%; } } /* the staff: five lines through the middle of the row, out to both edges; opaque, so where two meet they are still one line */ .td-note-pic::before { content: ""; position: absolute; z-index: 0; left: -100vw; right: -100vw; top: 33%; height: calc(34% + 1px); pointer-events: none; background-image: linear-gradient(var(--td-line), var(--td-line)), linear-gradient(var(--td-line), var(--td-line)), linear-gradient(var(--td-line), var(--td-line)), linear-gradient(var(--td-line), var(--td-line)), linear-gradient(var(--td-line), var(--td-line)); background-size: 100% 1px; background-repeat: no-repeat; background-position: 0 0, 0 25%, 0 50%, 0 75%, 0 100%; } /* each note at its own height: a melody across the row */ .td-bob { position: absolute; inset: 0; z-index: 1; display: grid; place-items: center; translate: 0 calc(var(--b, 0) * 9%); transition: translate 600ms var(--ay-ease); } .td-note-name { max-width: 15em; margin-top: 10px; font-family: var(--d-face); font-style: var(--d-style); font-weight: var(--d-weight); font-size: clamp(19px, 4.8vw, 23px); line-height: 1.12; text-wrap: balance; } .td-note-price { font-size: 14px; } .td-note-price .st-sample-price { font-size: 11px; color: var(--ay-soft); } @media (hover: hover) { .td-note-link:hover .td-bob { translate: 0 calc(var(--b, 0) * 9% - 5%); } .td-note-link:hover .td-note-name { color: var(--st-accent); } } @media (min-width: 900px) { .td-notes { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px var(--st-gap); } .td-note-name { font-size: 24px; } } @media (min-width: 1200px) { .td-notes { grid-template-columns: repeat(var(--st-grid, 4), minmax(0, 1fr)); } } .st-sec.td-swell { position: relative; content-visibility: visible; margin: calc(var(--sec) * 0.7) 0 44px; padding: calc(var(--sec) * 0.35) var(--g) calc(var(--sec) * 0.5); background: var(--td-sea); } .td-swell::before, .td-swell::after { content: ""; position: absolute; left: 0; right: 0; height: 44px; background: var(--td-sea); pointer-events: none; } .td-swell::before { bottom: calc(100% - 1px); -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'600'%20height%3D'44'%20viewBox%3D'0%200%20600%2044'%3E%3Cpath%20d%3D'M0%2022%20Q150%202%20300%2022%20T600%2022%20V44%20H0%20Z'%2F%3E%3C%2Fsvg%3E") 0 100% / 340px 28px repeat-x; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'600'%20height%3D'44'%20viewBox%3D'0%200%20600%2044'%3E%3Cpath%20d%3D'M0%2022%20Q150%202%20300%2022%20T600%2022%20V44%20H0%20Z'%2F%3E%3C%2Fsvg%3E") 0 100% / 340px 28px repeat-x; animation: td-tide-s 46s linear infinite; } .td-swell::after { top: calc(100% - 1px); -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'600'%20height%3D'44'%20viewBox%3D'0%200%20600%2044'%3E%3Cpath%20d%3D'M0%2022%20Q150%202%20300%2022%20T600%2022%20V0%20H0%20Z'%2F%3E%3C%2Fsvg%3E") -85px 0 / 340px 28px repeat-x; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'600'%20height%3D'44'%20viewBox%3D'0%200%20600%2044'%3E%3Cpath%20d%3D'M0%2022%20Q150%202%20300%2022%20T600%2022%20V0%20H0%20Z'%2F%3E%3C%2Fsvg%3E") -85px 0 / 340px 28px repeat-x; } .td-swell-in { display: grid; gap: 14px; max-width: 1180px; margin: 0 auto; } .td-swell-pic { position: relative; display: grid; place-items: center; width: min(84vw, 520px); aspect-ratio: 1; margin: 0 auto; } .td-swell-pic .td-rings { width: 100%; } .td-swell-pic .td-pebble { width: 76%; } .td-swell-line { margin-top: 10px; font-family: var(--d-face); font-style: italic; font-weight: 300; font-size: clamp(28px, 7.4vw, 56px); line-height: 1.14; letter-spacing: -0.01em; color: var(--ay-ink); text-wrap: balance; } .td-swell-name { margin-top: 16px; font-size: clamp(22px, 5.6vw, 30px); line-height: 1.1; } .td-swell-name a { display: inline-flex; align-items: center; min-height: 44px; color: inherit; } .td-swell-price { margin-top: 6px; font-size: 15px; } .td-swell-price .st-sample-price { font-size: 11.5px; } .td-swell-acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; } .td-swell-ask { border-color: color-mix(in srgb, var(--ay-ink) 30%, transparent); } @media (hover: hover) { .td-swell-pic:hover .td-pebble { scale: 1.03; } .td-pebble { transition: scale 500ms var(--ay-ease); } } @media (min-width: 900px) { .st-sec.td-swell { padding-top: calc(var(--sec) * 0.3); padding-bottom: calc(var(--sec) * 0.4); } .td-swell::before { -webkit-mask-size: 600px 44px; mask-size: 600px 44px; animation-name: td-tide; animation-duration: 80s; } .td-swell::after { -webkit-mask-size: 600px 44px; mask-size: 600px 44px; -webkit-mask-position: -150px 0; mask-position: -150px 0; } .td-swell-in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(32px, 6vw, 96px); } .td-swell[data-i="1"] .td-swell-pic { order: 1; } .td-swell-pic { width: min(100%, 540px, 64svh); } } .st-sec.td-song { --td-gold: color-mix(in srgb, var(--st-accent) 62%, var(--st-on-panel)); position: relative; content-visibility: visible; margin: calc(var(--sec) * 0.7) 0 44px; padding: calc(var(--sec) * 0.4) var(--g) calc(var(--sec) * 0.6); background: var(--st-panel); color: var(--st-on-panel); } .td-song::before, .td-song::after { content: ""; position: absolute; left: 0; right: 0; height: 44px; background: var(--st-panel); pointer-events: none; } .td-song::before { bottom: calc(100% - 1px); -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'600'%20height%3D'44'%20viewBox%3D'0%200%20600%2044'%3E%3Cpath%20d%3D'M0%2022%20Q150%202%20300%2022%20T600%2022%20V44%20H0%20Z'%2F%3E%3C%2Fsvg%3E") 0 100% / 340px 28px repeat-x; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'600'%20height%3D'44'%20viewBox%3D'0%200%20600%2044'%3E%3Cpath%20d%3D'M0%2022%20Q150%202%20300%2022%20T600%2022%20V44%20H0%20Z'%2F%3E%3C%2Fsvg%3E") 0 100% / 340px 28px repeat-x; animation: td-tide-s 52s linear infinite reverse; } .td-song::after { top: calc(100% - 1px); -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'600'%20height%3D'44'%20viewBox%3D'0%200%20600%2044'%3E%3Cpath%20d%3D'M0%2022%20Q150%202%20300%2022%20T600%2022%20V0%20H0%20Z'%2F%3E%3C%2Fsvg%3E") 0 0 / 340px 28px repeat-x; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'600'%20height%3D'44'%20viewBox%3D'0%200%20600%2044'%3E%3Cpath%20d%3D'M0%2022%20Q150%202%20300%2022%20T600%2022%20V0%20H0%20Z'%2F%3E%3C%2Fsvg%3E") 0 0 / 340px 28px repeat-x; } .td-song-in { max-width: 1000px; margin: 0 auto; } .td-song-staff { display: block; height: 72px; margin: 0 calc(50% - 50vw); background: var(--td-gold); opacity: 0.85; -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'480'%20height%3D'72'%20viewBox%3D'0%200%20480%2072'%3E%3Cpath%20d%3D'M0%2012%20Q120%200%20240%2012%20T480%2012'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2024%20Q120%2012%20240%2024%20T480%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2036%20Q120%2024%20240%2036%20T480%2036'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2048%20Q120%2036%20240%2048%20T480%2048'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2060%20Q120%2048%20240%2060%20T480%2060'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3C%2Fsvg%3E") 0 50% / 480px 72px repeat-x; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'480'%20height%3D'72'%20viewBox%3D'0%200%20480%2072'%3E%3Cpath%20d%3D'M0%2012%20Q120%200%20240%2012%20T480%2012'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2024%20Q120%2012%20240%2024%20T480%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2036%20Q120%2024%20240%2036%20T480%2036'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2048%20Q120%2036%20240%2048%20T480%2048'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2060%20Q120%2048%20240%2060%20T480%2060'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3C%2Fsvg%3E") 0 50% / 480px 72px repeat-x; animation: td-staff 60s linear infinite; } .td-song-head { position: relative; max-width: 14em; margin: -58px auto 0; padding: 0 0.3em; text-align: center; font-size: clamp(36px, calc(8.4vw * var(--d-scale)), 96px); line-height: 1.02; color: inherit; text-shadow: 0 0 18px var(--st-panel), 0 0 6px var(--st-panel); } .td-verses { display: grid; gap: 26px; margin-top: 34px; } .td-verse { max-width: 34em; font-size: calc(var(--t-size) + 1px); line-height: 1.75; } .td-verse[data-first] { max-width: 22em; margin: 0 auto 6px; text-align: center; font-family: var(--d-face); font-style: italic; font-weight: 300; font-size: clamp(24px, 5.6vw, 38px); line-height: 1.3; text-wrap: pretty; } /* a breath between verses: one small wave of gold */ .td-verse + .td-verse::before { content: ""; display: block; width: 72px; height: 16px; margin-bottom: 18px; background: var(--td-gold); -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'72'%20height%3D'16'%20viewBox%3D'0%200%2072%2016'%3E%3Cpath%20d%3D'M2%208%20Q10%201%2019%208%20T36%208%20T53%208%20T70%208'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.6'%20stroke-linecap%3D'round'%2F%3E%3C%2Fsvg%3E") 0 0 / 72px 16px no-repeat; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'72'%20height%3D'16'%20viewBox%3D'0%200%2072%2016'%3E%3Cpath%20d%3D'M2%208%20Q10%201%2019%208%20T36%208%20T53%208%20T70%208'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.6'%20stroke-linecap%3D'round'%2F%3E%3C%2Fsvg%3E") 0 0 / 72px 16px no-repeat; } .td-verse[data-first] + .td-verse::before { margin-top: 4px; } .td-verse[data-cap]::first-letter { float: left; margin: 0.06em 0.1em 0 0; font-family: var(--d-face); font-style: italic; font-size: 3.6em; line-height: 0.8; color: var(--td-gold); } @media (min-width: 900px) { .td-song::before { -webkit-mask-size: 600px 44px; mask-size: 600px 44px; animation-name: td-tide; animation-duration: 90s; } .td-song::after { -webkit-mask-size: 600px 44px; mask-size: 600px 44px; } .td-song-staff { height: 108px; -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'480'%20height%3D'72'%20viewBox%3D'0%200%20480%2072'%3E%3Cpath%20d%3D'M0%2012%20Q120%200%20240%2012%20T480%2012'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2024%20Q120%2012%20240%2024%20T480%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2036%20Q120%2024%20240%2036%20T480%2036'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2048%20Q120%2036%20240%2048%20T480%2048'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2060%20Q120%2048%20240%2060%20T480%2060'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3C%2Fsvg%3E") 0 50% / 720px 108px repeat-x; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'480'%20height%3D'72'%20viewBox%3D'0%200%20480%2072'%3E%3Cpath%20d%3D'M0%2012%20Q120%200%20240%2012%20T480%2012'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2024%20Q120%2012%20240%2024%20T480%2024'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2036%20Q120%2024%20240%2036%20T480%2036'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2048%20Q120%2036%20240%2048%20T480%2048'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3Cpath%20d%3D'M0%2060%20Q120%2048%20240%2060%20T480%2060'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1.3'%2F%3E%3C%2Fsvg%3E") 0 50% / 720px 108px repeat-x; animation-name: td-staff-l; animation-duration: 80s; } .td-song-head { margin-top: -86px; } .td-verses { gap: 34px; margin-top: 52px; } /* the verses drift, as lines of a song do across a page */ .td-verse:not([data-first])[data-i="1"] { margin-left: 4%; } .td-verse:not([data-first])[data-i="2"] { margin-left: 22%; } .td-verse:not([data-first])[data-i="0"] { margin-left: 12%; } } .st-sec[data-faq="rules"] .st-faq-n { display: none; } @media (min-width: 900px) { .st-sec[data-faq="rules"] { display: grid; grid-template-columns: 1fr 2fr; gap: 24px; } } .st-sec[data-contact="colophon"] { display: flex; flex-wrap: wrap; gap: 6px 32px; justify-content: space-between; color: var(--ay-soft); font-size: 15px; } .st { --td-sea: #D3E6DE; } .td-hide { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } /* rings spreading from a piece, as from a note sung or a drop on still water */ .td-rings { position: absolute; left: 50%; top: 50%; aspect-ratio: 1; translate: -50% -50%; pointer-events: none; } .td-rings i { position: absolute; inset: 0; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--st-accent) 60%, transparent); opacity: 0; animation: td-ripple 10s cubic-bezier(0.2, 0.6, 0.3, 1) infinite; } .td-rings i:nth-child(2) { animation-delay: -3.3s; } .td-rings i:nth-child(3) { animation-delay: -6.6s; } @keyframes td-ripple { 0% { transform: scale(0.5); opacity: 0; } 18% { opacity: 0.9; } 100% { transform: scale(1.22); opacity: 0; } } /* a pebble of sea glass: frosted, worn round and not quite round, lit from above; the piece floats in it */ .td-pebble { position: relative; display: block; width: 80%; aspect-ratio: 1; overflow: hidden; border-radius: 50% 50% 47% 53% / 55% 46% 54% 45%; background: radial-gradient(115% 115% at 30% 22%, color-mix(in srgb, #fff 58%, var(--td-sea)) 0%, var(--td-sea) 48%, color-mix(in srgb, var(--ay-ink) 9%, var(--td-sea)) 100%); box-shadow: inset 0 -8px 18px color-mix(in srgb, var(--ay-ink) 9%, transparent), inset 0 5px 12px color-mix(in srgb, #fff 55%, transparent), 0 16px 26px -18px color-mix(in srgb, var(--ay-ink) 55%, transparent); animation: td-drift 7.5s ease-in-out infinite alternate; animation-delay: var(--d, 0s); } .td-pebble[data-shape="1"] { border-radius: 45% 55% 52% 48% / 50% 53% 47% 50%; } .td-pebble[data-shape="2"] { border-radius: 53% 47% 56% 44% / 46% 55% 45% 54%; } .td-pebble[data-shape="3"] { border-radius: 48% 52% 44% 56% / 56% 47% 53% 44%; } .td-pebble .st-poster { width: 100%; height: 100%; } .td-pebble[data-free] .st-poster { box-sizing: border-box; padding: 11%; background: none !important; } .td-pebble[data-free] .st-poster img { object-fit: contain; filter: drop-shadow(0 6px 8px color-mix(in srgb, var(--ay-ink) 18%, transparent)); } .td-pebble .st-no-photo { width: 100%; height: 100%; background: none; font-style: var(--d-style); } @keyframes td-drift { from { transform: translateY(-3%) rotate(-1.4deg); } to { transform: translateY(3%) rotate(1.4deg); } } @media (prefers-reduced-motion: reduce) { .td-pebble, .td-rings i, .td-staff-waves, .td-song-staff, .td-sea::before, .td-sea::after, .td-swell::before, .td-song::before, .st-pp[data-page="tide-float"] .st-p-stage::before { animation: none !important; } .td-rings i { opacity: 0.5; } .td-rings i:nth-child(1) { transform: scale(0.72); } .td-rings i:nth-child(2) { transform: scale(0.92); opacity: 0.32; } .td-rings i:nth-child(3) { transform: scale(1.12); opacity: 0.18; } } @keyframes td-tide { to { -webkit-mask-position-x: -600px; mask-position-x: -600px; } } @keyframes td-tide-s { to { -webkit-mask-position-x: -340px; mask-position-x: -340px; } } @keyframes td-tide-far-s { to { -webkit-mask-position-x: 500px; mask-position-x: 500px; } } @keyframes td-tide-far { to { -webkit-mask-position-x: 860px; mask-position-x: 860px; } } @keyframes td-staff { to { -webkit-mask-position-x: -480px; mask-position-x: -480px; } } @keyframes td-staff-l { to { -webkit-mask-position-x: -720px; mask-position-x: -720px; } } .st[data-template="tide"] .st-nav[data-nav="centre"] { background: color-mix(in srgb, var(--ay-ground) 90%, transparent); border-bottom: 0; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); } .st[data-template="tide"] .st-nav[data-nav="centre"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -5px; height: 10px; pointer-events: none; background: color-mix(in srgb, var(--st-accent) 55%, var(--ay-ground)); -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'240'%20height%3D'10'%20viewBox%3D'0%200%20240%2010'%3E%3Cpath%20d%3D'M0%205%20Q60%200.5999999999999996%20120%205%20T240%205'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1'%2F%3E%3C%2Fsvg%3E") 0 0 / 240px 10px repeat-x; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'240'%20height%3D'10'%20viewBox%3D'0%200%20240%2010'%3E%3Cpath%20d%3D'M0%205%20Q60%200.5999999999999996%20120%205%20T240%205'%20fill%3D'none'%20stroke%3D'black'%20stroke-width%3D'1'%2F%3E%3C%2Fsvg%3E") 0 0 / 240px 10px repeat-x; } .st[data-template="tide"] .st-nav .st-brand:not(.st-brand-mark) { font-family: var(--d-face); font-style: italic; font-weight: 400; font-size: 23px; letter-spacing: -0.005em; text-transform: none; } 4:[["$","style",null,{"dangerouslySetInnerHTML":{"__html":"$20"}}],"$L21"] 21:["$","main",null,{"className":"ayin ay st","data-template":"tide","data-away":"","children":["$","div",null,{"className":"st-section st-privacy","children":[["$","p",null,{"children":["$","a",null,{"href":"/","children":"Sirena"}]}],["$","h1",null,{"children":"Returns"}],[["$","p","A piece made to order can be returned unworn within 14 days of arriving, in its pouch. A band made in your size can be remade in another size once.",{"style":{"whiteSpace":"pre-line"},"children":"A piece made to order can be returned unworn within 14 days of arriving, in its pouch. A band made in your size can be remade in another size once."}],["$","p","This is a sample store, so nothing is sold from it.",{"style":{"whiteSpace":"pre-line"},"children":"This is a sample store, so nothing is sold from it."}]],false,["$","p",null,{"style":{"marginTop":28},"children":["",["$","a","shipping",{"href":"/shipping","children":"Shipping"}]," · ",["$","a","about",{"href":"/about","children":"About"}]," · ",["$","a","sizing",{"href":"/sizing","children":"Sizing"}]," · ",["$","a","care",{"href":"/care","children":"Care"}]," · ",["$","a","contact",{"href":"/contact","children":"Contact"}]," · ",["$","a","privacy",{"href":"/privacy","children":"Privacy"}]]}],["$","p",null,{"className":"st-l st-ribbon","children":["$","a",null,{"href":"https://objectifly.com/start?template=tide","children":["A store template by Objectifly",["$","span",null,{"aria-hidden":"true","children":" · "}],["$","span",null,{"className":"st-ribbon-go","children":["Start with ","Tide"]}]]}]}]]}]}] 8:[null,[["$","meta","0",{"name":"viewport","content":"width=device-width, viewport-fit=cover, initial-scale=1"}],["$","meta","1",{"name":"theme-color","content":"#E8F1ED"}],["$","meta","2",{"name":"color-scheme","content":"light"}]]] 23:"StreamedIconsInsertion" 24:I["f471c8eb95d7",[],"$23",1] 22:T75e,Returns · Sirena1:[["$","div",null,{"hidden":true,"suppressHydrationWarning":true,"dangerouslySetInnerHTML":{"__html":"$22"}}],["$","$L24",null,{"metadataKey":"vi95f8dc289fcdcdc2"}]] 2:null