/* Lyriclip static site. Tokens from the identity (lyriclip-tokens.css). Dark only. Plain CSS, no build step. */
@font-face{font-family:"Jost";src:url("/fonts/jost-latin-100-900.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Heebo";src:url("/fonts/heebo-latin-100-900.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"InterML";src:url("/fonts/inter-multiscript-100-900.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Heebo";src:url("/fonts/heebo-hebrew-100-900.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
:root{
  --lc-ground:#1A1240;--lc-surface:#261C58;--lc-sunk:#120C2E;--lc-line:#40367A;--lc-line-strong:#7469B5;
  --lc-accent:#CFF51D;--lc-accent-press:#B4D90F;--lc-on-accent:#1A1240;
  --lc-violet:#7A54FF;--lc-violet-deep:#6A43F0;
  --lc-text:#DCD4FF;--lc-text-muted:#A79BEA;--lc-focus:#CFF51D;
  --font:"Jost","Heebo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r-btn:14px;--r-card:20px;--r-media:18px;--wrap:1160px;
}
:lang(he){--font:"Heebo","Jost",system-ui,-apple-system,"Segoe UI",sans-serif}
/* Jost has no Latin Extended, Vietnamese, Greek or Cyrillic: these languages use Inter (OFL) for all text */
:lang(pl),:lang(cs),:lang(hu),:lang(ro),:lang(tr),:lang(vi),:lang(el),:lang(ru),:lang(uk){--font:"InterML",system-ui,-apple-system,"Segoe UI",sans-serif}
[lang]{font-family:var(--font)}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:16px}
body{margin:0;background:var(--lc-ground);color:var(--lc-text);font-family:var(--font);font-size:1.125rem;line-height:1.6;overflow-wrap:anywhere}
img,video,svg{max-width:100%;height:auto}
h1,h2,h3{font-family:var(--font);hyphens:auto;-webkit-hyphens:auto;color:var(--lc-accent);font-weight:700;line-height:1.15;margin:0 0 .5em;letter-spacing:-.01em;text-wrap:balance}
:lang(he) h1,:lang(he) h2,:lang(he) h3{font-weight:800;letter-spacing:0;line-height:1.3}
h1{font-size:clamp(2.25rem,6.2vw,3.75rem)}
h2{font-size:clamp(1.75rem,4vw,2.4rem)}
h3{font-size:1.35rem;color:var(--lc-text)}
p{margin:0 0 1em;hyphens:auto;-webkit-hyphens:auto} ul,ol{margin:0 0 1em;padding-inline-start:1.3em} li{margin-bottom:.4em}
a{color:var(--lc-accent);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1.5px}
a:hover{color:var(--lc-text)}
:focus-visible{outline:3px solid var(--lc-focus);outline-offset:3px;border-radius:4px}
.muted{color:var(--lc-text-muted)}
.skip{position:absolute;inset-inline-start:12px;top:-100px;background:var(--lc-accent);color:var(--lc-on-accent);padding:12px 18px;border-radius:10px;font-weight:700;z-index:10;text-decoration:none}
.skip:focus{top:12px}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:20px}
section{padding-block:56px}
.narrow{max-width:760px}
/* header: not sticky, so focus is never hidden at 200% zoom */
.site-header{border-bottom:1.5px solid var(--lc-line);position:relative}
.hdr{display:flex;flex-wrap:wrap;align-items:center;gap:0 16px;padding-block:8px;position:relative}
.logo{display:inline-flex;align-items:center;min-height:44px;order:1;margin-inline-end:auto}
.logo img{display:block;width:124px;height:auto}
.hdr nav{order:2}
.hdr-tools{order:3;display:flex;align-items:center;gap:8px}
.nav{display:flex;flex-wrap:wrap;gap:0 6px;list-style:none;margin:0;padding:0}
.nav li{margin:0}
.nav a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0 12px;color:var(--lc-text);text-decoration:none;font-weight:500;border-radius:10px}
.nav a:hover{background:var(--lc-surface)}
.nav a[aria-current="page"]{color:var(--lc-accent);text-decoration:underline;text-underline-offset:6px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.langs summary,.nav-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0 14px;border-radius:10px;box-shadow:inset 0 0 0 1.5px var(--lc-line-strong);color:var(--lc-text);font:600 1rem/1 var(--font);background:transparent;cursor:pointer;list-style:none}
.langs summary::-webkit-details-marker{display:none}
.langs summary::after{content:"";margin-inline-start:8px;border:solid var(--lc-accent);border-width:0 2px 2px 0;width:7px;height:7px;transform:rotate(45deg) translateY(-2px)}
.langs[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.langs ul{position:absolute;inset-inline:20px;top:100%;z-index:20;margin:4px 0 0;padding:10px;list-style:none;background:var(--lc-surface);border:1.5px solid var(--lc-line-strong);border-radius:14px;display:grid;grid-template-columns:repeat(2,1fr);gap:0 8px}
.langs li{margin:0}
.langs li a{display:flex;align-items:center;min-height:44px;padding:0 10px;color:var(--lc-text);text-decoration:none;border-radius:8px}
.langs li a:hover{background:var(--lc-sunk)}
.langs li a[aria-current="true"],.chip-list a[aria-current="true"]{color:var(--lc-accent);font-weight:700}
.langs li a[aria-current="true"]::after,.chip-list a[aria-current="true"]::after{content:"";display:inline-block;width:5px;height:10px;margin-inline-start:.6em;border:solid var(--lc-accent);border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translateY(-2px)}
.nav-toggle{display:none}
@media (max-width:719px){
  .js .nav-toggle{display:inline-flex}
  .js .hdr nav{display:none;order:4;width:100%}
  .js .hdr nav.open{display:block}
  .js .nav{flex-direction:column}
  .js .nav a{justify-content:flex-start;width:100%}
}
@media (min-width:720px){
  .hdr{flex-wrap:nowrap}
  .logo{flex:none}
  .langs ul{inset-inline:auto 20px;width:min(560px,calc(100vw - 40px));grid-template-columns:repeat(3,1fr)}
}
@media (min-width:1200px){.langs ul{inset-inline-end:calc((100vw - var(--wrap)) / 2 + 20px)}}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:10px 26px;border:0;border-radius:var(--r-btn);background:var(--lc-accent);color:var(--lc-on-accent);font:600 1.0625rem/1.2 var(--font);text-decoration:none;cursor:pointer;text-align:center}
.btn:hover{color:var(--lc-on-accent);transform:translateY(-1px)} .btn:active{background:var(--lc-accent-press)}
.btn--ghost{background:transparent;color:var(--lc-text);box-shadow:inset 0 0 0 1.5px var(--lc-line-strong)}
.btn--ghost:hover{background:var(--lc-surface);color:var(--lc-text)}
.btn[disabled],.btn[aria-disabled="true"]{background:var(--lc-surface);color:var(--lc-text-muted);cursor:not-allowed;box-shadow:inset 0 0 0 1.5px var(--lc-line-strong);transform:none}
.cta-row{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;margin-block:24px 12px}
.status{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:2px 14px;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--lc-accent);color:var(--lc-accent);font-weight:700;font-size:.95rem}
.status::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--lc-accent)}
/* the sung word device: large text only (3.7:1 on violet) */
.lc-sung{display:inline-block;background:linear-gradient(var(--lc-violet),var(--lc-violet)) no-repeat 0 0/100% 100%;color:var(--lc-accent);border-radius:.14em;line-height:1;padding:.06em .16em .12em;white-space:nowrap}
[dir="rtl"] .lc-sung{background-position:100% 0}
/* hero */
.hero{padding-block:48px 56px}
.hero-grid{display:grid;gap:36px;align-items:center}
.lede{font-size:1.25rem;max-width:34em}
.small{font-size:.95rem}
/* cards, media */
.card{background:var(--lc-surface);border-radius:var(--r-card);padding:24px}
.grid{display:grid;gap:20px}
.steps{list-style:none;padding:0;counter-reset:s}
.steps li{counter-increment:s;margin:0}
.steps .card{height:100%}
.steps .n{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--lc-sunk);color:var(--lc-accent);font-weight:700;font-size:1.25rem;margin-bottom:12px}
.steps .n::before{content:counter(s)}
figure{margin:0}
.player{background:var(--lc-sunk);border-radius:var(--r-media);overflow:hidden}
.player video{display:block;width:100%;aspect-ratio:16/9;background:var(--lc-sunk)}
figcaption{padding:14px 4px 0;font-size:.98rem}
figcaption strong{color:var(--lc-text);display:block;font-size:1.1rem}
details.desc{margin-top:8px} details.desc summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--lc-accent);font-weight:600}
.formats{display:grid;gap:20px;list-style:none;padding:0}
.formats li{margin:0}
.fmt{display:flex;align-items:flex-end;justify-content:center;min-height:150px;margin-bottom:12px}
.fmt span{display:flex;align-items:center;justify-content:center;border:2px solid var(--lc-line-strong);border-radius:10px;background:var(--lc-sunk);color:var(--lc-text);font-weight:700}
.fmt .r169{width:168px;aspect-ratio:16/9}.fmt .r916{width:84px;aspect-ratio:9/16}.fmt .r11{width:112px;aspect-ratio:1/1}
.price-card{max-width:520px;margin-inline:auto;text-align:center}
.price{font-size:clamp(3.5rem,12vw,5.5rem);font-weight:700;line-height:1;color:var(--lc-accent);margin:0}
.price small{display:block;font-size:1.25rem;color:var(--lc-text);font-weight:500;margin-top:6px}
.ticks{list-style:none;padding:0;text-align:start;margin:24px 0}
.ticks li{position:relative;padding-inline-start:34px}
.ticks li::before{content:"";position:absolute;inset-inline-start:0;top:.3em;width:20px;height:20px;border-radius:50%;background:var(--lc-violet-deep)}
.ticks li::after{content:"";position:absolute;inset-inline-start:7px;top:.5em;width:5px;height:10px;border:solid var(--lc-accent);border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
/* faq */
.faq details{background:var(--lc-surface);border-radius:14px;margin-bottom:10px}
.faq summary{cursor:pointer;min-height:56px;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-weight:600;color:var(--lc-text);font-size:1.1rem;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";content:"+" / "";font-size:1.6rem;color:var(--lc-accent);line-height:1;flex:none}
.faq details[open] summary::after{content:"\2212";content:"\2212" / ""}
.faq .ans{padding:0 20px 8px}
.band{background:var(--lc-surface);border-radius:var(--r-card);padding:36px 24px;text-align:center}
.note{border-inline-start:4px solid var(--lc-accent);padding:4px 0 4px 16px;margin-block:1.2em;background:var(--lc-sunk);border-radius:6px;padding:14px 18px}
.chip-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0}
.chip-list li{margin:0;padding:4px 14px;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--lc-line-strong);font-weight:600;font-size:.95rem}
/* prose pages */
.prose h2{font-size:1.6rem;margin-top:1.8em;color:var(--lc-accent)}
.prose h3{margin-top:1.4em}
.prose .meta{color:var(--lc-text-muted)}
.page-head{padding-block:48px 8px}
.page-head p{max-width:40em}
table{border-collapse:collapse;width:100%;margin-block:1em}
th,td{border:1.5px solid var(--lc-line-strong);padding:10px 14px;text-align:start;vertical-align:top}
th{background:var(--lc-surface);color:var(--lc-text)}
.tbl{overflow-x:auto}
/* footer */
.site-footer{border-top:1.5px solid var(--lc-line);background:var(--lc-sunk);padding-block:40px 28px;font-size:1rem}
.foot-grid{display:grid;gap:28px}
.site-footer h2{font-size:1rem;color:var(--lc-text);text-transform:none;margin:0 0 8px;font-weight:700}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin:0}
.site-footer li a{display:inline-flex;align-items:center;min-height:44px}
.fine{margin-top:28px;padding-top:20px;border-top:1.5px solid var(--lc-line);color:var(--lc-text-muted);font-size:.95rem}
.fine p{margin:0 0 .6em}
.foot-langs{margin-top:28px}.chip-list{gap:0 6px}.chip-list a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;color:var(--lc-text);text-decoration:none}.chip-list li{padding:0;box-shadow:none}.chip-list a:hover{color:var(--lc-accent)}
@media (min-width:720px){
  .hero-grid{grid-template-columns:5fr 6fr}
  .grid.c3{grid-template-columns:repeat(3,1fr)}
  .grid.c2{grid-template-columns:repeat(2,1fr)}
  .formats{grid-template-columns:repeat(3,1fr)}
  .foot-grid{grid-template-columns:1.3fr 1fr 1fr 1.3fr}
  section{padding-block:80px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}.btn:hover{transform:none}}
