/* PRODUCT AND QUOTE BOX STYLING */
.product_image,
.quote_box {
    border-radius: 20px; /* Rounded corners for visual appeal */
}

/* FORM ERROR STYLING (SEARCH FIELD REMOVED) */
.orange_hsform .error .hs-input {
    border-color: #fff !important; /* White borders for orange themed forms */
}

/* HUBSPOT FORM LIST STYLING */
.hs-form .hs-form-booleancheckbox,
.hs-form .inputs-list {
    list-style: none !important; /* Remove default bullet points from form lists */
}

/* NAVIGATION AND LINK ACCENT COLOURS (SEARCH HOVER REMOVED) */
.fa.fa-fw.fa-angle-left,
.fa.fa-fw.fa-angle-right,
.uncode_breadcrumbs_wrap.bc-separator-pipe .breadcrumb > li + li:not(.paged)::before {
    color: #e74011; /* Brand orange for navigation elements and breadcrumb separators */
}

/* BREADCRUMB STYLING */
.uncode_breadcrumbs_wrap .breadcrumb > li.current,
.uncode_breadcrumbs_wrap .breadcrumb > li > a {
    color: #fff; /* White text for breadcrumb links */
    font-size: 16px; /* Consistent font size */
}

/* PRODUCT IMAGE CONTAINER */
.product_image {
    background-color: #f7f7f7; /* Light grey background */
    padding: 30px; /* Spacing around product images */
}

/* ACCORDION/COLLAPSIBLE ELEMENT STYLING */
.plus-signed.sign-size-rg .panel-title > a > span::after {
    font-size: 1em; /* Standard size for plus/minus icons */
    color: #e74011; /* Brand orange for expand/collapse indicators */
}

/* SCROLL TO TOP BUTTON */
.fa.fa-angle-up.fa-stack.btn-default.btn-hover-nobg {
    background-color: #e74011 !important; /* Orange background */
    border-radius: 10px; /* Rounded corners */
    border: 0; /* Remove default border */
}

/* PROGRESS BAR COMPONENTS */
.progress-container {
    width: 100%; /* Full width container */
    height: 5px; /* Thin progress bar */
    background: #323a45; /* Dark grey background */
}

.progress-bar {
    height: 5px; /* Match container height */
    background: #e74011; /* Orange fill colour */
    width: 0%; /* Start at 0% - will be animated via JavaScript */
}

/* ANIMATED SCROLL INDICATOR */
.scroll-container {
    display: flex;
    flex-direction: column; /* Stack elements vertically */
    align-items: center; /* Centre horizontally */
    height: 200px; /* Fixed container height */
    justify-content: flex-end; /* Align to bottom */
}

.line-container {
    position: relative; /* For absolute positioning of child elements */
    height: 50px; /* Line height */
    width: 5px; /* Thin vertical line */
    align-self: flex-end; /* Align to right edge */
}

.static-line {
    position: absolute; /* Overlay positioning */
    width: 100%; /* Full width of container */
    height: 100%; /* Full height of container */
    background-color: #fff; /* White static line */
}

.animated-line {
    position: absolute; /* Overlay positioning */
    width: 100%; /* Full width of container */
    height: 0; /* Start with no height - will animate */
    background-color: #e74011; /* Orange animated fill */
    animation: 4s ease-in-out infinite fill-line; /* 4 second infinite animation */
    transform-origin: top; /* Animation starts from top */
}

/* OFF-GRID DECORATIVE ELEMENTS */
.off-grid-left,
.off-grid-right {
    position: relative; /* Relative positioning for offset */
    top: -400px; /* Move up to overlay previous content */
    margin-bottom: -300px; /* Negative margin to prevent layout shift */
}

/* FILL LINE ANIMATION KEYFRAMES */
@keyframes fill-line {
    0%,
    100% {
        height: 0; /* Start and end with no height */
    }
    40%,
    60% {
        height: 100%; /* Full height in middle of animation */
    }
}

/* DESKTOP MENU DROPDOWN SIZING */
@media (min-width: 960px) {
    .menu-horizontal ul.menu-smart > li > ul:not(.mega-menu-inner),
    .menu-horizontal ul.menu-smart > li > ul:not(.mega-menu-inner) ul {
        width: 230px !important; /* Fixed width for dropdown menus */
    }
    .menu-horizontal ul.menu-smart > li > ul:not(.mega-menu-inner) ul {
        left: 0; /* Align sub-dropdowns to left edge */
    }
}

