#fw-section-hero-video-4a9b3e7c-fc04-404d-a47e-6d5e60bf7b5b {
--font-heading-scale: 1.19;
--font-body-scale: 0.74;
}
#fw-section-hero-video-4a9b3e7c-fc04-404d-a47e-6d5e60bf7b5b {

.hero__container {
    min-height: 460px;
    
}
}









































#fw-section-hero-0 {
--font-heading-scale: 1.37;
--font-body-scale: 1.35;
}
#fw-section-hero-0 {
--color-primary: #0a0909;
--color-primary-rgb: 10, 9, 9;
--color-background: #ffffff;
--color-background-rgb: 255, 255, 255;
--color-on-background: #ffcbf7;
--color-on-background-rgb: 255, 203, 247;
--color-on-primary: #ffffff;
--color-on-primary-rgb: 255, 255, 255;
--color-product-image-background: #500279;
--color-background-brightness: 255;
background-color: var(--color-background);
color: var(--color-on-background);
--primary-btn-bg: #0a0909;
--primary-btn-text: #ffffff;
--primary-btn-border-color: #ffcbf7;
--secondary-btn-bg: transparent;
--secondary-btn-text: #ffcbf7;
--secondary-btn-border-color: #ffcbf7;

/* 1. VARMISTETAAN ANIMAATIO */
@keyframes leijuntaLopullinen {
  0%, 100% { transform: translateY(0) !important; }
  50% { transform: translateY(-12px) !important; }
}

/* 2. PAKOTETAAN LIIKE KAIKKIIN HERO-OTSIKOIHIN */
/* Lisätty html body tekee tästä erittäin vahvan säännön */
html body .hero__heading, 
html body h2.hero__heading,
html body [class*="hero__heading"] {
    display: inline-block !important;
    position: relative !important;
    
    /* Pakotetaan animaatio päälle */
    animation-name: leijuntaLopullinen !important;
    animation-duration: 4s !important;
    animation-iteration-count: infinite !important;
    animation-timing-function: ease-in-out !important;
    
    /* Fontin tyylit ja koko */
    font-size: 1.6rem !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    text-shadow: 1px 1px 0px #ff80ff, 2px 2px 0px #ff80ff, 3px 3px 0px #ff80ff !important;
}

/* 3. POISTETAAN BLOKKAAVA OVERFLOW */
/* Joskus isäntäelementti 'leikkaa' animaation pois */
html body .hero__inner, 
html body .hero__wrapper, 
html body .hero__content {
    overflow: visible !important;
    display: block !important; /* Varmistaa että sisältö ei puristu kasaan */
}.hero__text {
    font-size: 17px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    color: #ffffff !important;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8), 0px 0px 20px rgba(0, 0, 0, 0.4) !important;
    line-height: 1.2 !important;
    font-family: sans-serif !important;
    margin-top: 10px !important;
} .hero__top-text {
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.9) !important;
    font-size: 100%!important;
    margin-bottom: -7px !important;
  background-color: #000000 !important;
color: #ffffff !important;
padding: 4px 12px !important; /* Ensimmäinen luku ylä/ala-tyhjyys, toinen vasen/oikea */
display: inline-block !important; /* Pitää laatikon vain tekstin levyisenä */
text-shadow: none !important; /* Poistaa vanhat varjot alta */
}
/* Vaihtoehtoinen tapa, jos marginaali ei tehoa */
@media (max-width: 768px) {
    .hero__top-text {font-weight: 600 !important;
letter-spacing: 1.5px !important;
text-shadow: 0px 3px 3px rgba(0, 0, 0, 0.4) !important;
      font-size: 70%!important;
        transform: translateY(25px) !important; /* Siirtää tekstiä 25px alaspäin */
                     background-color: #000000 !important;
color: #ffffff !important;
padding: 4px 12px !important; /* Ensimmäinen luku ylä/ala-tyhjyys, toinen vasen/oikea */
display: inline-block !important; /* Pitää laatikon vain tekstin levyisenä */
text-shadow: none !important; /* Poistaa vanhat varjot alta */
    }
  .hero__text {
        font-size: 12px !important;
    font-weight: 800 !important;
    text-shadow: 0px 3px 3px rgba(0, 0, 0, 0.4) !important;
} }
}

