/* Editorial sections share the site's paper, green accents and fine linework. */
.client-stories, .journal { position: relative; border-top: 1px solid var(--line); }
.client-stories { background: linear-gradient(135deg, #55d3b007, transparent 65%); }
.illustrative-note { display: flex; align-items: baseline; gap: 10px; font-size: .75rem; margin: -12px 0 26px; line-height: 1.6; }
.illustrative-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--mint); flex-shrink: 0; }
.testimonials-grid, .journal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.testimonial-card { margin: 0; padding: 30px; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); display: flex; flex-direction: column; box-shadow: 0 8px 28px #00000005; }
.testimonial-card:nth-child(2) { background: linear-gradient(140deg, #55d3b010, transparent 80%), var(--surface); }
.testimonial-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 24px; }
.testimonial-top .mono { color: var(--mint); letter-spacing: .025em; font-size: .7rem; }
.testimonial-top svg { width: 27px; height: 23px; flex-shrink: 0; color: var(--mint); opacity: .55; }
.testimonial-card blockquote { margin: 0 0 28px; }
.testimonial-card blockquote p { color: var(--text); font-size: 1.05rem; line-height: 1.65; letter-spacing: -.015em; margin: 0; }
.testimonial-card figcaption { display: flex; align-items: center; gap: 13px; margin-top: auto; padding-top: 23px; border-top: 1px solid var(--line); }
.client-monogram { width: 44px; height: 44px; flex-shrink: 0; display: grid; place-items: center; border: 1px solid var(--line); background: var(--mint-dark); border-radius: 50%; font-size: .75rem; color: var(--mint); }
.testimonial-card figcaption strong { display: block; font-size: .875rem; font-weight: 600; }
.testimonial-card figcaption div > span { display: block; color: var(--muted); font-size: .75rem; line-height: 1.6; }
.testimonial-card figcaption .client-company { font-size: .68rem; margin-top: 3px; }
.content-section-foot { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; gap: 22px; }
.content-section-foot p { margin: 0; font-size: .8rem; }
.content-section-foot .mono { color: var(--muted); font-size: .65rem; }
.content-section-foot svg, .journal-read svg, .article-close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.journal-card { border: 1px solid var(--line); border-radius: 20px; background: var(--surface); overflow: hidden; display: flex; flex-direction: column; transition: border-color .25s, box-shadow .25s; }
.journal-card:hover { border-color: var(--mint); box-shadow: 0 12px 30px #00000008; }
.journal-art { position: relative; isolation: isolate; height: 218px; background: #55d3b00a; overflow: hidden; border-bottom: 1px solid var(--line); }
.journal-art > .mono { position: absolute; top: 24px; left: 26px; color: var(--mint); z-index: 1; font-size: .65rem; }
.journal-art img { width: 92%; height: 130%; position: absolute; right: -3%; top: -12%; object-fit: contain; opacity: .42; mix-blend-mode: screen; filter: invert(1); mask-image: linear-gradient(110deg, transparent 8%, #000 60%); transition: transform .65s; }
.journal-art--ai { background: #55d3b011; }
.journal-art--integration { background: #b6c4b40a; }
.journal-art-axis { position: absolute; width: 55%; height: 55%; left: 26px; bottom: 23px; border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); opacity: .8; }
.journal-card:hover .journal-art img { transform: scale(1.035); }
.journal-copy { padding: 28px; display: flex; flex-direction: column; flex: 1; }
.journal-category { color: var(--muted); font-size: .65rem; letter-spacing: .1em; display: block; margin-bottom: 17px; }
.journal-copy h3 { font-size: 1.4rem; line-height: 1.3; margin-bottom: 16px; }
.journal-copy > p { font-size: .9rem; margin-bottom: 26px; }
.journal-read { display: flex; justify-content: space-between; align-items: center; gap: 16px; color: var(--text); border: 0; border-top: 1px solid var(--line); background: transparent; padding: 19px 0 0; font-size: .875rem; margin-top: auto; text-align: left; }
.journal-read svg { color: var(--mint); transition: transform .2s; }
.journal-read:hover { color: var(--mint); }
.journal-read:hover svg { transform: translate(2px, -2px); }
.article-dialog { color: var(--text); background: var(--bg); border: 1px solid var(--line); border-radius: 24px; padding: 0; width: min(780px, calc(100% - 36px)); max-height: calc(100dvh - 56px); box-shadow: 0 24px 90px #0004; }
.article-dialog::backdrop { background: #07141199; backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px); }
.article-dialog-bar { position: sticky; top: 0; z-index: 1; padding: 16px 28px; display: flex; justify-content: space-between; align-items: center; background: var(--bg); border-bottom: 1px solid var(--line); }
.article-dialog-bar .mono { color: var(--muted); font-size: .65rem; }
.article-close { border: 1px solid var(--line); background: var(--surface); color: var(--text); border-radius: 50%; width: 40px; height: 40px; display: grid; place-items: center; }
.article-close:hover { color: var(--mint); border-color: var(--mint); }
.article-body { padding: 38px 48px 42px; }
.article-body h2 { font-size: clamp(1.9rem, 4vw, 2.6rem); color: var(--mint); outline: none; }
.article-body .article-lead { font-size: 1.1rem; padding-bottom: 26px; border-bottom: 1px solid var(--line); margin-bottom: 30px; }
.article-body h3 { color: var(--mint); font-size: 1.2rem; margin: 30px 0 10px; }
.article-body p { font-size: 1rem; line-height: 1.8; }
.article-end { border-top: 1px solid var(--line); margin-top: 32px; padding-top: 24px; }
.article-end p { font-size: .875rem; margin-bottom: 12px; }
body.article-open { overflow: hidden; }
:root[data-theme="light"] .client-stories { background: linear-gradient(135deg, #d6e4c730, transparent 65%); }
:root[data-theme="light"] .testimonial-card { background: #ffffff26; }
:root[data-theme="light"] .testimonial-card:nth-child(2) { background: #d6e4c733; }
:root[data-theme="light"] .journal-card { background: #ffffff24; }
:root[data-theme="light"] .journal-art { background: #e6eadd35; }
:root[data-theme="light"] .journal-art--ai { background: #d6e4c740; }
:root[data-theme="light"] .journal-art img { filter: none; mix-blend-mode: multiply; opacity: .64; }
.footer-main nav { flex-wrap: wrap; }
@media (max-width: 1050px) {
  .testimonials-grid, .journal-grid { gap: 14px; }
  .testimonial-card { padding: 24px; }
  .testimonial-card blockquote p { font-size: .95rem; }
  .testimonial-top { align-items: flex-start; }
  .journal-copy { padding: 23px; }
  .journal-copy h3 { font-size: 1.2rem; }
  .journal-art { height: 185px; }
}
@media (max-width: 760px) {
  .testimonials-grid, .journal-grid { grid-template-columns: 1fr; gap: 18px; }
  .testimonial-card { padding: 27px; }
  .testimonial-card blockquote p { font-size: 1.05rem; }
  .testimonial-top { margin-bottom: 20px; }
  .content-section-foot { flex-direction: column; align-items: flex-start; gap: 14px; }
  .illustrative-note { margin-top: 0; }
  .journal-art { height: 215px; }
  .journal-art img { width: 78%; right: 0; }
  .journal-copy { padding: 27px; }
  .journal-copy h3 { font-size: 1.4rem; }
  .article-dialog { border-radius: 18px; max-height: calc(100dvh - 24px); }
  .article-dialog-bar { padding: 12px 20px; }
  .article-body { padding: 28px 24px; }
}
@media (prefers-reduced-motion: reduce) { .journal-card, .journal-art img, .journal-read svg { transition: none; } }

/* Native horizontal rails keep vertical page scrolling untouched. */
.content-carousel { min-width: 0; }
.content-carousel-track {
  --carousel-gap: 22px;
  display: grid;
  grid-template-columns: none;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 2 * var(--carousel-gap)) / 3);
  gap: var(--carousel-gap);
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding-bottom: 14px;
  -webkit-overflow-scrolling: touch;
}
.content-carousel-track::-webkit-scrollbar { display: none; }
.content-carousel-track > * { min-width: 0; scroll-snap-align: start; }
.content-carousel-track:focus-visible { outline: 2px solid var(--mint); outline-offset: 5px; border-radius: 20px; }
.content-carousel-track .journal-art { flex-shrink: 0; }
.content-carousel-controls { display: flex; align-items: center; gap: 14px; justify-content: center; margin-top: 8px; }
.content-carousel-controls[hidden], .content-carousel-dot[hidden] { display: none; }
.content-carousel-arrow {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: var(--surface);
  color: var(--mint);
  transition: border-color .2s, background .2s;
}
.content-carousel-arrow svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.content-carousel-arrow:hover:not(:disabled) { border-color: var(--mint); background: var(--mint-dark); }
.content-carousel-arrow:disabled { opacity: .3; cursor: default; }
.content-carousel-dots { display: flex; align-items: center; gap: 3px; }
.content-carousel-dot { width: 30px; height: 34px; border: 0; background: transparent; display: grid; place-items: center; padding: 0; }
.content-carousel-dot::before { content: ''; width: 5px; height: 5px; background: var(--muted); opacity: .35; border-radius: 10px; transition: width .25s, opacity .25s; }
.content-carousel-dot[aria-current="true"]::before { width: 22px; background: var(--mint); opacity: 1; }
@media (max-width: 1050px) {
  .content-carousel-track { --carousel-gap: 18px; grid-auto-columns: calc((100% - var(--carousel-gap)) / 2); }
}
@media (max-width: 760px) {
  .content-carousel-track { grid-auto-columns: 100%; }
  .content-carousel-controls { gap: 8px; }
  .content-carousel-dot { width: 26px; }
  .content-carousel .testimonial-card { min-height: 348px; }
}
@media (prefers-reduced-motion: reduce) { .content-carousel-arrow, .content-carousel-dot::before { transition: none; } }