/* ─────────────────────────────────────────
   Section detail pages (Headbox, Forming, etc.)
   Shared by all Supply-of-sections sub-pages
───────────────────────────────────────── */
.sd-main {
  display: block;
}

/* Intro text */
.sd-intro {
  margin-bottom: 28px;
}

.sd-intro p {
  font-size: 13px;
  color: var(--text);
  line-height: 1.75;
  margin-bottom: 14px;
}

.sd-intro a {
  color: var(--blue-link);
}

/* 3-column photo grid */
.sd-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
}

.sd-img-link {
  display: block;
  overflow: hidden;
  border: 2px solid #c8d8ec;
}

.sd-img {
  width: 100%;
  height: 190px;
  object-fit: cover;
  display: block;
  transition: transform .3s, opacity .2s;
}

.sd-img-link:hover .sd-img {
  transform: scale(1.04);
  opacity: .9;
}

/* ─────────────────────────────────────────
   Press section — bullet list variant
───────────────────────────────────────── */
.ps-list {
  list-style: disc;
  padding-left: 18px;
  margin-bottom: 18px;
}

.ps-list > li {
  margin-bottom: 18px;
  font-size: 13px;
  color: var(--text);
  line-height: 1.75;
}

.ps-list > li > strong {
  display: block;
  margin-bottom: 4px;
  color: #333;
}

.ps-list > li > p {
  margin: 0 0 4px 0;
  font-size: 13px;
  color: var(--text);
  line-height: 1.75;
}

.ps-contact {
  font-size: 13px;
  color: var(--text);
  margin-top: 6px;
}

/* PDF download links */
.sd-pdf-links {
  margin: 14px 0 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sd-pdf-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  color: var(--blue-link);
  text-decoration: none;
}

.sd-pdf-link:hover {
  text-decoration: underline;
}

.sd-pdf-link svg {
  flex-shrink: 0;
  color: var(--blue-link);
}

/* 3-image single-row grid */
.sd-grid-3 {
  grid-template-columns: repeat(3, 1fr);
}

/* ─────────────────────────────────────────
   Service detail — image left + text right
───────────────────────────────────────── */
.sd-feature {
  display: flex;
  gap: 28px;
  align-items: flex-start;
  margin-bottom: 28px;
}

.sd-feature-img {
  width: 300px;
  flex-shrink: 0;
  border: 2px solid #c8d8ec;
}

.sd-feature-img img {
  width: 100%;
  display: block;
}

.sd-feature-text {
  flex: 1;
  min-width: 0;
  font-size: 13px;
  color: var(--text);
  line-height: 1.75;
}

.sd-feature-text p {
  margin-bottom: 14px;
}

.sd-feature-text a {
  color: var(--blue-link);
}

.sd-feature-text ul {
  list-style: disc;
  padding-left: 18px;
  margin-bottom: 14px;
}

.sd-feature-text ul li {
  margin-bottom: 4px;
}

/* ─────────────────────────────────────────
   Responsive
───────────────────────────────────────── */
@media (max-width: 700px) {
  .sd-grid { grid-template-columns: repeat(2, 1fr); }
  .sd-feature { flex-direction: column; }
  .sd-feature-img { width: 100%; }
}

@media (max-width: 460px) {
  .sd-grid { grid-template-columns: 1fr; }
  .sd-img { height: 200px; }
}

/* ─────────────────────────────────────────
   Company page
───────────────────────────────────────── */
.company-section-title {
  font-size: 22px;
  font-weight: 700;
  color: var(--blue-primary);
  margin-bottom: 18px;
}

.company-main-img {
  width: 100%;
  max-width: 540px;
  height: 300px;
  object-fit: cover;
  object-position: center;
  display: block;
  border: 2px solid #c8d8ec;
  margin-bottom: 22px;
}

.company-text {
  font-size: 13px;
  color: var(--text);
  line-height: 1.75;
  margin-bottom: 28px;
}

.company-text p {
  margin-bottom: 14px;
}

.company-text a {
  color: var(--blue-link);
}

.company-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  margin-top: 8px;
}

.company-grid-img {
  overflow: hidden;
  border: 2px solid #c8d8ec;
}

.company-grid-img img {
  width: 100%;
  height: 190px;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform .3s, opacity .2s;
}

.company-grid-img:hover img {
  transform: scale(1.04);
  opacity: .9;
}

@media (max-width: 700px) {
  .company-grid { grid-template-columns: repeat(2, 1fr); }
  .company-main-img { max-width: 100%; height: 220px; }
}

@media (max-width: 460px) {
  .company-grid { grid-template-columns: 1fr; }
}