.jyx_rules_body {

  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
	 min-height   :       100vh;


}

.jyx_RulesHero_vital {
  background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
    padding: 120px 20px 60px;
    border-bottom: 5px solid #fbbf24;
	position: relative;
  overflow: hidden;
}


.jyx_RulesHero_vital::before {
  content: '';
    position: absolute;
  top: 0;
    left: 0;
  right: 0;
                    bottom: 0;
  background: url('../artwork/pattern-viking.png') repeat;
    opacity: 0.05;
  z-index: 0;
}

.jyx_hero_wrapper {
   max-width: 1200px;
  margin: 0 auto;
    position: relative;
  z-index: 1;
	
}

.jyx_hero_content_rules {


	text-align: center;
     }

.jyx_hero_heading {
  font-size: 52px;
  color: #fbbf24;
   margin-bottom: 20px;
  font-weight: 900;
      text-transform: uppercase;
  letter-spacing: 3px;
  text-shadow: 3px 3px 8px rgba(0,0,0,0.5);
}

.jyx_hero_tagline     {
   max-width: 700px;
    color: #e5e7eb;
  font-size: 20px;
   margin: 0 auto;
   line-height: 1.7;
}

.jyx_GameRules_carles {
    padding: 80px 20px;
               background: transparent; 

}

.jyx_rules_container {
   max-width: 1200px;
	 margin: 0 auto;
}

.jyx_rules_layout {
   display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 60px;
	 align-items: start; 

}

.jyx_rules_visual {
	   position: sticky;
   top: 120px;
  background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
	border: 4px solid #fbbf24;
    border-radius: 20px;
    padding: 20px;
  box-shadow: 0 15px 45px rgba(0,0,0,0.4);


}

.jyx_rules_photo {
  width: 100%;
   height: auto;
    display: block;
	 border-radius: 12px;
}

.jyx_rules_content		{
	  background: rgba(31,41,55,0.6);
    border: 2px solid #4b5563;
  border-radius: 20px;
    padding     :     45px 40px;
  backdrop-filter: blur(10px);}

.jyx_rules_maintitle {

	    font-size   :     38px;
   color: #fbbf24;
    margin-bottom: 40px;
   font-weight: 900;
    text-transform: uppercase;
  letter-spacing  :       2px;
  text-align: center;
         padding-bottom: 20px;
  border-bottom: 3px solid rgba(251,191,36,0.3);
	}

.jyx_rule_item {
    display: flex;
      gap: 25px;
   margin-bottom: 35px;
                    padding: 25px;
  background: rgba(55,65,81,0.4);
  border-radius: 12px;
       border: 2px solid transparent;
    transition: all 0.35s ease;
}  

.jyx_rule_item:hover {


  background: rgba(55,65,81,0.6);
	 border-color: #fbbf24;
  transform: translateX(5px);


}

.jyx_rule_icon_wrap {
    flex-shrink:  0;
   width: 60px;
   height: 60px;
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
  border-radius: 50%;
        display: flex;
  align-items: center;
   justify-content: center;
  box-shadow: 0 6px 20px rgba(251,191,36,0.4);
}



.jyx_rule_icon  {
                    width: 32px;
    height  :32px;
  filter: brightness(0) invert(1);
}

.jyx_rule_text {
	  flex: 1;

}

.jyx_rule_heading {
	font-size: 22px;
    color: #fff;
  margin-bottom:     12px;
    font-weight: 700;
}

.jyx_rule_description	{
   font-size: 16px;
    color: #d1d5db;
 line-height: 1.8;
  margin: 0;
}

.jyx_rule_description strong {
   color:     #fbbf24;
    font-weight: 700;
}

.jyx_ResponsiblePlay_bordeaux {
    padding: 60px 20px;
  background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
  border-top: 3px solid #dc2626;
  border-bottom  :      3px solid #dc2626;
}

.jyx_responsible_wrapper {
	max-width: 1000px;
   margin:        0 auto;
}

.jyx_responsible_card {
  background: rgba(220,38,38,0.1);

   border: 3px solid #dc2626;

    border-radius: 20px;

    padding: 45px 40px;

   display: flex;

   gap: 35px;

  align-items    :  center;

  backdrop-filter: blur(10px);
}

