/* 
   STM Series Modern Professional Layout
   Designed for desktop-first experience with robust mobile fallback.
*/

:root {
    --stm-maroon: #b22222;
    --stm-dark-grey: #333333;
    --stm-light-grey: #f9f9f9;
    --stm-border-color: #e0e0e0;
    --stm-container-width: 1200px;
    --stm-spacing: 40px;
}

/* Base Wrapper */
.stm-page-wrapper {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: var(--stm-dark-grey);
    line-height: 1.6;
    background: #fff;
    padding-bottom: 80px;
}

.stm-container {
    max-width: var(--stm-container-width);
    margin: 0 auto;
    padding: 0 20px;
}

.product-back-nav {
    margin: 24px auto 8px;
}

.product-back-link,
.datasheet-download-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--stm-maroon);
    font-weight: 700;
    text-decoration: none;
}

.product-back-link:hover,
.datasheet-download-link:hover {
    color: #7d1717;
}

.datasheet-download-section {
    margin-bottom: 60px;
}

.datasheet-download-box {
    display: flex;
    flex-wrap: wrap;
    gap: 18px 28px;
    align-items: center;
    justify-content: space-between;
    background: var(--stm-light-grey);
    border-left: 4px solid var(--stm-maroon);
    padding: 24px 28px;
}

.datasheet-download-box h3 {
    margin: 0 0 6px;
    color: #000;
    font-size: 1.25rem;
}

.datasheet-download-box p {
    margin: 0;
}

/* Hero / Header Section */
.stm-hero {
    text-align: center;
    padding: 60px 0;
    background: var(--stm-light-grey);
    border-bottom: 1px solid var(--stm-border-color);
    margin-bottom: 60px;
}

.stm-hero h1 {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 20px;
    color: #000;
}

.stm-hero .stm-subtitle {
    font-size: 1.25rem;
    color: var(--stm-maroon);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.stm-hero p {
    max-width: 800px;
    margin: 0 auto 30px;
    font-size: 1.1rem;
}

/* Common Divider */
.stm-divider {
    width: 60px;
    height: 3px;
    background: var(--stm-maroon);
    margin: 20px 0 30px;
}

.stm-divider--centered {
    margin: 20px auto 30px;
}

/* Product Section Card */
.stm-section {
    margin-bottom: 80px;
}

.stm-section-title {
    font-size: 1.8rem;
    font-weight: 700;
    margin-bottom: 40px;
    border-bottom: 2px solid var(--stm-border-color);
    padding-bottom: 10px;
    display: inline-block;
}

/* Two-Column Grid */
.stm-product-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 60px;
    align-items: flex-start;
}

.stm-product-column {
    flex: 1 1 450px;
    min-width: 320px;
}

/* Image Styling */
.stm-image-wrapper {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 25px;
    box-shadow: none;
    flex-wrap: nowrap;
}

.stm-image-wrapper img {
    width: auto;
    max-width: 100%;
    max-height: 250px;
    height: auto;
    object-fit: contain;
    flex-shrink: 1;
    min-width: 0;
}

/* Content Styling */
.stm-product-info h3 {
    font-size: 1.5rem;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 15px;
    color: #000;
    letter-spacing: 0.5px;
}

/* List Styling */
.stm-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.stm-list-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 12px;
    font-size: 1rem;
}

.stm-list-icon {
    color: #c0392b;
    margin-right: 10px;
    margin-top: 0px;
    flex-shrink: 0;
    font-size: 1.2rem;
    font-weight: 900;
    line-height: 1.1;
}

/* Options & Tips Grid */
.stm-options-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 40px;
    align-items: start;
    background: var(--stm-light-grey);
    padding: 50px;
    border-radius: 12px;
}

.stm-options-grid > .stm-product-info {
    align-self: start;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 100%;
}

.stm-options-grid .stm-product-info h3 {
    margin: 0 0 14px;
}

.stm-options-grid .stm-divider {
    margin: 0 0 28px;
}

.stm-options-grid .stm-product-info p {
    margin-top: 0;
}

