/*
  Assumptions: these pages are printed on US Letter or opened on a rep's phone.
  Direction: AISS editorial field guide—warm paper, cobalt rules, teal status ink.
  Open question: feature-level scope beyond the supplied canon remains intentionally unlisted.
*/
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Newsreader:opsz,wght@6..72,500;6..72,650&display=swap');

:root {
  --aiss-blue: #2563c9;
  --aiss-teal: #11998e;
  --aiss-ink: #142033;
  --aiss-muted: #5e6b7c;
  --aiss-paper: #f5f1e8;
  --aiss-white: #fffef9;
  --aiss-line: #cbd2d8;
  --aiss-warn: #a94e2e;
  --aiss-display: "Newsreader", Georgia, serif;
  --aiss-sans: "DM Sans", "Avenir Next", Arial, sans-serif;
  --aiss-shadow: 0 18px 48px rgba(20, 32, 51, .13);
}

* { box-sizing: border-box; }
html { background: #dfe4e7; color: var(--aiss-ink); }
body {
  width: min(100%, 980px);
  min-height: 100vh;
  margin: 0 auto;
  background: var(--aiss-paper);
  color: var(--aiss-ink);
  font: 15px/1.55 var(--aiss-sans);
  box-shadow: var(--aiss-shadow);
  animation: resourcePaperIn 520ms cubic-bezier(.2,.8,.2,1) both;
}
a { color: inherit; }
button { font: inherit; }
.resource-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 16px clamp(22px, 5vw, 52px);
  border-bottom: 1px solid var(--aiss-line);
  background: var(--aiss-white);
  animation: resourceBarIn 460ms ease both;
}
.wordmark { font-size: 12px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.wordmark span { color: var(--aiss-blue); }
.resource-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.resource-actions a,
.resource-actions button,
.cta {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 15px;
  border: 1px solid var(--aiss-ink);
  border-radius: 10px;
  background: transparent;
  color: var(--aiss-ink);
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}
.resource-actions .primary,
.cta.primary { border-color: var(--aiss-blue); background: var(--aiss-blue); color: #fff; }
main { padding: clamp(34px, 7vw, 74px) clamp(22px, 6vw, 62px) 48px; animation: resourceCopyIn 620ms 80ms cubic-bezier(.2,.8,.2,1) both; }
.kicker {
  margin: 0 0 12px;
  color: var(--aiss-blue);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .17em;
  text-transform: uppercase;
}
h1, h2, h3 { color: var(--aiss-ink); }
h1 {
  max-width: 760px;
  margin: 0;
  font: 650 clamp(40px, 7vw, 74px)/.98 var(--aiss-display);
  letter-spacing: -.035em;
}
h2 { margin: 0 0 10px; font: 650 27px/1.08 var(--aiss-display); }
h3 { margin: 0 0 7px; font-size: 14px; line-height: 1.25; }
p { margin: 0 0 12px; }
.lede { max-width: 720px; margin-top: 18px; color: var(--aiss-muted); font-size: 18px; }
.meta-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 28px;
  margin: 26px 0 0;
  padding: 15px 0;
  border-block: 1px solid var(--aiss-line);
  color: var(--aiss-muted);
  font-size: 12px;
}
.meta-strip strong { color: var(--aiss-ink); }
.grid { display: grid; gap: 14px; margin-top: 24px; }
.grid.two { grid-template-columns: 1.15fr .85fr; }
.grid.three { grid-template-columns: repeat(3, 1fr); }
.panel {
  padding: 20px;
  border: 1px solid var(--aiss-line);
  border-radius: 14px;
  background: rgba(255, 254, 249, .76);
}
.panel.blue { border-color: var(--aiss-blue); background: var(--aiss-blue); color: #fff; }
.panel.blue h2, .panel.blue h3 { color: #fff; }
.panel.teal { border-color: var(--aiss-teal); background: #e8f6f3; }
.panel.warn { border-color: #d5a48f; background: #fff5ef; }
.price { font: 650 42px/1 var(--aiss-display); letter-spacing: -.025em; }
.price small { display: block; margin-top: 6px; font: 700 11px/1.3 var(--aiss-sans); letter-spacing: .08em; text-transform: uppercase; }
.rule-list { margin: 0; padding: 0; list-style: none; }
.rule-list li { padding: 9px 0; border-top: 1px solid rgba(94, 107, 124, .25); }
.rule-list li:first-child { border-top: 0; padding-top: 0; }
.label {
  display: inline-block;
  margin-bottom: 10px;
  padding: 5px 8px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.table-wrap { overflow-x: auto; margin-top: 20px; border: 1px solid var(--aiss-line); border-radius: 14px; }
table { width: 100%; border-collapse: collapse; background: var(--aiss-white); font-size: 13px; }
th, td { padding: 13px 14px; border-bottom: 1px solid var(--aiss-line); text-align: left; vertical-align: top; }
th { background: #e9ecec; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
tr:last-child td { border-bottom: 0; }
.callout {
  margin-top: 22px;
  padding: 18px 20px;
  border-left: 8px solid var(--aiss-teal);
  background: var(--aiss-white);
}
.do-not { color: var(--aiss-warn); font-weight: 700; }
.script { font: 500 21px/1.35 var(--aiss-display); }
.footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 36px;
  padding-top: 15px;
  border-top: 1px solid var(--aiss-line);
  color: var(--aiss-muted);
  font-size: 11px;
}
.resource-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 26px; }
.resource-link { padding: 18px; border: 1px solid var(--aiss-line); border-radius: 14px; background: var(--aiss-white); text-decoration: none; }
.resource-link:hover { border-color: var(--aiss-blue); transform: translateY(-2px); }
.resource-link span { display: block; margin-top: 6px; color: var(--aiss-muted); font-size: 12px; }
.faq-grid .panel { padding-block: 16px; }
.faq-grid h2 { font-size: 21px; }
.cta.primary { animation: resourceCtaPulse 3.8s ease-in-out infinite; }

@keyframes resourcePaperIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes resourceBarIn { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: none; } }
@keyframes resourceCopyIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes resourceCtaPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(37,99,201,0); } 50% { box-shadow: 0 0 0 7px rgba(37,99,201,.14); } }

@media (max-width: 680px) {
  .resource-bar { align-items: flex-start; }
  .resource-actions { justify-content: flex-end; }
  .grid.two, .grid.three, .resource-list { grid-template-columns: 1fr; }
  h1 { font-size: 44px; }
  th, td { padding: 11px; }
}

@media print {
  @page { size: Letter; margin: .38in; }
  html, body { width: auto; min-height: 0; background: #fff; box-shadow: none; }
  body { font-size: 9.4pt; }
  .resource-bar { display: none; }
  main { padding: 0; }
  h1 { font-size: 34pt; }
  h2 { font-size: 17pt; }
  .lede { font-size: 12pt; }
  .panel { padding: 12px; break-inside: avoid; }
  .grid { gap: 8px; margin-top: 14px; }
  .meta-strip { margin-top: 14px; padding: 8px 0; }
  .table-wrap { margin-top: 12px; break-inside: avoid; }
  th, td { padding: 7px 8px; }
  .callout { margin-top: 12px; padding: 10px 12px; }
  .footer {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    padding-top: 7px;
    font-size: 8pt;
  }
  a { text-decoration: none; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}