.jyx_responsible_icon_area {

    flex-shrink: 0;
   width: 100px;
  height: 100px;
  background: linear-gradient(135deg, #dc2626 0%, #991b1b 100%);
  border-radius   :    50%;
         display: flex;
    align-items: center;
  justify-content: center;
  box-shadow: 0 10px 30px rgba(220,38,38,0.5);


}

.jyx_responsible_shield {
	width :55px;
  height: 55px;
  filter: brightness(0) invert(1);
} 

.jyx_responsible_content {
   flex: 1;
}

.jyx_responsible_headline {
         font-size: 32px;
  color: #fff;
	margin-bottom: 20px;
               font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

.jyx_responsible_paragraph {


   font-size: 17px;
   color: #e5e7eb;
   line-height: 1.8;
   margin-bottom: 18px;}

.jyx_responsible_actions {
  margin-top: 28px;
}

.jyx_responsible_btn	{
    display: inline-flex;
  align-items  :      center;
        gap: 12px;
  background: linear-gradient(135deg, #dc2626 0%, #991b1b 100%);
   color: #fff;
    padding: 16px 35px;
  border-radius: 50px;
    font-size: 17px;
    font-weight: 700;
   text-transform: uppercase;
	transition: all 0.35s ease;
  box-shadow: 0 8px 25px rgba(220,38,38,0.4);
    letter-spacing: 1px;
}


.jyx_responsible_btn:hover {
  background: linear-gradient(135deg, #991b1b 0%, #7f1d1d 100%);
  transform: translateY(-3px);
  box-shadow: 0 12px 35px rgba(220,38,38,0.6);
}

.jyx_btn_icon_resp {

	   width: 24px;

   height: 24px;

  filter: brightness(0) invert(1);
}

.jyx_CtaRules_vital {
 padding: 70px 20px;
  background : transparent;
}

.jyx_cta_rules_bounds {
	max-width: 900px;
   margin: 0 auto;
}

.jyx_cta_rules_content {
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
   border-radius: 20px;
   padding: 50px 40px;
  text-align: center;
  box-shadow: 0 15px 45px rgba(251,191,36,0.4);
  position: relative;
     overflow    :  hidden;
}

.jyx_cta_rules_content::before {
  content: '';
   position :   absolute;
          top: -50%;
   right  :    -50%;
   width: 200%;
   height: 200%;
  background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
  animation: jyx_cta_pulse 4s ease-in-out infinite;
} @keyframes jyx_cta_pulse {
    0%, 100% { transform: scale(1); opacity: 0.3; }
    50% { transform: scale(1.1); opacity: 0.5; }
}.jyx_cta_rules_title {
    font-size: 36px;
    color :       #1f2937;
                    margin-bottom: 18px;
  font-weight: 900;
    text-transform: uppercase;
    position: relative;
  z-index: 1;
}

.jyx_cta_rules_text {
  position: relative;
	 z-index: 1;
   font-size: 19px;
  line-height: 1.7;
   color    :#374151;
	margin-bottom    :       32px;
}

.jyx_cta_rules_button {
  display: inline-flex;
   align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, #dc2626 0%, #991b1b 100%);
	color: #fff;
     padding: 18px 45px;
   border-radius: 50px;
   font-size: 19px;
   font-weight     :        900;
   text-transform   :    uppercase;
   transition: all 0.35s ease;
  box-shadow: 0 10px 30px rgba(220,38,38,0.5);
    letter-spacing: 1.5px;
    position: relative;
  z-index :   1;
}

.jyx_cta_rules_button:hover {
  background: linear-gradient(135deg, #991b1b 0%, #7f1d1d 100%);
  transform: translateY(-4px);
  box-shadow: 0 15px 40px rgba(220,38,38,0.7);
}

.jyx_cta_icon {
    width: 26px;
    height: 26px;
  filter: brightness(0) invert(1);
}@media (max-width: 991px) {
    .jyx_rules_layout {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .jyx_rules_visual {
        position: static;
        max-width: 500px;
        margin: 0 auto;
    }

    .jyx_hero_heading {
        font-size: 38px;
    }
}

@media (max-width: 767px) {
    .jyx_hero_heading {
        font-size: 32px;
    }

    .jyx_hero_tagline {
        font-size: 17px;
    }

    .jyx_rules_content {
        padding: 30px 25px;
    }

    .jyx_rules_maintitle {
        font-size: 28px;
    }

    .jyx_rule_item {
        flex-direction: column;
        gap: 20px;
        padding: 20px;
    }

    .jyx_rule_icon_wrap {
        margin: 0 auto;
    }

    .jyx_rule_text {
        text-align: center;
    }

    .jyx_responsible_card {
        flex-direction: column;
        text-align: center;
        padding: 35px 25px;
    }

    .jyx_responsible_headline {
        font-size: 24px;
    }

    .jyx_cta_rules_title {
        font-size: 26px;
    }

    .jyx_cta_rules_content {
        padding: 40px 25px;
    }
}