/* 3D MODEL DEBUG INFO */
#orbitCoords,
#zoomLevel {
    font-size: 10px; /* Small debug text */
    position: absolute; /* Fixed positioning */
    color: #323a45; /* Dark grey text */
}

#orbitCoords {
    bottom: 20px; /* Bottom left corner */
    left: 20px;
}

#zoomLevel {
    bottom: 20px; /* Bottom right corner */
    right: 20px;
}

/* OFF-GRID POSITIONING */
.off-grid-right {
    right: -75px; /* Extend beyond right edge */
}

.off-grid-left {
    left: -75px; /* Extend beyond left edge */
}

.off-grid-image img {
    max-height: 100%; /* Maintain aspect ratio */
    width: auto; /* Auto width for proper scaling */
}

/* MENU BACKGROUND (SEARCH RESULT BACKGROUND REMOVED) */
.submenu-dark .menu-horizontal .menu-smart ul {
    background-color: #323a45; /* Dark grey background for submenus */
}

/* INLINE BLOCK ELEMENTS */
.iso_inline {
    display: inline-block; /* Inline but with block properties */
    vertical-align: top; /* Align to top of line */
    margin-right: 15px; /* Space to the right */
    margin-bottom: 10px; /* Space below */
}

/* VIDEO WRAPPER OVERLAY EFFECT */
.video-wrapper::after {
    content: ""; /* Empty pseudo-element */
    position: absolute; /* Overlay positioning */
    top: 0; /* Cover entire video */
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(circle, rgba(0, 0, 0, 0.15) 0.5px, transparent 0.5px); /* Dot pattern overlay */
    background-size: 3px 3px; /* Dot spacing */
    pointer-events: none; /* Don't interfere with video controls */
    z-index: 2; /* Layer above video */
}

/* SINGLE IMAGE WRAPPER */
.vc_single_image-wrapper img {
    width: auto; /* Maintain aspect ratio */
    height: auto; /* Maintain aspect ratio */
    max-width: 100%; /* Responsive scaling */
}

/* HUBSPOT FORM LAYOUT OVERRIDES */
.hbspt-form,
.hs-form,
.hs-form .field,
.hs-form .form-columns-1 .field,
.hs-form .form-columns-1 .hs-form-field,
.hs-form .hs-form-field,
.hs-form fieldset {
    max-width: 100% !important; /* Force full width */
    width: 100% !important; /* Force full width */
}

/* ICON BOX IMAGES */
.icon-box-icon img {
    width: 50px; /* Fixed icon size */
    height: 50px; /* Square icons */
}

.icon-box.icon-box-left,
.icon-box.icon-box-right {
    display: flex; /* Flexbox layout */
    align-items: center; /* Vertical centre alignment */
}

/* HUBSPOT FORM FIELD RESETS */
.hs-form fieldset {
    border: none !important; /* Remove default fieldset border */
    padding: 0 !important; /* Remove default padding */
    margin: 0 !important; /* Remove default margin */
}

.hs-form .field,
.hs-form .hs-form-field {
    margin-bottom: 20px !important; /* Space between form fields */
    display: block !important; /* Force block display */
}

/* HUBSPOT FORM INPUT SIZING */
.hs-form .field .input,
.hs-form .hs-company,
.hs-form .hs-email,
.hs-form .hs-firstname,
.hs-form .hs-form-field .input,
.hs-form .hs-message,
.hs-form .hs-phone,
.hs-form-private .field,
.hs-form-private .field .input,
.hs-form-private .hs-form-field,
.hs-form-private .hs-form-field .input,
.hs-form-private .hs-input {
    width: 100% !important; /* Force full width */
    max-width: 100% !important; /* Prevent overflow */
    display: block !important; /* Force block display */
}

