<section class="supt-section-logoboard -awards">
    <div class="supt-section-logoboard__container container">
        <div class="supt-section-logoboard__head row justify-content-center">
            <div class="col-12 col-md-10 col-lg-8">
                <h2 class="supt-slide-up-title">Awards</h2>
                <p class="supt-section-logoboard__description">With over 35 years of insight, experience, and innovation, Verisure has been continuously recognised for its industry-leading approach. By creating best-in-class products and services, high-performing workplaces for its staff and people, and implementing a futureproof ESG strategy.</p>
            </div>
        </div>
        <div class="supt-section-logoboard__body row">
            <div class="col">
                <div class="supt-section-logoboard__items-wrapper">
                    <div class="supt-section-logoboard__items">
                        <div class="supt-section-logoboard__item ">
                            <img src="/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/top-employer-europe-2025.webp" alt="Top Employer Europe 2025">
                        </div>
                        <div class="supt-section-logoboard__item ">
                            <img src="/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/FT_EU_Employers2025_Logo_RGB_White.webp" alt="FT EU Best Employer 2025">
                        </div>
                        <div class="supt-section-logoboard__item ">
                            <img src="/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/PD2024_RD.webp" alt="Red Dot award 2024">
                        </div>
                        <div class="supt-section-logoboard__item ">
                            <img src="/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/ESG-Global-50.webp" alt="ESG Global 50">
                        </div>
                        <div class="supt-section-logoboard__item ">
                            <img src="/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/ESG-Industry-50.webp" alt="ESG Industry 50">
                        </div>
                        <div class="supt-section-logoboard__item ">
                            <img src="/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/ESG-Regional-50.webp" alt="ESG Regional 50">
                        </div>
                        <div class="supt-section-logoboard__item ">
                            <img src="/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/Sustanalytics-Global-50.webp" alt="Sustanalytics Global 50">
                        </div>
                        <div class="supt-section-logoboard__item ">
                            <img src="/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/Sustanalytics-Industry.webp" alt="Sustanalytics Industry">
                        </div>
                        <div class="supt-section-logoboard__item ">
                            <img src="/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/Sustanalytics-Regional.webp" alt="Sustanalytics Regional">
                        </div>
                    </div>

                    <span class="supt-line">
                        <span class="supt-line__inner"></span>
                    </span>
                </div>
            </div>
        </div>
    </div>
</section>

No notes defined.

