/* inSona EU · views/legal.css · area E · #/privacy, #/cookies, #/accessibility, 404 (scoped under .v-legal)
   New pieces: the contents list (the band marks the section you're reading), the company-details notice,
   phone tables that stack into cards, and the 404 frame: a real guest room at 06:50, before first light. */

.v-legal .lg-head{padding:40px 0 48px;max-width:64ch}
.v-legal .lg-head .lede{margin-top:20px}
.v-legal .lg-meta{display:flex;align-items:center;gap:10px;margin-top:20px;font-size:14px;color:var(--ink-2)}
.v-legal .lg-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:80px;align-items:start;border-top:1px solid var(--line-2);padding-top:40px}

/* contents list */
.v-legal .lg-toc{position:sticky;top:calc(var(--hdr) + 32px)}
.v-legal .lg-tocd summary{list-style:none;display:none}
.v-legal .lg-tocd summary::-webkit-details-marker{display:none}
.v-legal .lg-toc ol{display:grid;gap:2px}
.v-legal .lg-toc a{position:relative;display:block;padding:8px 0 8px 24px;font:400 15px/1.35 var(--sans);color:var(--ink-2);text-decoration:none;border-radius:8px;transition:color var(--t-ui)}
.v-legal .lg-toc a:before{content:"";position:absolute;left:0;top:15px;width:14px;height:6px;background:currentColor;opacity:0;clip-path:polygon(0 50%,100% 0,100% 50%,0 100%);transform:scaleX(.5);transform-origin:left;transition:opacity var(--t-ui),transform var(--t-ui)}
.v-legal .lg-toc a[aria-current="true"]{color:var(--ink)}
.v-legal .lg-toc a[aria-current="true"]:before{opacity:.8;transform:none}
@media (hover:hover){.v-legal .lg-toc a:hover{color:var(--ink)}}

/* readable prose: Alegreya, 64 ch */
/* the body column runs to the grid edge, so tables and the closing rule end at the grid (x = 1344 at 1440); prose keeps its 64 ch measure */
.v-legal .lg-body{min-width:0}
.v-legal .lg-body .prose p,.v-legal .lg-body .prose ul{max-width:64ch}
.v-legal .lg-sec{padding-bottom:48px;scroll-margin-top:calc(var(--hdr) + 24px)}
.v-legal .lg-sec+.lg-sec{padding-top:8px}
.v-legal .lg-sec h2{margin-top:0;font-size:32px}
.v-legal .lg-sec h2:focus{outline:0}
.v-legal .lg-draft{display:flex;align-items:baseline;gap:12px;margin-bottom:40px;padding:16px 20px;border-radius:16px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);max-width:64ch;font:400 16px/1.45 var(--sans);color:var(--ink)}
.v-legal .lg-draft .bd{flex:none;color:var(--clay);transform:translateY(-1px)}
.v-legal .lg-kv{max-width:64ch;grid-template-columns:minmax(150px,200px) 1fr}
.v-legal .lg-kv dd{color:var(--ink)}
.v-legal .lg-kv a{color:var(--ink)}
.v-legal .lg-tbl .spec{min-width:680px}
.v-legal .lg-tbl .spec td,.v-legal .lg-tbl .spec th{white-space:normal;min-width:0}
.v-legal .lg-tbl tbody th{font:500 15px/1.35 var(--sans);text-align:left;padding:14px 16px;border-bottom:1px solid var(--line-2);vertical-align:top;color:var(--ink)}
.v-legal .lg-tbl tbody tr:last-child th{border-bottom:0}
.v-legal .lg-tbl th:first-child{position:static}
.v-legal .lg-tbl thead th:first-child{position:sticky}

/* cookie choice */
.v-legal .lg-manage{display:flex;justify-content:space-between;align-items:center;gap:16px 24px;flex-wrap:wrap;margin-bottom:40px;padding:20px 24px;border-radius:var(--r-card);background:var(--card);box-shadow:var(--sh)}
.v-legal .lg-cur{font:400 16px/1.45 var(--sans);color:var(--ink)}