/* Mobile Adjustments */
@media (max-width: 992px) {
    .stm-product-grid {
        flex-direction: column;
        gap: 40px;
    }
    .stm-page-wrapper {
        padding-bottom: 30px !important;
    }
    .stm-options-grid {
        padding: 20px !important;
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
    .stm-section {
        margin-bottom: 20px !important;
    }
    .stm-hero {
        padding: 30px 15px !important;
        margin-bottom: 20px !important;
    }
    .stm-hero h1 {
        font-size: 1.6rem !important;
    }
    .stm-product-column {
        min-width: 0 !important;
        width: 100% !important;
        flex: none !important;
        margin-bottom: 20px;
    }
    .stm-product-grid {
        gap: 20px !important;
        display: block !important;
    }
}

@media (max-width: 480px) {
    .stm-section-title {
        font-size: 1.5rem;
    }
    .stm-product-info h3 {
        font-size: 1.3rem;
    }
    .stm-list-item {
        font-size: 0.95rem;
    }
}

/* Kracht-inspired clean layout wrapper */
.kracht-product-block {
    margin-bottom: 80px;
    padding-bottom: 40px;
    border-bottom: 1px solid #eee;
}
.kracht-product-block:last-child {
    border-bottom: none;
}

/* Product header and left-aligned accent lines */
.kracht-product-header {
    margin-bottom: 30px;
    text-align: left;
}

.kracht-product-header h2 {
    font-size: 2rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #333333;
    margin: 0 0 10px 0;
    letter-spacing: 0.5px;
}

.kracht-accent-line {
    width: 60px;
    height: 3px;
    background-color: var(--stm-maroon);
    margin: 10px 0 20px 0;
}

.kracht-tagline {
    font-size: 1.1rem;
    color: #666;
    line-height: 1.6;
    margin-bottom: 30px;
    max-width: 900px;
}

/* Left-aligned product image wrapper */
.kracht-product-image {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 40px;
    box-shadow: none;
    max-width: 100%;
    flex-wrap: nowrap;
}

.kracht-product-image img {
    width: auto;
    max-width: 100%;
    max-height: 250px;
    height: auto;
    object-fit: contain;
    flex-shrink: 1;
    min-width: 0;
}

/* Clean 2-column detail grid directly below the image */
.kracht-details-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    margin-top: 20px;
}

.kracht-column {
    display: flex;
    flex-direction: column;
    gap: 35px;
}

.kracht-sub-section h3 {
    font-size: 1.25rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #333333;
    margin: 0 0 10px 0;
    letter-spacing: 0.5px;
}

.kracht-accent-line-sub {
    width: 35px;
    height: 2px;
    background-color: var(--stm-maroon);
    margin: 8px 0 15px 0;
}

/* Custom list items with arrow symbol */
.kracht-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.kracht-list li {
    display: flex;
    align-items: flex-start;
    margin-bottom: 12px;
    font-size: 1rem;
    color: var(--stm-dark-grey, #333333);
    line-height: 1.5;
}

.kracht-arrow {
    color: var(--stm-maroon);
    margin-right: 12px;
    font-weight: 700;
    flex-shrink: 0;
}

/* Document-style product/spec pairing */
.doc-style-spec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    gap: 28px;
    align-items: start;
}

.doc-style-image-row {
    width: 100%;
    min-height: 150px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 26px;
    margin: 0 0 18px;
    background: transparent;
    border: none;
    padding: 0;
    box-shadow: none;
}

.doc-style-image-row img {
    width: auto;
    max-width: 46%;
    max-height: 170px;
    height: auto;
    object-fit: contain;
}

.doc-style-image-row--device img {
    max-width: min(100%, 260px);
    max-height: 150px;
}

.doc-style-image-row--wide {
    min-height: 140px;
}

.doc-style-image-row--wide img {
    max-width: 24%;
    max-height: 150px;
}

.doc-style-image-row--hp-three img {
    max-width: 30%;
    max-height: 170px;
}

.doc-style-image-row--hp-four img {
    max-width: 23%;
    max-height: 160px;
}

