/* ==========================================================================
   Albertini Tuning — legal pages (accessibility, terms, privacy).
   Self-contained: mirrors the main site's carbon/brand-blue system so these
   pages read as the same brand without loading styles.css.
   ========================================================================== */

:root{
  --bg:#0A0B0D;
  --bg-2:#0F1116;
  --card:#14161C;
  --ink:#F4F5F7;
  --ink-2:rgba(244,245,247,.74);
  --ink-3:rgba(244,245,247,.52);
  --ink-4:rgba(244,245,247,.34);
  --line:rgba(255,255,255,.10);
  --blue:#245BFF;
  --blue-2:#5B85FF;
  --red:#E1231D;
  --gold:#F2A93B;
  --disp:'Frank Ruhl Libre',Georgia,serif;
  --body:'Assistant',system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

body{
  background:var(--bg);color:var(--ink-2);
  font-family:var(--body);font-size:17px;line-height:1.85;
  min-height:100vh;overflow-x:hidden;
}

a{color:var(--blue-2);text-decoration:none}
a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
a:focus-visible{outline:2px solid var(--blue-2);outline-offset:3px}

/* ---------- wordmark ---------- */
.wm{display:inline-flex;align-items:center;gap:10px;margin-bottom:14px}
.wm__bars{display:grid;gap:2.5px;flex:none}
.wm__bars i{display:block;width:22px;height:3px;border-radius:2px}
.wm__bars i:nth-child(1){background:var(--red)}
.wm__bars i:nth-child(2){background:var(--gold);width:17px}
.wm__bars i:nth-child(3){background:var(--blue)}
.wm__txt{font-family:var(--disp);font-weight:900;font-size:15px;letter-spacing:.02em;line-height:1;color:var(--ink)}
.wm__txt b{font-weight:400;color:var(--ink-3);margin-inline-start:5px}

/* ---------- layout ---------- */
.legal{max-width:820px;margin:0 auto;padding:48px clamp(18px,5vw,32px) 96px}

.back-home{
  display:inline-flex;align-items:center;gap:9px;margin-bottom:44px;
  padding:11px 20px;border:1px solid var(--line);color:var(--ink);
  font-size:14px;font-weight:600;background:rgba(255,255,255,.03);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 11px),calc(100% - 11px) 100%,0 100%);
  transition:background .3s,border-color .3s,color .3s
}
.back-home:hover{background:var(--blue);border-color:var(--blue);color:#fff;text-decoration:none}
.back-home svg{width:14px;height:14px}

h1{
  font-family:var(--disp);font-weight:900;letter-spacing:-.035em;line-height:1.05;
  font-size:clamp(32px,6vw,54px);color:var(--ink);margin-bottom:12px
}

.legal-meta{
  padding-bottom:28px;margin-bottom:34px;border-bottom:1px solid var(--line);
  color:var(--ink-4);font-size:14px
}

h2{
  font-family:var(--disp);font-weight:800;letter-spacing:-.02em;line-height:1.3;
  font-size:clamp(20px,3vw,27px);color:var(--ink);margin:46px 0 14px
}

p{margin-bottom:16px}
strong{color:var(--ink);font-weight:700}

ul{margin:0 0 20px;padding:0;list-style:none}
li{position:relative;padding-inline-start:22px;margin-bottom:11px}
li::before{content:'';position:absolute;inset-inline-start:3px;top:12px;width:6px;height:6px;background:var(--blue)}

.legal-note{
  margin-top:44px;padding:24px 26px;border:1px solid var(--line);
  background:var(--card);color:var(--ink-2);font-size:15.5px
}
.legal-note strong{color:var(--blue-2)}

/* ---------- footer ---------- */
.legal-foot{
  padding:32px clamp(18px,5vw,32px) 44px;background:var(--bg-2);
  border-top:1px solid var(--line);text-align:center;color:var(--ink-4);font-size:13px
}
.legal-foot nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin-bottom:14px}
.legal-foot nav a{color:var(--ink-2)}
.legal-foot nav a:hover{color:var(--blue-2)}
.legal-foot nav span{color:var(--ink-4)}

@media (max-width:640px){
  .legal{padding-top:34px}
  .back-home{margin-bottom:30px}
}