#fw-section-hero-video-bf10edbc-3020-4fc9-b697-d5e3e0c0ee0c {
--font-heading-scale: 0.7;
--font-body-scale: 0.99;
}
#fw-section-hero-video-bf10edbc-3020-4fc9-b697-d5e3e0c0ee0c {

hero__top-text {
    font-size: x-large;
    margin-bottom: 16px;
    color: var(--color-on-background);
}
@media screen and (max-width: 767px) {
  .hero__wrapper .hero__content {
    padding-top: 54px !important;
    padding-bottom: 0 !important;
  }
}
}
#fw-section-newsletter-55b56d89-1ae7-4682-921c-d0fe94354e42 {
--font-heading-scale: 1.0;
--font-body-scale: 1.0;
}
#fw-section-newsletter-55b56d89-1ae7-4682-921c-d0fe94354e42 {
--color-primary: #bc9c5e;
--color-primary-rgb: 188, 156, 94;
--color-background: #fbdefb;
--color-background-rgb: 251, 222, 251;
--color-on-background: #000000;
--color-on-background-rgb: 0, 0, 0;
--color-on-primary: #ffffff;
--color-on-primary-rgb: 255, 255, 255;
--color-product-image-background: #500279;
--color-background-brightness: 234;
background-color: var(--color-background);
color: var(--color-on-background);
--primary-btn-bg: #bc9c5e;
--primary-btn-text: #ffffff;
--primary-btn-border-color: #000000;
--secondary-btn-bg: transparent;
--secondary-btn-text: #000000;
--secondary-btn-border-color: #000000;
/* Tehdään lomakkeesta joustava ja leveä */
.newsletter-form {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        max-width: 800px !important;
        margin: 0 auto !important;
        gap: 30px !important;
    }

/* Sähköpostikentän venytys */
.newsletter-form__form-section {
    flex: 2 !important;
    width: 100% !important;
}

/* Maksutapojen asettelu lomakkeen viereen */
.ndbk-payments-in-newsletter {
    flex: 1 !important;
    display: flex !important;
    justify-content: flex-end !important;
}

/* Somelinkkien asettelu */
.ndbk-socials-row {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 15px !important;
    margin-top: 10px !important;
}

@media (max-width: 768px) {
    .newsletter-form { flex-direction: column !important; }
    .ndbk-payments-in-newsletter { justify-content: center !important; margin-top: 20px; }
}
}
#fw-section-footer {
--color-primary: #585858;
--color-primary-rgb: 88, 88, 88;
--color-background: #996d99;
--color-background-rgb: 153, 109, 153;
--color-on-background: #100f0f;
--color-on-background-rgb: 16, 15, 15;
--color-on-primary: #3a3a3a;
--color-on-primary-rgb: 58, 58, 58;
--color-product-image-background: #500279;
--color-background-brightness: 127;
background-color: var(--color-background);
color: var(--color-on-background);
--primary-btn-bg: #585858;
--primary-btn-text: #3a3a3a;
--primary-btn-border-color: #100f0f;
--secondary-btn-bg: transparent;
--secondary-btn-text: #100f0f;
--secondary-btn-border-color: #100f0f;

}
#fw-section-header {

.header__link {
    display: block;
    padding: 8px 0;
    color: #111111 !important;
    text-decoration: none;

    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.1 !important;
    letter-spacing: 0.06em !important;
    text-align: center !important;
    white-space: nowrap !important;
    

    text-shadow: 0px 0px 0px #fdd2fd !important;
}
}