.zoom-feature {
  padding: 64px 0;
  background: var(--sky);
  border-bottom: 1.5px solid var(--ink);
}

.zoom-feature-grid {
  display: grid;
  grid-template-columns: 180px 1fr auto;
  gap: 44px;
  align-items: center;
}

.zoom-feature-grid .section-index { margin: 0; }
.zoom-feature-grid h2 {
  margin: 0 0 12px;
  font: 400 clamp(32px, 4vw, 54px)/1 'DM Serif Display', Georgia, serif;
  letter-spacing: -.04em;
}
.zoom-feature-grid p { margin: 0; max-width: 690px; }
.zoom-feature-grid .button { white-space: nowrap; }

.recording-hero {
  padding: 105px 0 90px;
  background: var(--paper);
  border-bottom: 1.5px solid var(--ink);
}

.recording-hero-grid {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: 72px;
  align-items: end;
}

.recording-hero h1 {
  max-width: 850px;
  margin: 0;
  font-size: clamp(62px, 7.4vw, 108px);
}

.recording-hero h1 em { color: var(--blue); font-weight: 400; }
.recording-intro p { margin: 0 0 30px; font-size: 17px; }
.exporter-mascot {
  width: min(1024px, calc(100% - 52px));
  margin: 70px auto -26px;
}
.exporter-mascot img {
  display: block;
  width: 100%;
  height: auto;
  border: 1.5px solid var(--ink);
  background: white;
  box-shadow: 10px 10px 0 var(--ink);
}

.destination-strip {
  background: var(--blue);
  color: white;
  border-bottom: 1.5px solid var(--ink);
}

