/**
* 2007-2025 PrestaShop
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to http://www.prestashop.com for more information.
*
*  @author    PrestaShop SA <contact@prestashop.com>
*  @copyright 2007-2025 PrestaShop SA
*  @license   http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of PrestaShop SA
*/

/* ── Section wrapper (margin/padding handled by .oss-seasonal-wrapper) ── */
.tvcmsmultibanner2s {
  margin: 0;
  padding: 0;
  position: relative;
}

/* ── Container ── */
.tvcmsmultibanner2s .tvmultibanner2 {
  max-width: none;
  width: 100%;
  padding: 0;
}

/* ── Grid: column layout (top row + bottom row) ── */
.tvmultibanner2-grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* ── Top row: full-width single banner ── */
.tvmultibanner2-top-row {
  position: relative;
  width: 100%;
}
.tvmultibanner2-top-row .tvbanner-hover-wrapper {
  display: block;
  width: 100%;
  position: relative;
  overflow: hidden;
}
.tvmultibanner2-top-row .tvbanner-hover-wrapper img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* ── Bottom row: 3 equal columns ── */
.tvmultibanner2-bottom-row {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  align-items: stretch;
}
.tvmultibanner2-col {
  flex: 1 1 0;
  min-width: 0;
  position: relative;
}
.tvmultibanner2-col .tvbanner-hover-wrapper {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.tvmultibanner2-col .tvbanner-hover-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── Hover shine effect ── */
.tvcmsmultibanner2s .tvbanner-hover-wrapper:after {
  position: absolute;
  content: "";
  width: 50px;
  transform: skewX(-50deg);
  bottom: 0;
  left: -220%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.2);
}
.tvcmsmultibanner2s .tvbanner-hover-wrapper:hover:after {
  left: 300%;
  transition: all 1.5s ease 0.1s;
}

/* ── Caption content overlay ── */
.tvmultibanner2-content {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  box-sizing: border-box;
  padding: 0 30px;
  top: auto;
  bottom: auto;
  transform: none;
  text-align: left;
}
.tvmultibanner2-content.none {
  display: none;
}
/* top positions */
.tvmultibanner2-content.top-left {
  top: 30px;
  text-align: left;
}
.tvmultibanner2-content.top-center {
  top: 30px;
  text-align: center;
}
.tvmultibanner2-content.top-right {
  top: 30px;
  text-align: right;
}
/* center positions */
.tvmultibanner2-content.left {
  top: 50%;
  transform: translateY(-50%);
  text-align: left;
}
.tvmultibanner2-content.center {
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
}
.tvmultibanner2-content.right {
  top: 50%;
  transform: translateY(-50%);
  text-align: right;
}
/* bottom positions */
.tvmultibanner2-content.bottom-left {
  bottom: 30px;
  text-align: left;
}
.tvmultibanner2-content.bottom-center {
  bottom: 30px;
  text-align: center;
}

/* First banner only: button-style bottom-center */
.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center {
  bottom: 65px;
  left: 50%;
  right: auto;
  width: fit-content;
  max-width: 100%;
  transform: translateX(-50%);
  background: #273776;
  display: inline-block;
  font-family: "Manrope", sans-serif;
  font-weight: 600;
  font-size: 18px;
  line-height: 24px;
  letter-spacing: 0.08em;
  color: #ffffff;
  background-color: #273776;
  border: none;
  border-radius: 0;
  padding: 13px 23px;
  text-transform: none !important;
  text-decoration: none;
  transition: background-color 0.2s ease;
}

.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center:hover,
.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center:focus {
  background-color: #000000;
  color: #ffffff;
  text-decoration: none;
}

/* Override theme link styles when first banner content is a link */
.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center
  a,
.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center
  a:hover,
.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center
  a:focus,
.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center
  a:visited {
  color: #ffffff !important;
  text-decoration: none;
}
.tvcmsmultibanner2-top-row a.tvmultibanner2-content.bottom-center,
.tvcmsmultibanner2-top-row a.tvmultibanner2-content.bottom-center:hover,
.tvcmsmultibanner2-top-row a.tvmultibanner2-content.bottom-center:focus,
.tvcmsmultibanner2-top-row a.tvmultibanner2-content.bottom-center:visited {
  color: #ffffff !important;
  text-decoration: none;
}

.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center
  h1,
.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center
  h2,
.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center
  h3,
