/* SABOTAGE product-only editorial layouts. The separate tuning guide stays unchanged. */
.sbtg-product .sbtg-hero-grid { grid-template-columns:1fr 1fr; gap:56px; }
.sbtg-sail-profile { margin:0; padding:18px; background:#f0f0f3; border:1px solid #dddde5; }
.sbtg-sail-profile img { width:100%; height:auto; max-height:600px; object-fit:contain; }
.sbtg-sail-profile figcaption { padding:12px 0 0; font-size:11px; color:#575762; text-align:center; }
.sbtg-editorial-heading { margin-bottom:36px; }
.sbtg-editorial-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:60px; align-items:start; }
.sbtg-editorial-image { margin:0; min-width:0; }
.sbtg-editorial-copy .sbtg-pullquote { margin:0 0 28px; }
.sbtg-product #features .sbtg-pattern-copy { display:block; margin:0; }
.sbtg-product #features .sbtg-pattern-copy > div + div { margin-top:28px; }
.sbtg-product .sbtg-feature-showcase { display:block; min-height:0; margin-top:45px; }
.sbtg-product .sbtg-feature-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.sbtg-product .sbtg-feature-grid article { border-bottom:0; padding:25px; }
.sbtg-product .sbtg-feature-grid article:first-child { border-left:0; }
.sbtg-product .sbtg-feature-grid h3 { font-size:17px; }
.sbtg-product .sbtg-feature-grid p { font-size:13px; }
.sbtg-product .sbtg-development-grid { grid-template-columns:1fr; margin-top:28px; }
.sbtg-product .sbtg-development-grid article { padding:22px; }
.sbtg-product .sbtg-editorial-copy > p:first-child { margin-top:0; }
@media(max-width:1000px) { .sbtg-product .sbtg-hero-grid,.sbtg-editorial-row { gap:32px; } .sbtg-product .sbtg-feature-grid { grid-template-columns:1fr 1fr; } .sbtg-product .sbtg-feature-grid article { border-bottom:1px solid #d8d8e0; }}
@media(max-width:760px) { .sbtg-product .sbtg-hero-grid,.sbtg-editorial-row { grid-template-columns:1fr; } .sbtg-sail-profile { padding:12px; } .sbtg-sail-profile img { max-height:none; } .sbtg-editorial-heading { margin-bottom:26px; }.sbtg-editorial-copy { order:0; } .sbtg-editorial-image { order:1; } .sbtg-product .sbtg-feature-grid { grid-template-columns:1fr; } }

/* Compact horizontal section navigation, with an explicit touch-sized overflow cue. */
.sbtg-product .sbtg-section-nav-container { position:relative; display:block; min-width:0; }
.sbtg-product .sbtg-section-links { display:flex; gap:25px; align-items:center; overflow-x:auto; scrollbar-width:thin; overscroll-behavior-x:contain; padding-right:2px; }
.sbtg-product .sbtg-section-links a { display:inline-flex; align-items:center; flex-shrink:0; min-height:44px; }
.sbtg-product .sbtg-section-links:focus-visible { outline:2px solid #1677aa; outline-offset:2px; }
.sbtg-product .sbtg-nav-more { display:flex; position:absolute; inset:0 0 0 auto; align-items:center; justify-content:center; width:44px; border:0; color:#292934; background:linear-gradient(90deg,rgba(250,250,253,.55),#fafafd 35%); cursor:pointer; font-size:20px; padding:0 0 0 7px; }
.sbtg-product .sbtg-nav-more[hidden] { display:none; }
.sbtg-product .sbtg-section-nav-container.has-more .sbtg-section-links { padding-right:48px; }
@media(min-width:761px) { .sbtg-product .sbtg-nav .section-shell { padding-block:0; } }
@media(max-width:760px) {
  .sbtg-product .sbtg-nav .section-shell { display:grid; grid-template-columns:auto minmax(0,1fr); gap:16px; overflow:visible; padding-block:0; }
  .sbtg-product .sbtg-nav .section-shell > div { min-width:0; }
  .sbtg-product .sbtg-section-links { gap:20px; scrollbar-width:none; scroll-padding-inline:4px 40px; }
  .sbtg-product .sbtg-section-links::-webkit-scrollbar { display:none; }
  .sbtg-product .sbtg-nav .section-shell > a { display:inline-flex; align-items:center; min-height:44px; }
}

/* Owner-supplied SMAR design views: preserve complete geometry and native enlargement. */
.sbtg-smar-views { min-width:0; scroll-margin-top:90px; }
.sbtg-smar-primary { margin:0; }
.sbtg-smar-enlarge { display:block; text-decoration:none; }
.sbtg-smar-enlarge img { width:100%; height:auto; object-fit:contain; background:#e9e9e9; border:1px solid #d9d9e1; }
.sbtg-smar-enlarge > span { display:block; padding:9px 0 12px; font-size:11px; font-weight:600; text-align:right; }
.sbtg-smar-legend { display:flex; flex-wrap:wrap; gap:8px 20px; list-style:none; padding:14px 0; margin:0 0 8px; border-top:1px solid #d9d9e1; }
.sbtg .sbtg-smar-legend li { display:flex; align-items:center; gap:9px; margin:0; font-size:11px; line-height:1.5; }
.sbtg-smar-line { flex:none; width:25px; height:3px; background:currentColor; }
.sbtg-smar-red { color:#e00000; }
.sbtg-smar-blue { color:#0033c4; }
.sbtg-smar-primary figcaption > strong { display:block; font-size:14px; line-height:1.5; }
.sbtg-smar-primary figcaption > p { margin:9px 0 0; font-size:12px; line-height:1.7; }
.sbtg-smar-secondary { display:grid; grid-template-columns:110px minmax(0,1fr); gap:20px; align-items:center; padding-top:20px; margin-top:22px; border-top:1px solid #d9d9e1; text-decoration:none; }
.sbtg-smar-secondary img { display:block; width:110px; height:auto; object-fit:contain; border:1px solid #d9d9e1; }
.sbtg-smar-secondary strong { font-size:14px; line-height:1.5; }
.sbtg-smar-secondary > span > span { display:block; margin:7px 0; font-size:12px; line-height:1.6; }
.sbtg-smar-secondary b { display:block; font-size:11px; font-weight:600; }
.sbtg-smar-enlarge:hover > span,.sbtg-smar-secondary:hover b { text-decoration:underline; }
@media(max-width:760px) {
  .sbtg-smar-primary figcaption > p { font-size:13px; }
  .sbtg-smar-secondary { grid-template-columns:105px minmax(0,1fr); gap:16px; }
  .sbtg-smar-secondary img { width:105px; }
  .sbtg-smar-enlarge > span { min-height:44px; display:flex; justify-content:flex-end; align-items:center; gap:5px; padding-block:8px; }
}

/* Supporting physical construction gallery, following the SMAR explanation. */
.sbtg-construction-details { max-width:860px; margin:60px auto 0; scroll-margin-top:95px; }
.sbtg-construction-head { margin-bottom:28px; }
.sbtg-construction-head > h3 { font-size:clamp(22px,2.4vw,28px); line-height:1.3; margin:10px 0 16px; }
.sbtg-construction-head > p:last-child { font-size:14px; line-height:1.7; margin:0; }
.sbtg-construction-photo { min-width:0; margin:0; }
.sbtg-construction-enlarge { display:block; text-decoration:none; }
.sbtg-construction-enlarge img { display:block; width:100%; height:auto; object-fit:contain; background:#f3f3f5; }
.sbtg-construction-enlarge > span { display:flex; gap:5px; justify-content:flex-end; align-items:center; padding:8px 0; font-size:11px; font-weight:600; }
.sbtg-construction-enlarge:hover > span { text-decoration:underline; }
.sbtg-construction-photo figcaption h4 { margin:4px 0 6px; font-size:14px; font-weight:600; line-height:1.5; }
.sbtg-construction-photo figcaption p { font-size:12px; line-height:1.6; margin:0; }
.sbtg-construction-support { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; margin-top:28px; }
@media(max-width:760px) {
  .sbtg-construction-details { margin-top:42px; }
  .sbtg-construction-head { margin-bottom:24px; }
  .sbtg-construction-support { grid-template-columns:minmax(0,1fr); gap:28px; }
  .sbtg-construction-photo figcaption p { font-size:13px; }
  .sbtg-construction-enlarge > span { min-height:44px; }
}

/* Text-only Design Philosophy: compact principles with comfortable line lengths. */
.sbtg-design-text .sbtg-pullquote { margin:0 0 32px; }
.sbtg-design-text .sbtg-principles { grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; }
.sbtg-design-text .sbtg-principles article { padding:0 0 24px; }
@media(max-width:760px) {
  .sbtg-design-text .sbtg-principles { grid-template-columns:minmax(0,1fr); gap:24px; }
  .sbtg-design-text .sbtg-pullquote { margin-bottom:28px; }
}

/* Final product-page cleanup: readable active navigation and text-only development. */
.sbtg-product .site-header nav a[aria-current="page"] { color:var(--black); text-decoration:underline; text-decoration-color:var(--cyan); text-decoration-thickness:2px; text-underline-offset:6px; }
.sbtg-development-text > p { margin-top:0; }
.sbtg-development-text .sbtg-development-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media(max-width:760px) {
  .sbtg-development-text .sbtg-development-grid { grid-template-columns:minmax(0,1fr); }
}
