/*
  Additional editorial styling for recovered iroca CMS pages.
  Keeps the original Studio layout intact while giving added sections the
  quiet spacing, light rules, and restrained links used on the top page.
*/

:where(.iroca-tone-intro, .iroca-article-lead, .iroca-article-close, .iroca-soft-cta, .iroca-content-sequence, .iroca-photo-note, .iroca-detail-flow, .iroca-plant-notes) {
  box-sizing: border-box;
  max-width: min(640px, calc(100vw - 48px));
  margin-right: auto;
  margin-left: auto;
  color: #3e3d39;
  letter-spacing: 0;
}

:where(.iroca-tone-intro, .iroca-article-lead) {
  margin-top: clamp(56px, 8vw, 112px);
  margin-bottom: clamp(56px, 8vw, 104px);
  padding-top: 28px;
  border-top: 1px solid rgba(72, 69, 61, 0.18);
}

.iroca-tone-kicker {
  margin: 0 0 22px;
  color: #9a958c;
  font-family: "EB Garamond", "A1ゴシック L JIS2004", serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0;
}

.iroca-tone-title {
  margin: 0 0 26px;
  color: #33312e;
  font-size: clamp(21px, 1.85vw, 28px);
  font-weight: 400;
  line-height: 1.78;
  letter-spacing: 0;
}

:where(.iroca-tone-intro, .iroca-article-lead, .iroca-article-close, .iroca-soft-cta) p {
  font-size: 14.5px;
  font-weight: 400;
  line-height: 2.06;
  letter-spacing: 0;
}

.iroca-tone-flow,
.iroca-tone-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 26px;
  align-items: center;
  margin-top: 30px;
}

.iroca-tone-flow {
  padding-top: 22px;
  border-top: 1px solid rgba(72, 69, 61, 0.12);
}

:where(.iroca-tone-flow, .iroca-tone-actions) a {
  color: #3e3d39;
  font-size: 13px;
  line-height: 1.8;
  text-decoration: none;
  border-bottom: 1px solid rgba(62, 61, 57, 0.58);
}

:where(.iroca-tone-flow, .iroca-tone-actions) a:hover {
  color: #7c7669;
  border-bottom-color: rgba(124, 118, 105, 0.72);
}

.iroca-content-sequence,
.iroca-photo-note {
  margin-top: clamp(64px, 9vw, 128px);
  margin-bottom: clamp(64px, 9vw, 128px);
}

.iroca-content-sequence {
  padding: clamp(28px, 4vw, 48px) 0;
  border-top: 1px solid rgba(72, 69, 61, 0.14);
  border-bottom: 1px solid rgba(72, 69, 61, 0.14);
}

.iroca-content-sequence h3,
.iroca-photo-note h3 {
  margin-top: 42px;
  margin-bottom: 18px;
  color: #33312e;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0;
}

.iroca-content-sequence h3:first-child,
.iroca-photo-note h3:first-child {
  margin-top: 0;
}

.iroca-content-sequence p,
.iroca-photo-note p {
  margin-top: 0;
  margin-bottom: 24px;
  font-size: 14px;
  line-height: 2.02;
  letter-spacing: 0;
}

.iroca-soft-cta,
.iroca-article-close {
  margin-top: clamp(72px, 10vw, 140px);
  margin-bottom: clamp(72px, 10vw, 140px);
  padding: clamp(32px, 5vw, 56px) 0;
  text-align: center;
  border-top: 1px solid rgba(72, 69, 61, 0.16);
  border-bottom: 1px solid rgba(72, 69, 61, 0.16);
}

.iroca-soft-cta .iroca-tone-actions,
.iroca-article-close .iroca-tone-actions {
  justify-content: center;
}

figcaption {
  margin-top: 10px;
  color: #817c73;
  font-size: 11px;
  line-height: 1.8;
  letter-spacing: 0;
}

.iroca-detail-flow {
  margin-top: clamp(64px, 9vw, 128px);
  margin-bottom: clamp(64px, 9vw, 128px);
}

.iroca-detail-flow h2 {
  margin-top: clamp(58px, 8vw, 104px);
  margin-bottom: 24px;
  padding-top: 28px;
  color: #33312e;
  font-size: clamp(21px, 1.85vw, 28px);
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0;
  border-top: 1px solid rgba(72, 69, 61, 0.15);
}

.iroca-detail-flow h3,
.iroca-detail-flow h4 {
  margin-top: 42px;
  margin-bottom: 16px;
  color: #33312e;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.85;
  letter-spacing: 0;
}

.iroca-detail-flow p,
.iroca-detail-flow li {
  color: #4a4742;
  font-size: 14px;
  line-height: 2.02;
  letter-spacing: 0;
}

.iroca-detail-flow ul,
.iroca-detail-flow ol {
  margin: 22px 0 34px;
  padding-left: 1.2em;
}

.iroca-detail-flow figure {
  margin: clamp(32px, 5vw, 56px) 0;
}

.iroca-detail-flow img {
  max-width: 100%;
  height: auto;
}

.iroca-detail-flow hr {
  margin: clamp(44px, 7vw, 76px) 0;
  border: 0;
  border-top: 1px solid rgba(72, 69, 61, 0.13);
}

.iroca-plant-notes {
  margin-top: clamp(60px, 8vw, 96px);
  margin-bottom: clamp(60px, 8vw, 96px);
  padding: 0;
  border-top: 1px solid rgba(72, 69, 61, 0.17);
  border-bottom: 1px solid rgba(72, 69, 61, 0.17);
}

.iroca-plant-notes summary {
  cursor: pointer;
  list-style: none;
  padding: 26px 0;
  color: #33312e;
  font-size: 15px;
  line-height: 1.8;
}

.iroca-plant-notes summary::-webkit-details-marker {
  display: none;
}

.iroca-plant-notes summary::after {
  content: "+";
  float: right;
  color: #908a80;
  font-family: "EB Garamond", serif;
  font-size: 22px;
  line-height: 1;
}

.iroca-plant-notes[open] summary::after {
  content: "-";
}

.iroca-plant-notes-body {
  padding-bottom: 38px;
}

.iroca-plant-notes-body h2:first-child {
  margin-top: 12px;
}

@media (max-width: 480px) {
  :where(.iroca-tone-intro, .iroca-article-lead, .iroca-article-close, .iroca-soft-cta, .iroca-content-sequence, .iroca-photo-note, .iroca-detail-flow, .iroca-plant-notes) {
    max-width: calc(100vw - 40px);
  }

  :where(.iroca-tone-intro, .iroca-article-lead) {
    margin-top: 56px;
    margin-bottom: 64px;
  }

  .iroca-tone-title {
    font-size: 20px;
    line-height: 1.82;
  }

  :where(.iroca-tone-intro, .iroca-article-lead, .iroca-article-close, .iroca-soft-cta) p {
    font-size: 14px;
    line-height: 2.05;
  }

  .iroca-tone-flow,
  .iroca-tone-actions {
    gap: 10px 20px;
  }
}