/* HUBSPOT FORM INPUT STYLING */
.hs-form .hs-input,
.hs-form input[type="email"],
.hs-form input[type="tel"],
.hs-form input[type="text"],
.hs-form textarea {
    border-radius: 25px !important; /* Rounded input fields */
    padding: 12px 20px !important; /* Internal padding */
    width: 100% !important; /* Full width */
    max-width: 100% !important; /* Prevent overflow */
    box-sizing: border-box !important; /* Include padding in width calculations */
    font-size: 14px !important; /* Consistent font size */
    outline: 0 !important; /* Remove browser focus outline */
    transition: border-color 0.3s !important; /* Smooth border colour transitions */
    display: block !important; /* Force block display */
    background: 0 0 !important; /* Transparent background */
}

/* TEXTAREA SPECIFIC STYLING */
.hs-form .hs-fieldtype-textarea .hs-input {
    border-radius: 15px !important; /* Less rounded for larger fields */
    min-height: 100px !important; /* Minimum height for text areas */
    resize: vertical !important; /* Allow vertical resizing only */
}

/* HUBSPOT FORM BUTTON STYLING */
.hs-form .hs-button.primary,
.hs-form .hs-button.primary.large {
    border-radius: 25px !important; /* Rounded buttons */
    padding: 12px 30px !important; /* Button padding */
    font-size: 16px !important; /* Button text size */
    font-weight: 700 !important; /* Bold button text */
    cursor: pointer !important; /* Pointer cursor on hover */
    transition: 0.3s !important; /* Smooth hover transitions */
    width: 200px !important; /* Fixed button width */
    max-width: 200px !important; /* Prevent button from growing */
    text-transform: uppercase !important; /* Uppercase button text */
    display: inline-block !important; /* Inline but with block properties */
}

/* HUBSPOT FORM SUBMIT CONTAINER */
.hs-form .hs-submit,
.hs-form .hs-submit .actions {
    width: 100% !important; /* Full width submit container */
    max-width: 100% !important; /* Prevent overflow */
    text-align: left !important; /* Left align submit area */
}

/* HUBSPOT FORM LABELS */
.hs-form .hs-form-field label {
    display: block !important; /* Force block display */
    margin-bottom: 8px !important; /* Space below labels */
    font-weight: 600 !important; /* Semi-bold labels */
    width: 100% !important; /* Full width labels */
}

/* TWO COLUMN FORM LAYOUT */
.hs-form .form-columns-2 {
    display: flex !important; /* Flexbox layout */
    gap: 15px !important; /* Space between columns */
    flex-wrap: wrap !important; /* Allow wrapping on smaller screens */
    width: 100% !important; /* Full width container */
    max-width: 100% !important; /* Prevent overflow */
}

.hs-form .form-columns-2 .field,
.hs-form .form-columns-2 .hs-form-field {
    flex: 1 !important; /* Equal flex growth */
    min-width: 250px !important; /* Minimum width before wrapping */
    width: calc(50% - 7.5px) !important; /* 50% width minus half the gap */
    max-width: calc(50% - 7.5px) !important; /* Prevent overflow */
}

/* THREE COLUMN FORM LAYOUT */
.hs-form .form-columns-3 {
    display: flex !important; /* Flexbox layout */
    gap: 10px !important; /* Space between columns */
    flex-wrap: wrap !important; /* Allow wrapping */
    width: 100% !important; /* Full width container */
    max-width: 100% !important; /* Prevent overflow */
}

.hs-form .form-columns-3 .field,
.hs-form .form-columns-3 .hs-form-field {
    flex: 1 !important; /* Equal flex growth */
    min-width: 200px !important; /* Minimum width before wrapping */
    width: calc(33.333% - 6.67px) !important; /* 33.33% width minus gap proportion */
    max-width: calc(33.333% - 6.67px) !important; /* Prevent overflow */
}

/* DEFAULT HUBSPOT FORM THEME */
.default_hsform .hs-input {
    border: 2px solid #e74011 !important; /* Orange border */
    color: #323a45 !important; /* Dark grey text */
}

.default_hsform .hs-input:focus,
.grey_hsform .hs-input:focus {
    border-color: #e74011 !important; /* Orange focus border */
    box-shadow: 0 0 0 3px rgba(231, 64, 17, 0.1) !important; /* Orange focus glow */
}

.default_hsform .hs-button.primary,
.default_hsform .hs-button.primary.large,
.grey_hsform .hs-button.primary,
.grey_hsform .hs-button.primary.large {
    background-color: #e74011 !important; /* Orange button background */
    border: 2px solid #e74011 !important; /* Orange button border */
    color: #fff !important; /* White button text */
}

