<div class="hero theme--consumer theme--dark" style="background-image: url('/mocks/img/hero.jpg');">
<img class="hero__image" src=/mocks/img/hero.jpg alt=a fancy buidling />
<div class="hero__primary theme--consumer theme--dark">
<div class="hero__text">
<h1 class="headline-2 ">Vill du snabbt få förslag på rätt ventilation?</h1>
</div>
</div>
<div class="hero__secondary">
<p class="hero__image-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin semper mauris ultricies elit suscipit porttitor.</p>
</div>
</div>
<section class="panel h-text-align-center-m">
<figure class="panel__figure">
<img src="/mocks/img/hero-startpage.jpg" alt="" class="panel__image">
</figure>
<div class="panel__inner">
<div class="row row--justify-around">
<div class="col col--span-12 col--span-m-10 col--span-l-8 col--no-gutter">
<h1>Produkter och tjänster</h1>
<p>Här finns allt du behöver för att skapa världens bästa inomhusklimat. Med Swegons oslagbara urval av genomtänkta och pålitliga produkter och tjänster får du den optimala ventilationslösningen för varje projekt.</p>
<p>Letar du efter dokument för någon produkt så ange vad i sökfältet nedan. <br />
<a href="#">Eller sök via ordernummer</a>.
</p>
<form action="" method="get">
<div class="search-field search-field--big">
<div class="search-field__field">
<input type="search" class="search-field__input" />
<button class="search-field__submit" type="submit"></button>
</div>
</div>
</form>
</div>
</div>
</div>
</section>
<section class="panel theme--white ">
<div class="panel__inner">
<div class="row">
<div class="col col--span-12 col--span-s-6 col--span-xl-3 col--bottom-gutter">
<div class="card card--fluid-layout">
<a href="#" class="card__cta">
<figure class="card__figure">
<img src="/mocks/img/air-cooling-unit.jpg" alt="" class="card__image">
</figure>
<div class="card__body">
<h4 class="card__title">
Luftbehandling
</h4>
<p class="card__description">Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.</p>
</div>
</a>
</div>
</div>
<div class="col col--span-12 col--span-s-6 col--span-xl-3 col--bottom-gutter">
<div class="card card--fluid-layout">
<a href="#" class="card__cta">
<figure class="card__figure">
<img src="/mocks/img/ventilation-room.jpg" alt="" class="card__image">
</figure>
<div class="card__body">
<h4 class="card__title">
Rumsprodukter
</h4>
<p class="card__description">Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.</p>
</div>
</a>
</div>
</div>
<div class="col col--span-12 col--span-s-6 col--span-xl-3 col--bottom-gutter">
<div class="card card--fluid-layout">
<a href="#" class="card__cta">
<figure class="card__figure">
<img src="/mocks/img/office-coders.jpg" alt="" class="card__image">
</figure>
<div class="card__body">
<h4 class="card__title">
Behovs­styrda system
</h4>
<p class="card__description">Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.</p>
</div>
</a>
</div>
</div>
<div class="col col--span-12 col--span-s-6 col--span-xl-3 col--bottom-gutter">
<div class="card card--fluid-layout">
<a href="#" class="card__cta">
<figure class="card__figure">
<img src="/mocks/img/air-cooling-unit.jpg" alt="" class="card__image">
</figure>
<div class="card__body">
<h4 class="card__title">
Kyla- & värme­produktion
</h4>
<p class="card__description">Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.</p>
</div>
</a>
</div>
</div>
<div class="col col--span-12 col--span-s-6 col--span-xl-3 col--bottom-gutter">
<div class="card card--fluid-layout">
<a href="#" class="card__cta">
<figure class="card__figure">
<img src="/mocks/img/air-cooling-unit.jpg" alt="" class="card__image">
</figure>
<div class="card__body">
<h4 class="card__title">
Luftbehandling
</h4>
<p class="card__description">Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.</p>
</div>
</a>
</div>
</div>
<div class="col col--span-12 col--span-s-6 col--span-xl-3 col--bottom-gutter">
<div class="card card--fluid-layout">
<a href="#" class="card__cta">
<figure class="card__figure">
<img src="/mocks/img/ventilation-room.jpg" alt="" class="card__image">
</figure>
<div class="card__body">
<h4 class="card__title">
Rumsprodukter
</h4>
<p class="card__description">Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.</p>
</div>
</a>
</div>
</div>
<div class="col col--span-12 col--span-s-6 col--span-xl-3 col--bottom-gutter">
<div class="card card--fluid-layout">
<a href="#" class="card__cta">
<figure class="card__figure">
<img src="/mocks/img/office-coders.jpg" alt="" class="card__image">
</figure>
<div class="card__body">
<h4 class="card__title">
Behovs­styrda system
</h4>
<p class="card__description">Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.</p>
</div>
</a>
</div>
</div>
<div class="col col--span-12 col--span-s-6 col--span-xl-3 col--bottom-gutter">
<div class="card card--fluid-layout">
<a href="#" class="card__cta">
<figure class="card__figure">
<img src="/mocks/img/air-cooling-unit.jpg" alt="" class="card__image">
</figure>
<div class="card__body">
<h4 class="card__title">
Kyla- & värme­produktion
</h4>
<p class="card__description">Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.</p>
</div>
</a>
</div>
</div>
</div>
</div>
</section>
<div class="row row--direction-row-reverse">
<div class="col col--span-12 col--span-l-6 col--bottom-gutter-l col--no-gutter col--gutter-left-l">
<section class="panel
panel--image-background-l
panel--no-padding
panel--min-height-l
panel--no-margin-image
panel--image-fullsize-l-down h-full-height">
<figure class="panel__figure">
<img src="/mocks/img/ventilation-room.jpg" alt="" class="panel__image">
</figure>
</section>
</div>
<div class="col col--span-12 col--span-l-6 col--bottom-gutter-l col--no-gutter col--gutter-right-l">
<section class="panel theme--dark theme--turquoise
panel--compact
panel--min-height-l h-full-height">
<div class="panel__inner">
<div class="main-content">
<h2>Du är inte ensam</h2>
<h6 class="">
Bloggen för privatpersoner
</h6>
<p>Många har suttit i samma sits som du och frågat sig ”Hur gör vi med ventilationen?”. <a href="#">Och många tusentals har sedan</a> valt Swegon. Därför finns det massor av berättelser, till exempel om tekniska utmaningar som lösts, eller hur driftsekonomin blivit en glad överraskning. Referenserna är helt enkelt bevis på att vi levererar det vi utlovar – eller lite till.</p>
<a href="#" class="button button--ghost">
Guider
</a>
</div>
</div>
</section>
</div>
</div>
{{render "@hero--default"}}
{{#>@one-column-block--default hero}}
<form action="" method="get">
{{render "@search-field--big"}}
</form>
{{/@one-column-block--default}}
{{#>@panel theme="white"}}
<div class="row">
{{#each products}}
<div class="col col--span-12 col--span-s-6 col--span-xl-3 col--bottom-gutter">
{{> @card this}}
</div>
{{/each}}
{{#each products}}
<div class="col col--span-12 col--span-s-6 col--span-xl-3 col--bottom-gutter">
{{> @card this}}
</div>
{{/each}}
</div>
{{/@panel}}
{{render "@two-column-block--with-image-reverse"}}
{
"marketSelectorModal": {
"id": "market-selector",
"closeLabel": "Stäng"
},
"theme": "blue",
"hero": {
"title": "Produkter och tjänster",
"paragraph": "\n <p>Här finns allt du behöver för att skapa världens bästa inomhusklimat. Med Swegons oslagbara urval av genomtänkta och pålitliga produkter och tjänster får du den optimala ventilationslösningen för varje projekt.</p>\n\n <p>Letar du efter dokument för någon produkt så ange vad i sökfältet nedan. <br />\n <a href=\"#\">Eller sök via ordernummer</a>.</p>\n ",
"image": {
"src": "/mocks/img/hero-startpage.jpg",
"alt": ""
}
},
"products": [
{
"modifiers": "fluid-layout",
"title": "Luftbehandling",
"description": "Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.",
"href": "#",
"image": {
"src": "/mocks/img/air-cooling-unit.jpg",
"alt": ""
}
},
{
"modifiers": "fluid-layout",
"title": "Rumsprodukter",
"description": "Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.",
"href": "#",
"image": {
"src": "/mocks/img/ventilation-room.jpg",
"alt": ""
}
},
{
"modifiers": "fluid-layout",
"title": "Behovs­styrda system",
"description": "Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.",
"href": "#",
"image": {
"src": "/mocks/img/office-coders.jpg",
"alt": ""
}
},
{
"modifiers": "fluid-layout",
"title": "Kyla- & värme­produktion",
"description": "Brett utbud av rumsprodukter för den perfekta lösningen för varje typ av lokal.",
"href": "#",
"image": {
"src": "/mocks/img/air-cooling-unit.jpg",
"alt": ""
}
}
]
}
No notes defined.