.legal-main {
  padding-block: clamp(3.5rem, 7vw, 7rem);
  background:
    radial-gradient(circle at 10% 4%, rgb(184 66 40 / 9%), transparent 22rem),
    linear-gradient(180deg, var(--paper-warm), var(--paper));
}

.policy-shell {
  width: min(68rem, calc(100% - 2rem));
  margin-inline: auto;
  display: grid;
  grid-template-columns: 13rem minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: start;
}

.policy-aside {
  position: sticky;
  top: calc(var(--header-height) + 1.5rem);
  padding-top: 0.25rem;
}

.policy-mascot {
  width: 9rem;
  height: 11rem;
  margin-bottom: 1.25rem;
  object-fit: contain;
  object-position: center bottom;
}

.policy-aside strong {
  display: block;
  margin-bottom: 0.75rem;
  color: var(--ink);
  font-size: var(--text-xs);
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.policy-aside a {
  min-height: 2.5rem;
  display: flex;
  align-items: center;
  color: var(--ink-muted);
  border-bottom: 1px solid var(--line);
  font-size: var(--text-sm);
  font-weight: 700;
  text-decoration: none;
}

.policy-aside a:hover {
  color: var(--coral);
}

.policy-card {
  min-width: 0;
  padding: clamp(1.5rem, 5vw, 4.5rem);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

.policy-card > .eyebrow {
  margin-bottom: 1.25rem;
}

.policy-card h1 {
  max-width: 13ch;
  margin-bottom: 1.5rem;
  font-size: clamp(2.6rem, 5vw, 5rem);
}

.policy-card .lede {
  max-width: 45rem;
  margin-bottom: 1rem;
  color: var(--ink-soft);
  font-size: var(--text-lg);
}

.effective {
  display: inline-flex;
  margin-bottom: clamp(3rem, 6vw, 5rem);
  padding: 0.5rem 0.7rem;
  color: var(--seaweed-deep);
  background: var(--seaweed-soft);
  border-radius: var(--radius-xs);
  font-size: var(--text-xs);
  font-weight: 800;
}

.policy-section + .policy-section {
  margin-top: clamp(2.75rem, 6vw, 4.75rem);
  padding-top: clamp(2.75rem, 6vw, 4.75rem);
  border-top: 1px solid var(--line);
}

.policy-section h2 {
  margin-bottom: 1.2rem;
  font-size: clamp(1.75rem, 3vw, 2.65rem);
}

.policy-section p,
.policy-section li {
  max-width: 68ch;
}

.policy-section ul {
  padding-left: 1.35rem;
}

.policy-section li + li {
  margin-top: 0.75rem;
}

.policy-section a {
  color: var(--coral);
  font-weight: 750;
}

.notice-box,
.contact-box {
  margin-top: 1.5rem;
  padding: 1.15rem 1.25rem;
  color: var(--seaweed-deep);
  background: var(--seaweed-soft);
  border-left: 4px solid var(--seaweed);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-weight: 700;
}

.table-wrap {
  margin-top: 1.5rem;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
}

.service-table {
  width: 100%;
  min-width: 42rem;
  border-collapse: collapse;
  font-size: var(--text-sm);
}

.service-table th,
.service-table td {
  padding: 1rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
}

.service-table th {
  color: var(--ink);
  background: var(--cream);
}

.service-table tr:last-child td {
  border-bottom: 0;
}

@media (max-width: 54rem) {
  .policy-shell {
    grid-template-columns: 1fr;
  }

  .policy-aside {
    position: static;
    display: flex;
    gap: 0.35rem;
    overflow-x: auto;
    padding-bottom: 0.6rem;
    scrollbar-width: thin;
  }

  .policy-aside .policy-mascot,
  .policy-aside strong {
    display: none;
  }

  .policy-aside a {
    min-width: max-content;
    padding-inline: 0.75rem;
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: var(--radius-xs);
  }
}

@media (max-width: 35rem) {
  .legal-main {
    padding-block: 2rem 4rem;
  }

  .policy-shell {
    width: min(100% - 1rem, 68rem);
  }

  .policy-card {
    border-radius: var(--radius-md);
  }

  .policy-card h1 {
    font-size: clamp(2.35rem, 12vw, 3.5rem);
  }
}