/* Standalone layout refinements. Typography is scaled once during the build. */
.editorial.refined .site-header {
  max-width: 1280px;
  margin-inline: auto;
  padding: 26px 5%;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 28px;
}
.editorial.refined .site-header nav {
  min-width: 0;
  max-width: none;
  gap: 12px 22px;
}
.editorial.refined.nav-grouped .site-header nav { align-items: center; overflow: visible; }
.nav-group { position: relative; font: 14.64px/1.5 var(--sans); }
.nav-group summary { cursor: pointer; padding: 6px 0; list-style: none; white-space: nowrap; }
.nav-group summary::-webkit-details-marker { display: none; }
.nav-group summary:after { content: '⌄'; margin-left: 7px; }
.nav-group[open] summary:after { content: '⌃'; }
.nav-group-links {
  position: absolute;
  z-index: 30;
  top: 100%;
  left: -16px;
  min-width: 300px;
  max-width: 360px;
  padding: 12px 18px;
  background: var(--paper);
  border: 1px solid var(--rule);
  box-shadow: 0 8px 20px #41232412;
}
.editorial.refined .site-header .nav-group-links a {
  display: block;
  padding: 10px 0;
  border-bottom: 1px solid var(--rule);
  white-space: normal;
  line-height: 1.6;
}
.editorial.refined .site-header .nav-group-links a:last-child { border: 0; }
.editorial.refined.masthead-grouped .site-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding-block: 24px;
}
.editorial.refined.masthead-grouped .site-header nav {
  position: relative;
  width: 100%;
  margin: 0;
  justify-content: center;
  gap: 8px 24px;
}
.editorial.refined.masthead-grouped .menu-toggle { margin: 0; align-self: center; }
.masthead-grouped .nav-group { position: static; }
.masthead-grouped .nav-group summary { padding: 8px 0; border-bottom: 1px solid var(--ink); }
.masthead-grouped .nav-group summary:after { content: none; }
.masthead-grouped .nav-group summary::marker { content: ''; }
.masthead-grouped .nav-group summary:hover,
.masthead-grouped .nav-group[open] summary { color: var(--accent); border-bottom-color: var(--accent); }
.masthead-grouped .nav-group summary:focus-visible { outline: 3px solid var(--accent); outline-offset: 5px; }
.masthead-grouped #site-nav:has(details[open]) { padding-bottom: 48px; }
.masthead-grouped .nav-group-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 30px;
  top: auto;
  bottom: 0;
  left: 0;
  right: 0;
  min-width: 0;
  max-width: none;
  padding: 6px 16px;
  border: 0;
  border-top: 1px solid var(--ink);
  box-shadow: none;
}
.editorial.refined.masthead-grouped .site-header .nav-group-links a { padding: 3px 0; border: 0; }
.editorial.refined .portrait { align-self: center; }
.editorial.refined .portrait img { object-position: left center; }