.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center
  h4,
.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center
  h5,
.tvcmsmultibanner2s
  .tvmultibanner2-top-row
  .tvmultibanner2-content.bottom-center
  h6 {
  font-size: 20px;
  line-height: 27px;
}
.tvmultibanner2-content.bottom-right {
  bottom: 30px;
  text-align: right;
}

/* ── Caption typography ── */
.tvcmsmultibanner2s .tvmultibanner2-content h1,
.tvcmsmultibanner2s .tvmultibanner2-content h2,
.tvcmsmultibanner2s .tvmultibanner2-content h3,
.tvcmsmultibanner2s .tvmultibanner2-content h4,
.tvcmsmultibanner2s .tvmultibanner2-content h5,
.tvcmsmultibanner2s .tvmultibanner2-content h6 {
  font-family: "Manrope", sans-serif;
  font-weight: 400;
  font-size: 46px;
  line-height: 50px;
  color: #ffffff;
  margin: 0;
}
.tvcmsmultibanner2s .tvmultibanner2-content .tvmultibanner-btn,
.tvcmsmultibanner2s .tvmultibanner2-content .tvmultibanner-btn:hover {
  font-family: "Manrope", sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 27px;
  color: #ffffff;
  background: none;
  border: none;
  padding: 0;
  display: inline-block;
  margin-top: 15px;
}
.tvcmsmultibanner2s .tvmultibanner2-content .tvmultibanner-btn a,
.tvcmsmultibanner2s .tvmultibanner2-content .tvmultibanner-btn:hover a {
  color: #ffffff;
  text-decoration: none;
}

/* ── RTL support ── */
.lang-rtl .tvmultibanner2-bottom-row {
  flex-direction: row-reverse;
}

/* ── Responsive: tablet ── */
@media (max-width: 991px) {
  .tvcmsmultibanner2s .tvmultibanner2-content h1,
  .tvcmsmultibanner2s .tvmultibanner2-content h2,
  .tvcmsmultibanner2s .tvmultibanner2-content h3,
  .tvcmsmultibanner2s .tvmultibanner2-content h4,
  .tvcmsmultibanner2s .tvmultibanner2-content h5,
  .tvcmsmultibanner2s .tvmultibanner2-content h6 {
    font-size: 28px;
    line-height: 32px;
  }
  .tvcmsmultibanner2s
    .tvmultibanner2-top-row
    .tvmultibanner2-content.bottom-center
    h1,
  .tvcmsmultibanner2s
    .tvmultibanner2-top-row
    .tvmultibanner2-content.bottom-center
    h2,
  .tvcmsmultibanner2s
    .tvmultibanner2-top-row
    .tvmultibanner2-content.bottom-center
    h3,
  .tvcmsmultibanner2s
    .tvmultibanner2-top-row
    .tvmultibanner2-content.bottom-center
    h4,
  .tvcmsmultibanner2s
    .tvmultibanner2-top-row
    .tvmultibanner2-content.bottom-center
    h5,
  .tvcmsmultibanner2s
    .tvmultibanner2-top-row
    .tvmultibanner2-content.bottom-center
    h6 {
    font-size: 20px;
    line-height: 27px;
  }
}

/* ── Responsive: mobile ── */
@media (max-width: 767px) {
  .tvmultibanner2-bottom-row {
    flex-wrap: wrap;
  }
  .tvmultibanner2-col {
    flex: 0 0 100%;
  }
  .tvmultibanner2-col .tvbanner-hover-wrapper,
  .tvmultibanner2-col .tvbanner-hover-wrapper img {
    height: auto;
  }
}

@media (max-width: 480px) {
  .tvcmsmultibanner2s .tvmultibanner2-content h1,
  .tvcmsmultibanner2s .tvmultibanner2-content h2,
  .tvcmsmultibanner2s .tvmultibanner2-content h3,
  .tvcmsmultibanner2s .tvmultibanner2-content h4,
  .tvcmsmultibanner2s .tvmultibanner2-content h5,
  .tvcmsmultibanner2s .tvmultibanner2-content h6 {
    font-size: 20px;
    line-height: 27px;
  }
  .tvmultibanner2-content {
    padding: 0 15px;
  }
  .tvcmsmultibanner2s
    .tvmultibanner2-top-row
    .tvmultibanner2-content.bottom-center {
    padding: 16px 15px;
  }
}