.default_hsform .hs-button.primary.large:hover,
.default_hsform .hs-button.primary:hover,
.grey_hsform .hs-button.primary.large:hover,
.grey_hsform .hs-button.primary:hover {
    background-color: transparent !important; /* Transparent background on hover */
    border: 2px solid #e74011 !important; /* Maintain orange border */
    color: #e74011 !important; /* Orange text on hover */
}

.default_hsform .hs-form-booleancheckbox-display span,
.default_hsform .legal-consent-container .hs-richtext p,
.default_hsform label {
    color: #323a45 !important; /* Dark grey text for labels and checkboxes */
}

/* FORM ERROR STYLING */
.default_hsform .error .hs-input,
.default_hsform .hs-error-msgs,
.default_hsform .hs-form-required,
.grey_hsform .error .hs-input,
.grey_hsform .hs-error-msgs,
.grey_hsform .hs-form-required {
    color: #e74011 !important; /* Orange error text */
}

.default_hsform .hs-error-msgs,
.grey_hsform .hs-error-msgs,
.orange_hsform .hs-error-msgs {
    font-size: 12px !important; /* Smaller error text */
    margin-top: 5px !important; /* Space above error messages */
}

.default_hsform .error .hs-input,
.grey_hsform .error .hs-input {
    border-color: #e74011 !important; /* Orange border for error inputs */
}

/* FORM SUCCESS MESSAGE */
.default_hsform .hs-main-font-element,
.default_hsform .submitted-message {
    background-color: transparent !important; /* Transparent background */
    border: 2px solid #e74011 !important; /* Orange border */
    border-radius: 15px !important; /* Rounded corners */
    padding: 20px !important; /* Internal padding */
    text-align: center !important; /* Centre text */
    color: #323a45 !important; /* Dark grey text */
    width: 100% !important; /* Full width */
}

/* ORANGE HUBSPOT FORM THEME */
.orange_hsform .hs-input {
    border: 2px solid #fff !important; /* White border */
    color: #fff !important; /* White text */
}

.orange_hsform .hs-input:focus {
    border-color: #fff !important; /* White focus border */
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.2) !important; /* White focus glow */
}

.orange_hsform .hs-button.primary,
.orange_hsform .hs-button.primary.large {
    background-color: #fff !important; /* White button background */
    border: 2px solid #fff !important; /* White button border */
    color: #e74011 !important; /* Orange button text */
}

.orange_hsform .hs-button.primary.large:hover,
.orange_hsform .hs-button.primary:hover {
    background-color: transparent !important; /* Transparent background on hover */
    border: 2px solid #fff !important; /* Maintain white border */
    color: #fff !important; /* White text on hover */
}

.grey_hsform .hs-form-booleancheckbox-display span,
.grey_hsform .legal-consent-container .hs-richtext p,
.grey_hsform label,
.orange_hsform .hs-error-msgs,
.orange_hsform .hs-form-booleancheckbox-display span,
.orange_hsform .hs-form-required,
.orange_hsform .legal-consent-container .hs-richtext p,
.orange_hsform label {
    color: #fff !important; /* White text for orange theme labels */
}

.orange_hsform .hs-main-font-element,
.orange_hsform .submitted-message {
    background-color: transparent !important; /* Transparent background */
    border: 2px solid #fff !important; /* White border */
    border-radius: 15px !important; /* Rounded corners */
    padding: 20px !important; /* Internal padding */
    text-align: center !important; /* Centre text */
    color: #fff !important; /* White text */
    width: 100% !important; /* Full width */
}

/* GREY HUBSPOT FORM THEME */
.grey_hsform .hs-input {
    border: 2px solid #e74011 !important; /* Orange border */
    color: #fff !important; /* White text */
}

.grey_hsform .hs-main-font-element,
.grey_hsform .submitted-message {
    background-color: transparent !important; /* Transparent background */
    border: 2px solid #e74011 !important; /* Orange border */
    border-radius: 15px !important; /* Rounded corners */
    padding: 20px !important; /* Internal padding */
    text-align: center !important; /* Centre text */
    color: #fff !important; /* White text */
    width: 100% !important; /* Full width */
}