.doc-style-image-row--hp-device img {
    max-width: min(100%, 220px);
    max-height: 165px;
}

.doc-style-hp-spec-grid {
    max-width: 1040px;
    margin-left: 0;
    margin-right: auto;
}

.doc-style-spec-grid .kracht-sub-section {
    margin-top: 0;
}

.doc-style-product-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px 42px;
    align-items: start;
    max-width: 1040px;
}

.doc-style-product-grid .stm-image-wrapper {
    min-height: 150px;
}

.doc-style-product-grid .stm-image-wrapper img {
    width: auto;
    max-width: 48%;
    max-height: 170px;
    object-fit: contain;
}

.doc-style-product-grid .stm-image-wrapper img:only-child {
    max-width: 100%;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .kracht-details-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .kracht-product-header h2 {
        font-size: 1.6rem;
    }
    
    .kracht-product-image {
        width: 100%;
        max-width: 100%;
    }

    .doc-style-spec-grid {
        grid-template-columns: 1fr;
    }

    .doc-style-image-row,
    .doc-style-image-row--wide {
        min-height: 0;
        flex-wrap: nowrap;
        gap: 16px;
    }

    .doc-style-image-row img,
    .doc-style-image-row--device img,
    .doc-style-image-row--wide img,
    .doc-style-image-row--hp-three img,
    .doc-style-image-row--hp-four img,
    .doc-style-image-row--hp-device img {
        flex: 1 1 0;
        min-width: 0;
        max-width: 100%;
        max-height: 160px;
    }

    .doc-style-product-grid {
        grid-template-columns: 1fr;
    }
}

/* Page smooth scroll */
html {
    scroll-behavior: smooth;
}

/* Kracht-inspired Hero section below banner */
.kracht-hero-section {
    padding: 60px 0 45px 0;
    text-align: left;
}

.kracht-hero-section h1 {
    font-size: 2.4rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #333333;
    margin: 0;
    letter-spacing: 0.5px;
    line-height: 1.2;
}

.kracht-hero-section .kracht-accent-line {
    width: 60px;
    height: 3px;
    background-color: var(--stm-maroon);
    margin: 15px 0 25px 0;
}

.kracht-hero-subtitle {
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #333333;
    margin: 0 0 15px 0;
    letter-spacing: 0.5px;
}

.kracht-hero-desc {
    font-size: 1.05rem;
    line-height: 1.65;
    color: #555555;
    max-width: 950px;
    margin: 0 0 35px 0;
}

/* Quick jump links styling */
.kracht-jump-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.kracht-jump-menu li {
    display: flex;
    align-items: center;
}

.kracht-jump-menu a {
    color: #333333;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    transition: color 0.2s ease, transform 0.2s ease;
}

.kracht-jump-menu a:hover {
    color: var(--stm-maroon);
    transform: translateX(4px);
}

.kracht-jump-menu .jump-arrow {
    color: var(--stm-maroon);
    margin-right: 12px;
    font-weight: 700;
    font-size: 1rem;
}

/* ==========================================================================
   Elementor Swiper Banner Layout & Shape Divider Styles
   Universal rules extracted from post-18496840.css to resolve collapsed layout
   ========================================================================== */

.elementor-element.elementor-element-7b1527e {
    --display: flex;
    --min-height: 0px;
    --flex-direction: column;
    --container-widget-width: 100%;
    --container-widget-height: initial;
    --container-widget-flex-grow: 0;
    --container-widget-align-self: initial;
    --flex-wrap-mobile: wrap;
    border-style: none;
    --border-style: none;
    --margin-top: 0px;
    --margin-bottom: 0px;
    --margin-left: 0px;
    --margin-right: 0px;
    --padding-top: 0px;
    --padding-bottom: 0px;
    --padding-left: 0px;
    --padding-right: 0px;
    position: relative;
    width: 100%;
}

.elementor-element.elementor-element-7b1527e > .elementor-shape-bottom svg, 
.elementor-element.elementor-element-7b1527e > .e-con-inner > .elementor-shape-bottom svg {
    width: calc(100% + 1.3px);
    height: 84px;
}

