/* Webtick Blog — shared quality layer v3.1.0 */
html { scroll-padding-top: 96px; }

body:not(.wtb-story-home) :focus-visible {
  outline: 2px solid #00e5ff;
  outline-offset: 3px;
}

body:not(.wtb-story-home) ::selection {
  background: rgba(0, 229, 255, .22);
  color: inherit;
}

body:not(.wtb-story-home) .site-main,
body:not(.wtb-story-home) main {
  min-width: 0;
}

body:not(.wtb-story-home) iframe,
body:not(.wtb-story-home) video,
body:not(.wtb-story-home) embed,
body:not(.wtb-story-home) object {
  max-width: 100%;
}

body:not(.wtb-story-home) .article-content > * {
  min-width: 0;
}

body:not(.wtb-story-home) .article-content .wp-block-table {
  overflow-x: auto;
  margin: 32px 0;
}

body:not(.wtb-story-home) .article-content .wp-block-table table {
  margin: 0;
}

body:not(.wtb-story-home) .wp-block-button__link {
  transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}

body:not(.wtb-story-home) .wp-block-button__link:hover {
  transform: translateY(-1px);
  opacity: .94;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body:not(.wtb-story-home) *,
  body:not(.wtb-story-home) *::before,
  body:not(.wtb-story-home) *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

/* Webtick Design Engine — shared primitives */
:root { --wtb-radius: 18px; --wtb-shadow: 0 12px 35px rgba(15,23,42,.08); }
.wtb-page-layout-wide .container { max-width: var(--wtb-container, 1200px); }
.wtb-page-layout-full .page-wrap .container { max-width: none; width: 100%; }
.page-layout-grid { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:40px; align-items:start; }
.page-sidebar { min-width:0; }
.page-cover { overflow:hidden; border-radius:var(--wtb-radius); box-shadow:var(--wtb-shadow); margin:24px 0 32px; }
.page-cover img { display:block; width:100%; height:auto; }
.page-cover--minimal { border-radius:12px; box-shadow:none; }
.page-cover--immersive { border-radius:calc(var(--wtb-radius) * 1.5); min-height:360px; display:flex; align-items:center; }
.page-cover--immersive img { width:100%; height:clamp(360px,55vw,680px); object-fit:cover; }
@media (max-width: 900px) { .page-layout-grid { grid-template-columns:1fr; } .page-sidebar { order:2; } }