.information-page {
  --info-wine: var(--wine);
  --info-surface: #fffdf9;
  --info-tint: var(--tint);
}
.info-page { padding-block: var(--page-top) clamp(56px, 9vw, 132px); }
.info-heading { margin-bottom: clamp(30px, 5vw, 64px); }
.info-heading .eyebrow, .info-contents .eyebrow, .info-campaign .eyebrow {
  color: var(--info-wine);
  margin-bottom: .9rem;
}
.info-heading h1 {
  font-size: clamp(2.45rem, 5.6vw, 5.2rem);
  max-width: 15ch;
  overflow-wrap: break-word;
}
.info-heading .info-lead {
  color: var(--ink);
  line-height: 1.48;
  margin-top: clamp(.8rem, 2vw, 1.6rem);
  max-width: 45ch;
}
.info-page h2 { font-size: clamp(1.65rem, 3vw, 3.2rem); }
.info-link {
  display: inline-flex;
  align-items: baseline;
  gap: .5rem;
  color: var(--info-wine);
  text-decoration: underline;
  text-underline-offset: .27em;
  text-decoration-thickness: 1px;
}
.info-feature {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(26px, 6vw, 110px);
  align-items: center;
}
.info-feature .info-heading { margin-bottom: .9rem; }
.info-feature-note { max-width: 42ch; color: var(--muted); margin-bottom: 1.55rem; }
.info-feature > img { display: block; width: 100%; object-fit: cover; }
.info-about-intro > img { aspect-ratio: 5 / 4; object-position: center; }
.info-tailoring-intro > img { aspect-ratio: 6 / 5; object-position: 52% center; }
.info-actions { display: flex; flex-wrap: wrap; gap: .9rem 1.4rem; align-items: center; }
.info-campaign {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: clamp(26px, 5vw, 78px);
  align-items: center;
  margin-top: clamp(42px, 9vw, 132px);
  padding: clamp(24px, 5vw, 80px);
  background: var(--info-wine);
  color: #fff7f3;
}
.info-campaign .eyebrow { color: inherit; opacity: .83; }
.info-campaign h2 { font-size: clamp(1.65rem, 4vw, 4.6rem); }
.info-campaign-photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.info-campaign-photos img { aspect-ratio: 2 / 3; object-fit: cover; object-position: center 38%; }
.info-steps, .info-measurements { margin-top: clamp(42px, 7vw, 102px); }
.info-steps > h2, .info-measurements > h2 { margin-bottom: 1.4rem; }
.info-steps ol, .info-measurements ol {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: info-step;
}
.info-steps li, .info-measurements li {
  counter-increment: info-step;
  padding: clamp(16px, 3vw, 38px);
  border: 1px solid var(--line);
  background: var(--info-surface);
}
.info-steps li + li, .info-measurements li + li { border-left-width: 0; }
.info-steps li::before, .info-measurements li::before {
  content: counter(info-step, decimal-leading-zero);
  display: block;
  color: var(--info-wine);
  font-size: .75rem;
  letter-spacing: .12em;
  font-variant-numeric: tabular-nums;
  margin-bottom: .65rem;
}
.info-steps h3, .info-measurements h3 { font: 400 clamp(1.32rem, 2vw, 2rem)/1.15 var(--serif); }
.info-steps li p, .info-measurements li p { color: var(--muted); margin-top: .65rem; max-width: 38ch; }
.info-steps a, .info-size-help a, .info-document-copy a { color: var(--info-wine); text-decoration: underline; text-underline-offset: .18em; }
.info-size-guide > .info-heading { margin-bottom: 1rem; }
.info-measure-link { margin-bottom: clamp(20px, 4vw, 48px); }
.info-size-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: clamp(20px, 4vw, 60px); align-items: start; }
.info-size-chart h2, .info-size-advice h2 { margin-bottom: 1rem; }
.info-size-chart .info-table-wrap { border: 1px solid var(--line); background: var(--info-surface); }
.info-size-chart table { width: 100%; border-collapse: collapse; text-align: center; font-variant-numeric: tabular-nums; }
.info-size-chart th, .info-size-chart td { padding: .9rem clamp(.22rem, 1.1vw, 1rem); }
.info-size-chart thead { color: #fff7f3; background: var(--info-wine); font-size: clamp(.71rem, 1.05vw, .9rem); line-height: 1.22; }
.info-size-chart tbody tr + tr { border-top: 1px solid var(--line); }
.info-size-chart tbody tr:nth-child(even) { background: var(--info-tint); }
.info-size-chart tbody th { color: var(--info-wine); }
.info-size-chart > p { margin-top: .6rem; color: var(--muted); font-size: .82rem; }
.info-size-chart > p a { text-decoration: underline; text-underline-offset: .18em; }
.info-size-advice { border-top: 1px solid var(--line); padding-top: 1.05rem; }
.info-size-advice h2, .info-size-help h2 { font-size: clamp(1.45rem, 2.2vw, 2.15rem); }
.info-size-advice ul { padding-left: 1.15rem; margin: 0; color: var(--muted); }
.info-size-advice li + li { margin-top: .55rem; }
.info-size-advice li::marker { color: var(--info-wine); }
.info-diagram {
  display: grid;
  place-items: center;
  background: var(--info-tint);
  margin-bottom: 1.15rem;
  min-height: 120px;
  padding: .6rem;
}
.info-diagram img { width: min(100%, 180px); height: auto; }
.info-size-help { border-top: 1px solid var(--line); margin-top: clamp(28px, 5vw, 62px); padding-top: 1.2rem; }
.info-size-help p { margin-top: .5rem; }
.info-document {
  display: grid;
  grid-template-columns: minmax(190px, 255px) minmax(0, 1fr);
  gap: clamp(26px, 6vw, 90px);
  align-items: start;
  border-top: 1px solid var(--line);
  padding-top: clamp(20px, 4vw, 44px);
}
.info-contents { background: var(--info-tint); padding: 1rem 1.2rem; }
.info-contents ul { list-style: none; margin: 0; padding: 0; }
.info-contents a {
  display: block;
  font-size: .87rem;
  line-height: 1.4;
  padding-block: .45rem;
}
.info-contents a:hover, .info-contents [aria-current="page"] { color: var(--info-wine); text-decoration: underline; text-underline-offset: .2em; }
.info-document-copy { max-width: 76ch; font-size: 1rem; line-height: 1.65; overflow-wrap: anywhere; }
.info-document-copy section { padding-bottom: clamp(20px, 4vw, 36px); }
.info-document-copy section + section { padding-top: clamp(20px, 4vw, 36px); border-top: 1px solid var(--line); }
.info-document-copy h2 { font-size: clamp(1.48rem, 2.6vw, 2.65rem); line-height: 1.12; margin-bottom: .8rem; }
.info-document-copy p + p { margin-top: .7rem; }
.info-document-copy ul { padding-left: 1.25rem; }
.info-document-copy li + li { margin-top: .35rem; }
.info-contacts .info-document-copy a { font-weight: 550; }
@media (min-width: 801px) and (min-height: 690px) {
  .info-contents { position: sticky; top: calc(var(--header-h) + 20px); }
}
@media (max-width: 800px) {
  .info-size-grid, .info-document { grid-template-columns: 1fr; }
  .info-document-copy { max-width: none; }
  .info-support-nav { display: flex; flex-wrap: wrap; gap: .15rem .95rem; }
  .info-support-nav .eyebrow { flex: 1 0 100%; margin-bottom: .2rem; }
}
@media (max-width: 620px) {
  .info-feature, .info-campaign, .info-steps ol, .info-measurements ol { grid-template-columns: 1fr; }
  .info-tailoring-intro > img { aspect-ratio: 3 / 2; }
  .info-steps li + li, .info-measurements li + li { border-left-width: 1px; border-top-width: 0; }
  .info-measurements li {
    display: grid;
    grid-template-columns: minmax(86px, 1fr) minmax(0, 1.65fr);
    gap: .35rem .8rem;
  }
  .info-measurements li::before, .info-measurements h3, .info-measurements li p { grid-column: 2; margin: 0; }
  .info-measurements li::before { grid-row: 1; }
  .info-diagram { grid-row: 1 / 4; margin: 0; min-height: 0; align-self: start; }
  .info-document-copy { font-size: .95rem; }
}
