<section class="supt-section-cards supt-stagger-cards " data-nb-cards="3">
<div class="supt-section-cards__inner container">
<div class="supt-section-cards__head row align-items-center">
<h2 class="col supt-slide-up-title">Latest press releases</h2>
</div>
<div class="supt-section-cards__body row">
<div class="col">
<div class="supt-section-cards__list">
<div class="supt-section-cards__item supt-stagger-cards__card">
<div class="supt-card-press-release " itemscope itemtype="https://schema.org/Article">
<div class="supt-card-press-release__head">
<div class="supt-post-metas">
<div class="supt-tag">
<span class="supt-tag__label">Press release</span>
</div>
<svg width="3" height="4" viewBox="0 0 3 4" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="1.5" cy="2" r="1.5" fill="currentColor" />
</svg> <time itemprop="datePublished" datetime="2025-05-05T00:00:00+00:00">May 05, 2025</time>
</div>
</div>
<div class="supt-card-press-release__body">
<h3 itemprop="name">Verisure Launches its 2024 Annual Report</h3>
<p itemprop="abstract">Verisure, the leading provider of professionally monitored security systems for residential and small business customers in Europe and Latin America, has released its 2024 Annual Report.</p>
</div>
<div class="supt-card-press-release__foot">
<a href="#press-release" class="supt-button-link " target="_blank" itemprop="url">
<span>
Read more
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5">
<path d="M14 12V2.31766C14 2.04152 13.7761 1.81766 13.5 1.81766H3.81766" stroke-linecap="round" vector-effect="non-scaling-stroke" />
<path d="M2 14L13 3" stroke-linecap="round" vector-effect="non-scaling-stroke" />
</svg>
</span>
</a>
</div>
</div>
</div>
<div class="supt-section-cards__item supt-stagger-cards__card">
<div class="supt-card-press-release " itemscope itemtype="https://schema.org/Article">
<div class="supt-card-press-release__head">
<div class="supt-post-metas">
<div class="supt-tag">
<span class="supt-tag__label">Press release</span>
</div>
<svg width="3" height="4" viewBox="0 0 3 4" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="1.5" cy="2" r="1.5" fill="currentColor" />
</svg> <time itemprop="datePublished" datetime="2025-02-26T00:00:00+00:00">February 26, 2025</time>
</div>
</div>
<div class="supt-card-press-release__body">
<h3 itemprop="name">Verisure achieve top ranking in Sustainalytics 2025 ESG Companies List</h3>
<p itemprop="abstract">Verisure, the leading provider of professionally monitored security services in Europe and Latin America, has been included by Sustainalytics on its 2025 Top-rated ESG companies.</p>
</div>
<div class="supt-card-press-release__foot">
<a href="#press-release" class="supt-button-link " target="_blank" itemprop="url">
<span>
Read more
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5">
<path d="M14 12V2.31766C14 2.04152 13.7761 1.81766 13.5 1.81766H3.81766" stroke-linecap="round" vector-effect="non-scaling-stroke" />
<path d="M2 14L13 3" stroke-linecap="round" vector-effect="non-scaling-stroke" />
</svg>
</span>
</a>
</div>
</div>
</div>
<div class="supt-section-cards__item supt-stagger-cards__card">
<div class="supt-card-press-release " itemscope itemtype="https://schema.org/Article">
<div class="supt-card-press-release__head">
<div class="supt-post-metas">
<div class="supt-tag">
<span class="supt-tag__label">Press release</span>
</div>
<svg width="3" height="4" viewBox="0 0 3 4" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="1.5" cy="2" r="1.5" fill="currentColor" />
</svg> <time itemprop="datePublished" datetime="2025-05-05T00:00:00+00:00">May 05, 2025</time>
</div>
</div>
<div class="supt-card-press-release__body">
<h3 itemprop="name">Verisure Recognised with Top Employer Europe Certification for the second time</h3>
<p itemprop="abstract">Verisure, the leading provider of professionally monitored security services in Europe and Latin America, is proud to be awarded by the Top Employer® Institute, 2025 certification.</p>
</div>
<div class="supt-card-press-release__foot">
<a href="#press-release" class="supt-button-link " target="_blank" itemprop="url">
<span>
Read more
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5">
<path d="M14 12V2.31766C14 2.04152 13.7761 1.81766 13.5 1.81766H3.81766" stroke-linecap="round" vector-effect="non-scaling-stroke" />
<path d="M2 14L13 3" stroke-linecap="round" vector-effect="non-scaling-stroke" />
</svg>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
No notes defined.
<section class="supt-section-cards supt-stagger-cards {{modifiers|modifiersAttr}}" data-nb-cards="{{ cards|length }}">
<div class="supt-section-cards__inner container">
<div class="supt-section-cards__head row align-items-center">
<h2 class="col supt-slide-up-title">{{ title }}</h2>
{% if description %}
<p class="col-12 supt-section-cards__description supt-slide-up-title">{{ description }}</p>
{% endif %}
{% if button %}
<div class="col-auto">
{% include "atoms/buttons/button/button.twig" with button only %}
</div>
{% endif %}
</div>
<div class="supt-section-cards__body row">
<div class="col">
<div class="supt-section-cards__list">
{% for card in cards %}
<div class="supt-section-cards__item supt-stagger-cards__card">
{% include template with card only %}
</div>
{% endfor %}
</div>
</div>
</div>
</div>
</section>
{
"title": "Latest press releases",
"template": "molecules/cards/card-press-release/card-press-release.twig",
"cards": [
{
"date": "2025-05-05",
"title": "Verisure Launches its 2024 Annual Report",
"description": "Verisure, the leading provider of professionally monitored security systems for residential and small business customers in Europe and Latin America, has released its 2024 Annual Report.",
"link": {
"href": "#press-release",
"text": "Read more",
"attrs": {
"target": "_blank"
}
}
},
{
"date": "2025-02-26",
"title": "Verisure achieve top ranking in Sustainalytics 2025 ESG Companies List",
"description": "Verisure, the leading provider of professionally monitored security services in Europe and Latin America, has been included by Sustainalytics on its 2025 Top-rated ESG companies.",
"link": {
"href": "#press-release",
"text": "Read more",
"attrs": {
"target": "_blank"
}
}
},
{
"date": "2025-05-05",
"title": "Verisure Recognised with Top Employer Europe Certification for the second time",
"description": "Verisure, the leading provider of professionally monitored security services in Europe and Latin America, is proud to be awarded by the Top Employer® Institute, 2025 certification.",
"link": {
"href": "#press-release",
"text": "Read more",
"attrs": {
"target": "_blank"
}
}
}
]
}
.supt-section-cards {
@mixin clamp --section-spacing, $spacing-8, $spacing-16, $breakpoint-xs, $breakpoint-xl;
overflow: hidden;
padding-top: var(--section-spacing);
background: $color-grey-background;
&__inner {
display: flex;
flex-direction: column;
}
&__head {
h2 {
@extend %t-h2;
margin: 0;
}
}
&__description {
@extend %t-body-m-s;
margin-top: $spacing-4;
color: $color-grey-5;
}
&__list {
display: flex;
width: 100%;
padding-top: $spacing-6;
padding-bottom: var(--section-spacing);
--card-gutter: $spacing-1-5;
@media (min-width: $breakpoint-md) {
padding-top: $spacing-8;
--card-gutter: $spacing-2;
}
@media (max-width: calc($breakpoint-xl - 1px)) {
overflow-x: auto;
flex-wrap: nowrap;
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
width: auto;
margin-inline: calc(-1 * var(--supt-container-padding-inline));
padding-inline: var(--supt-container-padding-inline);
scroll-padding-inline: var(--supt-container-padding-inline);
/* Hide scrollbar */
scrollbar-width: none; /* Firefox */
-ms-overflow-style: none; /* IE and Edge */
&::-webkit-scrollbar {
display: none; /* Chrome, Safari, Opera */
}
}
}
&__item {
flex: 1 0 83.3333%;
padding-inline: var(--card-gutter);
@media (min-width: $breakpoint-md) {
flex-basis: 52%;
}
@media (max-width: calc($breakpoint-xl - 1px)) {
scroll-snap-align: start;
}
@media (min-width: $breakpoint-xl) {
flex-basis: calc(100% / 3);
}
&:first-child {
margin-left: calc(-1 * var(--card-gutter));
}
&:last-child {
margin-right: calc(-1 * var(--card-gutter));
}
> * {
height: 100%;
}
}
&[data-nb-cards='1'] {
.supt-section-cards__list {
justify-content: center;
}
.supt-section-cards__item {
flex-basis: 50%;
}
.supt-card-text {
@media (min-width: $breakpoint-md) {
display: grid;
grid-template-areas:
'head body'
'head foot';
}
&__head {
@media (min-width: $breakpoint-md) {
grid-area: head;
}
}
&__body {
@media (min-width: $breakpoint-md) {
grid-area: body;
align-self: flex-end;
}
}
&__foot {
@media (min-width: $breakpoint-md) {
grid-area: foot;
align-self: flex-start;
}
}
}
}
&[data-nb-cards='2'] {
@media (min-width: $breakpoint-md) {
.supt-section-cards__list {
justify-content: center;
overflow-x: hidden;
}
.supt-section-cards__item {
flex-basis: 50%;
flex-grow: 0;
&:first-child {
padding-left: 0;
}
&:last-child {
padding-right: 0;
}
}
}
}
&.-no-slides {
.supt-section-cards__list {
@media (max-width: calc($breakpoint-xl - 1px)) {
display: flex;
row-gap: $spacing-12;
flex-wrap: wrap;
overflow: hidden;
scroll-snap-type: none;
width: 100%;
margin-inline: 0;
padding-inline: 0;
scroll-padding-inline: 0;
}
}
.supt-section-cards__item {
@media (max-width: calc($breakpoint-md - 1px)) {
padding: 0;
margin: 0;
}
}
}
& + .supt-section-cards[data-nb-cards='1'] {
padding-top: 0;
}
}