/* Storefront CMS blocks — safe visual-editor component system. */
.cms-render {
  position: relative;
  padding: clamp(62px, 7vw, 112px) 0;
  overflow: clip;
  color: var(--ink);
  background: var(--paper-light);
  border-block: 1px solid rgba(61, 89, 46, .1);
}
.cms-render + .cms-render { border-top: 0; }
.cms-render__container {
  width: min(calc(100% - 64px), 1120px);
  margin-inline: auto;
}
.cms-render__container--wide { width: min(calc(100% - 64px), var(--container)); }
.cms-render__container--full { width: 100%; }
.cms-render__container--full > .cms-render__header,
.cms-render__container--full > .cms-render__body > :not(.cms-section) {
  width: min(calc(100% - 64px), var(--container));
  margin-inline: auto;
}
.cms-render__edit {
  position: absolute;
  z-index: 10;
  top: 18px;
  right: max(18px, calc((100vw - var(--container)) / 2));
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  padding: 7px 12px;
  color: #fff;
  border-radius: 999px;
  background: rgba(38, 58, 30, .88);
  box-shadow: 0 8px 24px rgba(38, 58, 30, .15);
  font: 700 .64rem/1 var(--ui);
  letter-spacing: .02em;
  backdrop-filter: blur(10px);
}
.cms-render__edit:hover { background: var(--green-deep); transform: translateY(-1px); }
.cms-render__header { max-width: 920px; margin-bottom: clamp(32px, 5vw, 68px); }
.cms-render__header--media {
  display: grid;
  max-width: none;
  grid-template-columns: minmax(0, .88fr) minmax(360px, .72fr);
  gap: clamp(34px, 6vw, 90px);
  align-items: center;
}
.cms-render__heading h1 {
  max-width: 940px;
  margin-bottom: 22px;
  font-size: clamp(3rem, 6vw, 6.6rem);
}
.cms-render__heading .lead { max-width: 780px; color: var(--muted); }
.cms-render__featured {
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(61, 89, 46, .12);
  border-radius: 30px 44px 34px 52px;
  background: var(--paper);
  box-shadow: var(--shadow-sm);
}
.cms-render__featured img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.cms-render__featured figcaption { padding: 11px 16px; color: var(--muted); font: 600 .67rem/1.45 var(--ui); }
.cms-render__body { font-size: clamp(1rem, 1.15vw, 1.16rem); }
.cms-render__body > *:first-child { margin-top: 0; }
.cms-render__body > *:last-child { margin-bottom: 0; }
.cms-render__body p,
.cms-render__body li { max-width: 850px; }
.cms-render__body h2 { margin-top: 1.15em; font-size: clamp(2.4rem, 4.5vw, 5rem); }
.cms-render__body h3 { margin-top: 1.2em; font-size: clamp(1.65rem, 2.7vw, 2.8rem); }
.cms-render__body h4 { margin-top: 1.2em; font-size: clamp(1.15rem, 1.6vw, 1.55rem); }
.cms-render__body ul,
.cms-render__body ol { display: grid; gap: 8px; padding-left: 1.25em; }
.cms-render__body blockquote,
.cms-quote {
  max-width: 900px;
  margin: 36px 0;
  padding: clamp(24px, 3vw, 42px);
  color: var(--green-deep);
  border: 1px solid rgba(61, 89, 46, .14);
  border-left: 5px solid var(--green);
  border-radius: 4px 28px 28px 4px;
  background: rgba(223, 231, 217, .55);
  font-family: var(--display);
  font-size: clamp(1.2rem, 2vw, 1.8rem);
}
.cms-render__body table { width: 100%; border-collapse: collapse; font-family: var(--ui); font-size: .86rem; }
.cms-render__body th,
.cms-render__body td { padding: 13px 15px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.cms-render__body th { color: var(--green-deep); background: var(--sage-light); }
.cms-table-wrap { overflow-x: auto; }

.cms-section { position: relative; margin-block: clamp(34px, 5vw, 72px); padding: clamp(38px, 5vw, 76px); border-radius: 32px; }
.cms-section--paper { border: 1px solid var(--line); background: var(--paper); }
.cms-section--soft { background: rgba(223, 231, 217, .55); }
.cms-section--green { color: #fff; background: var(--green); }
.cms-section--green h2,
.cms-section--green h3,
.cms-section--green h4 { color: #fff; }
.cms-section--green p,
.cms-section--green li { color: rgba(255,255,255,.78); }
.cms-section--compact { padding: clamp(24px, 3vw, 42px); }
.cms-section--hero { padding: clamp(50px, 7vw, 108px); }
.cms-container { width: min(100%, 920px); margin-inline: auto; }
.cms-container--wide { width: min(100%, 1240px); margin-inline: auto; }
.cms-container--full { width: 100%; }
.cms-grid { display: grid; gap: clamp(20px, 3vw, 38px); align-items: start; }
.cms-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cms-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cms-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cms-grid--media { grid-template-columns: minmax(0, .9fr) minmax(340px, .7fr); align-items: center; }
.cms-card {
  height: 100%;
  padding: clamp(22px, 3vw, 36px);
  border: 1px solid var(--line);
  border-radius: 22px 30px 24px 34px;
  background: rgba(255,255,255,.58);
  box-shadow: 0 12px 34px rgba(38,58,30,.06);
}
.cms-card--accent { color: #fff; background: var(--green-deep); }
.cms-card--accent h2,
.cms-card--accent h3,
.cms-card--accent h4 { color: #fff; }
.cms-card--accent p { color: rgba(255,255,255,.76); }
.cms-card--image { padding: 0; overflow: hidden; }
.cms-media { display: block; width: 100%; height: auto; margin: 26px 0; border-radius: 22px; }
.cms-media--wide { max-height: 680px; object-fit: cover; }
.cms-media--portrait { width: min(100%, 560px); margin-inline: auto; }
.cms-media--rounded { border-radius: 50%; aspect-ratio: 1; object-fit: cover; }
.cms-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 26px; }
.cms-note { padding: 18px 21px; border-left: 3px solid var(--orange); background: rgba(216,121,66,.08); }
.cms-list-check { padding: 0 !important; list-style: none; }
.cms-list-check li { position: relative; padding-left: 28px; }
.cms-list-check li::before { position: absolute; left: 0; top: .42em; width: 15px; height: 8px; border-left: 2px solid var(--green); border-bottom: 2px solid var(--green); content: ""; transform: rotate(-45deg); }
.cms-align-center { text-align: center; }
.cms-align-center > p,
.cms-align-center > ul,
.cms-align-center > ol { margin-inline: auto; }
.cms-align-right { text-align: right; }
.cms-text-muted { color: var(--muted); }
.cms-kicker { color: var(--green); font: 800 .7rem/1.2 var(--ui); letter-spacing: .1em; text-transform: uppercase; }

@media (max-width: 880px) {
  .cms-render__header--media,
  .cms-grid--media { grid-template-columns: 1fr; }
  .cms-render__featured { max-width: 680px; }
  .cms-grid--3,
  .cms-grid--4 { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .cms-render__container,
  .cms-render__container--wide,
  .cms-render__container--full > .cms-render__header,
  .cms-render__container--full > .cms-render__body > :not(.cms-section) { width: min(calc(100% - 32px), var(--container)); }
  .cms-render__edit { top: 10px; right: 12px; }
  .cms-render__heading h1 { font-size: clamp(2.65rem, 15vw, 4.5rem); }
  .cms-section { margin-block: 28px; padding: 25px 20px; border-radius: 22px; }
  .cms-grid--2,
  .cms-grid--3,
  .cms-grid--4 { grid-template-columns: 1fr; }
  .cms-actions { align-items: stretch; flex-direction: column; }
  .cms-actions .button { width: 100%; }
}
