div.newscontainer_open .newstitleline {    justify-content: start;}
.chooseyourplan {position: relative;z-index: 1;color:#111;}
body.inmodel:not(.mode_app) .chooseyourplan {margin-top: -200px;}
.chooseyourplan h1 { text-align: center; margin-bottom: 2rem; }
.columns { display: flex; gap: 1.5rem; justify-content: center; flex-wrap: wrap; }
.column { background: #FFFFFFDD; border-radius: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); padding: 1.5rem; flex: 1; /*max-width: 300px;*/ min-width: 150px;min-height: 180px;}
.column h2 { text-transform: capitalize; text-align: center; color: #333; }
.option-group { position:relative; }
.option-group label { position:relative; display: block; margin: 0.5rem 0 0.5rem 0px; cursor: pointer; }
.option-group label input { position:absolute;left:-20px;top:0;display: none;}
.option-group label .label { display: flex; border: 1px solid #ddd;ackground-color:#FFF;border-radius: 8px;padding: 4px;overflow:hidden;transition:all 0.3s;font-size: 10px;}
.option-group label:has(input:checked) .label {background-color: #1D3B52;color:#FFF;font-size: 16px;}
.option-group label .label .title { flex:1; }
.option-group label .label .price { justify-content:end;margin-left: 20px;
border: 1px solid #ddd;
border-radius: 5px;
padding: 2px 6px;
height: 16px;
line-height: 16px;
background-color: #00000011;
color: #666; transition:all 0.3s;}
.option-group label:has(input:checked) .label .price { background-color: #FFFFFFCC; color:#000; }

.subscribe-btn { }

.strikeprice {text-decoration:line-through;color: darkred;font-weight:normal;}
.promopricetext {font-weight:normal;}

/* Transition base styles */
.column {
  transition: all 0.6s ease;
  opacity: 1;
  transform: scale(1);
  position: relative;
}

/* Initial hiding of options */
.option-group, .subscribe-btn, .subscribe-info {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.6s ease;
  pointer-events: none;
  max-height: 0;
  overflow: hidden;
}
.column:not(.focused) .options {max-height:30px;}
div.activeproduct {position: absolute;
right: -20px;
top: -30px;
background-color: #FFFFFFEE;
bvorder:1px solid #00000011;
padding: 8px;
border-radius: 8px;
transform: rotate(1deg);}
a.activeproduct {font-weight:bold;color:#000;}

/* Hide others */
.column.dimmed {
  opacity: 0;
  transform: scale(0.8);
  pointer-events: none;
  transition: transform 0.6s ease, opacity 0.6s ease;
}
/* Move left and right columns toward center */
.columns.focused-layout .column.focused[position="p0"] {
  transform: translateX(20%) translateY(-80px) scale(1.1);
}
.columns.focused-layout .column.focused[position="p1"] {
  transform: translateY(-80px) scale(1.1);
}
.columns.focused-layout .column.focused[position="p2"] {
  transform: translateX(-10%) translateY(-80px) scale(1.1);
}

/* Show options inside focused */
.column.focused .option-chapter {display:none;}

.column.focused .option-group,
.column.focused .subscribe-btn,.column.focused .subscribe-info {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.column.focused .subscribe-btn {
display: block; margin-top: 1rem; text-align: center; background: #21AA44/*#0070f3*/; color: white; padding: 0.75rem; border-radius: 8px; text-decoration: none; 
/*position: sticky;*/min-height:20px;max-height:80px !important;
bottom: 32px;
left: 20px;
right: 20px; box-shadow: 0 0 10px 24px #ffffffDD,0 24px 10px 24px #ffffffee;
}
.column.focused .option-group {
  max-height:250px;
  margin-top: 1rem;
  overflow-x:hidden;
  overflow-y: auto;

}

/* Choose button */
.choose-btn {
  display: block;
  margin: 1rem auto 0;
  padding: 0.6rem 1rem;
  background: #21AA44AA;
  color: white;
  border: none;
  border-radius: 8px;
  /*font-weight: bold;*/
  cursor: pointer;
  transition: background 0.3s;
position: absolute;
bottom: 20px;
left: 20px;
right: 20px;
text-align: center;
font-size: 12px;
}
.choose-btn:hover {
  background: #009624;
}

.columns {
  display: flex;
  gap: 1.5rem;
  justify-content: center;
  flex-wrap: wrap;
  transition: all 0.6s ease;
  align-items: start;
}

.columns.focused-layout {
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  min-height: 50vh;
}
.columns.focused-layout .column {
  transition: all 0.6s ease;
}
.columns.focused-layout .column:not(.focused) {
  opacity: 0;
  transform: scale(0.8) translateX(-50%);
  pointer-events: none;
min-width:0px;
}
/* Center and enlarge selected block */
.column.focused {
  transform: scale(1.1);
  max-width: 65%;
  z-index: 10;
  margin: 0 auto;
flex:50;
min-width:280px;background-color:#FFFFFFF8;

}


.column .description div, .column .description p, .column .description li {margin: 4px 0 0 0 !important; padding-top: 0 !important;
padding-bottom: 0 !important;
text-align: justify !important;}


.column .description li{padding-left:24px;}
.column .description li:before {content:'>';position:absolute;left:5px;}

.column .fulldescription, .column .productfulldescription {font-style:italic;font-size:80%;}

.description.deployed {font-size:80% !important;}
.description {margin-top:0 !important;}
.column.focused .description:hover {max-height: 800px !important;}
.descriptionTitle {margin-bottom:0;text-align: center;}
.description h3 {margin-top:0;text-align: center;}

/* Back button */
.back-btn {
  display: none;
  position: absolute;
  top: -4px;
  left: -4px;
  background: #ccc;
  color: black;
  padding: 0;
  border-radius: 16px;
  width:32px;
  height:32px;
  line-height:32px;text-align:center;
  font-size: 0.9rem;
  cursor: pointer;
  transition: background 0.3s;
}
.back-btn:hover {
  background: #999;
}

@media screen and (min-width:800px) {
  .column.focused {display:flex !important;background-color:#FFFFFFF8;}
  .column.focused .about {flex:2;padding-right:40px;}
  .column.focused .options {flex:1;min-width:280px;max-height:1000px;border-left: 1px solid #ddd;padding: 24px;background-color: #FFF;margin: -24px;border-radius:0 12px 12px 0;}
.column.focused .option-group {  max-height:500px;}  
.subscribe-btn { left: auto; min-width:250px;}
}

@media screen and (max-width:799px) {
.column.focused .fulldescription {max-height: 20px;min-height: 20px;overflow:visible;font-size:0px;transition:all 0.3s;}
.column.focused .fulldescription:not(.deployed):before {content:attr(learnmore);position:absolute;font-size:14px;padding:5px;border:1px solid #ddd;background-color:#00000011;border-radius:5px;}
.column.focused .fulldescription.deployed {max-height:500px;overflow-x:hidden;overflow-y: auto;}
.column.focused .description {max-height: 88px !important;}
.column.focused .subscribe-btn {position:sticky;}
}

@media screen and (max-width:799px) {
.columns.focused-layout {
  min-height: 80vh;
}
  .column.focused {
    position: absolute;
    left: -24px;
    right: 0px;
    min-width: 100% !important;
    transform: none !important;
    /*bottom: 16px;*/
top: -164px;
/*overflow: auto;*/
}
}

.column.focused .back-btn {
  display: inline-block;
}

.subscribe-info {position: relative;z-index: 20000;font-size: 70%;text-align: center;font-style: italic;color: #888;padding: 16px;min-height:32px;}
.subscribe-info a {color:#000;}

.newstitleline {transition:opacity 0.3s;}
.newscontainer_open:has( .column.focused) .newstitleline {opacity:0;pointer-events:none;}

.column .about h2 {transition: all 0.3s;}
.column.focused .about h2 {position: absolute;top: -60px;color: #FFF;left: 0;right: 0;text-align: center;}