/* Shared styling for Ads Batch Creator legal pages.
   Tokens mirror the 101 Princess Street landing pages so the pages sit
   visually alongside the rest of the site. No tracking scripts here by design. */

:root {
  --page-cream: #FFFBEE;
  --card-cream: #FBF7EA;
  --forest: #3F4F49;
  --btn: #465953;
  --grey: #5F5F60;
  --ink: #1D2421;
  --hairline: #E4DECB;
  --maxw: 820px;
}

@font-face {
  font-family: 'Bodoni Antiqua URW';
  src: url('https://101princessstreet.com/wp-content/themes/howsimpl/fonts/bodoni-antiqua-light/Bodoni%20Antiqua%20URW%20Light%20Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--page-cream);
  color: var(--grey);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

.container {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 24px;
}

header.doc-head {
  border-bottom: 1px solid var(--hairline);
  padding: 40px 0 28px;
  margin-bottom: 40px;
}

header.doc-head .brand {
  display: inline-block;
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--btn);
  text-decoration: none;
  margin-bottom: 18px;
}

header.doc-head .brand:hover { text-decoration: underline; }

h1, h2, h3 {
  font-family: 'Bodoni Antiqua URW', Georgia, 'Times New Roman', serif;
  color: var(--forest);
  font-weight: 400;
  letter-spacing: -0.01em;
  text-transform: uppercase;
}

h1 { font-size: clamp(30px, 5vw, 44px); line-height: 1.15; margin: 0 0 12px; }
h2 { font-size: clamp(19px, 2.6vw, 24px); margin: 44px 0 14px; }
h3 { font-size: 17px; margin: 28px 0 10px; text-transform: none; letter-spacing: 0; }

.effective {
  font-size: 14px;
  color: var(--grey);
  margin: 0;
}

main { padding-bottom: 72px; }

p { margin: 0 0 16px; }

ul, ol { margin: 0 0 16px; padding-left: 22px; }
li { margin-bottom: 8px; }

a { color: var(--btn); }

strong { color: var(--ink); font-weight: 600; }

table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 20px;
  font-size: 15px;
}

th, td {
  text-align: left;
  padding: 11px 12px;
  border-bottom: 1px solid var(--hairline);
  vertical-align: top;
}

th {
  color: var(--ink);
  font-weight: 600;
  background: var(--card-cream);
}

.callout {
  background: var(--card-cream);
  border: 1px solid var(--hairline);
  border-radius: 10px;
  padding: 20px 22px;
  margin: 0 0 24px;
}

.callout p:last-child { margin-bottom: 0; }

.btn {
  display: inline-block;
  background: var(--btn);
  color: #fff;
  text-decoration: none;
  border-radius: 100px;
  padding: 14px 30px;
  font-weight: 600;
  font-size: 15px;
}

.btn:hover { background: #384842; }

footer.doc-foot {
  border-top: 1px solid var(--hairline);
  padding: 26px 0 48px;
  font-size: 14px;
}

footer.doc-foot a { margin-right: 18px; }

@media (max-width: 600px) {
  header.doc-head { padding: 28px 0 22px; margin-bottom: 30px; }
  table, th, td { font-size: 14px; }
  th, td { padding: 9px 8px; }
}