/* end: a quiet consultation path */
.v-legal .lg-end{display:flex;justify-content:space-between;align-items:center;gap:20px 32px;flex-wrap:wrap;margin-top:16px;padding:28px 0 0;border-top:1px solid var(--line-2)}
.v-legal .lg-end .h3{font:300 28px/1.2 var(--sans);letter-spacing:-.3px}
.v-legal .lg-end p{margin-top:6px;color:var(--ink-2);font-size:17px}

/* ---------- 404 ---------- */
/* a real room at 06:50, before first light: sharp, cool, no band on the wall yet */
.v-legal .nf-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:88px;align-items:center;padding-top:24px}
.v-legal .nf-frame{position:relative;aspect-ratio:4/5;max-height:640px;margin:0;border-radius:var(--r-frame);overflow:hidden;box-shadow:var(--sh-frame);background:#1E2433}
.v-legal .nf-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.v-legal .nf-frame .tag{position:absolute;left:16px;bottom:16px;top:auto}
.v-legal .nf-tx h1{max-width:9em}
.v-legal .nf-tx .lede{margin-top:24px}
.v-legal .nf-path{margin-top:12px}
.v-legal .nf-path .n{color:var(--ink);overflow-wrap:anywhere}
.v-legal .nf-tx .pill-row{margin-top:32px}
.v-legal .nf-home{margin-top:20px}

@media (max-width:980px){
  .v-legal .lg-grid{grid-template-columns:1fr;gap:24px;padding-top:24px}
  .v-legal .lg-toc{position:static}
  .v-legal .lg-tocd{border-radius:16px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2)}
  .v-legal .lg-tocd summary{display:flex;justify-content:space-between;align-items:center;min-height:52px;padding:0 18px;font:500 15px var(--sans);cursor:pointer}
  .v-legal .lg-tocd summary .gl{width:22px;height:10px;color:var(--ink-2);transition:transform var(--t-ui)}
  .v-legal .lg-tocd[open] summary .gl{transform:rotate(12deg) scaleX(1.25)}
  .v-legal .lg-tocd ol{padding:0 18px 12px}
  .v-legal .nf-grid{grid-template-columns:1fr;gap:40px}
  .v-legal .nf-frame{aspect-ratio:3/2;max-height:none}
  .v-legal .nf-frame img{object-position:50% 62%}
  .v-legal .nf-tx{order:-1}
}
@media (max-width:600px){
  .v-legal .lg-head{padding:28px 0 32px}
  .v-legal .lg-sec{padding-bottom:36px}
  .v-legal .lg-sec h2{font-size:28px}
  .v-legal .lg-kv{grid-template-columns:1fr}
  .v-legal .lg-kv dt{padding-bottom:0;border-bottom:0}
  .v-legal .lg-kv dd{padding-top:4px}
  .v-legal .lg-manage{padding:18px}
  .v-legal .lg-manage .pill{width:100%}
  .v-legal .nf-frame{aspect-ratio:4/3}
  /* phone: each table row becomes a small card, the column name above each value */
  .v-legal .lg-tbl{overflow:visible;background:none;box-shadow:none}
  .v-legal .lg-tbl .spec,.v-legal .lg-tbl tbody,.v-legal .lg-tbl tr{display:block;min-width:0;width:100%}
  .v-legal .lg-tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .v-legal .lg-tbl tr{margin-bottom:12px;padding:4px 0;border-radius:16px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2)}
  .v-legal .lg-tbl tbody th,.v-legal .lg-tbl td{display:block;padding:12px 16px 0;border:0}
  .v-legal .lg-tbl tbody th{font-size:16px;padding-top:14px}
  .v-legal .lg-tbl td:last-child{padding-bottom:14px}
  .v-legal .lg-tbl td:before{content:attr(data-l);display:block;font:500 13px/1.3 var(--sans);color:var(--ink-2);margin-bottom:2px}
}