:root{
  --legal-page:#edf2f4;
  --legal-surface:#fff;
  --legal-text:#17212b;
  --legal-muted:#52616f;
  --legal-line:#d6e1e5;
  --legal-navy:#071821;
  --legal-petrol:#0d6678;
  --legal-petrol-dark:#08495e;
  --legal-amber:#e4b04a;
}

*{box-sizing:border-box}

body.pse-production{
  margin:0;
  background:var(--legal-page);
  color:var(--legal-text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:17px;
  line-height:1.68;
}

.legal-preview-notice{
  padding:.72rem 1rem;
  border-bottom:1px solid rgba(228,176,74,.55);
  background:#fff7df;
  color:#5d4a12;
  font-size:.82rem;
  text-align:center;
}

.legal-breadcrumb{
  display:flex;
  width:min(calc(100% - 160px),1600px);
  margin:24px auto 0;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  color:var(--legal-muted);
  font-size:13px;
}

.legal-breadcrumb a{color:var(--legal-petrol-dark);font-weight:700;text-decoration:none}
.legal-breadcrumb a:hover{text-decoration:underline}

.legal-page{
  width:min(calc(100% - 160px),1280px);
  margin:24px auto 64px;
  overflow:hidden;
  border:1px solid var(--legal-line);
  border-radius:18px;
  background:var(--legal-surface);
  box-shadow:0 18px 50px rgba(7,24,33,.09);
}

.legal-hero{
  padding:clamp(2.2rem,5vw,4.5rem);
  background:linear-gradient(135deg,var(--legal-navy),var(--legal-petrol-dark));
  color:#fff;
}

.legal-eyebrow{
  margin:0 0 .8rem;
  color:var(--legal-amber);
  font-size:.78rem;
  font-weight:750;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.legal-hero h1{
  margin:0 0 1rem;
  font-size:clamp(2.2rem,5vw,4rem);
  line-height:1.05;
  letter-spacing:-.035em;
}

.legal-hero>p:last-child{max-width:74ch;margin:0;color:rgba(255,255,255,.9)}

.legal-layout{
  display:grid;
  padding:clamp(1.5rem,4vw,3.5rem);
  grid-template-columns:minmax(0,1fr) minmax(250px,320px);
  align-items:start;
  gap:clamp(2rem,4vw,4rem);
}

.legal-content section{padding:0 0 2rem;margin:0 0 2rem;border-bottom:1px solid var(--legal-line)}
.legal-content section:last-of-type{margin-bottom:0;border-bottom:0}
.legal-content h2,.legal-aside h2,.legal-validation h2{margin:0 0 1rem;color:var(--legal-petrol-dark);font-size:1.45rem;line-height:1.25}
.legal-content p{margin:0 0 1rem}
.legal-content ul,.legal-content ol{margin:1rem 0;padding-left:1.45rem}
.legal-content li{margin:.45rem 0}
.legal-content a,.legal-aside a{color:var(--legal-petrol-dark);font-weight:700}

.legal-card{
  padding:1.35rem;
  border-left:5px solid var(--legal-petrol);
  border-radius:0 10px 10px 0;
  background:#eaf4f6;
}

.legal-aside{
  position:sticky;
  top:24px;
  padding:1.4rem;
  border:1px solid var(--legal-line);
  border-radius:14px;
  background:#f7fafb;
}

.legal-aside p{margin:0 0 1.2rem;color:var(--legal-muted)}
.legal-aside a{display:block;padding:.7rem 0;border-top:1px solid var(--legal-line);text-decoration:none}
.legal-aside a:hover{text-decoration:underline}

.legal-validation{
  padding:1.35rem;
  border-left:5px solid var(--legal-amber);
  background:#fff7df;
}

@media(max-width:1100px){
  .legal-breadcrumb,.legal-page{width:calc(100% - 64px)}
  .legal-layout{grid-template-columns:1fr}
  .legal-aside{position:static}
}

@media(max-width:680px){
  body.pse-production{font-size:16px}
  .legal-breadcrumb,.legal-page{width:calc(100% - 40px)}
  .legal-page{margin-bottom:40px;border-radius:12px}
  .legal-hero,.legal-layout{padding:1.4rem}
  .legal-hero h1{font-size:clamp(2rem,11vw,2.75rem)}
}

@media(max-width:360px){
  .legal-breadcrumb,.legal-page{width:calc(100% - 28px)}
  .legal-hero,.legal-layout{padding:1.1rem}
}
