/* Shared styles for Yt AI Tools legal pages */
:root{
  --ink:#2b2420;
  --ink-soft:#5c5148;
  --cream:#faf6f0;
  --cream-2:#f2ebe1;
  --card:#ffffff;
  --gold:#b8894f;
  --gold-deep:#8f6535;
  --teal:#2f4a45;
  --teal-deep:#203330;
  --line:#e7ddd0;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
.serif,h1,h2{font-family:'Fraunces', Georgia, serif; font-weight:600; letter-spacing:-0.01em;}
a{color:var(--gold-deep);}
a:hover{color:var(--teal);}
img,svg{display:block; max-width:100%;}

.wrap{max-width:820px; margin:0 auto; padding:0 22px;}

/* Header */
header{
  position:sticky; top:0; z-index:40;
  background:rgba(250,246,240,0.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex; align-items:center; justify-content:space-between; max-width:1120px; margin:0 auto; padding:14px 22px;}
.logo{display:flex; align-items:center; gap:10px; font-family:'Fraunces',serif; font-weight:600; font-size:20px; text-decoration:none; color:var(--ink);}
.logo-mark{
  width:36px; height:36px; border-radius:10px;
  background:linear-gradient(135deg,var(--teal),var(--teal-deep));
  display:flex; align-items:center; justify-content:center;
  color:#f4e9d8; font-family:'Fraunces',serif; font-weight:600; font-size:16px;
}
.logo small{display:block; font-family:'Inter',sans-serif; font-size:10px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; color:var(--gold-deep);}
.back-link{font-size:13.5px; font-weight:600; text-decoration:none; color:var(--ink-soft); display:inline-flex; align-items:center; gap:6px;}
.back-link:hover{color:var(--ink);}
.back-link svg{width:15px; height:15px;}

/* Page body */
.legal-hero{padding:52px 0 10px;}
.legal-hero .eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--gold-deep); background:#f4e9d8; border:1px solid #e7d3ae;
  padding:6px 13px; border-radius:100px; margin-bottom:16px;
}
.legal-hero h1{font-size:clamp(28px,5vw,42px); line-height:1.1; margin-bottom:12px;}
.legal-hero .updated{font-size:13px; color:var(--ink-soft);}

.legal-body{padding:34px 0 70px;}
.legal-card{
  background:var(--card); border:1px solid var(--line); border-radius:22px;
  padding:38px 36px; box-shadow:0 20px 50px -30px rgba(43,36,32,0.25);
}
@media(max-width:620px){ .legal-card{padding:28px 22px;} }

.legal-card h2{font-size:20px; margin:30px 0 12px; scroll-margin-top:80px;}
.legal-card h2:first-child{margin-top:0;}
.legal-card h3{font-size:15.5px; font-weight:700; margin:20px 0 8px; font-family:'Inter',sans-serif;}
.legal-card p{font-size:14.8px; color:var(--ink-soft); margin-bottom:14px;}
.legal-card ul,.legal-card ol{margin:0 0 16px 20px; padding:0;}
.legal-card li{font-size:14.8px; color:var(--ink-soft); margin-bottom:8px;}
.legal-card strong{color:var(--ink);}
.legal-card a{word-break:break-word;}

.placeholder{
  background:#fbeecb; color:#8a6516; border:1px dashed #d9b566;
  padding:1px 7px; border-radius:6px; font-size:13px; font-weight:600;
  font-family:'Inter',sans-serif; white-space:nowrap;
}
.note-box{
  background:var(--cream-2); border:1px solid var(--line); border-left:3px solid var(--gold);
  border-radius:12px; padding:16px 18px; margin:18px 0;
}
.note-box p{font-size:13.5px; margin-bottom:0;}

.toc{
  background:var(--cream-2); border:1px solid var(--line); border-radius:14px;
  padding:20px 22px; margin-bottom:28px;
}
.toc strong{display:block; font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--gold-deep); margin-bottom:12px;}
.toc ol{margin:0 0 0 18px;}
.toc li{font-size:14px; margin-bottom:6px;}
.toc a{text-decoration:none; color:var(--ink-soft);}
.toc a:hover{color:var(--teal);}

/* Footer */
footer{border-top:1px solid var(--line); padding:34px 0 40px; background:var(--cream-2);}
.footer-inner{max-width:1120px; margin:0 auto; padding:0 22px;}
.footer-links{display:flex; gap:20px; flex-wrap:wrap; font-size:13.5px; margin-bottom:16px;}
.footer-links a{text-decoration:none; color:var(--ink-soft);}
.footer-links a:hover{color:var(--ink);}
.footer-links a.current{color:var(--ink); font-weight:700;}
.copyright{font-size:12px; color:#948a7f; line-height:1.7; max-width:900px;}
