/* Opt-in feature-list variants; shared data, theme tokens, static-first content. */
.gl-feature-motion { background:var(--bg); }
.gl-motion-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; align-items:start; }
.gl-motion-card { min-width:0; }
.gl-motion-card-inner { background:var(--surface); border-radius:var(--radius-md); overflow:hidden; }
.gl-motion-card figure { margin:0; overflow:hidden; }
.gl-motion-card img { width:100%; aspect-ratio:4/5; object-fit:cover; transition:transform .7s var(--ease,ease); }
.gl-motion-copy { padding:26px; }
.gl-motion-copy h3 { font-size:clamp(24px,2.4vw,36px); margin:14px 0; line-height:1.35; }
.gl-motion-copy p { font-size:15px; line-height:1.8; color:var(--muted-2); margin:0 0 16px; }
.gl-motion-number { font-size:12px; font-family:monospace; letter-spacing:.14em; color:var(--muted); }
.gl-motion-link { display:inline-flex; align-items:center; gap:18px; min-height:44px; font-size:14px; border-bottom:1px solid var(--line); }
.gl-motion-link:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
[data-gl-feature-motion="collage"] .gl-motion-card:nth-child(2) { padding-top:100px; }
[data-gl-feature-motion="collage"] .gl-motion-card:nth-child(3) { padding-top:40px; }
[data-gl-feature-motion="collage"] .gl-motion-card-inner { transform:translateY(calc(var(--motion-drift,0) * 1px)); }
[data-gl-feature-motion="stacked"] .gl-motion-cards { display:block; }
[data-gl-feature-motion="stacked"] .gl-motion-card { position:sticky; top:calc(94px + var(--motion-index) * 20px); padding-bottom:36px; }
[data-gl-feature-motion="stacked"] .gl-motion-card-inner { transform:scale(var(--motion-scale,1)); transform-origin:center top; display:grid; grid-template-columns:1.15fr 1fr; align-items:center; border:1px solid var(--line); box-shadow:0 -12px 32px color-mix(in srgb,var(--black) 6%,transparent); }
[data-gl-feature-motion="stacked"] .gl-motion-card img { aspect-ratio:4/3; }
[data-gl-feature-motion="stacked"] .gl-motion-copy { padding:clamp(24px,5vw,72px); }
@media (hover:hover) and (prefers-reduced-motion:no-preference) { .gl-motion-card:hover img { transform:scale(1.035); } }
@media (max-width:760px) {
  .gl-motion-cards { grid-template-columns:1fr; gap:32px; }
  [data-gl-feature-motion="collage"] .gl-motion-card:nth-child(n) { padding-top:0; }
  .gl-motion-card img { aspect-ratio:4/3; }
  [data-gl-feature-motion="stacked"] .gl-motion-card { position:relative; top:auto; }
  [data-gl-feature-motion="stacked"] .gl-motion-card-inner { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) {
  .gl-motion-card-inner,.gl-motion-card img { transform:none !important; transition:none !important; }
  [data-gl-feature-motion="stacked"] .gl-motion-card { position:relative; top:auto; }
}
html[data-gl-motion-paused] .gl-motion-card-inner,html[data-gl-motion-paused] .gl-motion-card img { transform:none !important; transition:none !important; }
html[data-gl-motion-paused] [data-gl-feature-motion="stacked"] .gl-motion-card { position:relative; top:auto; }
/* Additional compositions share the same item model and keep links in reading order. */
[data-gl-feature-motion="bento"] .gl-motion-cards { grid-template-columns:1.35fr 1fr; gap:22px; align-items:stretch; }
[data-gl-feature-motion="bento"] .gl-motion-card:first-child { grid-row:span 2; }
[data-gl-feature-motion="bento"] .gl-motion-card-inner { height:100%; border:1px solid var(--line); border-radius:24px; }
[data-gl-feature-motion="bento"] .gl-motion-card:not(:first-child) .gl-motion-card-inner { display:grid; grid-template-columns:.85fr 1.15fr; }
[data-gl-feature-motion="bento"] .gl-motion-card:not(:first-child) figure { min-height:220px; }
[data-gl-feature-motion="bento"] .gl-motion-card img { height:100%; min-height:100%; aspect-ratio:4/3; }
[data-gl-feature-motion="bento"] .gl-motion-card h3 { font-size:clamp(22px,2vw,30px); }
[data-gl-feature-motion="bento"] .gl-motion-copy { padding:28px; }
[data-gl-feature-motion="filmstrip"] .gl-motion-cards { display:flex; overflow-x:auto; gap:26px; scroll-snap-type:x mandatory; overscroll-behavior-inline:contain; padding-bottom:20px; scrollbar-width:thin; scrollbar-color:var(--accent) var(--surface-2); }
[data-gl-feature-motion="filmstrip"] .gl-motion-card { flex:0 0 78%; scroll-snap-align:start; }
[data-gl-feature-motion="filmstrip"] .gl-motion-card-inner { display:grid; grid-template-columns:1.1fr 1fr; align-items:center; border:1px solid var(--line); }
[data-gl-feature-motion="filmstrip"] .gl-motion-card img { aspect-ratio:4/3; }
.gl-filmstrip-controls { display:flex; gap:20px; justify-content:flex-end; align-items:center; margin-top:16px; font-size:13px; }
.gl-filmstrip-controls[hidden] { display:none; }
.gl-filmstrip-controls button { min-width:86px; min-height:44px; border:1px solid var(--line); background:var(--surface); color:var(--fg); border-radius:4px; cursor:pointer; }
.gl-filmstrip-controls button:disabled { opacity:.45; cursor:default; }
.gl-filmstrip-controls button:focus-visible,.gl-motion-cards:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
[data-gl-feature-motion="timeline"] .gl-motion-cards { display:block; position:relative; padding-left:48px; }
[data-gl-feature-motion="timeline"] .gl-motion-cards::before { content:""; position:absolute; top:0; bottom:0; left:10px; width:2px; background:var(--accent); transform:scaleY(var(--timeline-progress,1)); transform-origin:top; }
[data-gl-feature-motion="timeline"] .gl-motion-card { position:relative; padding-bottom:34px; }
[data-gl-feature-motion="timeline"] .gl-motion-card::before { content:""; position:absolute; left:-44px; top:34px; width:14px; height:14px; border:2px solid var(--accent); border-radius:50%; background:var(--bg); }
[data-gl-feature-motion="timeline"] .gl-motion-card-inner { display:grid; grid-template-columns:.75fr 1.25fr; align-items:center; border:1px solid var(--line); }
[data-gl-feature-motion="timeline"] .gl-motion-card img { aspect-ratio:16/10; }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  [data-gl-feature-motion="bento"] .gl-motion-card-inner { transition:transform .25s ease,box-shadow .25s ease; }
  [data-gl-feature-motion="bento"] .gl-motion-card:hover .gl-motion-card-inner,[data-gl-feature-motion="bento"] .gl-motion-card:focus-within .gl-motion-card-inner { transform:translateY(-5px); box-shadow:0 12px 30px color-mix(in srgb,var(--black) 12%,transparent); }
}
@media (max-width:760px) {
  [data-gl-feature-motion="bento"] .gl-motion-cards { grid-template-columns:1fr; }
  [data-gl-feature-motion="bento"] .gl-motion-card:first-child { grid-row:auto; }
  [data-gl-feature-motion="bento"] .gl-motion-card:not(:first-child) .gl-motion-card-inner { display:block; }
  [data-gl-feature-motion="bento"] .gl-motion-card:not(:first-child) figure { min-height:0; }
  [data-gl-feature-motion="filmstrip"] .gl-motion-card { flex-basis:90%; }
  [data-gl-feature-motion="filmstrip"] .gl-motion-card-inner { grid-template-columns:1fr; }
  [data-gl-feature-motion="timeline"] .gl-motion-cards { padding-left:28px; }
  [data-gl-feature-motion="timeline"] .gl-motion-cards::before { left:4px; }
  [data-gl-feature-motion="timeline"] .gl-motion-card::before { left:-30px; }
  [data-gl-feature-motion="timeline"] .gl-motion-card-inner { grid-template-columns:1fr; }
}
html[data-gl-motion-paused] [data-gl-feature-motion="timeline"] .gl-motion-cards::before { transform:none; }
@media (prefers-reduced-motion:reduce) { [data-gl-feature-motion="timeline"] .gl-motion-cards::before { transform:none; } }