.editorial.refined #contact .section-inner {
  display: block;
  max-width: 900px;
  margin-inline: auto;
}
.editorial.refined #contact .heading { max-width: none; }
.editorial.refined #contact h2 { margin-bottom: 18px; }
.editorial.refined #contact h5 { margin-bottom: 32px; }
.contact-form {
  min-width: 0;
  padding: 32px;
  border: 1px solid #b99c8d;
  background: #fcf7ef;
}
.editorial.refined #contact .native-contact-form { margin: 0; }
.native-contact-form .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.native-contact-form .form-field { min-width: 0; margin-bottom: 26px; }
.native-contact-form label { margin: 0 0 8px; font-size: 15.86px; font-weight: 500; }
.native-contact-form label span { color: var(--accent); }
.native-contact-form input,
.native-contact-form textarea {
  width: 100%;
  padding: 13px 15px;
  border: 1px solid #b99c8d;
  border-radius: 2px;
  background: #fffcf7;
  color: var(--ink);
  font: 21.96px/1.5 var(--sans);
  margin: 0;
}
.native-contact-form input:focus,
.native-contact-form textarea:focus { border-color: var(--accent); outline: 2px solid var(--accent); outline-offset: 2px; }
.native-contact-form textarea { min-height: 190px; resize: vertical; }
.native-contact-form input::placeholder { color: #8a7168; opacity: 1; }
.native-contact-form [aria-invalid="true"] { border-color: var(--accent); }
.native-contact-form .field-error { color: #8c2424; font-size: 14.64px; line-height: 1.5; margin: 7px 0 0; }
.native-contact-form .form-footer { display: flex; align-items: center; gap: 24px; }
.native-contact-form .submit-button { padding: 13px 28px; font: 500 19.52px/1.5 var(--sans); background: var(--ink); color: var(--paper); border: 1px solid var(--ink); cursor: pointer; }
.native-contact-form .submit-button:hover { background: var(--accent); border-color: var(--accent); }
.native-contact-form .submit-button:disabled { opacity: .65; cursor: wait; }
.native-contact-form .form-note { font-size: 14.64px; line-height: 1.6; color: #745b52; margin: 0; }
.native-contact-form .form-status { font: 17.08px/1.6 var(--sans); margin-top: 20px; }
.native-contact-form .form-status:empty { display: none; }
.native-contact-form .form-status[data-state="error"] { color: #8c2424; }
.native-contact-form .form-status[data-state="success"] { color: #34583b; }
.native-contact-form .form-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.skip-link { position: absolute; top: -80px; left: 16px; z-index: 99; }
.skip-link:focus { top: 12px; background: var(--paper); padding: 12px; }
body { overflow-wrap: break-word; }
.editorial.refined .article-groups {
  max-width: none;
  margin: 30px 0 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px 48px;
}
.editorial.refined .article-group {
  display: block;
  min-width: 0;
  padding-top: 22px;
}
.editorial.refined .article-group h3 { margin-bottom: 20px; }
.editorial.refined .article-group ul { padding-left: 1.1em; }
.editorial.refined .article-group li { margin-bottom: 0; padding-bottom: 18px; }
.editorial.refined #dutch-television-documentary .section-inner {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 40px;
}
.documentary-media { min-width: 0; }
.editorial.refined #dutch-television-documentary .image { margin: 0; }
.documentary-episodes { margin-top: 20px; }
.documentary-episodes ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }
.documentary-episodes a { display: block; }
@media (max-width: 1100px) {
  .editorial.refined .site-header { grid-template-columns: 1fr auto; }
  .editorial.refined .site-header .menu-toggle { display: block; }
  .editorial.refined .site-header nav { display: none; grid-column: 1 / -1; margin: 0; }
  .editorial.refined .site-header nav.open {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    gap: 0 24px;
  }
  .editorial.refined .site-header nav a { padding: 10px 0; border-top: 1px solid var(--rule); }
  .editorial.refined.nav-grouped .site-header nav.open { display: block; }
  .nav-group { font-size: 17.08px; }
  .nav-group summary { padding: 10px 0; border-top: 1px solid var(--rule); }
  .nav-group-links { position: static; min-width: 0; max-width: none; padding: 0 12px; border: 0; box-shadow: none; }
  .editorial.refined.masthead-grouped .site-header { display: flex; }
  .editorial.refined.masthead-grouped .site-header nav.open { display: block; }
  .masthead-grouped #site-nav:has(details[open]) { padding-bottom: 0; }
  .masthead-grouped .nav-group summary { padding: 8px 0; border-top-color: var(--ink); }
  .masthead-grouped .nav-group-links { position: static; display: block; padding: 2px 16px 6px; }
  .editorial.refined.masthead-grouped .site-header .nav-group-links a { padding: 6px 0; border-top-color: var(--ink); }
}
@media (min-width: 761px) and (max-width: 1000px) {
  .editorial.refined #dutch-television-documentary .section-inner { display: block; }
  .documentary-media { margin-top: 28px; }
}
@media (max-width: 760px) {
  .editorial.refined .site-header { padding-inline: 6%; }
  .editorial.refined .portrait { align-self: stretch; }
  .editorial.refined .portrait img { aspect-ratio: 2 / 3; }
  .contact-form { padding: 24px 20px; }
  .native-contact-form .form-row { grid-template-columns: 1fr; gap: 0; }
  .native-contact-form .form-footer { flex-direction: column; align-items: flex-start; gap: 14px; }
  .editorial.refined .article-groups { grid-template-columns: 1fr; gap: 24px; }
  .editorial.refined #dutch-television-documentary .section-inner { display: block; }
  .documentary-media { margin-top: 28px; }
}
@media (max-width: 600px) {
  .editorial.refined .site-header nav.open { grid-template-columns: 1fr; }
}
@media (max-width: 360px) {
  #contact { padding-inline: 4px; }
  .contact-form { padding-inline: 16px; }
  .documentary-episodes ul { grid-template-columns: 1fr; }
}