<section class="supt-section-logoboard {{ modifiers|modifiersAttr }}">
	<div class="supt-section-logoboard__container container">
		<div class="supt-section-logoboard__head row justify-content-center">
			<div class="col-12 col-md-10 col-lg-8">
				<h2 class="supt-slide-up-title">{{ title }}</h2>
				{% if description %}
					<p class="supt-section-logoboard__description">{{ description }}</p>
				{% endif %}
			</div>
		</div>
		<div class="supt-section-logoboard__body row">
			<div class="col">
				<div class="supt-section-logoboard__items-wrapper">
					<div class="supt-section-logoboard__items">
						{% for item in items %}
							<div class="supt-section-logoboard__item {{ item.modifiers|modifiersAttr }}">
								{% if item.link %}
									<a class="supt-section-logoboard__item-link" {{ item.link|attrs }}>
										<img {{ item.img|merge({src: path(item.img.src)} )|attrs }}>
									</a>
								{% else %}
									<img {{ item.img|merge({src: path(item.img.src)} )|attrs }}>
								{% endif %}
							</div>
						{% endfor %}
					</div>

					{# Bottom horizontal line #}
					{% include 'atoms/line/line.twig' %}
				</div>
			</div>
		</div>
	</div>
</section>
{
  "modifiers": [
    "awards"
  ],
  "title": "Awards",
  "description": "With over 35 years of insight, experience, and innovation, Verisure has been continuously recognised for its industry-leading approach. By creating best-in-class products and services, high-performing workplaces for its staff and people, and implementing a futureproof ESG strategy.",
  "items": [
    {
      "img": {
        "src": "/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/top-employer-europe-2025.webp",
        "alt": "Top Employer Europe 2025"
      }
    },
    {
      "img": {
        "src": "/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/FT_EU_Employers2025_Logo_RGB_White.webp",
        "alt": "FT EU Best Employer 2025"
      }
    },
    {
      "img": {
        "src": "/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/PD2024_RD.webp",
        "alt": "Red Dot award 2024"
      }
    },
    {
      "img": {
        "src": "/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/ESG-Global-50.webp",
        "alt": "ESG Global 50"
      }
    },
    {
      "img": {
        "src": "/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/ESG-Industry-50.webp",
        "alt": "ESG Industry 50"
      }
    },
    {
      "img": {
        "src": "/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/ESG-Regional-50.webp",
        "alt": "ESG Regional 50"
      }
    },
    {
      "img": {
        "src": "/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/Sustanalytics-Global-50.webp",
        "alt": "Sustanalytics Global 50"
      }
    },
    {
      "img": {
        "src": "/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/Sustanalytics-Industry.webp",
        "alt": "Sustanalytics Industry"
      }
    },
    {
      "img": {
        "src": "/sites/gv/files/flmngr/superhuit/about-us/at-a-glance/awards/Sustanalytics-Regional.webp",
        "alt": "Sustanalytics Regional"
      }
    }
  ]
}
  • Content:
    .supt-section-logoboard {
    	@mixin clamp padding-bottom, $spacing-8, $spacing-16, $breakpoint-xs, $breakpoint-xl;
    	background: $color-grey-background;
    
    	&__container {
    		display: flex;
    		flex-direction: column;
    		@mixin clamp gap, $spacing-16, $spacing-20, $breakpoint-xs, $breakpoint-xl;
    	}
    
    	&__head {
    		> *:first-child {
    			@mixin clamp padding-top, $spacing-16, $spacing-32, $breakpoint-xs, $breakpoint-xl;
    			border-top: 1px solid $color-grey-2;
    		}
    
    		h2,
    		h3,
    		h4 {
    			@extend %t-h2;
    
    			margin: 0;
    			text-align: center;
    		}
    	}
    
    	&__description {
    		@extend %t-body-sm;
    		margin-top: $spacing-4;
    		text-align: center;
    	}
    
    	&__items-wrapper {
    		position: relative;
    
    		.supt-line {
    			--line-xs-width: 100%;
    			--line-xs-height: 1px;
    			--line-md-width: 100%;
    			--line-md-height: 1px;
    
    			position: absolute;
    			bottom: 0;
    			left: 0;
    
    			.supt-line__inner {
    				transform: scaleX(0);
    			}
    		}
    	}
    
    	&__items {
    		@mixin clamp padding-bottom, $spacing-16, $spacing-32, $breakpoint-xs, $breakpoint-xl;
    		border-bottom: 1px solid $color-grey-2;
    		padding-inline: $spacing-4;
    		display: flex;
    		flex-flow: row wrap;
    		align-items: end;
    		justify-content: center;
    		gap: $spacing-20 $spacing-16;
    	}
    
    	&__item {
    		a {
    			display: flex;
    		}
    
    		img {
    			@mixin clamp height, 48px, 56px, $breakpoint-xs, $breakpoint-xl;
    			object-fit: contain;
    			object-position: center;
    		}
    
    		&.-verisure {
    			align-self: center;
    
    			@media (max-width: calc($breakpoint-md - 1px)) {
    				flex-basis: 100%;
    				display: flex;
    				justify-content: center;
    			}
    
    			img {
    				@mixin clamp height, 100px, 150px, $breakpoint-xs, $breakpoint-xl;
    			}
    		}
    	}
    
    	&:not(.-awards) {
    		.supt-section-logoboard__items {
    			@media (min-width: $breakpoint-md) {
    				display: grid;
    				grid-template-areas:
    					'logo1 logo2'
    					'logo1 logo3';
    			}
    		}
    		.supt-section-logoboard__item {
    			&:nth-child(1) {
    				grid-area: logo1;
    			}
    			&:nth-child(2) {
    				grid-area: logo2;
    			}
    			&:nth-child(3) {
    				grid-area: logo3;
    			}
    		}
    	}
    
    	&.-awards {
    		.supt-section-logoboard__items {
    			@mixin clamp padding-inline, $spacing-4, $spacing-24, $breakpoint-xs, $breakpoint-xl;
    			@mixin clamp row-gap, $spacing-16, $spacing-24, $breakpoint-xs, $breakpoint-xl;
    			@mixin clamp column-gap, 36, 80, $breakpoint-xs, $breakpoint-xl;
    			display: grid;
    			grid-template-columns: repeat(2, 1fr);
    			align-items: center;
    
    			@media (min-width: $breakpoint-md) {
    				grid-template-columns: repeat(3, 1fr);
    			}
    		}
    
    		.supt-section-logoboard__item {
    			display: flex;
    			justify-content: center;
    			align-items: center;
    
    			img {
    				@mixin clamp height, 72px, 100px, $breakpoint-xs, $breakpoint-xl;
    				max-width: 100%;
    				mix-blend-mode: darken;
    			}
    		}
    
    		& + .supt-section-copyright {
    			padding-top: 0;
    		}
    	}
    }
    
  • URL: /components/raw/section-logoboard/section-logoboard.css
  • Filesystem Path: src/components/organisms/section-logoboard/section-logoboard.css
  • Size: 2.8 KB