@media (forced-colors:active){.btn,.status,.chip-list li{border:1.5px solid ButtonText}}

/* ================= design pass (v2) ================= */
:root{--ease:cubic-bezier(.3,.7,.2,1);--lc-surface-hi:#2D2269;--lc-violet-soft:rgba(122,84,255,.28);--stripe:repeating-linear-gradient(115deg,var(--lc-accent) 0 14px,var(--lc-ground) 14px 28px)}
.mt{margin-top:14px}.mt-lg{margin-top:48px}.mt-xl{margin-top:2em}.center{text-align:center}.nopad{padding-inline:0}
section{padding-block:48px}
.btn{transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s}
.btn:hover{box-shadow:0 12px 30px -12px rgba(207,245,29,.6)}
.btn:active{transform:translateY(1px) scale(.99)}
.btn[disabled]{box-shadow:inset 0 0 0 1.5px var(--lc-line-strong)}
a{transition:color .15s}
/* hero */
.hero{position:relative;padding-block:18px 36px;overflow:clip}
.hero::before{content:"";position:absolute;top:-8%;inset-inline-end:-25%;width:80%;aspect-ratio:1;background:radial-gradient(closest-side,var(--lc-violet-soft),transparent);pointer-events:none}
.hero::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(220,212,255,.08) 1px,transparent 1.6px);background-size:26px 26px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%);pointer-events:none}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr);gap:16px 44px;grid-template-areas:"h1" "media" "cta" "lede" "note"}
.h-h1{grid-area:h1;margin:0;font-size:clamp(2rem,8.4vw,4.2rem);line-height:1.12}
:lang(he) .h-h1{line-height:1.25}
.h-media{grid-area:media;min-width:0}
.h-cta{grid-area:cta}.h-cta .cta-row{margin-block:4px}
.h-lede{grid-area:lede;margin:0}.h-note{grid-area:note;margin:0}
@media (min-width:900px){
  .hero{padding-block:44px 64px}
  .hero-grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-areas:"h1 media" "lede media" "cta media" "note media";grid-template-rows:auto auto auto 1fr;align-items:start}
  .h-h1{font-size:clamp(2.4rem,4.6vw,4.2rem)}
}
@media (prefers-reduced-motion:no-preference){
  .hero .lc-sung{animation:sweep .95s .55s var(--ease) both}
  .screen-bar{animation:clap .7s .25s var(--ease) both}
}
@keyframes sweep{from{background-size:0% 100%;color:var(--lc-accent)}to{background-size:100% 100%}}
@keyframes clap{from{transform:rotate(-4deg) translateY(-3px)}60%{transform:rotate(.6deg)}to{transform:none}}
/* the framed "screen" with the clapper bar */
.screen{position:relative;border-radius:20px;background:var(--lc-sunk);overflow:hidden;box-shadow:0 0 0 1.5px var(--lc-line-strong),0 22px 50px -26px rgba(122,84,255,.55)}
.sample:not(.sample--hero) .screen{box-shadow:0 0 0 1.5px var(--lc-line),0 18px 40px -22px rgba(122,84,255,.5)}
.screen-bar{height:26px;background:var(--stripe);border-bottom:3px solid var(--lc-violet);transform-origin:0 100%}
[dir="rtl"] .screen-bar{transform-origin:100% 100%}
.player{position:relative;background:var(--lc-sunk);border-radius:0}
.player video{display:block;width:100%;height:100%;object-fit:contain;aspect-ratio:auto}
.player[data-ratio="16x9"]{aspect-ratio:16/9}
.player[data-ratio="9x16"]{aspect-ratio:9/16;max-width:min(100%,calc(72vh * 9 / 16));margin-inline:auto}
.player[data-ratio="1x1"]{aspect-ratio:1;max-width:min(100%,72vh);margin-inline:auto}
.tag{position:absolute;top:0;inset-inline-end:12px;z-index:2;padding:0 12px;height:22px;display:flex;align-items:center;border-radius:0 0 10px 10px;background:var(--lc-sunk);color:var(--lc-text);font-weight:600;font-size:.78rem;line-height:1;pointer-events:none;box-shadow:inset 0 0 0 1.5px var(--lc-line-strong)}
.fmt-switch{display:flex;gap:8px;margin-top:12px;justify-content:center}
.fmt-switch button{min-height:44px;min-width:64px;padding:0 16px;border-radius:999px;border:0;background:transparent;color:var(--lc-text);box-shadow:inset 0 0 0 1.5px var(--lc-line-strong);font:600 1rem/1 var(--font);cursor:pointer;transition:background .15s,color .15s}
.fmt-switch button:hover{background:var(--lc-surface)}
.fmt-switch button[aria-pressed="true"]{background:var(--lc-violet-deep);color:var(--lc-accent);box-shadow:none}
figcaption{padding-top:14px}
.sample figcaption{text-align:start}
.soon-body{display:grid;gap:10px;justify-items:center;align-content:center;text-align:center;padding:36px 24px;aspect-ratio:16/9}
.soon-body h3{color:var(--lc-accent);margin:0}.soon-body p{margin:0;max-width:30em}
.soon .lc-sung{padding:.35em .7em;border-radius:.45em;line-height:0}.soon .lc-sung svg{display:block}
.gallery{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));margin-block:24px}
.gallery--big{grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr))}
.gallery .soon,.gallery .sample{min-width:0}
/* section dividers: a clapper-stripe segment that runs along a line */
.sep{max-width:var(--wrap);margin:6px auto;padding-inline:20px;position:relative;height:14px}
.sep::before{content:"";position:absolute;inset-inline:20px;top:6px;height:2px;background:var(--lc-line)}
.sep i{position:absolute;top:0;inset-inline-start:20px;width:96px;height:14px;border-radius:4px;background:var(--stripe);--run:calc(min(100vw,var(--wrap)) - 40px - 96px)}
@media (prefers-reduced-motion:no-preference){
  .sep.in i{animation:run 1.6s .1s var(--ease) both}
  [dir="rtl"] .sep.in i{animation-name:run-rtl}
}
@keyframes run{from{transform:none}to{transform:translateX(var(--run))}}
@keyframes run-rtl{from{transform:none}to{transform:translateX(calc(var(--run) * -1))}}
/* how it works: strip (desktop) / timeline (phone) */
.strip{list-style:none;margin:32px 0 8px;padding:0;display:grid;gap:30px;position:relative;counter-reset:s}
.strip::before{content:"";position:absolute;inset-block:22px;inset-inline-start:20.5px;width:3px;border-radius:2px;background:var(--lc-line)}
.step{position:relative;padding-inline-start:68px;counter-increment:s;min-width:0}
.step .n{position:absolute;top:0;inset-inline-start:0;width:44px;height:44px;border-radius:50%;background:var(--lc-violet-deep);color:var(--lc-accent);font-weight:700;font-size:1.25rem;display:grid;place-items:center;box-shadow:0 0 0 5px var(--lc-ground)}
.step .n::before{content:counter(s)}
.step h3{color:var(--lc-accent);margin:8px 0 .4em}
.step-art{max-width:240px;margin-bottom:14px;border-radius:16px;padding:10px;background:linear-gradient(160deg,var(--lc-surface-hi),var(--lc-surface));box-shadow:inset 0 0 0 1.5px var(--lc-line)}
.art{display:block;width:100%;height:auto}
.a-line{fill:none;stroke:var(--lc-text-muted);stroke-width:3;stroke-linejoin:round}
.a-acc{fill:none;stroke:var(--lc-accent);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.a-acc.thin{stroke-width:2;opacity:.5}
.a-fill{fill:var(--lc-text)}.a-fill-acc{fill:var(--lc-accent)}.a-viol{fill:var(--lc-violet)}
.a-draw{fill:none;stroke:var(--lc-accent);stroke-width:3;stroke-dasharray:1;stroke-dashoffset:0}
.a-spin{transform-box:fill-box;transform-origin:center}.a-up{transform-box:fill-box}
@media (min-width:760px){
  .strip:not(.strip--v){grid-template-columns:repeat(3,1fr);gap:36px}
  .strip:not(.strip--v)::before{inset-block:auto;top:21px;inset-inline:22px;height:3px;width:auto}
  .strip:not(.strip--v) .step{padding-inline-start:0;padding-top:64px}
}
@media (prefers-reduced-motion:no-preference){
  .step.in .n{animation:pop .65s var(--ease) both}
  .step.in .a-up{animation:rise 1.2s .3s var(--ease) 2 both}
  .step.in .a-spin{animation:spin 1.4s .4s var(--ease) both}
  .step.in .a-draw{animation:draw 1.1s .2s var(--ease) both}
  .step.in .a-draw.d2{animation-delay:.5s}.step.in .a-draw.d3{animation-delay:.8s}
}
@keyframes pop{0%{transform:scale(.4)}70%{transform:scale(1.15)}100%{transform:scale(1)}}
@keyframes rise{0%{transform:translateY(10px);opacity:.2}60%{opacity:1}100%{transform:none;opacity:1}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
/* comparison */
.compare{display:grid;gap:24px;margin-top:24px}
@media (min-width:760px){.compare{grid-template-columns:1fr 1fr;gap:32px}}
.frame{aspect-ratio:16/9;border-radius:18px;position:relative;overflow:hidden;box-shadow:0 0 0 1.5px var(--lc-line)}
.frame-plain{background:linear-gradient(160deg,#2A2060,var(--lc-sunk))}
.frame-plain span{position:absolute;inset-inline:0;bottom:11%;text-align:center;font-weight:500;font-size:clamp(.85rem,2.2vw,1.05rem);color:var(--lc-text-muted);letter-spacing:.01em}
.frame-live{background:var(--lc-ground);container-type:inline-size;box-shadow:0 0 0 1.5px var(--lc-violet),0 24px 50px -26px rgba(122,84,255,.8)}
.frame-live::after{content:"";position:absolute;inset-inline:0;bottom:0;height:13%;background:var(--stripe)}
.frame-live .l1{position:absolute;top:8%;inset-inline-start:6%;font-weight:700;font-size:clamp(1.3rem,5vw,2.4rem);line-height:1;color:var(--lc-accent)}
.frame-live .l2{position:absolute;inset-inline-start:5%;top:30%;font-weight:700;font-size:clamp(2.6rem,10.5vw,4.8rem);line-height:1;transform:rotate(-3deg);transform-origin:0 50%}
.frame-live .l3{position:absolute;inset-inline-end:6%;bottom:20%;font-weight:600;font-size:clamp(.9rem,2.6vw,1.2rem);line-height:1;color:var(--lc-text)}
.frame-live .sq{position:absolute;top:9%;width:18px;height:18px;background:var(--lc-accent);border-radius:4px}
@supports (width:1cqw){
  .frame-live .l1{font-size:13cqw}.frame-live .l2{font-size:27cqw}.frame-live .l3{font-size:7cqw}.frame-live .sq{width:4.5cqw;height:4.5cqw;border-radius:1cqw}
}
.frame-live .sq:nth-of-type(1){inset-inline-end:6%}.frame-live .sq:nth-of-type(2){inset-inline-end:12.5%;background:var(--lc-text-muted)}.frame-live .sq:nth-of-type(3){inset-inline-end:19%;background:var(--lc-violet)}
.frame-live .lc-sung{font-size:inherit;padding:.04em .12em .1em}
@media (prefers-reduced-motion:no-preference){.cmp.in .frame-live .lc-sung{animation:sweep 1s .4s var(--ease) both}}
.cmp figcaption{padding-top:14px}.cmp figcaption strong{display:block;color:var(--lc-text);font-size:1.15rem}
/* formats */
.formats li{padding:18px 12px;border-radius:18px;transition:background .2s}
.formats li:hover{background:var(--lc-surface)}
.fmt span{transition:border-color .2s,color .2s,transform .25s var(--ease)}
.formats li:hover .fmt span{border-color:var(--lc-accent);color:var(--lc-accent);transform:translateY(-4px)}
/* price ticket */
.ticket{position:relative;max-width:520px;margin-inline:auto;border-radius:22px;overflow:hidden;background:linear-gradient(170deg,var(--lc-surface-hi),var(--lc-surface) 55%);box-shadow:0 0 0 1.5px var(--lc-line-strong),0 34px 70px -34px rgba(122,84,255,.8)}
.ticket-top{padding:26px 24px 22px;text-align:center}
.ticket .price{margin:0}
.perf{position:relative;height:0;border-top:3px dashed var(--lc-line-strong);margin-inline:22px}
.perf::before,.perf::after{content:"";position:absolute;top:-14px;width:26px;height:26px;border-radius:50%;background:var(--lc-ground);box-shadow:inset 0 0 0 1.5px var(--lc-line-strong)}
.perf::before{inset-inline-start:-35px}.perf::after{inset-inline-end:-35px}
.ticket-body{padding:24px 26px 28px;text-align:center}
.ticket-body .ticks{margin-top:0}
.ticket-body .btn{width:100%}
/* faq */
.faq details{border:1.5px solid transparent;transition:border-color .2s,background .2s}
.faq details:hover{border-color:var(--lc-line-strong)}
.faq details[open]{background:linear-gradient(170deg,var(--lc-surface-hi),var(--lc-surface));border-color:var(--lc-violet)}
.faq summary:hover{color:var(--lc-accent)}
.band{background:linear-gradient(150deg,var(--lc-surface-hi),var(--lc-surface));box-shadow:0 0 0 1.5px var(--lc-line)}
/* reveal on scroll: transform + opacity only, off under reduced motion */
@media (prefers-reduced-motion:no-preference){
  .js .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
  .js .reveal.in{opacity:1;transform:none}
  .js:not(.rv) .reveal{animation:force-show .01s 2.5s forwards}
  .step[data-i="1"].reveal{transition-delay:.12s}.step[data-i="2"].reveal{transition-delay:.24s}
  .formats li.reveal:nth-child(2){transition-delay:.1s}.formats li.reveal:nth-child(3){transition-delay:.2s}
}
@keyframes force-show{to{opacity:1;transform:none}}

/* QA round fixes */
.nav-toggle{border:0}
.more{display:inline-flex;align-items:center;min-height:44px}
.site-footer li a,.chip-list a{min-width:44px}
a[href="mailto:support@lyriclip.co"]{white-space:nowrap;-webkit-hyphens:none;hyphens:none}
.soon-label{margin:0 0 14px;padding:13px 16px;border-radius:var(--r-btn);border:2px dashed var(--lc-line-strong);color:var(--lc-text-muted);font-weight:600;text-align:center;font-size:1rem;line-height:1.3}
.soon-h{margin:0;color:var(--lc-accent);font-weight:700;font-size:1.35rem;line-height:1.2}
.soon{margin-bottom:28px}
.soon:not(.soon--hero){box-shadow:0 0 0 1.5px var(--lc-line)}
.langnote{margin:0 0 .6em;color:var(--lc-text)}
.ticks-intro{margin:0 0 .9em;text-align:center;color:var(--lc-text-muted);font-weight:600}
.step h2{color:var(--lc-accent);font-size:1.5rem;margin:8px 0 .4em}
.player video:focus-visible{outline:3px solid var(--lc-focus);outline-offset:-3px}
@media (max-width:400px){.btn{padding:10px 16px}}
/* v3: real stills, journey strip, light design for contact / accessibility / 404 */
.frame-real{background:var(--lc-sunk);box-shadow:0 0 0 1.5px var(--lc-violet),0 24px 50px -26px rgba(122,84,255,.8)}
.frame-real img{display:block;width:100%;height:100%;object-fit:cover}
.journey{list-style:none;margin:28px 0 8px;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.journey li{margin:0;border-radius:14px;overflow:hidden;box-shadow:0 0 0 1.5px var(--lc-line);aspect-ratio:16/9;background:var(--lc-sunk)}
.journey li:last-child:nth-child(odd){grid-column:1/-1}
.journey img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.journey li:hover img{transform:scale(1.05)}
@media (min-width:760px){.journey{grid-template-columns:repeat(5,1fr)}.journey li:last-child:nth-child(odd){grid-column:auto}}
.page-head{position:relative;padding-top:68px}
.page-head::before{content:"";position:absolute;top:30px;inset-inline-start:20px;width:96px;height:14px;border-radius:4px;background:var(--stripe)}
.page-head.nopad::before{inset-inline-start:0}
.cards{display:grid;gap:20px;margin-block:20px}
.cc{padding:24px 26px;border-radius:var(--r-card);background:linear-gradient(170deg,var(--lc-surface-hi),var(--lc-surface) 60%);box-shadow:0 0 0 1.5px var(--lc-line)}
.cc h2{margin:0 0 .5em;font-size:1.3rem}
.cc p:last-child,.cc ul:last-child{margin-bottom:0}
.big404{font-size:clamp(4rem,24vw,9rem);font-weight:700;line-height:1.1;margin:0 0 28px}
.big404 .lc-sung{padding:.05em .2em .1em}
.gallery>.sample:only-child{max-width:780px}