/* DNS legal pages — warm, readable extension of the shared Inter design system */
:root{
  --legal-paper:rgba(255,252,246,.76);
  --legal-shadow:0 24px 70px rgba(42,33,25,.09);
}

body.legal-page{
  min-height:100vh;
  background:
    radial-gradient(circle at 82% 8%,rgba(217,140,122,.18),transparent 31rem),
    radial-gradient(circle at 8% 34%,rgba(198,154,76,.14),transparent 28rem),
    var(--bg);
}

.legal-skip{z-index:2200}
.legal-header{
  position:relative;
  z-index:10;
  min-height:88px;
  padding:16px clamp(20px,5vw,64px);
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  border-bottom:1px solid var(--line);
  background:rgba(242,235,221,.88);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.legal-home{
  justify-self:start;
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:44px;
  font-family:var(--sans);
  font-size:14px;
  font-weight:600;
}
.legal-home svg{width:17px;height:17px}
.legal-brand{
  justify-self:center;
  display:flex;
  align-items:center;
  gap:10px;
}
.legal-brand img{width:auto;height:46px}
.legal-brand span{
  font-family:var(--sans);
  font-size:21px;
  font-weight:650;
  letter-spacing:.09em;
}
.legal-nav{
  justify-self:end;
  display:flex;
  align-items:center;
  gap:18px;
  font-family:var(--sans);
  font-size:13px;
}
.legal-nav a{padding:10px 0;color:var(--ink-dim)}
.legal-nav a[aria-current="page"]{color:var(--terra);font-weight:600}
.legal-nav a:hover{color:var(--ink)}

.legal-main{position:relative;z-index:2}
.legal-hero{
  padding:clamp(74px,10vw,130px) clamp(20px,5vw,64px) clamp(50px,7vw,84px);
}
.legal-hero-inner{max-width:1080px;margin:0 auto}
.legal-kicker{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:20px;
  font-family:var(--sans);
  font-size:12px;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--terra);
}
.legal-kicker::before{content:"";width:30px;height:1px;background:currentColor}
.legal-title{
  max-width:12ch;
  font-family:var(--sans);
  font-size:clamp(44px,7.4vw,92px);
  line-height:.98;
  font-weight:560;
  letter-spacing:-.045em;
}
.legal-intro{
  max-width:66ch;
  margin-top:26px;
  font-family:var(--sans);
  color:var(--ink-dim);
  font-size:clamp(16px,1.7vw,20px);
  line-height:1.7;
}
.legal-date{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-top:24px;
  padding:9px 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,252,246,.48);
  font-family:var(--sans);
  font-size:13px;
  color:var(--ink-dim);
}
.legal-date strong{color:var(--ink);font-weight:600}

.legal-layout{
  max-width:1080px;
  margin:0 auto;
  padding:0 clamp(20px,5vw,64px) clamp(80px,10vw,140px);
  display:grid;
  grid-template-columns:minmax(190px,240px) minmax(0,1fr);
  gap:clamp(34px,6vw,76px);
  align-items:start;
}
.legal-toc{
  position:sticky;
  top:26px;
  padding:22px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,252,246,.52);
  font-family:var(--sans);
}
.legal-toc h2{
  margin-bottom:13px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--terra);
}
.legal-toc ol{list-style:none;display:grid;gap:2px}
.legal-toc a{
  display:block;
  padding:7px 0;
  color:var(--ink-dim);
  font-size:13px;
  line-height:1.35;
}
.legal-toc a:hover{color:var(--terra)}

.legal-document{
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:24px;
  background:var(--legal-paper);
  box-shadow:var(--legal-shadow);
}
.legal-section{
  padding:clamp(28px,4.5vw,48px);
  border-bottom:1px solid var(--line);
  scroll-margin-top:30px;
}
.legal-section:last-child{border-bottom:0}
.legal-section h2{
  margin-bottom:18px;
  font-family:var(--sans);
  font-size:clamp(23px,3vw,32px);
  line-height:1.2;
  font-weight:620;
  letter-spacing:-.025em;
}
.legal-section h3{
  margin:26px 0 10px;
  font-family:var(--sans);
  font-size:17px;
  line-height:1.4;
  font-weight:650;
}
.legal-section p,
.legal-section li{
  font-family:var(--sans);
  color:var(--ink-dim);
  font-size:15.5px;
  line-height:1.78;
}
.legal-section p+p{margin-top:14px}
.legal-section ul,
.legal-section ol{margin:14px 0 0 1.25em;display:grid;gap:10px}
.legal-section strong{color:var(--ink);font-weight:650}
.legal-section a{
  color:var(--terra);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}
.legal-note{
  margin-top:18px;
  padding:18px 20px;
  border-left:3px solid var(--terra);
  border-radius:0 12px 12px 0;
  background:rgba(200,86,47,.07);
}
.legal-contact{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:20px;
}
.legal-contact div{
  padding:17px 18px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,252,246,.55);
}
.legal-contact dt{
  margin-bottom:5px;
  font-family:var(--sans);
  font-size:11px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--terra);
}
.legal-contact dd{
  font-family:var(--sans);
  font-size:14px;
  line-height:1.55;
  color:var(--ink);
  overflow-wrap:anywhere;
}

.legal-footer{
  padding:38px clamp(20px,5vw,64px);
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  background:rgba(242,235,221,.8);
  font-family:var(--sans);
  color:var(--ink-dim);
  font-size:13px;
}
.legal-footer-links{display:flex;flex-wrap:wrap;gap:18px}
.legal-footer-links a:hover{color:var(--terra)}

@media(max-width:860px){
  .legal-header{grid-template-columns:1fr auto}
  .legal-brand{justify-self:end}
  .legal-nav{
    grid-column:1/-1;
    justify-self:start;
    width:100%;
    margin-top:10px;
    padding-top:10px;
    border-top:1px solid var(--line);
    overflow-x:auto;
  }
  .legal-layout{grid-template-columns:1fr}
  .legal-toc{position:static}
  .legal-toc ol{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px}
}

@media(max-width:560px){
  .legal-header{padding:13px 18px}
  .legal-brand img{height:38px}
  .legal-brand span{font-size:16px}
  .legal-nav{gap:15px;font-size:12px}
  .legal-hero{padding-left:18px;padding-right:18px}
  .legal-layout{padding-left:18px;padding-right:18px}
  .legal-toc ol{grid-template-columns:1fr}
  .legal-section{padding:26px 22px}
  .legal-contact{grid-template-columns:1fr}
  .legal-footer{align-items:flex-start;flex-direction:column}
}

@media print{
  .legal-header,.legal-toc,.legal-footer,.skip-link,#a11y-btn,#a11y-panel{display:none!important}
  body.legal-page{background:#fff}
  .legal-hero{padding:24px 0}
  .legal-layout{display:block;max-width:none;padding:0}
  .legal-document{border:0;box-shadow:none;background:#fff}
  .legal-section{break-inside:avoid;padding:22px 0}
}