
/* =====================================================================================================
   Meterknot Legal Information v0.1 (2026-10-10, MTKN-MC · Web-Dev), Phase F3, ruled by Sotiris 2026-10-10 05:34 ("Legal Information -
   yes you can rebuild this"; "Build Legal Information to our new design system"). A page that is read is light (ruling 10 of
   2026-10-06): the article's dark head (the path, the H1, the dek, the byline's place with the entity and the date) over the white
   sheet, where the Legal Notice reads as a register: each group's number and name at the left, its entries as labelled rows at
   the right, one hairline under each. Then the related links on the article's end mark, and the global footer (no conversion band).
   Copy: the live /legal-information/ page, verbatim. The head parts are the article's (Insights-Article v0.10), unchanged; the lg-
   rules are this page's own. No lime on the sheet.
   ===================================================================================================== */
#sys-light{display:none}
.nw{white-space:nowrap}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
#ahead .wrap,#abody .wrap{max-width:none;padding-left:max(var(--pad),calc(50% - 620px));padding-right:max(var(--pad),calc(50% - 620px))}
.dm{width:7px;height:7px;border:1px solid var(--blue-300);transform:rotate(45deg);display:inline-block;flex:none}
:root{--ink:#001627;--ink-2:#22394B;--ink-3:#5D7385;--paper:#FFFFFF;--paper-rule:#D9E1E7;--paper-tint:#F2F5F7}

header.on-light{background:rgba(0,22,39,.96) !important;-webkit-backdrop-filter:blur(12px) !important;backdrop-filter:blur(12px) !important;border-bottom-color:rgba(183,197,208,.12) !important}

/* ---------- the head (dark): the path, the title, the dek, the entity and the date (the article's) ---------- */
#ahead{padding:clamp(130px,17vh,190px) 0 0}
#ahead .a-path{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:0;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--blue-300)}@media (min-width:2561px){#ahead .a-path{font-size:max(12px, min(calc(12.00px + (100vw - 2560px) * 0.00234), 15.00px))}}
#ahead .a-path a{color:var(--blue-100);text-decoration:none;display:inline-flex;align-items:center;gap:10px}
#ahead .a-path a:hover{color:#fff}
#ahead .a-path .sl{color:var(--meta-3)}
#ahead .a-path .dm{border-color:var(--blue-300);transition:background .35s var(--ease),border-color .35s var(--ease)}
#ahead .a-path .dm.on{background:var(--blue-100);border-color:var(--blue-100)}
#ahead a:focus-visible{outline:2px solid #fff;outline-offset:3px}
.mk-pre #ahead .wrap > *{opacity:0}
#ahead h1.a-h1{margin:clamp(26px,3.6vh,40px) 0 0;max-width:20ch;font-size:clamp(38px,5.2vw,92px);line-height:1.02;letter-spacing:-0.03em;font-weight:700;color:#fff;text-wrap:balance}
#ahead .a-dek{margin:clamp(22px,3vh,34px) 0 0;max-width:46ch;font-size:clamp(18px,1.45vw,24px);line-height:1.55;color:var(--blue-100);font-weight:300}@media (min-width:2561px){#ahead .a-dek{font-size:max(clamp(18px,1.45vw,24px), min(calc(24.00px + (100vw - 2560px) * 0.00188), 26.40px))}}
#ahead .c-by{position:relative;display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 22px;margin:clamp(28px,4vh,44px) 0 0;padding-top:22px;max-width:760px}
#ahead .a-rl{position:absolute;left:0;right:0;top:0;height:1px;pointer-events:none}
#ahead .a-rl .ln{position:absolute;inset:0;background:rgba(135,159,177,.32);transform-origin:0 50%}
#ahead .c-by .nm{font-size:17px;font-weight:500;color:#fff}@media (min-width:2561px){#ahead .c-by .nm{font-size:max(17px, min(calc(17.00px + (100vw - 2560px) * 0.00332), 21.25px))}}
#ahead .c-by .mt{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--blue-300)}@media (min-width:2561px){#ahead .c-by .mt{font-size:max(12px, min(calc(12.00px + (100vw - 2560px) * 0.00234), 15.00px))}}
#ahead .lg-hg{padding-bottom:clamp(56px,8vh,96px)}
#ahead .a-path .pl{color:var(--blue-100)}

/* ---------- the sheet (light): the register ---------- */
#abody{background:var(--paper);color:var(--ink-2);padding:clamp(56px,8vh,96px) 0 clamp(90px,12vh,140px)}
#abody .lg-reg{margin:0;padding:0;list-style:none;border-top:1px solid var(--paper-rule)}
#abody .lg-g{display:grid;grid-template-columns:minmax(0,250px) minmax(0,1fr);column-gap:clamp(40px,5vw,72px);padding:clamp(26px,3.6vh,40px) 0;border-bottom:1px solid var(--paper-rule)}
#abody .lg-g h2{margin:0;font-size:clamp(20px,1.6vw,24px);line-height:1.25;letter-spacing:-0.01em;font-weight:600;color:var(--ink);text-wrap:balance}@media (min-width:2561px){#abody .lg-g h2{font-size:max(clamp(20px,1.6vw,24px), min(calc(24.00px + (100vw - 2560px) * 0.00188), 26.40px))}}
#abody .lg-g h2 .ix{display:block;margin-bottom:10px;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.16em;color:var(--ink-3)}@media (min-width:2561px){#abody .lg-g h2 .ix{font-size:max(12px, min(calc(12.00px + (100vw - 2560px) * 0.00234), 15.00px))}}
#abody .lg-g dl{margin:0;display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);column-gap:clamp(20px,3vw,48px)}
#abody .lg-r{display:contents}
#abody .lg-r dt,#abody .lg-r dd{padding:14px 0;border-top:1px solid var(--paper-rule)}
#abody .lg-r:first-child dt,#abody .lg-r:first-child dd{padding-top:4px;border-top:0}
#abody .lg-r dt{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.14em;line-height:1.9;text-transform:uppercase;color:var(--ink-3)}@media (min-width:2561px){#abody .lg-r dt{font-size:max(12px, min(calc(12.00px + (100vw - 2560px) * 0.00234), 15.00px))}}
#abody .lg-r dd{margin:0;font-size:clamp(17px,1.25vw,20px);line-height:1.5;font-weight:400;color:var(--ink);font-variant-numeric:tabular-nums}@media (min-width:2561px){#abody .lg-r dd{font-size:max(clamp(17px,1.25vw,20px), min(calc(20.00px + (100vw - 2560px) * 0.00156), 22.00px))}}
#abody .lg-r dd a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:var(--paper-rule);transition:text-decoration-color .3s var(--ease)}
#abody .lg-r dd a:hover{text-decoration-color:var(--ink)}
#abody a:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
/* the related links: the article's end mark, the links as the article's close link */
#abody .lg-end{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px 30px;margin-top:clamp(30px,4.4vh,48px)}
#abody .lg-end i{width:9px;height:9px;background:var(--ink);transform:rotate(45deg);flex:none;align-self:center}
#abody .lg-end .lg-el{margin:0;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}@media (min-width:2561px){#abody .lg-end .lg-el{font-size:max(12px, min(calc(12.00px + (100vw - 2560px) * 0.00234), 15.00px))}}
#abody .lg-end a{font-size:clamp(17px,1.25vw,20px);font-weight:500;color:var(--ink);text-decoration:none}@media (min-width:2561px){#abody .lg-end a{font-size:max(clamp(17px,1.25vw,20px), min(calc(20.00px + (100vw - 2560px) * 0.00156), 22.00px))}}
#abody .lg-end a .t{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;text-decoration-color:var(--paper-rule);transition:text-decoration-color .3s var(--ease)}
#abody .lg-end a:hover .t{text-decoration-color:var(--ink)}
#abody .lg-end a .arr{font-family:var(--mono);margin-left:6px;display:inline-block;transition:transform .3s var(--ease)}
#abody .lg-end a:hover .arr{transform:translateX(3px)}
#abody .lg-end .mk-arw{width:.8em;height:.8em;vertical-align:-0.05em;fill:none;stroke:currentColor;stroke-width:1.4}

@media (prefers-reduced-motion:reduce){ #ahead .a-path .dm{transition:none} }
@media (max-width:900px){
  #ahead{padding-top:clamp(108px,15vh,140px)}
  #ahead h1.a-h1{font-size:clamp(32px,9vw,44px);line-height:1.06}
  #ahead .a-dek{font-size:17px}
  #abody{padding-top:40px}
  #abody .lg-g{grid-template-columns:minmax(0,1fr);row-gap:18px}
  #abody .lg-g dl{grid-template-columns:minmax(0,1fr)}
  #abody .lg-r dt{padding:14px 0 2px}
  #abody .lg-r dd{padding:0 0 14px;border-top:0}
  #abody .lg-r:first-child dt{padding-top:0}
  #abody .lg-r dd{font-size:18px}
  #abody .lg-end a{font-size:18px}
}

/* B8 (2026-10-10, ruled "option A 10%"): from 2560 px wide, text under 16 px 10% larger; each line repeats a rule above with its own context */
@media (min-width:2560px){#ahead .a-path{font-size:calc(12px * 1.1)}}
@media (min-width:2560px){@media (min-width:2561px){#ahead .a-path{font-size:calc(max(12px, min(calc(12.00px + (100vw - 2560px) * 0.00234), 15.00px)) * 1.1)}}}
@media (min-width:2560px){#ahead .c-by .mt{font-size:calc(12px * 1.1)}}
@media (min-width:2560px){@media (min-width:2561px){#ahead .c-by .mt{font-size:calc(max(12px, min(calc(12.00px + (100vw - 2560px) * 0.00234), 15.00px)) * 1.1)}}}
@media (min-width:2560px){#abody .lg-g h2 .ix{font-size:calc(12px * 1.1)}}
@media (min-width:2560px){@media (min-width:2561px){#abody .lg-g h2 .ix{font-size:calc(max(12px, min(calc(12.00px + (100vw - 2560px) * 0.00234), 15.00px)) * 1.1)}}}
@media (min-width:2560px){#abody .lg-r dt{font-size:calc(12px * 1.1)}}
@media (min-width:2560px){@media (min-width:2561px){#abody .lg-r dt{font-size:calc(max(12px, min(calc(12.00px + (100vw - 2560px) * 0.00234), 15.00px)) * 1.1)}}}
@media (min-width:2560px){#abody .lg-end .lg-el{font-size:calc(12px * 1.1)}}
@media (min-width:2560px){@media (min-width:2561px){#abody .lg-end .lg-el{font-size:calc(max(12px, min(calc(12.00px + (100vw - 2560px) * 0.00234), 15.00px)) * 1.1)}}}