.elementor-element.elementor-element-7b1527e > .elementor-shape-bottom, 
.elementor-element.elementor-element-7b1527e > .e-con-inner > .elementor-shape-bottom {
    z-index: 2;
    pointer-events: none;
}

.elementor-element.elementor-element-4211593 {
    --display: flex;
    --min-height: 0px;
    --flex-direction: column;
    --container-widget-width: 100%;
    --container-widget-height: initial;
    --container-widget-flex-grow: 0;
    --container-widget-align-self: initial;
    --flex-wrap-mobile: wrap;
    --padding-top: 0px;
    --padding-bottom: 0px;
    --padding-left: 0px;
    --padding-right: 0px;
    position: relative;
    width: 100%;
}

.elementor-element.elementor-element-4211593 > .elementor-shape-bottom svg, 
.elementor-element.elementor-element-4211593 > .e-con-inner > .elementor-shape-bottom svg {
    width: calc(100% + 1.3px);
    height: 90px;
}

.elementor-element.elementor-element-4211593 > .elementor-shape-bottom, 
.elementor-element.elementor-element-4211593 > .e-con-inner > .elementor-shape-bottom {
    z-index: 2;
    pointer-events: none;
}

.elementor-element.elementor-element-d5528cd {
    --e-image-carousel-slides-to-show: 1;
    width: 100%;
}

@media(min-width:768px){
    .elementor-element.elementor-element-7b1527e {
        --width: 100%;
    }
}

