/* Styles Cinejma's standalone information and legal pages for comfortable reading on desktop and mobile. */
:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: #111316; color: #d9dde3; }
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; background: radial-gradient(circle at 50% -20%, #2a2e35 0, #17191d 38rem, #111316 70rem); line-height: 1.65; }
a { color: #ffad73; text-underline-offset: 3px; }
a:hover { color: #ffc39b; }
.legal-header { position: sticky; z-index: 2; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 58px; padding: 9px max(18px, calc((100vw - 920px) / 2)); border-bottom: 1px solid #30343b; background: #181a1ff2; backdrop-filter: blur(12px); }
.legal-brand { display: flex; align-items: center; gap: 9px; color: #f1f3f5; font-size: 13px; font-weight: 800; letter-spacing: .08em; text-decoration: none; }
.legal-brand img { width: 32px; height: 32px; border-radius: 8px; }
.legal-nav { display: flex; gap: 18px; font-size: 13px; }
.legal-nav a { color: #aeb5be; text-decoration: none; }
.legal-nav a[aria-current="page"], .legal-nav a:hover { color: #fff; }
.legal-document { width: min(920px, calc(100% - 36px)); margin: 0 auto; padding: 64px 0 90px; }
.legal-kicker { margin: 0 0 8px; color: #e8793a; font-size: 12px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
h1 { margin: 0; color: #fff; font-size: clamp(36px, 7vw, 58px); line-height: 1.05; letter-spacing: -.035em; }
.legal-updated { margin: 16px 0 38px; color: #8e96a1; font-size: 13px; }
.legal-summary { margin: 0 0 42px; padding: 20px 22px; border: 1px solid #4c443d; border-radius: 8px; background: #29241f; color: #ece4dc; font-size: 16px; }
h2 { margin: 42px 0 12px; padding-top: 5px; color: #f1f3f5; font-size: 21px; line-height: 1.3; }
h3 { margin: 24px 0 8px; color: #e1e5ea; font-size: 16px; }
p, li { color: #c3c9d1; }
ul { padding-left: 24px; }
li + li { margin-top: 7px; }
strong { color: #e8ebef; }
.legal-note { padding: 15px 17px; border-left: 3px solid #e8793a; background: #1c1f24; }
.legal-footer { margin-top: 60px; padding-top: 22px; border-top: 1px solid #30343b; color: #858c96; font-size: 12px; }
.about-document { padding-top: 48px; }
.about-hero { display: grid; justify-items: center; padding: 18px 0 68px; text-align: center; }
.about-icon { width: clamp(108px, 18vw, 154px); height: clamp(108px, 18vw, 154px); margin-bottom: 28px; border-radius: 30%; filter: drop-shadow(0 20px 34px #0009); }
.about-hero h1 { max-width: 760px; text-wrap: balance; }
.about-intro { max-width: 700px; margin: 24px auto 0; color: #cbd0d7; font-size: clamp(17px, 2.5vw, 21px); line-height: 1.6; text-wrap: balance; }
.about-action { display: inline-flex; align-items: center; gap: 9px; margin-top: 30px; padding: 11px 17px; border: 1px solid #b85e2e; border-radius: 7px; background: #e8793a; color: #17191d; font-size: 14px; font-weight: 800; text-decoration: none; box-shadow: 0 9px 26px #e8793a24; }
.about-action:hover { background: #f28b4c; color: #111316; }
.about-story { display: grid; grid-template-columns: minmax(240px, .85fr) minmax(300px, 1.15fr); gap: clamp(30px, 7vw, 76px); align-items: start; padding: 42px 0; border-top: 1px solid #30343b; border-bottom: 1px solid #30343b; }
.about-story h2 { margin: 0; padding: 0; font-size: clamp(25px, 4vw, 34px); letter-spacing: -.02em; }
.about-story > p { margin: 1px 0 0; font-size: 16px; }
.about-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 54px; overflow: hidden; border: 1px solid #30343b; border-radius: 10px; background: #30343b; }
.about-feature { min-height: 230px; padding: 28px; background: #191c21; }
.about-feature > span { color: #e8793a; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.about-feature h3 { margin: 36px 0 9px; font-size: 18px; }
.about-feature p { margin: 0; }
.about-footer { text-align: center; }
.libraries-document { max-width: 920px; }
.library-section { margin-top: 50px; }
.library-section > h2 { margin-bottom: 8px; }
.library-section-intro { max-width: 720px; margin: 0 0 18px; color: #9199a4; }
.library-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.library-card { display: flex; flex-direction: column; min-height: 210px; padding: 20px; border: 1px solid #343941; border-radius: 8px; background: #191c21; }
.library-card > div { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.library-card h3 { margin: 0; color: #f1f3f5; font-size: 17px; }
.library-card h3 small { color: #858d97; font-size: 11px; font-weight: 600; }
.library-license { padding: 3px 7px; border: 1px solid #51453c; border-radius: 999px; background: #29231f; color: #e9aa80; font-size: 10px; font-weight: 700; }
.library-card p { margin: 17px 0 20px; font-size: 14px; line-height: 1.55; }
.library-card > a { align-self: flex-start; margin-top: auto; color: #aeb5be; font-size: 12px; }
.library-card > a:hover { color: #ffc39b; }
.library-note { margin-top: 52px; color: #aab1ba; font-size: 13px; }
@media (max-width: 560px) {
  .legal-header { align-items: flex-start; padding: 10px 16px; }
  .legal-brand span { display: none; }
  .legal-nav { gap: 12px; padding-top: 6px; font-size: 12px; }
  .legal-document { width: min(100% - 30px, 920px); padding-top: 44px; }
  .legal-summary { padding: 17px; font-size: 15px; }
  .about-document { padding-top: 34px; }
  .about-hero { padding-bottom: 48px; }
  .about-story { grid-template-columns: 1fr; gap: 18px; }
  .about-features, .library-list { grid-template-columns: 1fr; }
  .about-feature { min-height: 0; }
  .about-feature h3 { margin-top: 24px; }
  .library-card { min-height: 0; }
}
