/* ETC responsive shell, 30.10.2026.
 * Presentation only. Four IDs intentionally outrank legacy theme layers.
 * Outer surfaces fill the viewport; text and forms retain readable line lengths.
 */
html#etc-ds#etc-ds#etc-ds#etc-ds {
  --etc-shell-wide: 100%;
  --etc-shell-commerce: 100%;
  --etc-shell-gutter: clamp(20px, 2.5vw, 64px);
}
html#etc-ds#etc-ds#etc-ds#etc-ds :where(
  .container, .etc-header-2026 .eh-container,
  .ec-page, .ec-home, .ec-mainhero, .ec-home-services,
  #etc-new-wrap, #etc-featured-wrap, #etc-widgets-wrap, #etc-news-wrap, #etc-brands-wrap,
  .etc-pay-wrap, .etc-acc__wrap, .etc-learn, .etc-training-section, body > .page
) {
  box-sizing: border-box;
  width: calc(100% - var(--etc-shell-gutter) * 2) !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  min-width: 0;
}
/* Nested modules share the outer gutter, rather than adding another inset. */
html#etc-ds#etc-ds#etc-ds#etc-ds :is(.container, .ec-page, .etc-acc__wrap) .container,
html#etc-ds#etc-ds#etc-ds#etc-ds :is(#etc-new-wrap, #etc-featured-wrap, #etc-news-wrap, #etc-widgets-wrap) > .container,
html#etc-ds#etc-ds#etc-ds#etc-ds .container .etc-acc__wrap {
  width: 100% !important;
  max-width: none !important;
}
html#etc-ds#etc-ds#etc-ds#etc-ds .etc-header-2026 .eh-main { gap: clamp(16px, 2vw, 38px); }
html#etc-ds#etc-ds#etc-ds#etc-ds .etc-header-2026 .eh-search { flex: 1 1 auto; min-width: 180px; }
html#etc-ds#etc-ds#etc-ds#etc-ds .etc-header-2026 .eh-directory { justify-content: space-between; }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-mainhero { min-height: 320px; }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-mainhero__copy { padding: clamp(28px, 2.25vw, 42px); }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-mainhero__image { max-height: 360px; object-fit: contain; }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home { min-height: 300px; }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home h2 { font-size: clamp(28px, 2.25vw, 44px); }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home-category strong { font-size: 14px; }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home-category__body { padding: clamp(18px, 1.5vw, 28px); }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home-category > img { min-height: 190px; }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home-service { padding: clamp(24px, 2.25vw, 40px); }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home-service p { max-width: 65ch; }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-card-body { padding: clamp(22px, 2vw, 36px); }
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-card h2,
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-card h3 { overflow-wrap: anywhere; }
/* Floating contact tools stay at the viewport edge, clear of the content gutter. */
html#etc-ds#etc-ds#etc-ds#etc-ds .etc-social-dock { right: 6px !important; }
/* Keep prose readable inside the shared full-width page shell. */
html#etc-ds#etc-ds#etc-ds#etc-ds article.container > :is(h1, .edit-article, .card, .pageItem) {
  max-width: 1000px;
  margin-left: 0;
  margin-right: 0;
}
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-description > p,
html#etc-ds#etc-ds#etc-ds#etc-ds .ec-description > ul { max-width: 90ch; }
@media (min-width: 1600px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-mainhero h1 { font-size: clamp(44px, 2.75vw, 56px) !important; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-mainhero__copy > p { font-size: 18px; max-width: 620px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home-category { grid-template-columns: 44% 56%; }
}
@media (max-width: 1199px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-header-2026 .eh-main { gap: 14px; }
}
@media (max-width: 991px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-header-2026 .eh-main { gap: 8px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-header-2026 .eh-search { min-width: 0; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-grid { gap: 16px; }
}
@media (max-width: 767px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds { --etc-shell-gutter: 16px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-page { padding-top: 20px; padding-bottom: 40px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-mainhero { min-height: 0; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-mainhero__copy { padding: 26px 22px 0; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-mainhero__image { max-height: 260px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home { min-height: 0; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home h2 { font-size: 28px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home-category > img { min-height: 150px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home-category__body { padding: 18px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home-category strong { font-size: 13px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-card-body { padding: 22px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-nav a { margin: 0; min-height: 44px; padding: 10px 12px; border-radius: 12px; text-align: center; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-button { min-height: 48px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-social-dock { right: 4px !important; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-trust { gap: 12px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds :is(.ec-page, .product-info-page, article.container) { overflow-wrap: anywhere; }
}

@media (min-width: 768px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home-copy { padding: 28px 40px; }
}
@media (max-width: 767px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home-copy { padding: 24px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home h2 { font-size: 26px; letter-spacing: -.7px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home p { font-size: 14px; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .ec-home .ec-button { width: 100%; padding: 12px 14px; font-size: 14px; }
  /* Contacts remain available in the header menu and footer; no floating overlay on touch controls. */
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-social-dock { display: none !important; }
}

html#etc-ds#etc-ds#etc-ds#etc-ds .page > .pageContent,
html#etc-ds#etc-ds#etc-ds#etc-ds .page .etc-acc__wrap { width: 100% !important; max-width: none !important; }
html#etc-ds#etc-ds#etc-ds#etc-ds .page > h1 { padding-inline: 0 !important; }
@media (min-width: 1200px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-cat-gates { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (max-width: 767px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds .btn-scroll-top { display: none !important; }
}

html#etc-ds#etc-ds#etc-ds#etc-ds .etc-training-section .etc-training-card { width: 100% !important; max-width: none !important; margin-inline: 0 !important; }

/* Product photo must not push price and purchase controls below a tablet screen. */
html#etc-ds#etc-ds#etc-ds#etc-ds .etc-photo-wrap { min-height: 0 !important; }
html#etc-ds#etc-ds#etc-ds#etc-ds .etc-main-photo { width: 100% !important; height: auto !important; max-height: 520px !important; object-fit: contain !important; aspect-ratio: auto !important; }
@media (min-width: 768px) and (max-width: 991px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-product-card > .row > .col-lg-5 { flex: 0 0 40%; width: 40%; max-width: 40%; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-product-card > .row > .col-lg-7 { flex: 0 0 60%; width: 60%; max-width: 60%; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-main-photo { max-height: 320px !important; }
}
@media (max-width: 767px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-main-photo { max-height: 280px !important; }
}

/* Keep floating contacts entirely in the outer gutter. Narrow layouts use header/footer contacts. */
@media (max-width: 1599px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-social-dock { display: none !important; }
}
@media (min-width: 1600px) {
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-social-dock { right: 3px !important; width: 34px !important; padding: 0 !important; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-social-actions { width: 32px !important; }
  html#etc-ds#etc-ds#etc-ds#etc-ds .etc-social-action { width: 32px !important; min-width: 32px !important; height: 40px !important; padding: 0 !important; }
}