.destination-strip .container {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.destination-strip span {
  color: #aebced;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.destination-strip strong { font-size: 15px; }

.trust-section { padding: 110px 0; background: #eef5ff; border-bottom: 1.5px solid var(--ink); }
.trust-heading { display: grid; grid-template-columns: 1.15fr .85fr; gap: 80px; align-items: end; margin-bottom: 55px; }
.trust-heading h2 { max-width: 760px; margin: 0; font: 400 clamp(48px,6vw,80px)/1 'DM Serif Display',Georgia,serif; letter-spacing: -.05em; }
.trust-heading>p { margin: 0 0 8px; color: var(--muted); font-size: 17px; }
.trust-grid { display: grid; grid-template-columns: repeat(2,1fr); border: 1.5px solid var(--ink); background: white; box-shadow: 8px 8px 0 var(--ink); }
.trust-grid article { min-height: 285px; padding: 30px; border-right: 1.5px solid var(--ink); border-bottom: 1.5px solid var(--ink); }
.trust-grid article:nth-child(2n) { border-right: 0; }
.trust-grid article:nth-last-child(-n+2) { border-bottom: 0; }
.trust-grid article>span { color: var(--blue); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.trust-grid h3 { margin: 62px 0 14px; font: 400 31px/1.05 'DM Serif Display',Georgia,serif; }
.trust-grid p { margin: 0; color: var(--muted); }
.trust-grid a { display: inline-flex; gap: 14px; margin-top: 20px; color: var(--blue); font-size: 13px; font-weight: 800; text-decoration: none; }
.trust-note { max-width: 900px; margin: 24px 0 0; color: #65635d; font-size: 12px; }

.export-section { background: var(--white); }
.export-destinations {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border: 1.5px solid var(--ink);
  box-shadow: 8px 8px 0 var(--ink);
}

.export-destinations article {
  min-height: 485px;
  padding: 30px;
  border-right: 1.5px solid var(--ink);
}
.export-destinations article:last-child { border: 0; }
.export-destinations article:nth-child(1) { background: #f7fbff; }
.export-destinations article:nth-child(2) { background: var(--yellow); }
.export-destinations article:nth-child(3) { background: var(--sky); }

.destination-letter {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  margin-bottom: 74px;
  border: 1.5px solid var(--ink);
  border-radius: 50%;
  background: white;
  font-weight: 800;
}
.export-destinations h3 {
  margin-bottom: 17px;
  font: 400 31px/1.05 'DM Serif Display', Georgia, serif;
}
.export-destinations p { color: #4c4a45; }
.export-destinations ul { margin: 25px 0 0; padding: 21px 0 0 19px; border-top: 1px solid var(--ink); font-size: 13px; }
.export-destinations li { margin: 7px 0; }

.export-process { background: var(--paper); }
.export-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1.5px solid var(--ink);
  border-bottom: 1.5px solid var(--ink);
}
.export-steps article { min-height: 285px; padding: 28px; border-right: 1.5px solid var(--ink); }
.export-steps article:last-child { border: 0; }
.export-steps span { color: var(--blue); font-size: 11px; font-weight: 800; }
.export-steps h3 { margin: 62px 0 13px; font: 400 29px 'DM Serif Display', Georgia, serif; }
.export-steps p { margin: 0; color: var(--muted); font-size: 13px; }
.export-steps code { color: var(--ink); font-size: 12px; }

.export-detail { background: var(--blue); color: white; }
.export-detail-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 90px; }
.export-detail h2 { max-width: 500px; }
.detail-list { border-top: 1px solid rgba(255,255,255,.5); }
.detail-list article { padding: 27px 0; border-bottom: 1px solid rgba(255,255,255,.28); display: grid; grid-template-columns: .72fr 1.28fr; gap: 30px; }
.detail-list h3 { margin: 0; font: 400 23px 'DM Serif Display', Georgia, serif; }
.detail-list p { margin: 0; color: #c9d1ed; font-size: 13px; }

.export-faq { padding: 120px 0; background: var(--white); border-bottom: 1.5px solid var(--ink); }
.export-faq h2 { margin-bottom: 55px; font: 400 clamp(48px, 6vw, 80px)/1 'DM Serif Display', Georgia, serif; letter-spacing: -.05em; }
.faq-list { margin-left: auto; max-width: 860px; border-top: 1.5px solid var(--ink); }
.faq-list details { border-bottom: 1.5px solid var(--ink); }
.faq-list summary { padding: 24px 50px 24px 0; cursor: pointer; font-weight: 800; position: relative; }
.faq-list summary::after { content: '+'; position: absolute; right: 8px; font-size: 22px; }
.faq-list details[open] summary::after { content: '−'; }
.faq-list details p { max-width: 720px; margin: 0; padding: 0 0 25px; color: var(--muted); }
.export-cta { border-top: 0; }

@media (max-width: 900px) {
  .zoom-feature-grid, .recording-hero-grid, .export-detail-grid { grid-template-columns: 1fr; }
  .zoom-feature-grid { gap: 24px; }
  .zoom-feature-grid .button { justify-self: start; }
  .recording-hero-grid { gap: 35px; }
  .export-destinations { grid-template-columns: 1fr; }
  .export-destinations article { min-height: auto; border-right: 0; border-bottom: 1.5px solid var(--ink); }
  .destination-letter { margin-bottom: 42px; }
  .export-steps { grid-template-columns: 1fr 1fr; }
  .export-steps article:nth-child(2) { border-right: 0; }
  .export-steps article:nth-child(-n+2) { border-bottom: 1.5px solid var(--ink); }
  .detail-list article { grid-template-columns: 1fr; gap: 10px; }
  .trust-heading { grid-template-columns: 1fr; gap: 25px; }
}

@media (max-width: 600px) {
  .zoom-feature { padding: 48px 0; }
  .recording-hero { padding: 70px 0 58px; }
  .recording-hero h1 { font-size: 56px; }
  .exporter-mascot { width: calc(100% - 28px); margin-top: 45px; }
  .destination-strip .container { padding: 20px 0; align-items: flex-start; flex-direction: column; gap: 8px; }
  .export-steps { grid-template-columns: 1fr; }
  .export-steps article { min-height: 220px; border-right: 0; border-bottom: 1.5px solid var(--ink); }
  .export-steps article:nth-child(2) { border-bottom: 1.5px solid var(--ink); }
  .export-steps h3 { margin-top: 38px; }
  .export-faq { padding: 78px 0; }
  .trust-section { padding: 78px 0; }
  .trust-grid { grid-template-columns: 1fr; }
  .trust-grid article { min-height: auto; border-right: 0; border-bottom: 1.5px solid var(--ink)!important; }
  .trust-grid article:last-child { border-bottom: 0!important; }
  .trust-grid h3 { margin-top: 38px; }
}