/* FORM LEGAL CONSENT STYLING */
.hs-form .legal-consent-container {
    margin-top: 20px !important; /* Space above legal text */
}

.hs-form .legal-consent-container .hs-richtext {
    margin-bottom: 10px !important; /* Space below rich text */
}

.hs-form .legal-consent-container .hs-richtext p {
    margin: 0 !important; /* Remove default paragraph margins */
    line-height: 1.4 !important; /* Improved readability */
}

/* FORM CHECKBOX LISTS */
.hs-form .inputs-list {
    padding: 0 !important; /* Remove default list padding */
    margin: 0 !important; /* Remove default list margin */
}

.hs-form .hs-form-booleancheckbox-display {
    display: flex !important; /* Flexbox layout */
    align-items: flex-start !important; /* Align to top */
    gap: 10px !important; /* Space between checkbox and label */
    cursor: pointer !important; /* Pointer cursor for entire area */
    text-align: left !important; /* Left align text */
    justify-content: flex-start !important; /* Left justify content */
}

/* FORM CHECKBOXES */
.hs-form input[type="checkbox"] {
    width: 16px !important; /* Fixed checkbox size */
    height: 16px !important; /* Square checkboxes */
    border-radius: 4px !important; /* Slightly rounded checkboxes */
    cursor: pointer !important; /* Pointer cursor */
    margin: 0 !important; /* Remove default margin */
    max-width: 16px !important; /* Prevent growing */
    min-width: 16px !important; /* Prevent shrinking */
    flex-shrink: 0 !important; /* Don't shrink in flexbox */
}

.hs-form .hs-form-booleancheckbox-display span {
    flex: 1 !important; /* Take remaining space */
    line-height: 1.4 !important; /* Improved readability */
    text-align: left !important; /* Left align text */
}

.default_hsform input[type="checkbox"],
.grey_hsform input[type="checkbox"] {
    border: 2px solid #e74011 !important; /* Orange checkbox border */
    background: 0 0 !important; /* Transparent background */
}

.orange_hsform input[type="checkbox"] {
    border: 2px solid #fff !important; /* White checkbox border */
    background: 0 0 !important; /* Transparent background */
}

/* 3D MODEL CONTAINER */
#model3D {
    width: 100%; /* Full width */
    min-height: 650px; /* Fixed height for 3D viewport */
    border-radius: 15px; /* Rounded corners */
}

/* MOBILE RESPONSIVE STYLES */
@media (max-width: 768px) {
    /* MOBILE OFF-GRID ELEMENTS */
    .off-grid-left,
    .off-grid-right {
        top: -150px; /* Less extreme offset on mobile */
        right: -20px; /* Smaller horizontal offset */
        left: -20px; /* Smaller horizontal offset */
        margin-bottom: -150px; /* Adjusted negative margin */
    }

    .off-grid-image img {
        max-width: 100%; /* Full width on mobile */
        height: auto; /* Auto height to maintain aspect ratio */
    }

    /* MOBILE FORM LAYOUT */
    .hs-form .form-columns-2,
    .hs-form .form-columns-3 {
        flex-direction: column !important; /* Stack columns vertically */
    }

    .hs-form .form-columns-2 .field,
    .hs-form .form-columns-2 .hs-form-field,
    .hs-form .form-columns-3 .field,
    .hs-form .form-columns-3 .hs-form-field {
        width: 100% !important; /* Full width on mobile */
        max-width: 100% !important; /* No max width restriction */
        min-width: unset !important; /* Remove minimum width */
    }

    /* MOBILE FORM INPUTS */
    .hs-form .hs-input {
        padding: 10px 15px !important; /* Smaller padding on mobile */
    }

    .hs-form .hs-button.primary {
        padding: 10px 25px !important; /* Smaller button padding */
        font-size: 14px !important; /* Smaller button text */
    }
}

/* GDPR PRIVACY BAR */
.gdpr-privacy-bar {
    background: rgba(50, 58, 69, 0.9) !important; /* Semi-transparent dark background */
    margin-bottom: 250px; /* Large bottom margin for positioning */
}

/* VIDEO WRAPPER TRANSITION */
.ramtech-video-wrapper {
    transition: opacity 0.3s; /* Smooth fade transitions */
}

.trp-flag-image.trp-flag-rounded {
    width: 12px;
    margin-right: 5px;
}