/* ==========================================================================
   Product detail pages: title -> description -> points -> product blocks
   ========================================================================== */

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-hero-section {
    max-width: 980px;
    padding: 56px 0 42px;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-hero-section h1 {
    margin-bottom: 14px !important;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-hero-desc {
    max-width: 920px;
    margin-bottom: 28px !important;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-jump-menu {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding-top: 20px !important;
    border-top: 1px solid var(--stm-border-color);
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-section {
    margin-bottom: 64px;
    padding-bottom: 44px;
    border-bottom: 1px solid var(--stm-border-color);
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-section:last-of-type {
    border-bottom: 0;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-section-title,
body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-product-header h2 {
    display: flex;
    align-items: baseline;
    gap: 12px;
    width: 100%;
    margin-bottom: 26px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--stm-border-color);
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-product-header {
    margin-bottom: 18px;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-product-header .kracht-accent-line {
    display: none !important;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-tagline {
    max-width: 900px;
    margin: 0 0 26px;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-product-grid {
    display: block !important;
}

@media (min-width: 992px) {
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) #stm-series .stm-overview-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 42px !important;
        align-items: start !important;
        max-width: 1040px;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) #stm-series .stm-product-column {
        min-width: 0 !important;
        width: auto !important;
        margin-bottom: 0 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) #stm-series .stm-overview-full {
        grid-column: 1 / -1;
        max-width: 720px;
        margin-top: 8px;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-product-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 34px 42px !important;
        align-items: start !important;
        max-width: 1040px !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-product-grid .stm-product-column {
        min-width: 0 !important;
        width: auto !important;
        margin-bottom: 0 !important;
    }
}


/* Stacking details on mobile/tablet */
@media (max-width: 991px) {
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-details-grid {
        display: block !important;
    }
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-column {
        width: 100%;
        min-width: 0;
        margin-bottom: 28px;
    }
}

/* Side-by-side details on desktop */
@media (min-width: 992px) {
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-details-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 50px !important;
    }
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-column:first-child {
        width: 100% !important;
        margin-bottom: 0 !important;
    }
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-column:nth-child(2) {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 45px !important;
        width: 100% !important;
        margin-bottom: 0 !important;
    }
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-column:nth-child(2) .kracht-sub-section {
        margin-top: 0 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-details-grid.doc-style-spec-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 34px 42px !important;
        align-items: start !important;
        max-width: 1040px !important;
        margin-left: 0 !important;
        margin-right: auto !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid .kracht-column:first-child {
        display: flex !important;
        flex-direction: column !important;
        gap: 35px !important;
        width: 100% !important;
        margin-bottom: 0 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid .kracht-column:nth-child(2) {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 35px 36px !important;
        align-items: start !important;
        width: 100% !important;
        margin-bottom: 0 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid .kracht-column:nth-child(2) .kracht-sub-section:first-child {
        grid-column: 1 / -1 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column,
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:first-child,
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:nth-child(2) {
        display: contents !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:first-child > .kracht-sub-section:first-child {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:nth-child(2) > .kracht-sub-section:first-child {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:nth-child(2) > .kracht-sub-section:nth-child(2) {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:nth-child(2) > .kracht-sub-section:nth-child(3) {
        grid-column: 2 !important;
        grid-row: 2 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid .doc-style-image-row {
        justify-content: flex-start !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid .doc-style-image-row--device img {
        max-width: 280px !important;
    }
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-product-column,
body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-column {
    width: 100%;
    min-width: 0;
    margin-bottom: 28px;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-image-wrapper,
body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-product-image {
    width: min(100%, 800px);
    max-width: 800px;
    margin: 0 0 26px;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-image-wrapper img,
body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-product-image img {
    width: auto;
    max-width: 100%;
    min-width: 0;
    height: auto;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-product-info,
body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-sub-section {
    max-width: 920px;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-sub-section + .kracht-sub-section,
body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-product-info + .stm-product-info {
    margin-top: 28px;
}

body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-options-grid > .stm-product-info + .stm-product-info {
    margin-top: 0 !important;
}

@media (max-width: 768px) {
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-hero-section {
        padding: 34px 0 28px;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-section-title,
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-product-header h2 {
        font-size: 1.45rem;
        gap: 8px;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-section {
        margin-bottom: 36px !important;
        padding-bottom: 30px;
    }
}

/* Mobile responsive rules for TCF, Wafer, HP variants flow row */
@media (max-width: 767px) {
    .stm-image-wrapper,
    .kracht-product-image {
        flex-wrap: nowrap !important;
        gap: 15px !important;
        overflow: hidden !important;
    }
    .stm-image-wrapper img,
    .kracht-product-image img {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        max-width: 100% !important;
        max-height: 180px !important;
        object-fit: contain !important;
    }
}

@media (max-width: 767px) {
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-image-row,
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-image-wrapper,
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-product-image {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-image-row img,
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .stm-image-wrapper img,
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-product-image img {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
    }
}

/* Final document-style grid: technical pair on row 1, supporting pair on row 2 */
@media (min-width: 992px) {
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-details-grid.doc-style-spec-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-template-rows: auto auto !important;
        gap: 38px 44px !important;
        align-items: start !important;
        max-width: 1040px !important;
        margin-left: 0 !important;
        margin-right: auto !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .kracht-details-grid.doc-style-hp-spec-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 38px 44px !important;
        align-items: start !important;
        max-width: 1040px !important;
        margin-left: 0 !important;
        margin-right: auto !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-hp-spec-grid > .kracht-sub-section {
        max-width: none !important;
        margin-top: 0 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column,
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:first-child,
    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:nth-child(2) {
        display: contents !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:first-child > .kracht-sub-section:first-child {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:nth-child(2) > .kracht-sub-section:first-child {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:nth-child(2) > .kracht-sub-section:nth-child(2) {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid > .kracht-column:nth-child(2) > .kracht-sub-section:nth-child(3) {
        grid-column: 2 !important;
        grid-row: 2 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid.doc-style-spec-grid--left-device > .kracht-column:first-child > .kracht-sub-section:nth-child(2) {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid.doc-style-spec-grid--left-device > .kracht-column:nth-child(2) > .kracht-sub-section:first-child {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }

    body:is(.page-id-1451, .page-id-1581, .page-id-1511, .page-id-1634, .page-id-1680, .elementor-page-1398, .elementor-page-1388) .doc-style-spec-grid.doc-style-spec-grid--left-device > .kracht-column:nth-child(2) > .kracht-sub-section:nth-child(2) {
        grid-column: 2 !important;
        grid-row: 2 !important;
    }
}