{"id":3968,"date":"2025-07-09T07:56:30","date_gmt":"2025-07-09T07:56:30","guid":{"rendered":"https:\/\/bscwebdesign.at\/home\/"},"modified":"2026-07-16T10:05:24","modified_gmt":"2026-07-16T10:05:24","slug":"home","status":"publish","type":"page","link":"https:\/\/bscwebdesign.at\/en\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"3968\" class=\"elementor elementor-3968 elementor-10\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-72e82dd e-con-full e-flex e-con e-parent\" data-id=\"72e82dd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2873014 elementor-widget elementor-widget-html\" data-id=\"2873014\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Sora:wght@100;200;300;400;500;600;700;800&display=swap\" rel=\"stylesheet\">\n<style>\n* {\n  font-family: 'Sora', sans-serif !important;\n}\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a9175a6 elementor-widget elementor-widget-html\" data-id=\"a9175a6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"bsc-hero\">\n  <div class=\"bsc-grid-bg\"><\/div>\n  <div class=\"bsc-glow\"><\/div>\n\n  <div class=\"bsc-hero-content\">\n\n  <div class=\"bsc-hero-inner\">\n    <h1 class=\"bsc-heading\">\n      Websites for your<br>business that<br>\n      <span class=\"bsc-anim-wrap\">\n        <span class=\"bsc-anim\" id=\"bscHeroWord\">think ahead<\/span>\n      <\/span>\n    <\/h1>\n\n    <p class=\"bsc-sub\">\n      No templates, no gimmicks. Websites that understand your\n      goals and connect with your target audience.\n    <\/p>\n\n    <div class=\"bsc-actions\">\n      <a href=\"\/en\/contact\/\" class=\"btn-primary\">\n        <span class=\"btn-primary__text\">Start a project<\/span>\n        <span class=\"btn-primary__shine\"><\/span>\n      <\/a>\n\n      <a href=\"\/en\/references\/\" class=\"bsc-btn-ghost\">\n        Our work\n        <svg\n          class=\"btn-ghost__arrow\"\n          width=\"16\"\n          height=\"16\"\n          viewBox=\"0 0 16 16\"\n          fill=\"none\"\n        >\n          <path\n            d=\"M3 8h10M9 4l4 4-4 4\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.6\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          \/>\n        <\/svg>\n      <\/a>\n    <\/div>\n\n    <div class=\"bsc-stats\">\n\n      <div class=\"bsc-stat\">\n        <span class=\"bsc-stat-num\">Avg. 4 weeks<\/span>\n        <span class=\"bsc-stat-label\">until launch<\/span>\n      <\/div>\n\n      <div class=\"bsc-stat-divider\"><\/div>\n\n      <div class=\"bsc-stat\">\n        <span class=\"bsc-stat-num\">Same day<\/span>\n        <span class=\"bsc-stat-label\">changes implemented<\/span>\n      <\/div>\n\n      <div class=\"bsc-stat-divider\"><\/div>\n\n      <div class=\"bsc-stat\">\n        <span class=\"bsc-stat-num\">\n          <svg\n            width=\"14\"\n            height=\"14\"\n            viewBox=\"0 0 20 20\"\n            fill=\"#F5A623\"\n            xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\n            style=\"vertical-align:-1px;margin-right:3px;flex-shrink:0\"\n          >\n            <path d=\"M10 1l2.39 5.26L18 7.27l-4 3.9.94 5.5L10 14.1 5.06 16.67 6 11.17 2 7.27l5.61-.01L10 1z\"\/>\n          <\/svg>\n          4.9 \/ 5\n        <\/span>\n        <span class=\"bsc-stat-label\">Google rating<\/span>\n      <\/div>\n\n    <\/div>\n  <\/div>\n\n  <div class=\"bsc-marquee-col\" aria-hidden=\"true\">\n    <div class=\"bsc-marquee-track\">\n\n      <a class=\"bsc-card\" href=\"https:\/\/www.twobuild.cc\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Twobuild-1.webp\" alt=\"TwoBuild\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>TwoBuild<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/vereno-wein.at\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Vereno-Wein.webp\" alt=\"Vereno Weinhandel\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Vereno Weinhandel<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/medico-working.at\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/MEDICO.webp\" alt=\"MEDI.CO Fach\u00e4rzte\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>MEDI.CO Fach\u00e4rzte<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/www.schwarzenberger-coaching.at\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Schwarzenberger-Consulting-Desktop-scaled-1.webp\" alt=\"Schwarzenberger Coaching\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Schwarzenberger Coaching<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/drkaramat.at\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Dr-Karamat.webp\" alt=\"Dr. Karamat\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Dr. Karamat<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/weingut-pax.at\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Weingut-Pax-Home-PC.webp\" alt=\"Weingut Pax\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Weingut Pax<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/kardiologe-salzburg.com\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Dr-Uzel-Home-PC-1.webp\" alt=\"Dr. Uzel\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Dr. Uzel<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/buzzbabes.com\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Buzz-Babes-Home-PC.webp\" alt=\"Buzz Babes\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Buzz Babes<\/span><\/div>\n      <\/a>\n\n\n      <!-- Duplicate for seamless loop -->\n\n      <a class=\"bsc-card\" href=\"https:\/\/www.twobuild.cc\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Twobuild-1.webp\" alt=\"\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>TwoBuild<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/vereno-wein.at\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Vereno-Wein.webp\" alt=\"\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Vereno Weinhandel<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/medico-working.at\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/MEDICO.webp\" alt=\"\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>MEDI.CO Fach\u00e4rzte<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/www.schwarzenberger-coaching.at\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Schwarzenberger-Consulting-Desktop-scaled-1.webp\" alt=\"\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Schwarzenberger Coaching<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/drkaramat.at\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Dr-Karamat.webp\" alt=\"\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Dr. Karamat<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/weingut-pax.at\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Weingut-Pax-Home-PC.webp\" alt=\"\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Weingut Pax<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/kardiologe-salzburg.com\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Dr-Uzel-Home-PC-1.webp\" alt=\"\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Dr. Uzel<\/span><\/div>\n      <\/a>\n\n      <a class=\"bsc-card\" href=\"https:\/\/buzzbabes.com\/\" target=\"_blank\" rel=\"noopener\">\n        <img decoding=\"async\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Buzz-Babes-Home-PC.webp\" alt=\"\" loading=\"lazy\"\/>\n        <div class=\"bsc-card-overlay\"><span>Buzz Babes<\/span><\/div>\n      <\/a>\n\n    <\/div>\n  <\/div>\n\n  <\/div>\n<\/section>\n\n<style>\n\n\/* \u2500\u2500 Primary Button \u2500\u2500 *\/\n\n.bsc-hero .btn-primary,\n.bsc-hero .btn-primary__text,\n.bsc-hero .btn-primary__icon {\n  font-size: 16px !important;\n}\n\n.bsc-hero .btn-primary {\n  background: #151DA5 !important;\n  border-color: #151DA5 !important;\n  color: #fff !important;\n}\n\n.bsc-hero .btn-primary:hover {\n  background: #151DA5 !important;\n  border-color: #151DA5 !important;\n  color: #fff !important;\n}\n\n\n\/* \u2500\u2500 Hero \u2500\u2500 *\/\n\n.bsc-hero {\n  position: relative;\n  background: #FDFDFD;\n  height: 110vh;\n  min-height: 620px;\n  overflow: hidden;\n  display: block;\n  margin-top: -70px;\n}\n\n.bsc-hero-content {\n  position: relative;\n  z-index: 2;\n  width: 100%;\n  max-width: 1425px;\n  height: 100%;\n  margin: 0 auto;\n  display: grid;\n  grid-template-columns: 63% 30%;\n  align-items: center;\n}\n\n.bsc-grid-bg {\n  position: absolute;\n  inset: 0;\n  background-image: radial-gradient(circle, #c5c8d8 1px, transparent 1px);\n  background-size: 30px 30px;\n  opacity: 0.28;\n  pointer-events: none;\n}\n\n.bsc-glow {\n  position: absolute;\n  top: 45%;\n  left: 32%;\n  transform: translate(-50%, -50%);\n  width: 800px;\n  height: 700px;\n  background: radial-gradient(\n    ellipse at center,\n    rgba(21, 29, 165, 0.055) 0%,\n    transparent 60%\n  );\n  pointer-events: none;\n}\n\n\n\/* \u2500\u2500 Left \u2500\u2500 *\/\n\n.bsc-hero-inner {\n  position: relative;\n  z-index: 2;\n  padding: 0 48px 0 clamp(32px, 10vw, 120px);\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  align-self: center;\n  margin-top: 80px;\n}\n\n.bsc-heading {\n  font-size: 60px;\n  font-weight: 900;\n  color: #0a0a0a;\n  line-height: 1.1;\n  letter-spacing: -0.035em;\n  margin-bottom: 22px;\n}\n\n.bsc-anim-wrap {\n  display: inline-block;\n  height: 1.1em;\n  overflow: hidden;\n  vertical-align: bottom;\n  perspective: 400px;\n}\n\n.bsc-anim {\n  display: block;\n  color: #151DA5;\n  -webkit-text-fill-color: #151DA5;\n}\n\n\n\/* \u2500\u2500 Animated Words \u2500\u2500 *\/\n\n.bsc-anim.word-exit {\n  animation: bscWordExit 0.36s cubic-bezier(0.4, 0, 1, 1) forwards;\n}\n\n.bsc-anim.word-enter {\n  animation: bscWordEnter 0.36s cubic-bezier(0, 0, 0.2, 1) forwards;\n}\n\n@keyframes bscWordExit {\n  0% {\n    opacity: 1;\n    transform: translateY(0) rotateX(0deg);\n  }\n\n  100% {\n    opacity: 0;\n    transform: translateY(-110%) rotateX(-22deg);\n  }\n}\n\n@keyframes bscWordEnter {\n  0% {\n    opacity: 0;\n    transform: translateY(110%) rotateX(22deg);\n  }\n\n  100% {\n    opacity: 1;\n    transform: translateY(0) rotateX(0deg);\n  }\n}\n\n.bsc-sub {\n  font-size: 16px;\n  line-height: 1.75;\n  color: #6b6b6b;\n  max-width: 420px;\n  margin-bottom: 36px;\n}\n\n.bsc-actions {\n  display: flex;\n  gap: 12px;\n  align-items: center;\n  flex-wrap: wrap;\n  margin-bottom: 36px;\n}\n\n.bsc-btn-ghost {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 16px;\n  font-weight: 600;\n  color: #555;\n  text-decoration: none;\n  letter-spacing: -0.01em;\n  transition: color 0.2s ease;\n}\n\n.bsc-btn-ghost:hover {\n  color: #0a0a0a;\n}\n\n.bsc-btn-ghost svg {\n  transition: transform 0.2s ease;\n}\n\n.bsc-btn-ghost:hover svg {\n  transform: translateX(3px);\n}\n\n\n\/* \u2500\u2500 Stats \u2500\u2500 *\/\n\n.bsc-stats {\n  display: flex;\n  align-items: center;\n  gap: 0;\n  flex-wrap: wrap;\n  row-gap: 12px;\n}\n\n.bsc-stat {\n  display: flex;\n  flex-direction: column;\n  gap: 3px;\n  padding-right: 28px;\n}\n\n.bsc-stat-num {\n  font-size: 18px;\n  font-weight: 800;\n  color: #0a0a0a;\n  letter-spacing: -0.03em;\n  line-height: 1.1;\n  display: flex;\n  align-items: center;\n}\n\n.bsc-stat-label {\n  font-size: 14px;\n  font-weight: 500;\n  color: #999;\n  letter-spacing: 0.01em;\n  white-space: nowrap;\n}\n\n.bsc-stat-divider {\n  width: 1px;\n  height: 36px;\n  background: rgba(0, 0, 0, 0.1);\n  margin-right: 28px;\n  flex-shrink: 0;\n}\n\n\n\/* \u2500\u2500 Right: Marquee \u2500\u2500 *\/\n\n.bsc-marquee-col {\n  position: relative;\n  height: 100%;\n  overflow: hidden;\n  padding: 0 clamp(20px, 3vw, 40px) 0 0;\n  -webkit-mask-image: linear-gradient(\n    to bottom,\n    transparent 0%,\n    black 5%,\n    black 95%,\n    transparent 100%\n  );\n  mask-image: linear-gradient(\n    to bottom,\n    transparent 0%,\n    black 5%,\n    black 95%,\n    transparent 100%\n  );\n}\n\n.bsc-marquee-track {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  padding-top: 12px;\n  animation: bscMarqueeUp 38s linear infinite;\n  will-change: transform;\n}\n\n@keyframes bscMarqueeUp {\n  0% {\n    transform: translateY(0);\n  }\n\n  100% {\n    transform: translateY(-50%);\n  }\n}\n\n.bsc-card {\n  position: relative;\n  width: 100%;\n  aspect-ratio: 16\/10;\n  border-radius: 10px;\n  overflow: hidden;\n  border: 1px solid rgba(0, 0, 0, 0.07);\n  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);\n  flex-shrink: 0;\n  text-decoration: none;\n  display: block;\n  transition: box-shadow 0.25s, transform 0.25s;\n}\n\n.bsc-card:hover {\n  box-shadow:\n    0 8px 32px rgba(21, 29, 165, 0.13),\n    0 2px 8px rgba(0, 0, 0, 0.08);\n  transform: translateY(-2px);\n}\n\n.bsc-card img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: top center;\n  display: block;\n}\n\n.bsc-card-overlay {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  background: linear-gradient(\n    to top,\n    rgba(10, 10, 10, 0.78) 0%,\n    transparent 100%\n  );\n  padding: 20px 12px 10px;\n  opacity: 0;\n  transition: opacity 0.22s ease;\n}\n\n.bsc-card:hover .bsc-card-overlay {\n  opacity: 1;\n}\n\n.bsc-card-overlay span {\n  font-size: 12px;\n  font-weight: 700;\n  color: #fff;\n  letter-spacing: 0.06em;\n  text-transform: none;\n}\n\n\n\/* \u2500\u2500 iPad \/ Tablet \u2500\u2500 *\/\n\n@media (max-width: 1024px) and (min-width: 601px) {\n\n  .bsc-hero {\n    height: auto;\n    min-height: 900px;\n  }\n\n  .bsc-hero-content {\n    max-width: none;\n    min-height: 900px;\n    padding: 16px 0 12px;\n    grid-template-columns: 55% 42%;\n    align-items: center;\n  }\n\n  .bsc-hero-inner {\n    padding: 16px 24px 16px clamp(24px, 5vw, 48px);\n    margin-top: 0;\n    align-self: center;\n  }\n\n  .bsc-heading {\n    font-size: 40px;\n  }\n\n  .bsc-sub {\n    font-size: 14px;\n    max-width: 340px;\n  }\n\n  .bsc-marquee-col {\n    display: block;\n    height: 700px;\n    overflow: hidden;\n    padding: 0 16px 0 0;\n    align-self: center;\n    -webkit-mask-image: none;\n    mask-image: none;\n  }\n\n  .bsc-marquee-track {\n    gap: 10px;\n    padding-top: 0;\n    animation: bscMarqueeUp 34s linear infinite;\n  }\n\n  .bsc-card {\n    aspect-ratio: 16 \/ 8.5;\n    border-radius: 10px;\n  }\n\n  .bsc-stats {\n    gap: 0;\n    flex-wrap: nowrap;\n  }\n\n  .bsc-stat {\n    padding-right: 18px;\n  }\n\n  .bsc-stat-num {\n    font-size: 14px;\n  }\n\n  .bsc-stat-label {\n    font-size: 10px;\n  }\n\n  .bsc-stat-divider {\n    margin-right: 18px;\n    height: 28px;\n  }\n}\n\n\n\/* \u2500\u2500 Mobile \u2500\u2500 *\/\n\n@media (max-width: 600px) {\n\n  \/* Exakt wie in der Referenz: Padding liegt auf der Hero selbst *\/\n  .bsc-hero {\n    height: auto;\n    min-height: auto;\n    padding: 170px 20px 48px;\n    box-sizing: border-box;\n  }\n\n  \/* Der neue Desktop-Wrapper \u00fcbernimmt mobil nur die alte Grid-Funktion *\/\n  .bsc-hero-content {\n    width: 100%;\n    max-width: none;\n    height: auto;\n    margin: 0;\n    grid-template-columns: 1fr;\n    align-items: start;\n    justify-items: stretch;\n    row-gap: 32px;\n  }\n\n  .bsc-hero-inner {\n    padding: 0;\n    align-items: center;\n    text-align: center;\n    margin-top: 0;\n  }\n\n  .bsc-heading {\n    font-size: 32px;\n    text-align: center;\n    margin-bottom: 20px;\n  }\n\n  .bsc-sub {\n    font-size: 1px;\n    text-align: center;\n    max-width: 340px;\n    margin-bottom: 20px;\n  }\n\n  .bsc-actions {\n    justify-content: center;\n    flex-direction: column;\n    align-items: center;\n    margin-bottom: 20px;\n  }\n\n  .bsc-stats {\n    flex-direction: column;\n    align-items: center;\n    gap: 0;\n  }\n\n  .bsc-stat {\n    align-items: center;\n    text-align: center;\n    padding-right: 0;\n    padding-bottom: 10px;\n    width: 100%;\n  }\n\n  .bsc-stat:last-child {\n    padding-bottom: 0;\n  }\n\n  .bsc-stat-divider {\n    display: none;\n  }\n\n  .bsc-marquee-col {\n    display: block;\n    width: 100%;\n    overflow: hidden;\n    padding: 0;\n    -webkit-mask-image: none;\n    mask-image: none;\n  }\n\n  .bsc-marquee-track {\n    display: flex;\n    flex-direction: row;\n    gap: 2px;\n    width: max-content;\n    padding: 0;\n    animation: bscMarqueeSide 24s linear infinite;\n  }\n\n  .bsc-card {\n    width: 250px;\n    min-width: 250px;\n    aspect-ratio: 16 \/ 10;\n    flex-shrink: 0;\n  }\n\n  .bsc-card-overlay {\n    opacity: 1;\n    padding: 18px 12px 10px;\n  }\n\n  .bsc-marquee-track .bsc-card:nth-child(n+9) {\n    display: none;\n  }\n}\n\n@keyframes bscMarqueeSide {\n  0% {\n    transform: translateX(0);\n  }\n\n  100% {\n    transform: translateX(-50%);\n  }\n}\n\n<\/style>\n\n<script>\n(function() {\n  var words = ['think ahead', 'convince', 'grow', 'sell'];\n  var current = 0;\n  var el = document.getElementById('bscHeroWord');\n\n  if (!el) return;\n\n  function next() {\n    el.classList.remove('word-enter');\n    el.classList.add('word-exit');\n\n    setTimeout(function() {\n      current = (current + 1) % words.length;\n      el.textContent = words[current];\n      el.classList.remove('word-exit');\n      el.classList.add('word-enter');\n    }, 340);\n  }\n\n  setTimeout(function() {\n    next();\n    setInterval(next, 2800);\n  }, 2500);\n})();\n\n\n(function() {\n  var track = document.querySelector('.bsc-marquee-track');\n\n  if (!track) return;\n\n  var startX = 0;\n  var startOffset = 0;\n  var isDragging = false;\n  var currentOffset = 0;\n\n  function isMobile() {\n    return window.innerWidth <= 600;\n  }\n\n  function getTranslateX(el) {\n    var matrix = new WebKitCSSMatrix(\n      window.getComputedStyle(el).transform\n    );\n\n    return matrix.m41;\n  }\n\n  track.addEventListener('touchstart', function(e) {\n    if (!isMobile()) return;\n\n    isDragging = true;\n    startX = e.touches[0].clientX;\n    currentOffset = getTranslateX(track);\n    startOffset = currentOffset;\n\n    track.style.animation = 'none';\n    track.style.transform = 'translateX(' + currentOffset + 'px)';\n  }, {\n    passive: true\n  });\n\n\n  track.addEventListener('touchmove', function(e) {\n    if (!isDragging || !isMobile()) return;\n\n    var dx = e.touches[0].clientX - startX;\n    currentOffset = startOffset + dx;\n\n    track.style.transform =\n      'translateX(' + currentOffset + 'px)';\n  }, {\n    passive: true\n  });\n\n\n  track.addEventListener('touchend', function() {\n    if (!isMobile()) return;\n\n    isDragging = false;\n\n    var trackWidth = track.scrollWidth \/ 2;\n\n    var wrapped = currentOffset % trackWidth;\n\n    if (wrapped > 0) {\n      wrapped -= trackWidth;\n    }\n\n    track.style.transform =\n      'translateX(' + wrapped + 'px)';\n\n    var remaining =\n      Math.abs(wrapped + trackWidth) \/ trackWidth;\n\n    var duration = 24 * remaining;\n\n    track.style.animation = 'none';\n\n    track.getBoundingClientRect();\n\n    var styleId = 'bsc-touch-anim';\n    var existing = document.getElementById(styleId);\n\n    if (existing) {\n      existing.remove();\n    }\n\n    var style = document.createElement('style');\n\n    style.id = styleId;\n\n    style.textContent =\n      '@keyframes bscMarqueeContinue {' +\n      '0% { transform: translateX(' + wrapped + 'px); }' +\n      '100% { transform: translateX(' +\n      (wrapped - trackWidth * remaining) +\n      'px); }' +\n      '}';\n\n    document.head.appendChild(style);\n\n    track.style.animation =\n      'bscMarqueeContinue ' +\n      duration +\n      's linear forwards';\n\n    setTimeout(function() {\n\n      var tempStyle =\n        document.getElementById(styleId);\n\n      if (tempStyle) {\n        tempStyle.remove();\n      }\n\n      track.style.animation =\n        'bscMarqueeSide 24s linear infinite';\n\n      track.style.transform = '';\n\n    }, duration * 1000);\n  });\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2e5c015 elementor-widget elementor-widget-html\" data-id=\"2e5c015\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Sora:wght@100;200;300;400;500;600;700;800&display=swap\" rel=\"stylesheet\">\n<style>\n* {\n  font-family: 'Sora', sans-serif !important;\n}\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b75ecfa elementor-widget elementor-widget-html\" data-id=\"b75ecfa\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- WE THINK AHEAD SECTION -->\n<section class=\"wdm-section\" id=\"wdm\">\n\n  <div class=\"wdm-section-bg\"><\/div>\n\n  <div class=\"wdm-inner\">\n\n    <div class=\"wdm-header\">\n\n      <!-- LEFT: Slogan block -->\n      <div class=\"wdm-header-left\">\n        <div class=\"wdm-slogan\">\n          <span class=\"wdm-slogan-wir\">WE<\/span>\n          <span class=\"wdm-slogan-denken\">THINK<\/span>\n          <span class=\"wdm-slogan-mit\">AHEAD<\/span>\n        <\/div>\n\n        <div class=\"wdm-divider\">\n          <span class=\"wdm-divider-line\"><\/span>\n          <span class=\"wdm-divider-dot\"><\/span>\n        <\/div>\n\n        <p class=\"wdm-slogan-sub\">\n          so your website works for you<br>\n          and does more than just look good.\n        <\/p>\n      <\/div>\n\n      <!-- RIGHT: Phone -->\n      <div class=\"wdm-illustration\">\n        <div class=\"wdm-wa\">\n          <div class=\"wdm-wa-phone\">\n\n            <div class=\"wdm-wa-statusbar\">\n              <span class=\"wdm-wa-time\">20:26<\/span>\n\n              <div class=\"wdm-wa-icons\">\n                <svg width=\"14\" height=\"10\" viewBox=\"0 0 24 12\" fill=\"white\">\n                  <rect\n                    x=\"0\"\n                    y=\"2\"\n                    width=\"18\"\n                    height=\"8\"\n                    rx=\"2\"\n                    fill=\"none\"\n                    stroke=\"white\"\n                    stroke-width=\"1.5\"\n                  \/>\n                  <rect\n                    x=\"19\"\n                    y=\"4\"\n                    width=\"3\"\n                    height=\"4\"\n                    rx=\"1\"\n                    fill=\"white\"\n                  \/>\n                  <rect\n                    x=\"1.5\"\n                    y=\"3.5\"\n                    width=\"13\"\n                    height=\"5\"\n                    rx=\"1\"\n                    fill=\"white\"\n                  \/>\n                <\/svg>\n              <\/div>\n            <\/div>\n\n            <div class=\"wdm-wa-header\">\n\n              <div class=\"wdm-wa-back\">\u2039<\/div>\n\n              <div class=\"wdm-wa-avatar\">\n                <img decoding=\"async\"\n                  src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/WhatsApp-Profilbild-BSC.webp\"\n                  alt=\"BSC\"\n                  style=\"width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;\"\n                >\n              <\/div>\n\n              <div class=\"wdm-wa-info\">\n                <div class=\"wdm-wa-name\">BSC Webdesign<\/div>\n\n                <div class=\"wdm-wa-status\">\n                  <span class=\"wdm-wa-online-dot\"><\/span>\n                  online\n                <\/div>\n              <\/div>\n\n              <div class=\"wdm-wa-actions\">\n                <svg\n                  width=\"18\"\n                  height=\"18\"\n                  viewBox=\"0 0 24 24\"\n                  fill=\"white\"\n                >\n                  <path d=\"M6.6 10.8c1.4 2.8 3.8 5.1 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1L6.6 10.8z\"\/>\n                <\/svg>\n              <\/div>\n\n            <\/div>\n\n            <div class=\"wdm-wa-body\">\n\n              <div class=\"wdm-wa-date\">Today<\/div>\n\n              <div class=\"wdm-wa-msg wdm-wa-msg--out wdm-wa-m1\">\n                <div class=\"wdm-wa-bubble wdm-wa-bubble--out\">\n                  I need a new website that actually brings in more customers.\n\n                  <div class=\"wdm-wa-meta\">\n                    <span>09:14<\/span>\n\n                    <svg\n                      width=\"14\"\n                      height=\"9\"\n                      viewBox=\"0 0 16 11\"\n                      fill=\"none\"\n                    >\n                      <path\n                        d=\"M1 5.5l3.5 3.5L14 1\"\n                        stroke=\"#53bdeb\"\n                        stroke-width=\"1.8\"\n                        stroke-linecap=\"round\"\n                        stroke-linejoin=\"round\"\n                      \/>\n                      <path\n                        d=\"M5 5.5l3.5 3.5L14 1\"\n                        stroke=\"#53bdeb\"\n                        stroke-width=\"1.8\"\n                        stroke-linecap=\"round\"\n                        stroke-linejoin=\"round\"\n                      \/>\n                    <\/svg>\n                  <\/div>\n                <\/div>\n              <\/div>\n\n              <div class=\"wdm-wa-msg wdm-wa-msg--in wdm-wa-m2\">\n                <div class=\"wdm-wa-bubble wdm-wa-bubble--in wdm-wa-bubble--typing\">\n                  <span><\/span>\n                  <span><\/span>\n                  <span><\/span>\n                <\/div>\n              <\/div>\n\n              <div class=\"wdm-wa-msg wdm-wa-msg--in wdm-wa-m3\">\n                <div class=\"wdm-wa-bubble wdm-wa-bubble--in\">\n                  What do you want people to think, feel and do when they land on your website?\n\n                  <div class=\"wdm-wa-meta\">\n                    <span>09:15<\/span>\n                  <\/div>\n                <\/div>\n              <\/div>\n\n              <div class=\"wdm-wa-msg wdm-wa-msg--out wdm-wa-m4\">\n                <div class=\"wdm-wa-bubble wdm-wa-bubble--out wdm-wa-bubble--typing\">\n                  <span><\/span>\n                  <span><\/span>\n                  <span><\/span>\n                <\/div>\n              <\/div>\n\n              <div class=\"wdm-wa-msg wdm-wa-msg--out wdm-wa-m5\">\n                <div class=\"wdm-wa-bubble wdm-wa-bubble--out\">\n                  Hmm... I've never thought about it that way.\n\n                  <div class=\"wdm-wa-meta\">\n                    <span>09:16<\/span>\n\n                    <svg\n                      width=\"14\"\n                      height=\"9\"\n                      viewBox=\"0 0 16 11\"\n                      fill=\"none\"\n                    >\n                      <path\n                        d=\"M1 5.5l3.5 3.5L14 1\"\n                        stroke=\"#53bdeb\"\n                        stroke-width=\"1.8\"\n                        stroke-linecap=\"round\"\n                        stroke-linejoin=\"round\"\n                      \/>\n                      <path\n                        d=\"M5 5.5l3.5 3.5L14 1\"\n                        stroke=\"#53bdeb\"\n                        stroke-width=\"1.8\"\n                        stroke-linecap=\"round\"\n                        stroke-linejoin=\"round\"\n                      \/>\n                    <\/svg>\n                  <\/div>\n                <\/div>\n              <\/div>\n\n              <div class=\"wdm-wa-msg wdm-wa-msg--in wdm-wa-m6\">\n                <div class=\"wdm-wa-bubble wdm-wa-bubble--in wdm-wa-bubble--typing\">\n                  <span><\/span>\n                  <span><\/span>\n                  <span><\/span>\n                <\/div>\n              <\/div>\n\n              <div class=\"wdm-wa-msg wdm-wa-msg--in wdm-wa-m7\">\n                <div class=\"wdm-wa-bubble wdm-wa-bubble--in wdm-wa-bubble--final\">\n                  That's the difference between a website that simply looks good and one that actually drives results.\n\n                  <div class=\"wdm-wa-meta wdm-wa-meta--light\">\n                    <span>09:17<\/span>\n                  <\/div>\n                <\/div>\n              <\/div>\n\n            <\/div>\n\n            <div class=\"wdm-wa-inputbar\">\n              <div class=\"wdm-wa-input\">Message<\/div>\n\n              <div class=\"wdm-wa-mic\">\n                <svg\n                  width=\"16\"\n                  height=\"16\"\n                  viewBox=\"0 0 24 24\"\n                  fill=\"none\"\n                  stroke=\"white\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                >\n                  <path d=\"M12 1a3 3 0 00-3 3v8a3 3 0 006 0V4a3 3 0 00-3-3z\"\/>\n                  <path d=\"M19 10v2a7 7 0 01-14 0v-2M12 19v4M8 23h8\"\/>\n                <\/svg>\n              <\/div>\n            <\/div>\n\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n\n    <!-- 4 pillars -->\n    <div class=\"wdm-pillars\">\n\n      <div class=\"wdm-pillar\">\n        <h3 class=\"wdm-pillar-heading\">\n          We think like we're part of your team.\n        <\/h3>\n\n        <p class=\"wdm-pillar-text\">\n          We don't act like an outside agency. We work with your bigger goals and the whole picture in mind.\n        <\/p>\n      <\/div>\n\n      <div class=\"wdm-pillar\">\n        <h3 class=\"wdm-pillar-heading\">\n          We catch problems before they become problems.\n        <\/h3>\n\n        <p class=\"wdm-pillar-text\">\n          Structure, user journeys and technical details are considered from day one, not as an afterthought.\n        <\/p>\n      <\/div>\n\n      <div class=\"wdm-pillar\">\n        <h3 class=\"wdm-pillar-heading\">\n          We ask the questions others overlook.\n        <\/h3>\n\n        <p class=\"wdm-pillar-text\">\n          The right questions upfront save time, money and frustration later on.\n        <\/p>\n      <\/div>\n\n      <div class=\"wdm-pillar\">\n        <h3 class=\"wdm-pillar-heading\">\n          We don't just follow the brief. We think ahead.\n        <\/h3>\n\n        <p class=\"wdm-pillar-text\">\n          Your website is built to grow with your business, not just get you to launch.\n        <\/p>\n      <\/div>\n\n    <\/div>\n\n  <\/div>\n<\/section>\n\n<style>\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   SECTION\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.wdm-section {\n  background: #FDFDFD;\n  padding: 88px 0 56px;\n  position: relative;\n  overflow: hidden;\n}\n\n.wdm-section-bg {\n  position: absolute;\n  inset: 0;\n  background-image: radial-gradient(\n    circle,\n    #c8cbdc 1px,\n    transparent 1px\n  );\n  background-size: 28px 28px;\n  opacity: 0.3;\n  pointer-events: none;\n}\n\n.wdm-section::after {\n  content: '';\n  position: absolute;\n  top: -80px;\n  right: -80px;\n  width: 500px;\n  height: 500px;\n  background: radial-gradient(\n    ellipse,\n    rgba(21, 29, 165, 0.06) 0%,\n    transparent 65%\n  );\n  pointer-events: none;\n}\n\n.wdm-inner {\n  max-width: 1160px;\n  margin: 0 auto;\n  padding: 0 48px;\n  position: relative;\n  z-index: 1;\n}\n\n.wdm-header {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 56px;\n  align-items: center;\n  margin-bottom: 56px;\n}\n\n.wdm-slogan {\n  display: flex;\n  flex-direction: column;\n  line-height: 0.92;\n  margin-bottom: 28px;\n}\n\n.wdm-slogan-wir,\n.wdm-slogan-denken,\n.wdm-slogan-mit {\n  font-size: 90px !important;\n  font-weight: 900;\n  letter-spacing: -0.03em;\n  display: block;\n}\n\n.wdm-slogan-wir {\n  color: rgba(13, 13, 13, 0.12);\n}\n\n.wdm-slogan-denken {\n  color: rgba(13, 13, 13, 0.38);\n}\n\n.wdm-slogan-mit {\n  color: #151DA5;\n}\n\n.wdm-divider {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  margin-bottom: 20px;\n}\n\n.wdm-divider-line {\n  display: block;\n  width: 48px;\n  height: 2px;\n  background: #151DA5;\n  border-radius: 2px;\n}\n\n.wdm-divider-dot {\n  display: block;\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n  background: #151DA5;\n  opacity: 0.4;\n}\n\n.wdm-slogan-sub {\n  font-size: clamp(15px, 1.6vw, 17px);\n  line-height: 1.65;\n  color: #4a4a5a;\n  margin: 0;\n  font-weight: 500;\n}\n\n.wdm-wa {\n  display: flex;\n  justify-content: center;\n}\n\n.wdm-wa-phone {\n  width: 300px;\n  border-radius: 36px;\n  overflow: hidden;\n  background: #fff;\n  box-shadow:\n    0 24px 64px rgba(21, 29, 165, 0.14),\n    0 4px 16px rgba(0, 0, 0, 0.08),\n    0 0 0 4px #2d2d2d,\n    0 0 0 5px #3a3a3a;\n}\n\n.wdm-wa-statusbar {\n  background: #075e54;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 6px 16px 4px;\n  font-size: 11px;\n  color: white;\n  font-weight: 600;\n}\n\n.wdm-wa-icons {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.wdm-wa-header {\n  background: #075e54;\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 8px 14px 12px;\n  color: white;\n}\n\n.wdm-wa-back {\n  font-size: 22px;\n  color: white;\n  line-height: 1;\n  margin-right: -4px;\n  font-weight: 300;\n}\n\n.wdm-wa-avatar {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  background: #25d366;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 14px;\n  font-weight: 800;\n  color: white;\n  flex-shrink: 0;\n}\n\n.wdm-wa-info {\n  flex: 1;\n}\n\n.wdm-wa-name {\n  font-size: 14px;\n  font-weight: 700;\n  color: white;\n  line-height: 1.2;\n}\n\n.wdm-wa-status {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  font-size: 11px;\n  color: rgba(255, 255, 255, 0.75);\n}\n\n.wdm-wa-online-dot {\n  width: 6px;\n  height: 6px;\n  background: #25d366;\n  border-radius: 50%;\n}\n\n.wdm-wa-actions {\n  color: white;\n  opacity: 0.85;\n}\n\n.wdm-wa-body {\n  background-color: #efeae2;\n  padding: 12px 10px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  position: relative;\n}\n\n.wdm-wa-date {\n  text-align: center;\n  font-size: 11px;\n  color: #667781;\n  background: rgba(255, 255, 255, 0.85);\n  padding: 4px 10px;\n  border-radius: 6px;\n  align-self: center;\n  margin-bottom: 6px;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);\n}\n\n.wdm-wa-msg {\n  display: flex;\n  opacity: 0;\n}\n\n.wdm-wa-msg--out {\n  justify-content: flex-end;\n}\n\n.wdm-wa-msg--in {\n  justify-content: flex-start;\n}\n\n.wdm-wa-m1 {\n  animation:\n    wdm-wa-in 0.35s ease 0.4s forwards;\n  overflow: hidden;\n}\n\n.wdm-wa-m2 {\n  position: absolute;\n  bottom: 8px;\n  left: 10px;\n  animation:\n    wdm-wa-in 0.35s ease 1.0s forwards,\n    wdm-wa-out 0.2s ease 2.1s forwards;\n}\n\n.wdm-wa-m3 {\n  animation:\n    wdm-wa-in 0.35s ease 2.2s forwards;\n  overflow: hidden;\n}\n\n.wdm-wa-m4 {\n  position: absolute;\n  bottom: 8px;\n  right: 10px;\n  animation:\n    wdm-wa-in 0.35s ease 3.0s forwards,\n    wdm-wa-out 0.2s ease 4.0s forwards;\n}\n\n.wdm-wa-m5 {\n  animation:\n    wdm-wa-in 0.35s ease 4.1s forwards;\n  overflow: hidden;\n}\n\n.wdm-wa-m6 {\n  position: absolute;\n  bottom: 8px;\n  left: 10px;\n  animation:\n    wdm-wa-in 0.35s ease 4.8s forwards,\n    wdm-wa-out 0.2s ease 5.8s forwards;\n}\n\n.wdm-wa-m7 {\n  animation:\n    wdm-wa-in 0.35s ease 5.9s forwards;\n  overflow: hidden;\n}\n\n@keyframes wdm-wa-in {\n  from {\n    opacity: 0;\n    transform: translateY(6px) scale(0.97);\n  }\n\n  to {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n}\n\n@keyframes wdm-wa-out {\n  0% {\n    opacity: 1;\n    max-height: 60px;\n    margin: 0;\n  }\n\n  100% {\n    opacity: 0;\n    max-height: 0;\n    margin: 0;\n    padding: 0;\n  }\n}\n\n.wdm-wa-bubble {\n  max-width: 82%;\n  padding: 8px 10px;\n  border-radius: 8px;\n  font-size: 13px;\n  line-height: 1.5;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);\n}\n\n.wdm-wa-bubble--out {\n  background: #d9fdd3;\n  border-top-right-radius: 2px;\n  color: #111;\n}\n\n.wdm-wa-bubble--in {\n  background: #fff;\n  border-top-left-radius: 2px;\n  color: #111;\n}\n\n.wdm-wa-bubble--final {\n  background: #fff;\n  color: #0d0d0d;\n  border-left: 3px solid #151DA5;\n  border-top-left-radius: 2px;\n  font-style: italic;\n}\n\n.wdm-wa-bubble--typing {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  padding: 10px 14px;\n}\n\n.wdm-wa-bubble--typing span {\n  width: 7px;\n  height: 7px;\n  border-radius: 50%;\n  background: #8696a0;\n  animation: wdm-bounce 1.2s ease-in-out infinite;\n}\n\n.wdm-wa-bubble--typing span:nth-child(2) {\n  animation-delay: 0.2s;\n}\n\n.wdm-wa-bubble--typing span:nth-child(3) {\n  animation-delay: 0.4s;\n}\n\n@keyframes wdm-bounce {\n  0%,\n  60%,\n  100% {\n    transform: translateY(0);\n  }\n\n  30% {\n    transform: translateY(-5px);\n  }\n}\n\n.wdm-wa-meta {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 3px;\n  margin-top: 3px;\n  font-size: 10px;\n  color: #8696a0;\n}\n\n.wdm-wa-meta--light {\n  color: rgba(0, 0, 0, 0.35) !important;\n}\n\n.wdm-wa-inputbar {\n  background: #f0f2f5;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 10px;\n  border-top: 1px solid #e9edef;\n}\n\n.wdm-wa-input {\n  flex: 1;\n  background: white;\n  border-radius: 20px;\n  padding: 8px 14px;\n  font-size: 13px;\n  color: #8696a0;\n}\n\n.wdm-wa-mic {\n  width: 34px;\n  height: 34px;\n  background: #25d366;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.wdm-pillars {\n  display: grid;\n  grid-template-columns: repeat(4, 1fr);\n  border-top: 0.5px solid #151DA5;\n}\n\n.wdm-pillar {\n  padding: 24px 24px 24px 0;\n  border-right: 0.5px solid #151DA5;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  transition: background 0.2s;\n}\n\n.wdm-pillar:hover {\n  background: rgba(21, 29, 165, 0.03);\n}\n\n.wdm-pillar:last-child {\n  border-right: none;\n  padding-right: 0;\n}\n\n.wdm-pillar:first-child {\n  padding-left: 0;\n}\n\n.wdm-pillar:not(:first-child) {\n  padding-left: 24px;\n}\n\n.wdm-pillar-heading {\n  font-size: 16px;\n  font-weight: 700;\n  color: #0d0d0d;\n  line-height: 1.35;\n  margin: 0;\n}\n\n.wdm-pillar-text {\n  font-size: 16px;\n  line-height: 1.7;\n  color: #777;\n  margin: 0;\n}\n\n@media (max-width: 960px) and (min-width: 601px) {\n\n  .wdm-section {\n    padding: 72px 0 56px;\n  }\n\n  .wdm-inner {\n    padding: 0 32px;\n  }\n\n  .wdm-header {\n    grid-template-columns: 45% 55%;\n    gap: 20px;\n    align-items: center;\n    margin-bottom: 48px;\n  }\n\n  .wdm-header-left {\n    order: 1;\n  }\n\n  .wdm-illustration {\n    order: 2;\n  }\n\n  .wdm-wa {\n    justify-content: center;\n  }\n\n  .wdm-wa-phone {\n    width: 280px;\n  }\n\n  .wdm-wa-body {\n    max-height: 380px;\n    overflow: hidden;\n  }\n\n  .wdm-wa-meta {\n    display: none;\n  }\n\n  .wdm-slogan-wir,\n  .wdm-slogan-denken,\n  .wdm-slogan-mit {\n    font-size: 60px !important;\n  }\n\n  .wdm-slogan-sub {\n    font-size: 13px;\n  }\n\n  .wdm-pillars {\n    grid-template-columns: 1fr 1fr;\n  }\n\n  .wdm-pillar {\n    padding-top: 20px;\n    padding-bottom: 20px;\n  }\n\n  .wdm-pillar:nth-child(odd) {\n    border-right: 1px solid #eaecf2;\n    padding-left: 0 !important;\n    padding-right: 24px;\n  }\n\n  .wdm-pillar:nth-child(even) {\n    border-right: none;\n    padding-left: 24px !important;\n    padding-right: 0;\n  }\n\n  .wdm-pillar:last-child,\n  .wdm-pillar:nth-last-child(2) {\n    border-bottom: none;\n  }\n}\n\n@media (max-width: 600px) {\n\n  .wdm-section {\n    padding: 56px 0 40px;\n  }\n\n  .wdm-inner {\n    padding: 0 20px;\n  }\n\n  .wdm-header {\n    grid-template-columns: 1fr;\n    gap: 36px;\n    margin-bottom: 36px;\n  }\n\n  .wdm-wa-phone {\n    width: 270px;\n  }\n\n  .wdm-header-left {\n    text-align: center;\n    align-items: center;\n  }\n\n  .wdm-slogan {\n    align-items: center;\n    text-align: center;\n    line-height: 0.95;\n  }\n\n  .wdm-slogan-wir,\n  .wdm-slogan-denken,\n  .wdm-slogan-mit {\n    font-size: 40px !important;\n  }\n\n  .wdm-slogan-wir,\n  .wdm-slogan-denken {\n    display: inline;\n  }\n\n  .wdm-slogan {\n    display: block;\n  }\n\n  .wdm-slogan-wir::after {\n    content: \" \";\n  }\n\n  .wdm-slogan-denken::after {\n    content: \"\\A\";\n    white-space: pre;\n  }\n\n  .wdm-divider {\n    justify-content: center;\n  }\n\n  .wdm-slogan-sub {\n    text-align: center;\n  }\n\n  .wdm-pillars {\n    grid-template-columns: 1fr;\n  }\n\n  .wdm-pillar,\n  .wdm-pillar:first-child,\n  .wdm-pillar:not(:first-child),\n  .wdm-pillar:last-child {\n    border-right: none !important;\n    border-bottom: 1px solid #eaecf2;\n    padding: 18px 0 !important;\n    align-items: flex-start;\n    text-align: left;\n  }\n\n  .wdm-pillar-heading,\n  .wdm-pillar-text {\n    width: 100%;\n    text-align: left;\n  }\n\n  .wdm-pillar:last-child {\n    border-bottom: none;\n  }\n}\n\n<\/style>\n\n<script>\n(function() {\n  const section = document.querySelector('.wdm-section');\n\n  if (!section) return;\n\n  const msgs = section.querySelectorAll(\n    '.wdm-wa-m1,' +\n    '.wdm-wa-m2,' +\n    '.wdm-wa-m3,' +\n    '.wdm-wa-m4,' +\n    '.wdm-wa-m5,' +\n    '.wdm-wa-m6,' +\n    '.wdm-wa-m7'\n  );\n\n  msgs.forEach(el => {\n    el.style.animationPlayState = 'paused';\n  });\n\n  const observer = new IntersectionObserver((entries) => {\n    entries.forEach(entry => {\n      if (entry.isIntersecting) {\n\n        msgs.forEach(el => {\n          el.style.animationPlayState = 'running';\n        });\n\n        observer.disconnect();\n      }\n    });\n  }, {\n    threshold: 0.3\n  });\n\n  observer.observe(section);\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-495e38e e-flex e-con-boxed e-con e-parent\" data-id=\"495e38e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-46e9e14 e-flex e-con-boxed e-con e-child\" data-id=\"46e9e14\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a916165 elementor-widget elementor-widget-html\" data-id=\"a916165\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<h2 class=\"trust-heading\">\n  Companies that already trust <span>BSC Webdesign<\/span>.\n<\/h2>\n\n<style>\n.trust-heading span {\n  color: #151DA5;\n}\n\n@media (max-width: 600px) {\n  .trust-heading {\n    text-align: center;\n  }\n}\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-86d40ad elementor-widget elementor-widget-deensimc-smooth-marquee\" data-id=\"86d40ad\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"deensimc-smooth-marquee.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<div class=\"deensimc-marquee-main-container deensimc-image-marquee deensimc-marquee-edge-shadow\" data-marquee-speed=\"5\" data-track-fill=\"yes\" data-track-item-selector=\"*\">\n\t\t\t\t<div class=\"deensimc-marquee-track-wrapper\">\n\t\t\t\t\t<div class=\"deensimc-marquee-track\">\n\t\t\t\t\t\t<figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Weingut-Pax-original-e1776886313750.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Vereno-Weinhandel-original-e1776886331740.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Twobuild-original-e1776886344646.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/TU-Wien-original-e1776886360163.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/AM_CI_logo_01_final_col_grey_RGB.svg\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/MEDICO-Fachaerzte-original-e1776886392585.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Nelis-used-bikes-and-more-orignal-e1776886376831.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure>\t\t\t\t\t<\/div>\n\t\t\t\t\t<div aria-hidden=\"true\" class=\"deensimc-marquee-track\">\n\t\t\t\t\t\t<figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Weingut-Pax-original-e1776886313750.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Vereno-Weinhandel-original-e1776886331740.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Twobuild-original-e1776886344646.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/TU-Wien-original-e1776886360163.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/AM_CI_logo_01_final_col_grey_RGB.svg\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/MEDICO-Fachaerzte-original-e1776886392585.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Nelis-used-bikes-and-more-orignal-e1776886376831.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure>\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<noscript>\n\t\t\t<div class=\"deensimc-noscript-notice\" role=\"note\">\n\t\t\t\tThis section requires JavaScript to load properly. Please enable JavaScript in your browser and reload the page.\t\t\t<\/div>\n\t\t<\/noscript>\n\t\t<div class=\"elementor-element elementor-element-d0bf188 elementor-widget elementor-widget-deensimc-smooth-marquee\" data-id=\"d0bf188\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"deensimc-smooth-marquee.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<div class=\"deensimc-marquee-main-container deensimc-image-marquee deensimc-marquee-reverse deensimc-marquee-edge-shadow\" data-marquee-speed=\"5\" data-track-fill=\"yes\" data-track-item-selector=\"*\">\n\t\t\t\t<div class=\"deensimc-marquee-track-wrapper\">\n\t\t\t\t\t<div class=\"deensimc-marquee-track\">\n\t\t\t\t\t\t<figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Masterconcept-gmbh-original-e1776886405485.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/LB-Medical-Care-original-e1776886421536.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/E-D-Beratung-original-e1776886440720.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Dr-Karamat-original-e1776886474281.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Dr-Uzel-original-e1776886456885.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Dr-Grundbichler-original.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure>\t\t\t\t\t<\/div>\n\t\t\t\t\t<div aria-hidden=\"true\" class=\"deensimc-marquee-track\">\n\t\t\t\t\t\t<figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Masterconcept-gmbh-original-e1776886405485.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/LB-Medical-Care-original-e1776886421536.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/E-D-Beratung-original-e1776886440720.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Dr-Karamat-original-e1776886474281.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Dr-Uzel-original-e1776886456885.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Dr-Grundbichler-original.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure>\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<noscript>\n\t\t\t<div class=\"deensimc-noscript-notice\" role=\"note\">\n\t\t\t\tThis section requires JavaScript to load properly. Please enable JavaScript in your browser and reload the page.\t\t\t<\/div>\n\t\t<\/noscript>\n\t\t<div class=\"elementor-element elementor-element-f693832 elementor-widget elementor-widget-deensimc-smooth-marquee\" data-id=\"f693832\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"deensimc-smooth-marquee.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<div class=\"deensimc-marquee-main-container deensimc-image-marquee deensimc-marquee-edge-shadow\" data-marquee-speed=\"5\" data-track-fill=\"yes\" data-track-item-selector=\"*\">\n\t\t\t\t<div class=\"deensimc-marquee-track-wrapper\">\n\t\t\t\t\t<div class=\"deensimc-marquee-track\">\n\t\t\t\t\t\t<figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Benjamin-Consulting-original-e1776886521126.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Ahevita-original-e1776886539239.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Buzz-Babes-original-e1776886504695.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Gly_Logo-scaled-1-e1776886603579.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Easy-Clean-Car-Wash-Original-e1776886572412.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Ed-accounting-GmbH-original-e1776886561578.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Schwarzenberger-Consulting-original-e1776886588363.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure>\t\t\t\t\t<\/div>\n\t\t\t\t\t<div aria-hidden=\"true\" class=\"deensimc-marquee-track\">\n\t\t\t\t\t\t<figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Benjamin-Consulting-original-e1776886521126.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Ahevita-original-e1776886539239.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Buzz-Babes-original-e1776886504695.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Gly_Logo-scaled-1-e1776886603579.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Easy-Clean-Car-Wash-Original-e1776886572412.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Ed-accounting-GmbH-original-e1776886561578.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure><figure class=\"deensimc-img-wrapper\"><div class=\"deensimc-img\"><img decoding=\"async\" class=\"deensimc-marquee-image\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Schwarzenberger-Consulting-original-e1776886588363.webp\" loading=lazy alt=\"Image gallery marquee\"><\/div><figcaption class=\"deensimc-image-marquee-caption\"><\/figcaption><\/figure>\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<noscript>\n\t\t\t<div class=\"deensimc-noscript-notice\" role=\"note\">\n\t\t\t\tThis section requires JavaScript to load properly. Please enable JavaScript in your browser and reload the page.\t\t\t<\/div>\n\t\t<\/noscript>\n\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-64dd843 e-flex e-con-boxed e-con e-child\" data-id=\"64dd843\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1f51b70 elementor-widget elementor-widget-image\" data-id=\"1f51b70\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"800\" height=\"892\" src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Handshake-918x1024.webp\" class=\"attachment-large size-large wp-image-13438\" alt=\"\" srcset=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Handshake-918x1024.webp 918w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Handshake-269x300.webp 269w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Handshake-768x857.webp 768w, https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/01\/Handshake.webp 1000w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-39c7a76 e-con-full e-flex e-con e-parent\" data-id=\"39c7a76\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9d70745 elementor-widget elementor-widget-html\" data-id=\"9d70745\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"section-team\">\n  <div class=\"team-section-bg\"><\/div>\n\n  <div class=\"team-inner\">\n\n    <div class=\"team-header\">\n      <h2 class=\"team-heading\">\n        We make your business stand out online. <span>Period.<\/span>\n      <\/h2>\n      <p class=\"team-sub\">\n        Three friends. One shared goal. Click a card to get to know us.\n      <\/p>\n    <\/div>\n\n    <div class=\"team-grid\">\n\n      <!-- TOBIAS -->\n      <div class=\"flip-card\" id=\"card-tobi\">\n        <div class=\"flip-card-inner\">\n\n          <div class=\"flip-front\">\n            <div class=\"member-photo\">\n              <img decoding=\"async\"\n                src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Berger-Headshot.webp\"\n                alt=\"Tobias Berger\"\n              \/>\n            <\/div>\n\n            <div class=\"member-body\">\n              <h3 class=\"member-name\">Tobias Berger<\/h3>\n              <div class=\"member-role\">Development & Technology<\/div>\n\n              <p class=\"member-desc\">\n                Tobias makes sure your website is fast, reliable\n                and built to perform for the long run.\n              <\/p>\n\n              <div class=\"member-facts\">\n\n                <div class=\"member-fact\">\n                  <svg\n                    width=\"14\"\n                    height=\"14\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"#151DA5\"\n                    stroke-width=\"2.5\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  >\n                    <path d=\"M20 6L9 17l-5-5\"\/>\n                  <\/svg>\n                  Clean, reliable development\n                <\/div>\n\n                <div class=\"member-fact\">\n                  <svg\n                    width=\"14\"\n                    height=\"14\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"#151DA5\"\n                    stroke-width=\"2.5\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  >\n                    <path d=\"M20 6L9 17l-5-5\"\/>\n                  <\/svg>\n                  Performance & SEO in mind\n                <\/div>\n\n                <div class=\"member-fact\">\n                  <svg\n                    width=\"14\"\n                    height=\"14\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"#151DA5\"\n                    stroke-width=\"2.5\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  >\n                    <path d=\"M20 6L9 17l-5-5\"\/>\n                  <\/svg>\n                  Your go-to for technical questions\n                <\/div>\n\n              <\/div>\n\n              <button\n                class=\"btn-flip\"\n                onclick=\"flipCard('card-tobi')\"\n              >\n                Read the full bio\n              <\/button>\n            <\/div>\n          <\/div>\n\n          <div class=\"flip-back\">\n            <div class=\"back-content\">\n\n              <div class=\"back-header\">\n                <div class=\"back-name\">Tobias Berger<\/div>\n                <div class=\"back-role-label\">\n                  Development & Technology\n                <\/div>\n              <\/div>\n\n              <p class=\"back-bio\">\n                Tobias is our numbers guy and resident tech enthusiast.\n                He earned his bachelor's degree in Statistics and Business\n                Mathematics at TU Wien with honors and received a merit\n                scholarship. He is currently pursuing a master's degree in\n                Statistics, Probability and Mathematics in Economics.\n                <br><br>\n                Alongside his studies, he worked as a teaching assistant\n                at TU Wien and independently built websites for university\n                projects. His passion for technology, analytical mindset\n                and eye for detail make him an essential part of the team.\n              <\/p>\n\n              <div class=\"back-footer\">\n                <a\n                  href=\"https:\/\/www.linkedin.com\/in\/tobias-berger-13b208282\/\"\n                  target=\"_blank\"\n                  class=\"btn-linkedin\"\n                >\n                  LinkedIn\n                <\/a>\n\n                <button\n                  class=\"btn-flip-back\"\n                  onclick=\"flipCard('card-tobi')\"\n                  title=\"Back\"\n                >\n                  \u00d7\n                <\/button>\n              <\/div>\n\n            <\/div>\n          <\/div>\n\n        <\/div>\n      <\/div>\n\n\n      <!-- PAUL -->\n      <div class=\"flip-card\" id=\"card-paul\">\n        <div class=\"flip-card-inner\">\n\n          <div class=\"flip-front\">\n            <div class=\"member-photo\">\n              <img decoding=\"async\"\n                src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Stellnberger-Headshot.webp\"\n                alt=\"Paul Stellnberger\"\n              \/>\n            <\/div>\n\n            <div class=\"member-body\">\n              <h3 class=\"member-name\">Paul Stellnberger<\/h3>\n              <div class=\"member-role\">Web Design & Structure<\/div>\n\n              <p class=\"member-desc\">\n                Paul turns complex ideas into clear, intuitive websites\n                that look great and make sense from the first click.\n              <\/p>\n\n              <div class=\"member-facts\">\n\n                <div class=\"member-fact\">\n                  <svg\n                    width=\"14\"\n                    height=\"14\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"#151DA5\"\n                    stroke-width=\"2.5\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  >\n                    <path d=\"M20 6L9 17l-5-5\"\/>\n                  <\/svg>\n                  Web design & user experience\n                <\/div>\n\n                <div class=\"member-fact\">\n                  <svg\n                    width=\"14\"\n                    height=\"14\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"#151DA5\"\n                    stroke-width=\"2.5\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  >\n                    <path d=\"M20 6L9 17l-5-5\"\/>\n                  <\/svg>\n                  Legally compliant implementation\n                <\/div>\n\n                <div class=\"member-fact\">\n                  <svg\n                    width=\"14\"\n                    height=\"14\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"#151DA5\"\n                    stroke-width=\"2.5\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  >\n                    <path d=\"M20 6L9 17l-5-5\"\/>\n                  <\/svg>\n                  Clear, intuitive site structures\n                <\/div>\n\n              <\/div>\n\n              <button\n                class=\"btn-flip\"\n                onclick=\"flipCard('card-paul')\"\n              >\n                Read the full bio\n              <\/button>\n            <\/div>\n          <\/div>\n\n          <div class=\"flip-back\">\n            <div class=\"back-content\">\n\n              <div class=\"back-header\">\n                <div class=\"back-name\">Paul Stellnberger<\/div>\n                <div class=\"back-role-label\">\n                  Web Design & Structure\n                <\/div>\n              <\/div>\n\n              <p class=\"back-bio\">\n                Paul combines commercial thinking with a strong instinct\n                for people. He graduated from WU Vienna with honors,\n                spent a semester abroad at George Washington University\n                and is part of the WU Top League.\n                <br><br>\n                He gained hands-on experience at the European Commission\n                and the Austrian National Bank, further sharpening his\n                analytical skills. His strategic mindset, versatility\n                and enthusiasm for new ideas bring valuable perspective\n                to every project.\n              <\/p>\n\n              <div class=\"back-footer\">\n                <a\n                  href=\"https:\/\/www.linkedin.com\/in\/paul-stellnberger\/\"\n                  target=\"_blank\"\n                  class=\"btn-linkedin\"\n                >\n                  LinkedIn\n                <\/a>\n\n                <button\n                  class=\"btn-flip-back\"\n                  onclick=\"flipCard('card-paul')\"\n                  title=\"Back\"\n                >\n                  \u00d7\n                <\/button>\n              <\/div>\n\n            <\/div>\n          <\/div>\n\n        <\/div>\n      <\/div>\n\n\n      <!-- AARON -->\n      <div class=\"flip-card\" id=\"card-aaron\">\n        <div class=\"flip-card-inner\">\n\n          <div class=\"flip-front\">\n            <div class=\"member-photo\">\n              <img decoding=\"async\"\n                src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/Csok-Headshot.webp\"\n                alt=\"Aaron Csok\"\n              \/>\n            <\/div>\n\n            <div class=\"member-body\">\n              <h3 class=\"member-name\">Aaron Csok<\/h3>\n              <div class=\"member-role\">Branding & Design<\/div>\n\n              <p class=\"member-desc\">\n                Aaron gives your brand a clear, distinctive online presence\n                that makes an impact.\n              <\/p>\n\n              <div class=\"member-facts\">\n\n                <div class=\"member-fact\">\n                  <svg\n                    width=\"14\"\n                    height=\"14\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"#151DA5\"\n                    stroke-width=\"2.5\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  >\n                    <path d=\"M20 6L9 17l-5-5\"\/>\n                  <\/svg>\n                  Positioning & brand identity\n                <\/div>\n\n                <div class=\"member-fact\">\n                  <svg\n                    width=\"14\"\n                    height=\"14\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"#151DA5\"\n                    stroke-width=\"2.5\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  >\n                    <path d=\"M20 6L9 17l-5-5\"\/>\n                  <\/svg>\n                  Graphic design & visual direction\n                <\/div>\n\n                <div class=\"member-fact\">\n                  <svg\n                    width=\"14\"\n                    height=\"14\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"#151DA5\"\n                    stroke-width=\"2.5\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  >\n                    <path d=\"M20 6L9 17l-5-5\"\/>\n                  <\/svg>\n                  Design that turns heads\n                <\/div>\n\n              <\/div>\n\n              <button\n                class=\"btn-flip\"\n                onclick=\"flipCard('card-aaron')\"\n              >\n                Read the full bio\n              <\/button>\n            <\/div>\n          <\/div>\n\n          <div class=\"flip-back\">\n            <div class=\"back-content\">\n\n              <div class=\"back-header\">\n                <div class=\"back-name\">Aaron Csok<\/div>\n                <div class=\"back-role-label\">\n                  Branding & Design\n                <\/div>\n              <\/div>\n\n              <p class=\"back-bio\">\n                Aaron brings entrepreneurial drive and a strong digital\n                perspective to the team. During his studies in the United\n                States, he graduated at the top of his class and served\n                as vice president of the student body.\n                <br><br>\n                He went on to gain experience in e-commerce, social media\n                and digital marketing. With a sharp eye for trends,\n                an international perspective and solid technical know-how,\n                Aaron creates tailored solutions for our clients at BSC.\n                Creative, modern and focused on making ideas happen.\n              <\/p>\n\n              <div class=\"back-footer\">\n                <a\n                  href=\"https:\/\/www.linkedin.com\/in\/aaroncsok\/\"\n                  target=\"_blank\"\n                  class=\"btn-linkedin\"\n                >\n                  LinkedIn\n                <\/a>\n\n                <button\n                  class=\"btn-flip-back\"\n                  onclick=\"flipCard('card-aaron')\"\n                  title=\"Back\"\n                >\n                  \u00d7\n                <\/button>\n              <\/div>\n\n            <\/div>\n          <\/div>\n\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/section>\n\n\n<style>\n\n.section-team {\n  background: #FDFDFD;\n  padding: 88px 0 72px;\n  position: relative;\n  overflow: hidden;\n}\n\n.team-section-bg {\n  position: absolute;\n  inset: 0;\n  background-image: radial-gradient(\n    circle,\n    #c8cbdc 1px,\n    transparent 1px\n  );\n  background-size: 28px 28px;\n  opacity: 0.3;\n  pointer-events: none;\n}\n\n.team-inner {\n  position: relative;\n  max-width: 1160px;\n  margin: 0 auto;\n  padding: 0 48px;\n  z-index: 1;\n}\n\n.team-header {\n  text-align: center;\n  margin-bottom: 48px;\n}\n\n.team-heading {\n  font-size: clamp(1.8rem, 2.8vw, 2.4rem);\n  font-weight: 900;\n  color: #0d0d0d;\n  line-height: 1.2;\n  margin: 0 0 12px;\n  letter-spacing: -0.02em;\n}\n\n.team-heading span {\n  color: #151DA5;\n}\n\n.team-sub {\n  font-size: 16px;\n  color: #666;\n  margin: 0;\n}\n\n\n\/* GRID *\/\n\n.team-grid {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 24px;\n}\n\n\n\/* FLIP CARD *\/\n\n.flip-card {\n  perspective: 1200px;\n  height: auto;\n}\n\n.flip-card-inner {\n  position: relative;\n  width: 100%;\n  height: auto;\n  min-height: 580px;\n  transform-style: preserve-3d;\n  transition: transform .6s cubic-bezier(.4, 0, .2, 1);\n}\n\n.flip-card.flipped .flip-card-inner {\n  transform: rotateY(180deg);\n}\n\n.flip-front,\n.flip-back {\n  position: relative;\n  inset: 0;\n  backface-visibility: hidden;\n  -webkit-backface-visibility: hidden;\n  border-radius: 16px;\n  overflow: hidden;\n}\n\n\n\/* FRONT *\/\n\n.flip-front {\n  background: #fff;\n  border: 1px solid #e2e8f0;\n  display: flex;\n  flex-direction: column;\n  transition: box-shadow 0.2s, transform 0.2s;\n}\n\n.member-photo {\n  position: relative;\n  aspect-ratio: 4 \/ 3;\n  overflow: hidden;\n  background: #eaecf2;\n  flex-shrink: 0;\n}\n\n.member-photo img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center top;\n  display: block;\n  transition: transform .5s;\n}\n\n.member-body {\n  padding: 20px 22px 22px;\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n}\n\n.member-name {\n  font-size: 20px;\n  font-weight: 800;\n  color: #0d0d0d;\n  margin: 0 0 2px;\n  letter-spacing: -0.01em;\n}\n\n.member-role {\n  font-size: 14px;\n  font-weight: 700;\n  color: #151DA5;\n  letter-spacing: 0.08em;\n  margin-bottom: 10px;\n}\n\n.member-desc {\n  font-size: 16px;\n  line-height: 1.7;\n  color: #64748b;\n  margin: 0 0 14px;\n}\n\n.member-facts {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  margin-bottom: 16px;\n}\n\n.member-fact {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 14px;\n  color: #0d0d0d;\n  font-weight: 500;\n  background: transparent !important;\n  border: none !important;\n  padding: 0 !important;\n  border-radius: 0 !important;\n}\n\n.member-fact svg {\n  flex-shrink: 0;\n}\n\n\n\/* BUTTON *\/\n\n.btn-flip {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  margin-top: 22px;\n  font-size: 14px;\n  font-weight: 700;\n  color: #151DA5 !important;\n  background: rgba(21, 29, 165, 0.08);\n  border: none !important;\n  border-radius: 8px;\n  padding: 12px 18px;\n  cursor: pointer;\n  transition:\n    background .2s,\n    color .2s,\n    transform .2s;\n  font-family: inherit;\n  width: 100%;\n  box-shadow: none !important;\n}\n\n.btn-flip:hover {\n  background: #151DA5;\n  color: #fff !important;\n  transform: translateY(-1px);\n}\n\n\n\/* BACK *\/\n\n.flip-back {\n  background: #151DA5;\n  transform: rotateY(180deg);\n  display: flex;\n  flex-direction: column;\n  padding: 28px 24px 24px;\n  position: absolute;\n}\n\n.back-content {\n  position: relative;\n  z-index: 1;\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n}\n\n.back-header {\n  margin-bottom: 16px;\n}\n\n.back-name {\n  font-size: 22px;\n  font-weight: 800;\n  color: #fff;\n  line-height: 1.1;\n}\n\n.back-role-label {\n  font-size: 14px;\n  font-weight: 700;\n  color: rgba(255, 255, 255, 0.72);\n  letter-spacing: .07em;\n  margin-top: 5px;\n}\n\n.back-bio {\n  font-size: 14px;\n  color: rgba(255, 255, 255, 0.70);\n  line-height: 1.75;\n  flex: 1;\n}\n\n.back-footer {\n  margin-top: 20px;\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding-top: 16px;\n  border-top: 1px solid rgba(255, 255, 255, .1);\n}\n\n\n\/* LINKEDIN BUTTON *\/\n\n.btn-linkedin {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  background: rgba(255, 255, 255, .1);\n  border: 1px solid rgba(255, 255, 255, .18);\n  color: #fff;\n  font-size: 12px;\n  font-weight: 600;\n  padding: 10px 18px;\n  border-radius: 8px;\n  text-decoration: none;\n  flex: 1;\n  justify-content: center;\n  transition:\n    background .2s,\n    color .2s;\n}\n\n.btn-linkedin:hover {\n  background: rgba(255, 255, 255, 0.95);\n  color: #151DA5;\n}\n\n\n\/* BACK BUTTON *\/\n\n.btn-flip-back {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  background: rgba(255, 255, 255, .08);\n  border: 1px solid rgba(255, 255, 255, .12);\n  cursor: pointer;\n  flex-shrink: 0;\n  transition: background .2s;\n  color: rgba(255, 255, 255, .7);\n  font-size: 24px;\n  line-height: 1;\n}\n\n.btn-flip-back:hover {\n  background: rgba(255, 255, 255, .18);\n}\n\n\n\/* TABLET *\/\n\n@media (max-width: 1024px) and (min-width: 768px) {\n\n  .team-grid {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: center;\n    gap: 24px;\n    max-width: 860px;\n    margin: 0 auto;\n  }\n\n  .team-grid .flip-card {\n    width: calc(50% - 12px);\n  }\n}\n\n\n\/* MOBILE *\/\n\n@media (max-width: 767px) {\n\n  .team-grid {\n    display: grid;\n    grid-template-columns: 1fr;\n    max-width: 420px;\n    margin: 0 auto;\n    gap: 24px;\n  }\n\n  .team-grid .flip-card {\n    width: 100%;\n  }\n\n  .flip-card {\n    height: auto;\n    min-height: 560px;\n  }\n\n  .team-inner {\n    padding: 0 20px;\n  }\n\n  .section-team {\n    padding: 64px 0;\n  }\n}\n\n<\/style>\n\n\n<script>\nfunction flipCard(id) {\n  document.getElementById(id).classList.toggle('flipped');\n}\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f944bc0 elementor-widget elementor-widget-html\" data-id=\"f944bc0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- SERVICES SECTION -->\n<section class=\"services-section\">\n\n  <div class=\"services-section-bg\"><\/div>\n\n  <div class=\"services-inner\">\n\n    <!-- Header -->\n    <div class=\"team-header\">\n      <h2 class=\"team-heading\">\n        Here\u2019s what we can <span>do for you.<\/span>\n      <\/h2>\n\n      <p class=\"team-sub\">\n        No templates. No gimmicks. Just solutions designed to move your business forward.\n      <\/p>\n    <\/div>\n\n    <!-- List rows -->\n    <div class=\"services-list\">\n\n      <!-- Website -->\n      <a href=\"\/en\/services\/#websites\" class=\"svc-row\">\n\n        <div class=\"svc-row-left\">\n          <div class=\"svc-row-title-wrap\">\n            <span class=\"svc-row-title\">Website<\/span>\n            <span class=\"svc-row-price\">from \u20ac2,500<\/span>\n          <\/div>\n        <\/div>\n\n        <div class=\"svc-row-mid\">\n          <p class=\"svc-row-desc\">\n            A professional business website with a clear structure, modern design and an intuitive user experience.\n          <\/p>\n        <\/div>\n\n        <div class=\"svc-row-right\">\n          <ul class=\"svc-row-list\">\n            <li>Custom design<\/li>\n            <li>Mobile optimised<\/li>\n            <li>SEO foundations included<\/li>\n            <li>Clean technical implementation<\/li>\n          <\/ul>\n\n          <span class=\"svc-row-cta\">\n            Learn more\n\n            <svg width=\"15\" height=\"15\" viewBox=\"0 0 16 16\" fill=\"none\">\n              <path\n                d=\"M3 8h10M9 4l4 4-4 4\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.6\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              \/>\n            <\/svg>\n          <\/span>\n        <\/div>\n\n      <\/a>\n\n\n      <!-- Online Shop -->\n      <a href=\"\/en\/services\/#webshop\" class=\"svc-row\">\n\n        <div class=\"svc-row-left\">\n          <div class=\"svc-row-title-wrap\">\n            <span class=\"svc-row-title\">Online Shop<\/span>\n            <span class=\"svc-row-price\">from \u20ac3,000<\/span>\n          <\/div>\n        <\/div>\n\n        <div class=\"svc-row-mid\">\n          <p class=\"svc-row-desc\">\n            Online shops that do more than showcase your products. Clear, intuitive and built to drive sales.\n          <\/p>\n        <\/div>\n\n        <div class=\"svc-row-right\">\n          <ul class=\"svc-row-list\">\n            <li>Well structured product pages<\/li>\n            <li>Optimised user journeys<\/li>\n            <li>Easy to manage<\/li>\n            <li>Built for conversions<\/li>\n          <\/ul>\n\n          <span class=\"svc-row-cta\">\n            Learn more\n\n            <svg width=\"15\" height=\"15\" viewBox=\"0 0 16 16\" fill=\"none\">\n              <path\n                d=\"M3 8h10M9 4l4 4-4 4\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.6\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              \/>\n            <\/svg>\n          <\/span>\n        <\/div>\n\n      <\/a>\n\n\n      <!-- Additional Services -->\n      <a href=\"\/en\/services\/#additional-services\" class=\"svc-row\">\n\n        <div class=\"svc-row-left\">\n          <div class=\"svc-row-title-wrap\">\n            <span class=\"svc-row-title\">Additional Services<\/span>\n          <\/div>\n        <\/div>\n\n        <div class=\"svc-row-mid\">\n          <p class=\"svc-row-desc\">\n            SEO, branding and ongoing support from one team, so you can stay focused on running your business.\n          <\/p>\n        <\/div>\n\n        <div class=\"svc-row-right\">\n          <ul class=\"svc-row-list\">\n            <li>SEO &amp; Google Maps<\/li>\n            <li>Logo &amp; branding<\/li>\n            <li>Ongoing monthly support<\/li>\n            <li>Funding advice &amp; strategy<\/li>\n          <\/ul>\n\n          <span class=\"svc-row-cta\">\n            Learn more\n\n            <svg width=\"15\" height=\"15\" viewBox=\"0 0 16 16\" fill=\"none\">\n              <path\n                d=\"M3 8h10M9 4l4 4-4 4\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.6\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              \/>\n            <\/svg>\n          <\/span>\n        <\/div>\n\n      <\/a>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<style>\n\n\/* \u2500\u2500\u2500 Section \u2500\u2500\u2500 *\/\n\n.services-section {\n  background: #FDFDFD;\n  position: relative;\n  overflow: hidden;\n  padding: 64px 0;\n  box-sizing: border-box;\n}\n\n.services-section-bg {\n  position: absolute;\n  inset: 0;\n  background-image: radial-gradient(\n    circle,\n    #c8cbdc 1px,\n    transparent 1px\n  );\n  background-size: 28px 28px;\n  opacity: 0.38;\n  pointer-events: none;\n}\n\n.services-inner {\n  position: relative;\n  max-width: 1160px;\n  width: 100%;\n  margin: 0 auto;\n  padding: 0 48px;\n  display: flex;\n  flex-direction: column;\n}\n\n\n\/* \u2500\u2500\u2500 Header \u2500\u2500\u2500 *\/\n\n.team-header {\n  text-align: center;\n}\n\n.team-heading span {\n  color: #151DA5;\n}\n\n\n\/* \u2500\u2500\u2500 List \u2500\u2500\u2500 *\/\n\n.services-list {\n  display: flex;\n  flex-direction: column;\n  border-top: 0.5px solid #151DA5;\n}\n\n\n\/* \u2500\u2500\u2500 Row \u2500\u2500\u2500 *\/\n\n.svc-row {\n  display: grid;\n  grid-template-columns: 220px 1fr 1fr;\n  align-items: start;\n  gap: 32px;\n  padding: 28px 0;\n  border-bottom: 0.5px solid #151DA5;\n  text-decoration: none !important;\n  color: inherit;\n  transition: background 0.2s;\n  position: relative;\n}\n\n.svc-row:link,\n.svc-row:visited,\n.svc-row:hover,\n.svc-row:active {\n  text-decoration: none !important;\n}\n\n.svc-row * {\n  text-decoration: none !important;\n}\n\n.svc-row::after {\n  content: '';\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: -1px;\n  height: 1px;\n  background: #151DA5;\n  transform: scaleX(0);\n  transform-origin: left;\n  transition: transform 0.35s ease;\n}\n\n.svc-row:hover::after {\n  transform: scaleX(1);\n}\n\n\n\/* \u2500\u2500\u2500 Left column \u2500\u2500\u2500 *\/\n\n.svc-row-left {\n  display: flex;\n  align-items: flex-start;\n}\n\n.svc-row-title-wrap {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.svc-row-title {\n  font-size: clamp(1.4rem, 2vw, 1.75rem);\n  font-weight: 800;\n  color: #0d0d0d;\n  letter-spacing: -0.02em;\n  line-height: 1.15;\n  transition: color 0.2s;\n}\n\n.svc-row:hover .svc-row-title {\n  color: #151DA5;\n}\n\n.svc-row-price {\n  font-size: 16px;\n  font-weight: 700;\n  color: #151DA5;\n  letter-spacing: 0.02em;\n}\n\n\n\/* \u2500\u2500\u2500 Mid column \u2500\u2500\u2500 *\/\n\n.svc-row-mid {\n  padding-top: 4px;\n}\n\n.svc-row-desc {\n  font-size: 16px;\n  line-height: 1.75;\n  color: #555;\n  margin: 0;\n}\n\n\n\/* \u2500\u2500\u2500 Right column \u2500\u2500\u2500 *\/\n\n.svc-row-right {\n  padding-top: 4px;\n  display: flex;\n  flex-direction: column;\n  gap: 14px;\n}\n\n.svc-row-list {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 5px 16px;\n}\n\n.svc-row-list li {\n  font-size: 16px;\n  color: #666;\n  display: flex;\n  align-items: center;\n  gap: 7px;\n  line-height: 1.4;\n}\n\n.svc-row-list li::before {\n  content: '';\n  width: 4px;\n  height: 4px;\n  border-radius: 50%;\n  background: #151DA5;\n  opacity: 0.5;\n  flex-shrink: 0;\n}\n\n.svc-row-cta {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 16px;\n  font-weight: 700;\n  color: #151DA5;\n  transition: gap 0.2s;\n}\n\n.svc-row:hover .svc-row-cta {\n  gap: 10px;\n}\n\n\n\/* \u2500\u2500\u2500 Responsive \u2500\u2500\u2500 *\/\n\n@media (max-width: 960px) {\n\n  .svc-row {\n    grid-template-columns: 1fr 1fr;\n    grid-template-rows: auto auto;\n    gap: 16px 24px;\n  }\n\n  .svc-row-left {\n    grid-column: 1;\n    grid-row: 1;\n  }\n\n  .svc-row-mid {\n    grid-column: 2;\n    grid-row: 1;\n  }\n\n  .svc-row-right {\n    grid-column: 1 \/ -1;\n    grid-row: 2;\n  }\n\n}\n\n\n@media (max-width: 640px) {\n\n  .services-section {\n    padding: 56px 0;\n  }\n\n  .services-inner {\n    padding: 0 20px;\n  }\n\n  .svc-row {\n    grid-template-columns: 1fr;\n    grid-template-rows: auto auto auto;\n    gap: 10px;\n    padding: 24px 0;\n  }\n\n  .svc-row-left {\n    grid-column: 1;\n    grid-row: 1;\n  }\n\n  .svc-row-mid {\n    grid-column: 1;\n    grid-row: 2;\n  }\n\n  .svc-row-right {\n    grid-column: 1;\n    grid-row: 3;\n  }\n\n  .svc-row-list {\n    grid-template-columns: 1fr;\n  }\n\n  .svc-row-title {\n    font-size: 22px;\n    line-height: 1.1;\n  }\n\n  .svc-row-title-wrap {\n    flex-direction: row;\n    align-items: center;\n    gap: 10px;\n    flex-wrap: wrap;\n  }\n\n  .svc-row-price {\n    font-size: 16px;\n    line-height: 1;\n  }\n\n}\n\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4653a59 elementor-widget elementor-widget-html\" data-id=\"4653a59\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- CASE STUDY SECTION \u2013 BEFORE\/AFTER SLIDER -->\n<section class=\"case-section\">\n\n  <div class=\"case-inner\">\n\n    <div class=\"case-header\">\n      <h2 class=\"case-heading\">\n        Clarity builds <span>trust<\/span>.<br>\n        Trust drives <span>growth<\/span>.\n      <\/h2>\n\n      <p class=\"case-sub\">\n        See how we turned an outdated website into a platform for growth.\n      <\/p>\n    <\/div>\n\n    <div class=\"case-card\">\n\n      <!-- Left: Text -->\n      <div class=\"case-content\">\n\n        <div class=\"case-client-label\">\n          Dr. Aglas \/ Medi.co \u00b7 Salzburg\n        <\/div>\n\n        <div class=\"case-accordion\">\n\n          <div class=\"case-acc-item\">\n            <button class=\"case-acc-trigger\" aria-expanded=\"false\">\n              <span>Starting point<\/span>\n\n              <svg\n                class=\"case-acc-icon\"\n                width=\"18\"\n                height=\"18\"\n                viewBox=\"0 0 18 18\"\n                fill=\"none\"\n              >\n                <path\n                  d=\"M4 7l5 5 5-5\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.8\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                \/>\n              <\/svg>\n            <\/button>\n\n            <div class=\"case-acc-body\">\n              <p>\n                Dr. Aglas' existing website was outdated both technically and visually.\n                It lacked clear positioning and a structure that could support future growth.\n                At the same time, the vision for a modern medical centre with multiple\n                independent physicians was beginning to take shape.\n              <\/p>\n            <\/div>\n          <\/div>\n\n\n          <div class=\"case-acc-item\">\n            <button class=\"case-acc-trigger\" aria-expanded=\"false\">\n              <span>Our approach<\/span>\n\n              <svg\n                class=\"case-acc-icon\"\n                width=\"18\"\n                height=\"18\"\n                viewBox=\"0 0 18 18\"\n                fill=\"none\"\n              >\n                <path\n                  d=\"M4 7l5 5 5-5\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.8\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                \/>\n              <\/svg>\n            <\/button>\n\n            <div class=\"case-acc-body\">\n              <p>\n                We repositioned the brand as a modern medical centre and gave the website\n                a clear strategic direction. The new site was designed to be intuitive,\n                structured and reassuring. Instead of an overloaded design, the focus is\n                on clarity, professionalism and easy navigation.\n              <\/p>\n            <\/div>\n          <\/div>\n\n\n          <div class=\"case-acc-item\">\n            <button class=\"case-acc-trigger\" aria-expanded=\"false\">\n              <span>The result<\/span>\n\n              <svg\n                class=\"case-acc-icon\"\n                width=\"18\"\n                height=\"18\"\n                viewBox=\"0 0 18 18\"\n                fill=\"none\"\n              >\n                <path\n                  d=\"M4 7l5 5 5-5\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.8\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                \/>\n              <\/svg>\n            <\/button>\n\n            <div class=\"case-acc-body\">\n              <p>\n                Within one year, the centre grew to six physicians. The website strengthens\n                the centre's professional image, builds trust and actively supports the\n                continued growth of the location.\n              <\/p>\n            <\/div>\n          <\/div>\n\n        <\/div>\n\n        <a href=\"\/en\/references\/\" class=\"btn-primary\">\n          <span class=\"btn-primary__text\">View more projects<\/span>\n          <span class=\"btn-primary__icon\">\u2192<\/span>\n          <span class=\"btn-primary__shine\"><\/span>\n        <\/a>\n\n      <\/div>\n\n\n      <!-- Right: Slider -->\n      <div class=\"case-visual\">\n\n        <div class=\"case-slider\" id=\"caseSlider\">\n\n          <!-- After -->\n          <div class=\"case-slider-after\">\n            <img decoding=\"async\"\n              src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/BSC-Webdesign-MEDICO-after.webp\"\n              alt=\"Website after the redesign\"\n              draggable=\"false\"\n            \/>\n          <\/div>\n\n          <!-- Before -->\n          <div class=\"case-slider-before\" id=\"caseSliderBefore\">\n            <img decoding=\"async\"\n              src=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2026\/04\/BSC-Webdesign_Aglas-before-1.webp\"\n              alt=\"Website before the redesign\"\n              draggable=\"false\"\n            \/>\n          <\/div>\n\n          <!-- Labels -->\n          <div class=\"case-slider-label case-slider-label--before\">\n            Before\n          <\/div>\n\n          <div class=\"case-slider-label case-slider-label--after\">\n            After\n          <\/div>\n\n          <!-- Handle -->\n          <div class=\"case-slider-handle\" id=\"caseSliderHandle\">\n\n            <div class=\"case-slider-line\"><\/div>\n\n            <div class=\"case-slider-btn\">\n              <svg\n                width=\"20\"\n                height=\"20\"\n                viewBox=\"0 0 20 20\"\n                fill=\"none\"\n              >\n                <path\n                  d=\"M7 4l-4 6 4 6M13 4l4 6-4 6\"\n                  stroke=\"white\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                \/>\n              <\/svg>\n            <\/div>\n\n            <div class=\"case-slider-line\"><\/div>\n\n          <\/div>\n\n        <\/div>\n\n        <p class=\"case-slider-hint\">\n          \u2190 Drag to compare \u2192\n        <\/p>\n\n      <\/div>\n\n    <\/div>\n\n  <\/div>\n<\/section>\n\n\n<style>\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   HEADING\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.case-heading span {\n  color: #151DA5;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   SECTION\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.case-section {\n  background: #FDFDFD;\n  padding: 88px 0;\n  position: relative;\n  overflow: hidden;\n}\n\n.case-section::before {\n  content: '';\n  position: absolute;\n  inset: 0;\n  background-image: radial-gradient(\n    circle,\n    #c8cbdc 1px,\n    transparent 1px\n  );\n  background-size: 28px 28px;\n  opacity: 0.38;\n  pointer-events: none;\n}\n\n.case-inner {\n  position: relative;\n  max-width: 1160px;\n  margin: 0 auto;\n  padding: 0 48px;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   HEADER\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.case-header {\n  text-align: center;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 16px;\n  margin-bottom: 56px;\n}\n\n.case-heading {\n  font-size: clamp(1.8rem, 3vw, 2.6rem);\n  font-weight: 900;\n  color: #0d0d0d;\n  line-height: 1.2;\n  margin: 0;\n  letter-spacing: -0.02em;\n}\n\n.case-sub {\n  font-size: 16px;\n  color: #666;\n  margin: 0;\n  max-width: 520px;\n  line-height: 1.6;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   CARD\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.case-card {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 48px;\n  align-items: center;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   CONTENT\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.case-content {\n  display: flex;\n  flex-direction: column;\n  gap: 28px;\n}\n\n.case-client-label {\n  font-size: 16px;\n  font-weight: 700;\n  letter-spacing: 0.1em;\n  color: #151DA5;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   ACCORDION\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.case-accordion {\n  display: flex;\n  flex-direction: column;\n  border-radius: 12px;\n  overflow: hidden;\n  border: 1px solid #eaecf2;\n  background: #fff;\n}\n\n.case-acc-item {\n  border-bottom: 1px solid #eaecf2;\n}\n\n.case-acc-item:last-child {\n  border-bottom: none;\n}\n\n.case-acc-trigger {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  background: #fafbff;\n  border: none;\n  cursor: pointer;\n  font-size: 16px;\n  font-weight: 700;\n  color: #0d0d0d;\n  text-align: left;\n  transition:\n    background 0.2s,\n    color 0.2s;\n  font-family: inherit;\n}\n\n.case-acc-trigger:hover {\n  background: rgba(21, 29, 165, 0.05);\n}\n\n.case-acc-item--open .case-acc-trigger {\n  background: rgba(21, 29, 165, 0.08);\n  color: #151DA5;\n  border-left: 3px solid #151DA5;\n}\n\n.case-acc-icon {\n  flex-shrink: 0;\n  color: #999;\n  transition:\n    transform 0.25s,\n    color 0.25s;\n}\n\n.case-acc-item--open .case-acc-icon {\n  transform: rotate(180deg);\n  color: #151DA5;\n}\n\n.case-acc-body {\n  max-height: 0;\n  overflow: hidden;\n  transition:\n    max-height 0.35s ease,\n    padding 0.25s ease;\n  padding: 0 20px;\n  background: #fff;\n}\n\n.case-acc-item--open .case-acc-body {\n  max-height: 600px;\n  padding: 16px 20px;\n}\n\n.case-acc-body p {\n  font-size: 16px;\n  line-height: 1.75;\n  color: #555;\n  margin: 0;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   BUTTON\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.btn-primary {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  padding: 14px 28px;\n  border-radius: 6px;\n  background: #151DA5;\n  color: #fff !important;\n  font-size: 16px;\n  font-weight: 600;\n  text-decoration: none;\n  overflow: hidden;\n  transition:\n    transform 0.2s ease,\n    box-shadow 0.2s ease;\n  box-shadow: 0 4px 18px rgba(21, 29, 165, 0.28);\n  white-space: nowrap;\n  align-self: flex-start;\n}\n\n.btn-primary__text,\n.btn-primary__icon {\n  color: #fff !important;\n  position: relative;\n  z-index: 1;\n}\n\n.btn-primary__shine {\n  position: absolute;\n  inset: 0;\n  background: linear-gradient(\n    105deg,\n    transparent 30%,\n    rgba(255, 255, 255, 0.22) 50%,\n    transparent 70%\n  );\n  transform: translateX(-100%);\n  z-index: 0;\n}\n\n.btn-primary:hover {\n  background: #151DA5;\n  transform: translateY(-2px);\n  box-shadow: 0 8px 28px rgba(21, 29, 165, 0.40);\n  color: #fff !important;\n}\n\n.btn-primary:hover .btn-primary__shine {\n  transform: translateX(200%);\n  transition: transform 0.55s ease;\n}\n\n.btn-primary:hover .btn-primary__icon {\n  animation: nudge-right 0.4s ease forwards;\n}\n\n@keyframes nudge-right {\n  0% {\n    transform: translateX(0);\n  }\n\n  50% {\n    transform: translateX(5px);\n  }\n\n  100% {\n    transform: translateX(0);\n  }\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   SLIDER\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.case-visual {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 12px;\n}\n\n.case-slider {\n  position: relative;\n  width: 100%;\n  border-radius: 14px;\n  overflow: hidden;\n  box-shadow:\n    0 8px 40px rgba(21, 29, 165, 0.14),\n    0 2px 8px rgba(0, 0, 0, 0.08);\n  cursor: col-resize;\n  user-select: none;\n  border: 1px solid #e4e6f2;\n  aspect-ratio: 16 \/ 10;\n}\n\n\n\/* After *\/\n\n.case-slider-after {\n  position: absolute;\n  inset: 0;\n}\n\n.case-slider-after img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: top;\n  display: block;\n}\n\n\n\/* Before *\/\n\n.case-slider-before {\n  position: absolute;\n  inset: 0;\n  clip-path: inset(0 50% 0 0);\n}\n\n.case-slider-before img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: top;\n  display: block;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   LABELS\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.case-slider-label {\n  position: absolute;\n  top: 14px;\n  font-size: 12px;\n  font-weight: 700;\n  letter-spacing: 0.08em;\n  padding: 5px 12px;\n  border-radius: 20px;\n  pointer-events: none;\n  z-index: 4;\n  backdrop-filter: blur(4px);\n}\n\n.case-slider-label--before {\n  left: 14px;\n  background: rgba(255, 255, 255, 0.92);\n  color: #444;\n  border: 1px solid rgba(0, 0, 0, 0.08);\n}\n\n.case-slider-label--after {\n  right: 14px;\n  background: #151DA5;\n  color: #fff;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   HANDLE\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.case-slider-handle {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 50%;\n  transform: translateX(-50%);\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  z-index: 5;\n  pointer-events: none;\n}\n\n.case-slider-line {\n  flex: 1;\n  width: 2px;\n  background: rgba(255, 255, 255, 0.9);\n  box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);\n}\n\n.case-slider-btn {\n  width: 44px;\n  height: 44px;\n  background: #151DA5;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-shadow:\n    0 4px 16px rgba(21, 29, 165, 0.4),\n    0 0 0 3px rgba(255, 255, 255, 0.9);\n  flex-shrink: 0;\n  transition: transform 0.15s;\n}\n\n.case-slider:hover .case-slider-btn {\n  transform: scale(1.08);\n  background: #151DA5;\n}\n\n.case-slider-hint {\n  font-size: 12px;\n  color: #aaa;\n  font-weight: 500;\n  letter-spacing: 0.03em;\n  margin: 0;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   RESPONSIVE\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n@media (max-width: 1024px) {\n\n  .case-card {\n    grid-template-columns: 1fr;\n    gap: 48px;\n  }\n\n  .case-visual {\n    max-width: 560px;\n    width: 100%;\n    margin: 0 auto;\n  }\n}\n\n\n@media (max-width: 640px) {\n\n  .case-section {\n    padding: 64px 0;\n  }\n\n  .case-inner {\n    padding: 0 20px;\n  }\n\n  .case-stats {\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .case-stat-divider {\n    width: 40px;\n    height: 1px;\n  }\n\n  .btn-primary {\n    align-self: center;\n  }\n}\n\n<\/style>\n\n\n<script>\n\n\/* Accordion *\/\n\ndocument.querySelectorAll('.case-acc-trigger').forEach(trigger => {\n\n  trigger.addEventListener('click', () => {\n\n    const item = trigger.closest('.case-acc-item');\n    const isOpen = item.classList.contains('case-acc-item--open');\n\n    document.querySelectorAll('.case-acc-item').forEach(i => {\n\n      i.classList.remove('case-acc-item--open');\n\n      i.querySelector('.case-acc-trigger')\n        .setAttribute('aria-expanded', 'false');\n\n    });\n\n    if (!isOpen) {\n\n      item.classList.add('case-acc-item--open');\n\n      trigger.setAttribute('aria-expanded', 'true');\n\n    }\n\n  });\n\n});\n\n\n\/* Before\/After Slider *\/\n\n(function() {\n\n  const slider = document.getElementById('caseSlider');\n  const before = document.getElementById('caseSliderBefore');\n  const handle = document.getElementById('caseSliderHandle');\n\n  if (!slider || !before || !handle) return;\n\n  let isDragging = false;\n\n\n  function setPosition(x) {\n\n    const rect = slider.getBoundingClientRect();\n\n    let pct = (x - rect.left) \/ rect.width;\n\n    pct = Math.min(\n      Math.max(pct, 0.02),\n      0.98\n    );\n\n    const pctStr =\n      (pct * 100).toFixed(2) + '%';\n\n    before.style.clipPath =\n      `inset(0 ${(100 - pct * 100).toFixed(2)}% 0 0)`;\n\n    handle.style.left = pctStr;\n\n  }\n\n\n  \/* Mouse *\/\n\n  slider.addEventListener('mousedown', e => {\n\n    isDragging = true;\n\n    setPosition(e.clientX);\n\n    e.preventDefault();\n\n  });\n\n\n  window.addEventListener('mousemove', e => {\n\n    if (!isDragging) return;\n\n    setPosition(e.clientX);\n\n  });\n\n\n  window.addEventListener('mouseup', () => {\n\n    isDragging = false;\n\n  });\n\n\n  \/* Touch *\/\n\n  slider.addEventListener(\n    'touchstart',\n    e => {\n\n      isDragging = true;\n\n      setPosition(e.touches[0].clientX);\n\n      e.preventDefault();\n\n    },\n    {\n      passive: false\n    }\n  );\n\n\n  window.addEventListener(\n    'touchmove',\n    e => {\n\n      if (!isDragging) return;\n\n      setPosition(e.touches[0].clientX);\n\n    },\n    {\n      passive: true\n    }\n  );\n\n\n  window.addEventListener('touchend', () => {\n\n    isDragging = false;\n\n  });\n\n})();\n\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-445b5ea elementor-widget elementor-widget-html\" data-id=\"445b5ea\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\n     BSC WEBDESIGN \u2014 FAQ Section (Homepage)\n     Accordion style, matching site design\n     ============================================================ -->\n\n<section class=\"faq\">\n  <div class=\"faq__inner\">\n\n    <div class=\"faq__left\">\n      <h2 class=\"faq__heading\">\n        Frequently asked <span class=\"faq__heading-accent\">questions<\/span>\n      <\/h2>\n\n      <p class=\"faq__sub\">\n        Everything you need to know about building a website, web design,\n        pricing, technology, SEO and working with BSC Webdesign.\n      <\/p>\n\n      <a class=\"faq__more\" href=\"\/en\/faq\/\">\n        View all questions\n\n        <svg\n          width=\"13\"\n          height=\"13\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2.5\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n        >\n          <path d=\"M5 12h14M12 5l7 7-7 7\"\/>\n        <\/svg>\n      <\/a>\n    <\/div>\n\n\n    <div class=\"faq__right\">\n      <div class=\"faq__list\">\n\n        <div class=\"faq-item\">\n          <button\n            class=\"faq-question\"\n            onclick=\"toggleFAQHome(this)\"\n          >\n            How long does it take to build my website?\n\n            <span class=\"faq-chevron\">\n              <svg\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <path\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                  d=\"M19 9l-7 7-7-7\"\n                \/>\n              <\/svg>\n            <\/span>\n          <\/button>\n\n          <div class=\"faq-answer\">\n            <p>\n              Most websites are completed within three to five weeks.\n              The exact timeline depends on the scope of the project and\n              the number of feedback rounds. We follow a clear process\n              and keep you updated throughout, so you always know where\n              things stand and what comes next.\n            <\/p>\n          <\/div>\n        <\/div>\n\n\n        <div class=\"faq-item\">\n          <button\n            class=\"faq-question\"\n            onclick=\"toggleFAQHome(this)\"\n          >\n            What is the difference between BSC Webdesign and a website builder like Wix or Jimdo?\n\n            <span class=\"faq-chevron\">\n              <svg\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <path\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                  d=\"M19 9l-7 7-7-7\"\n                \/>\n              <\/svg>\n            <\/span>\n          <\/button>\n\n          <div class=\"faq-answer\">\n            <p>\n              Website builders are convenient, but they also come with\n              limitations. Many rely on rigid structures, offer less\n              control over important SEO elements and can make it harder\n              to optimise performance and technical structure. We build\n              websites around your business, with a clear structure,\n              strong performance and the technical foundations needed\n              for long-term visibility.\n            <\/p>\n          <\/div>\n        <\/div>\n\n\n        <div class=\"faq-item\">\n          <button\n            class=\"faq-question\"\n            onclick=\"toggleFAQHome(this)\"\n          >\n            What does the process of building a website with BSC Webdesign look like?\n\n            <span class=\"faq-chevron\">\n              <svg\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <path\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                  d=\"M19 9l-7 7-7-7\"\n                \/>\n              <\/svg>\n            <\/span>\n          <\/button>\n\n          <div class=\"faq-answer\">\n            <p>\n              We start by discussing your goals, the scope of the project\n              and your budget. You then receive a proposal and, once\n              everything is agreed, the contract. From there, we develop\n              the concept and design, build the website and work through\n              feedback rounds together until everything feels right.\n              After launch, we remain your point of contact for updates\n              and further development. We also clearly agree on what is\n              included in your ongoing support package.\n            <\/p>\n          <\/div>\n        <\/div>\n\n\n        <div class=\"faq-item\">\n          <button\n            class=\"faq-question\"\n            onclick=\"toggleFAQHome(this)\"\n          >\n            How much does ongoing support cost after launch?\n\n            <span class=\"faq-chevron\">\n              <svg\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <path\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                  d=\"M19 9l-7 7-7-7\"\n                \/>\n              <\/svg>\n            <\/span>\n          <\/button>\n\n          <div class=\"faq-answer\">\n            <p>\n              Ongoing monthly support is part of our long-term collaboration.\n              The cost depends on what you need. Some clients mainly want\n              the peace of mind that the technical side is taken care of,\n              while others rely on us for regular content updates, changes\n              and ongoing support with everything related to their website.\n              We explain the exact scope and costs clearly before you sign\n              anything.\n            <\/p>\n          <\/div>\n        <\/div>\n\n\n        <div class=\"faq-item\">\n          <button\n            class=\"faq-question\"\n            onclick=\"toggleFAQHome(this)\"\n          >\n            Will you still be there for me after my website goes live?\n\n            <span class=\"faq-chevron\">\n              <svg\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <path\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                  d=\"M19 9l-7 7-7-7\"\n                \/>\n              <\/svg>\n            <\/span>\n          <\/button>\n\n          <div class=\"faq-answer\">\n            <p>\n              Absolutely. You receive the direct mobile number of your\n              personal contact at BSC and can reach us directly whenever\n              you need us. Small changes are usually taken care of on the\n              same day. We are not the kind of agency that builds your\n              website and disappears. We aim to be a reliable long-term\n              partner you can count on.\n            <\/p>\n          <\/div>\n        <\/div>\n\n\n        <div class=\"faq-item\">\n          <button\n            class=\"faq-question\"\n            onclick=\"toggleFAQHome(this)\"\n          >\n            Can I pay for my website in instalments?\n\n            <span class=\"faq-chevron\">\n              <svg\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <path\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                  d=\"M19 9l-7 7-7-7\"\n                \/>\n              <\/svg>\n            <\/span>\n          <\/button>\n\n          <div class=\"faq-answer\">\n            <p>\n              Yes. Especially for smaller businesses and start-ups,\n              it is important that the investment remains manageable.\n              That is why we can also offer payment in instalments.\n              Just let us know and we will find a fair arrangement\n              that works for you.\n            <\/p>\n          <\/div>\n        <\/div>\n\n      <\/div>\n    <\/div>\n\n  <\/div>\n<\/section>\n\n\n<style>\n\n.faq *,\n.faq *::before,\n.faq *::after {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n\n.faq button,\n.faq button:hover,\n.faq button:focus,\n.faq button:active,\n.faq button:focus-visible,\n.faq button:focus-within {\n  background: transparent !important;\n  background-color: transparent !important;\n  background-image: none !important;\n  outline: none !important;\n  box-shadow: none !important;\n  -webkit-tap-highlight-color: transparent !important;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   SECTION\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.faq {\n  background: #FDFDFD;\n  padding: 96px 0 112px;\n  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\n  overflow-x: hidden;\n}\n\n.faq__inner {\n  max-width: 1180px;\n  margin: 0 auto;\n  padding: 0 2rem;\n  display: grid;\n  grid-template-columns: 1fr 1.6fr;\n  gap: 80px;\n  align-items: start;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.faq__left,\n.faq__right {\n  min-width: 0;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   LEFT COLUMN\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.faq__heading {\n  font-size: clamp(1.8rem, 3vw, 2.6rem);\n  font-weight: 800;\n  color: #0d0d0d;\n  line-height: 1.15;\n  letter-spacing: -0.025em;\n  margin-bottom: 16px;\n}\n\n.faq__heading-accent {\n  color: #151DA5;\n}\n\n.faq__sub {\n  font-size: 16px;\n  color: #6b7280;\n  line-height: 1.7;\n  margin-bottom: 32px;\n}\n\n.faq__more {\n  display: inline-flex;\n  align-items: center;\n  gap: 7px;\n  font-size: 16px;\n  font-weight: 700;\n  color: #151DA5;\n  text-decoration: none;\n  letter-spacing: 0.01em;\n  transition: gap 0.15s ease;\n}\n\n.faq__more:hover {\n  gap: 11px;\n}\n\n.faq__more svg {\n  flex-shrink: 0;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   FAQ LIST\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.faq__list {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n}\n\n.faq-item {\n  background: #ffffff;\n  border: 1px solid #eaecf2;\n  border-radius: 14px;\n  transition:\n    border-color 0.2s,\n    box-shadow 0.2s;\n  width: 100%;\n  max-width: 100%;\n}\n\n.faq-item.open {\n  border-color: rgba(21, 29, 165, 0.20);\n  box-shadow: 0 4px 20px rgba(21, 29, 165, 0.07);\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   QUESTION\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.faq-question {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 16px;\n  padding: 18px 22px;\n  background-color: transparent !important;\n  background-image: none !important;\n  border: none;\n  cursor: pointer;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 600;\n  color: #0d0d0d;\n  text-align: left;\n  line-height: 1.45;\n  transition: color 0.2s;\n  -webkit-appearance: none;\n  appearance: none;\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  white-space: normal;\n  min-width: 0;\n}\n\n.faq-question:hover,\n.faq-question:focus,\n.faq-question:active {\n  background-color: transparent !important;\n  background-image: none !important;\n  outline: none;\n  color: #151DA5;\n}\n\n.faq-item.open .faq-question {\n  color: #151DA5;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   CHEVRON\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.faq-chevron {\n  flex-shrink: 0;\n  width: 22px;\n  height: 22px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: transform 0.3s;\n}\n\n.faq-chevron svg {\n  width: 16px;\n  height: 16px;\n  color: #9ca3af;\n  transition: color 0.2s;\n}\n\n.faq-item.open .faq-chevron {\n  transform: rotate(180deg);\n}\n\n.faq-item.open .faq-chevron svg {\n  color: #151DA5;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   ANSWER\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n.faq-answer {\n  max-height: 0;\n  overflow: hidden;\n  padding: 0 22px;\n  transition:\n    max-height 0.38s ease,\n    padding 0.3s ease;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.faq-item.open .faq-answer {\n  max-height: 600px;\n  padding: 0 22px 20px;\n}\n\n.faq-answer p {\n  font-size: 16px;\n  color: #6b7280;\n  line-height: 1.78;\n  border-top: 1px solid #eaecf2;\n  padding-top: 14px;\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   TABLET\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n@media (max-width: 860px) {\n\n  .faq__inner {\n    grid-template-columns: 1fr;\n    gap: 40px;\n    padding: 0 1.25rem;\n  }\n\n  .faq__left {\n    display: grid;\n    grid-template-columns: 1fr auto;\n    grid-template-rows: auto auto;\n    column-gap: 24px;\n    align-items: start;\n  }\n\n  .faq__heading {\n    grid-column: 1 \/ -1;\n  }\n\n  .faq__sub {\n    grid-column: 1;\n    margin-bottom: 0;\n  }\n\n  .faq__more {\n    grid-column: 2;\n    grid-row: 2;\n    align-self: center;\n    white-space: nowrap;\n  }\n}\n\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   MOBILE\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n\n@media (max-width: 560px) {\n\n  .faq {\n    padding: 64px 0 80px;\n  }\n\n  .faq__inner {\n    padding: 0 1rem;\n  }\n\n  .faq__left {\n    display: flex;\n    flex-direction: column;\n    gap: 0;\n  }\n\n  .faq__sub {\n    margin-bottom: 24px;\n  }\n\n  .faq-question {\n    padding: 14px 16px;\n    font-size: 16px;\n    gap: 12px;\n  }\n\n  .faq-answer {\n    padding: 0 16px;\n  }\n\n  .faq-item.open .faq-answer {\n    padding: 0 16px 16px;\n  }\n\n  .faq-answer p {\n    font-size: 16px;\n  }\n\n  .faq-chevron {\n    width: 18px;\n    height: 18px;\n  }\n\n  .faq-chevron svg {\n    width: 13px;\n    height: 13px;\n  }\n}\n\n<\/style>\n\n\n<script>\n\nfunction toggleFAQHome(btn) {\n\n  const item = btn.closest('.faq-item');\n\n  const isOpen =\n    item.classList.contains('open');\n\n  document\n    .querySelectorAll('.faq-item.open')\n    .forEach(i => i.classList.remove('open'));\n\n  if (!isOpen) {\n    item.classList.add('open');\n  }\n\n}\n\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Websites for yourbusiness that think ahead No templates, no gimmicks. Websites that understand your goals and connect with your target audience. Start a project Our work Avg. 4 weeks until launch Same day changes implemented 4.9 \/ 5 Google rating TwoBuild Vereno Weinhandel MEDI.CO Fach\u00e4rzte Schwarzenberger Coaching Dr. Karamat Weingut Pax Dr. Uzel Buzz Babes [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":3967,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3968","page","type-page","status-publish","has-post-thumbnail","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Professional Websites &amp; Webshops | BSC Webdesign Vienna<\/title>\n<meta name=\"description\" content=\"Simple. Professional. Inexpensive. BSC Webdesign Vienna creates modern websites &amp; web stores that convince and strengthen your online presence.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/bscwebdesign.at\/en\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Professional Websites &amp; Webshops | BSC Webdesign Vienna\" \/>\n<meta property=\"og:description\" content=\"Simple. Professional. Inexpensive. BSC Webdesign Vienna creates modern websites &amp; web stores that convince and strengthen your online presence.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/bscwebdesign.at\/en\/\" \/>\n<meta property=\"og:site_name\" content=\"bscwebdesign.at\" \/>\n<meta property=\"article:modified_time\" content=\"2026-07-16T10:05:24+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/09\/Logo-Quadrat.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/\",\"url\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/\",\"name\":\"Professional Websites & Webshops | BSC Webdesign Vienna\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/bscwebdesign.at\\\/wp-content\\\/uploads\\\/2025\\\/08\\\/cropped-logo-klein.webp\",\"datePublished\":\"2025-07-09T07:56:30+00:00\",\"dateModified\":\"2026-07-16T10:05:24+00:00\",\"description\":\"Simple. Professional. Inexpensive. BSC Webdesign Vienna creates modern websites & web stores that convince and strengthen your online presence.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/#primaryimage\",\"url\":\"https:\\\/\\\/bscwebdesign.at\\\/wp-content\\\/uploads\\\/2025\\\/08\\\/cropped-logo-klein.webp\",\"contentUrl\":\"https:\\\/\\\/bscwebdesign.at\\\/wp-content\\\/uploads\\\/2025\\\/08\\\/cropped-logo-klein.webp\",\"width\":512,\"height\":512,\"caption\":\"BSC Webdesign Logo \u2013 Professionelle Websites und Webshops aus \u00d6sterreich.\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/bscwebdesign.at\\\/en\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Home\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#website\",\"url\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/\",\"name\":\"bscwebdesign.at\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#organization\",\"name\":\"bscwebdesign.at\",\"url\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/bscwebdesign.at\\\/wp-content\\\/uploads\\\/2025\\\/07\\\/bsc-logo-next.webp\",\"contentUrl\":\"https:\\\/\\\/bscwebdesign.at\\\/wp-content\\\/uploads\\\/2025\\\/07\\\/bsc-logo-next.webp\",\"width\":2500,\"height\":1000,\"caption\":\"bscwebdesign.at\"},\"image\":{\"@id\":\"https:\\\/\\\/plum-ibex-319890.hostingersite.com\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Professional Websites & Webshops | BSC Webdesign Vienna","description":"Simple. Professional. Inexpensive. BSC Webdesign Vienna creates modern websites & web stores that convince and strengthen your online presence.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/bscwebdesign.at\/en\/","og_locale":"en_US","og_type":"article","og_title":"Professional Websites & Webshops | BSC Webdesign Vienna","og_description":"Simple. Professional. Inexpensive. BSC Webdesign Vienna creates modern websites & web stores that convince and strengthen your online presence.","og_url":"https:\/\/bscwebdesign.at\/en\/","og_site_name":"bscwebdesign.at","article_modified_time":"2026-07-16T10:05:24+00:00","og_image":[{"url":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/09\/Logo-Quadrat.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/bscwebdesign.at\/en\/","url":"https:\/\/bscwebdesign.at\/en\/","name":"Professional Websites & Webshops | BSC Webdesign Vienna","isPartOf":{"@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/bscwebdesign.at\/en\/#primaryimage"},"image":{"@id":"https:\/\/bscwebdesign.at\/en\/#primaryimage"},"thumbnailUrl":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/cropped-logo-klein.webp","datePublished":"2025-07-09T07:56:30+00:00","dateModified":"2026-07-16T10:05:24+00:00","description":"Simple. Professional. Inexpensive. BSC Webdesign Vienna creates modern websites & web stores that convince and strengthen your online presence.","breadcrumb":{"@id":"https:\/\/bscwebdesign.at\/en\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/bscwebdesign.at\/en\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/bscwebdesign.at\/en\/#primaryimage","url":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/cropped-logo-klein.webp","contentUrl":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/08\/cropped-logo-klein.webp","width":512,"height":512,"caption":"BSC Webdesign Logo \u2013 Professionelle Websites und Webshops aus \u00d6sterreich."},{"@type":"BreadcrumbList","@id":"https:\/\/bscwebdesign.at\/en\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/bscwebdesign.at\/en\/"},{"@type":"ListItem","position":2,"name":"Home"}]},{"@type":"WebSite","@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#website","url":"https:\/\/plum-ibex-319890.hostingersite.com\/","name":"bscwebdesign.at","description":"","publisher":{"@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/plum-ibex-319890.hostingersite.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#organization","name":"bscwebdesign.at","url":"https:\/\/plum-ibex-319890.hostingersite.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#\/schema\/logo\/image\/","url":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/07\/bsc-logo-next.webp","contentUrl":"https:\/\/bscwebdesign.at\/wp-content\/uploads\/2025\/07\/bsc-logo-next.webp","width":2500,"height":1000,"caption":"bscwebdesign.at"},"image":{"@id":"https:\/\/plum-ibex-319890.hostingersite.com\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/pages\/3968","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/comments?post=3968"}],"version-history":[{"count":120,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/pages\/3968\/revisions"}],"predecessor-version":[{"id":15575,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/pages\/3968\/revisions\/15575"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/media\/3967"}],"wp:attachment":[{"href":"https:\/\/bscwebdesign.at\/en\/wp-json\/wp\/v2\/media?parent=3968"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}