/* CSS Variables for Result Page */
:root{
  --bg:#ffffff;
  --surface:#ffffff;
  --muted:#667085;
  --text:#0b1324;
  --heading:#0b1324;
  --border:#E5E7EB;
  --shadow:0 8px 24px rgba(16,24,40,.06);
  --radius:14px;

  --primary:#DC2626;     /* červená – CTA jako ve wireframu */
  --primary-600:#B91C1C;
  --accent:#2563EB;      /* modrá pro odkazy */
  --ok:#10B981;          /* zelené fajfky */
  --warn:#F59E0B;
  --bad:#EF4444;

  --chip-bg:#F2F4F7;
  --badge-bg:#FDF2F2;
  --badge-text:#7F1D1D;
}

*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:#f8f9fa;font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;color:#1c1c1c;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}

/* Progress bar */
.progress-bar-container{
  position:fixed;
  bottom:0;
  left:0;
  width:100%;
  height:4px;
  background-color:#e5e7eb;
  z-index:1000;
  display:none; /* Hidden by default */
}
.progress-bar-fill{
  height:100%;
  background:linear-gradient(90deg, #6366f1, #8b5cf6);
  width:0%;
  transition:width 0.3s ease-in-out;
  border-radius:0 2px 2px 0;
}
.wrap{width:min(800px,92vw);margin:0 auto;padding:0 0px}
.brand{width: 100%; text-align: center; top:0}
.logo{display:inline-block;padding:18px 0 0 0;font-weight:500;font-size:18px;color:#4529bc; text-transform: uppercase;}
.card{background:#fff;border:1px solid #eee;border-radius:40px;box-shadow:0 8px 24px rgba(0,0,0,.06);padding:28px;margin:18px 0}
.step{display:none}
.step[aria-hidden="false"]{display:block}

.section-wrap {float: left; width: 100%;}

/* Special styling for result step to ensure proper centering */
#step-results{
  width:min(800px,92vw);
  margin:0 auto;
  padding:0;
}
#step-results .result-wrap{
  width:100%;
  margin:0;
  margin-top: 15px;
  padding:0 0px 80px 0px;
}
.question{font-size:24px;line-height:1.3;margin:0px 0 22px 0; text-align: center;}
.choices{display:flex;flex-direction:column;gap:16px}
.choice{display:flex;align-items:center;border:1px solid #e8e6e4;border-radius:16px;padding:18px 20px;cursor:pointer;transition:box-shadow .15s,border-color .15s}
.choice:hover{box-shadow:0 6px 16px rgba(0,0,0,.07);border-color:#e1dedb}
.choice input{appearance:none;position:absolute;opacity:0;pointer-events:none}
.choice span{font-size:18px}
.btn{appearance:none;border:1px solid #d9d6d3;background:#fff;padding:10px 16px;border-radius:12px;cursor:pointer}
.btn.ghost{background:#fff}
.status{display:none;color:#6b6b6b;font-size:12px;margin:16px 8px 40px}
.nav.hint{color:#9a9999;font-size:14px;margin-top:24px}
.risk-result{font-size:28px;font-weight:700;margin:20px 0 16px 0;text-align:center}
.risk-description{font-size:16px;line-height:1.5;margin:0 0 20px 0;text-align:center;color:#666}
.points-display{font-size:18px;font-weight:600;text-align:center;color:#333;margin:16px 0}
#result-content{padding:20px 0}
.nav{display:flex;justify-content:space-between;align-items:center;margin-top:40px; margin-bottom: 20px;}
.nav-arrow{appearance:none;border:1px solid #d9d6d3;background:#fff;padding:12px;border-radius:50%;cursor:pointer;font-size:16px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;transition:box-shadow .15s,border-color .15s}
.nav-arrow:hover{box-shadow:0 4px 12px rgba(0,0,0,.1);border-color:#c1beb8}
.nav-arrow:disabled{opacity:0.5;cursor:not-allowed}
.choice.selected{background:#f8f9fa;border-color:#89b1f7;box-shadow:0 4px 12px rgba(176,111,74,.15)}
.choice.selected span{color:#246be9;font-weight:600}

/* Click animation for mobile feedback */
.choice.clicked{
  background:#e3f2fd !important;
  border-color:#2196f3 !important;
  box-shadow:0 8px 24px rgba(33,150,243,.3) !important;
  transform:scale(1.02);
  transition:all 0.3s ease;
}

.choice.clicked span{
  color:#1976d2 !important;
  font-weight:700 !important;
}

.choice.clicked::before{
  content:"✓";
  position:absolute;
  right:20px;
  top:50%;
  transform:translateY(-50%);
  color:#1976d2;
  font-weight:bold;
  font-size:18px;
  animation:checkmark 0.5s ease-in-out;
}

@keyframes checkmark {
  0% { opacity:0; transform:translateY(-50%) scale(0); }
  50% { opacity:1; transform:translateY(-50%) scale(1.2); }
  100% { opacity:1; transform:translateY(-50%) scale(1); }
}
.category-header{font-size:14px;font-weight:600;color:#246be9;text-transform:uppercase;letter-spacing:0.5px;margin:10px 0 6px 0;text-align:center;}

/* ===== LANDING PAGE STYLES ===== */
.landing-image{
  text-align:center;
  margin:0 0 20px 0;
}
.landing-image img{
  width:60%;
  max-width:300px;
  height:auto;
}

.landing-timer{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0;
  color:#6366f1;
  font-weight:500;
  font-size:14px;
}
.timer-icon{
  font-size:16px;
}

.landing-headline{
  font-size:32px;
  font-weight:700;
  text-align:center;
  line-height:1.2;
  margin:0;
  color:#1c1c1c;
}

.landing-marketing-text{
  text-align:center;
  margin:20px 0 50px 0;
  max-width:600px;
  margin-left:auto;
  margin-right:auto;
}

.landing-marketing-text p{
  font-size:16px;
  line-height:1.5;
  color:#4b5563;
  margin:0;
  font-weight:400;
}

.landing-start-wrapper{
  border:1px solid #89b1f7; 
  border-radius: 40px;
  box-shadow:0 8px 30px rgba(59,130,246,.3); 
  background:#fff;
  padding:24px; 
  margin:0 0 30px 0;
}

.landing-start-section{
  margin:0;
}
.start-label{
  text-align:center;
  font-size:18px;
  font-weight:700;
  color:#6366f1;
  margin:0 0 20px 0;
  text-transform:uppercase;
  letter-spacing:0.5px;
}

.gender-choices{
  display:flex;
  gap:16px;
  justify-content:center;
  flex-wrap:wrap;
}
.gender-choice{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  padding:24px 32px;
  border:2px solid #e8e6e4;
  border-radius:20px;
  background:#fff;
  cursor:pointer;
  transition:all 0.2s ease;
  min-width:140px;
}
.gender-choice:hover{
  border-color:#6366f1;
  box-shadow:0 8px 24px rgba(99,102,241,0.15);
  transform:translateY(-2px);
}
.gender-icon{
  font-size:32px;
  color:#6366f1;
}
.gender-text{
  font-size:16px;
  font-weight:600;
  color:#1c1c1c;
}

.landing-privacy{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 0 0 0;
  margin-top:16px;
}
.privacy-icon{
  font-size:16px;
}
.privacy-text{
  font-size:13px;
  color:#6b7280;
  font-weight:500;
}

/* Company info on landing page */
.landing-company-info{
  text-align:center;
  font-size:11px;
  color:#9ca3af;
  line-height:1.3;
  margin-top:20px;
  opacity:0.8;
}
.landing-company-info div{
  margin:2px 0;
}

/* Informational Block */
.info-content{
  display:flex;
  flex-direction:column;
  gap:24px;
  align-items:center;
  padding: 20px 0 0 0;
}
.info-image{
  text-align:center;
  margin:0 0 20px 0;
}
.info-image img{
  width:100%;
  max-width:300px;
  height:auto;
}
.info-title{
  font-size:24px;
  line-height:1.3;
  margin:0px 0 22px 0;
  text-align:center;
  font-weight:700;
  color:#1c1c1c;
}
.info-text{
  text-align:center;
  max-width:600px;
  margin:0 auto;
}
.info-text p{
  font-size:16px;
  line-height:1.5;
  color:#4b5563;
  margin:0 0 16px 0;
}
.info-stats{
  font-weight:600;
  color:#6366f1;
}
.info-continue-btn{
  background:#dc2626;
  color:#fff;
  border:none;
  padding:14px 32px;
  border-radius:12px;
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  transition:all 0.2s ease;
  min-width:140px;
}
.info-continue-btn:hover{
  background:#b91c1c;
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(220,38,38,0.3);
}

/* Info block navigation layout - completely override general nav styles */
#step-info .nav{
  display:grid !important;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  margin-top:40px;
  margin-bottom:20px;
  gap:20px;
}

#step-info .nav-arrow{
  justify-self:start;
}

#step-info .info-continue-btn{
  justify-self:center;
  grid-column:2;
}

/* Second info block navigation layout - same as first */
#step-info2 .nav{
  display:grid !important;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  margin-top:40px;
  margin-bottom:20px;
  gap:20px;
}

#step-info2 .nav-arrow{
  justify-self:start;
}

#step-info2 .info-continue-btn{
  justify-self:center;
  grid-column:2;
}

/* Third info block navigation layout - same as others */
#step-info3 .nav{
  display:grid !important;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  margin-top:40px;
  margin-bottom:20px;
  gap:20px;
}

#step-info3 .nav-arrow{
  justify-self:start;
}

#step-info3 .info-continue-btn{
  justify-self:center;
  grid-column:2;
}

/* Info list styling */
.info-list{
  list-style:none;
  padding:0;
  margin:0;
  text-align:left;
  max-width:500px;
  margin:0 auto;
}

.info-list li{
  padding:8px 0;
  font-size:16px;
  line-height:1.5;
  color:#4b5563;
  position:relative;
  padding-left:24px;
}

.info-list li:before{
  content:"•";
  color:#6366f1;
  font-weight:bold;
  position:absolute;
  left:0;
}

/* BMI Calculator */
.bmi-calculator{
  display:flex;
  flex-direction:column;
  gap:24px;
  align-items:center;
  padding: 40px 0 0 0;
}
.bmi-inputs{
  display:flex;
  gap:20px;
  flex-wrap:wrap;
  justify-content:center;
}
.input-group{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:140px;
}
.input-group label{
  font-size:14px;
  font-weight:600;
  color:#374151;
}
.input-group input[type="number"]{
  padding:12px 16px;
  border:2px solid #e5e7eb;
  border-radius:12px;
  font-size:16px;
  background:#fff;
  transition:border-color 0.2s ease;
  text-align:center;
}
.input-group input[type="number"]:focus{
  outline:none;
  border-color:#6366f1;
  box-shadow:0 0 0 3px rgba(99,102,241,0.1);
}
.bmi-confirm-btn{
  background:#6366f1;
  color:#fff;
  border:none;
  padding:14px 32px;
  border-radius:12px;
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  transition:all 0.2s ease;
  min-width:120px;
}
.bmi-confirm-btn:hover{
  background:#5856eb;
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(99,102,241,0.3);
}
.bmi-confirm-btn:disabled{
  background:#d1d5db;
  cursor:not-allowed;
  transform:none;
  box-shadow:none;
}

/* ===== RESULT PAGE STYLES ===== */

/* Result page wrapper styling - controlled by parent #step-results */

/* TOP SECTION WRAPPER */
.top-section{
  border:1px solid var(--border); border-radius: 40px;
  box-shadow:var(--shadow); background:var(--surface);
  padding:24px; margin-bottom:40px;
}

/* MAIN CONTENT WRAPPER */
.main-content{
  border:1px solid #89b1f7; border-radius: 40px;
  box-shadow:0 8px 30px rgba(59,130,246,.3); background:var(--surface);
  padding:24px; margin-bottom:40px;
}

/* 1) HLAVIČKA S PROFILEM (úzká lišta) */
.topbar{
  display:flex; justify-content:center; align-items:center; gap:8px;
  height:20px; position:relative;
  margin-bottom: 15px;
}
.progress-rail{height:6px; background:linear-gradient(90deg,#22C55E,#FBBF24,#F87171); width:100%; border-radius:999px;}
.marker{
  position:absolute; top:-6px; transform:translateX(-50%); left:70%;
  width:0; height:0; border-left:8px solid transparent; border-right:8px solid transparent; border-top:10px solid #000000;
}
.profile{
  text-align:center; font-size:16px; color:#475467; margin:10px 0 18px;
}

/* 2) RIZIKOVÝ BLOK */
.risk-card{
  display:grid; place-items:center; gap:10px;
  border:1px solid #ea580c; border-radius: 40px;
  box-shadow:var(--shadow); padding:22px 50px; background:#ea580c;
  margin:0 auto 8px; 
}
.risk-card > div:first-child{ color:#fff; font-weight:600; }
.risk-title{ font-weight:800; font-size:42px; color:#fff; line-height: 1;}
.risk-meta{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; font-size:12px }
.risk-badge{ background:var(--badge-bg, #fed7aa); color:var(--badge-text, #9a3412); padding:6px 10px; border-radius:999px; border:1px solid var(--badge-bg, #fed7aa); font-weight:600; }

/* 3) HLAVNÍ SDĚLENÍ + CTA */
.lead{ text-align:center; margin:18px 0 8px; }
.lead h1{ font-size:32px; font-weight:700; margin:30px 0 20px; line-height: 1.2;}
.lead strong{ color:var(--primary-600) }
.lead p{ color:var(--muted); margin:0 auto; max-width:68ch }
.lead-description{ color:var(--muted); margin:0 auto; max-width:68ch; font-size:18px; line-height:1.5; }

.offer-highlight{
  padding:24px; margin:30px auto 0;
  max-width:600px;
}
.offer-text{
  color:#246be9; font-size:24px; font-weight:700; 
  text-align:center; line-height:1.3; margin-bottom:12px;
}
.offer-arrow{
  color:#60a5fa; font-size:32px; text-align:center;
  animation:pulse-arrow 2s infinite ease-in-out;
}
.offer-subtitle{
  color:#475467; font-size:14px; text-align:center;
  font-weight:500; margin-top:8px;
}

@keyframes pulse-arrow {
  0%, 100% { transform:translateY(0); opacity:0.7; }
  50% { transform:translateY(4px); opacity:1; }
}
.cta{
  display:flex; justify-content:center; margin:18px 0 28px;
}
.btn{
  appearance:none; border:1px solid transparent; background:var(--primary);
  color:#fff; font-weight:700; padding:14px 18px; border-radius:12px; cursor:pointer;
  box-shadow:0 8px 20px rgba(220,38,38,.25);
  transition:.15s transform, .15s box-shadow, .15s background;
}
.btn:hover{ background:var(--primary-600); transform:translateY(-1px) }

/* 4) DIAGNOSTIKA – 2 sloupce */
.diagnostika-image{
  text-align:center; margin:20px 0 20px;
}
.diagnostika-image img{
  width:50%; height:auto;
}
.section-title{
  text-align:center; text-transform:uppercase; letter-spacing:.12em;
  color:#246be9; font-size:16px; font-weight:300; margin:30px 0 0px;
}
.cols{
  display:grid; grid-template-columns:1fr; gap:16px;
}
@media(min-width:860px){ .cols{ grid-template-columns:1fr 1fr } }
.card h3{ margin:6px 0 12px; font-size:18px }
.list{ list-style:none; padding:0; margin:0; display:grid; gap:10px }
.li{
  display:grid; grid-template-columns:24px 1fr; gap:10px; align-items:start;
  padding:8px 10px; border-radius:10px; background:#F9FAFB; border:1px solid #EEF2F6;
  font-size:14px;
}
.ok{ color:var(--ok) }
.no{ color:var(--bad) }

/* 5) 5 DŮVODŮ */
.reasons{ text-align:center; margin-top:18px }
.reason-list{ margin:14px auto 10px; max-width:100%; padding: 0 20px; display:grid; gap:12px }
.reason-item{ text-align:left; padding:12px 14px; background:#fff; }
.reason-item strong{ display:block }

.cta-center{ display:flex; justify-content:center; margin:18px 0 8px }

/* 6) KDE + JAK */
.where, .how{ margin-top:8px }
.subhead{ text-align:center; font-size:32px; font-weight:700; margin:40px 0 20px 0}
.how-steps{ list-style:none; padding:0; margin:8px auto 0; padding: 0 20px; max-width:100%; display:grid; gap:10px }
.how-steps li{
  display:grid; grid-template-columns:36px 1fr; gap:12px; align-items:start;
   padding:12px;
}
.num{
  width:32px; height:32px; display:grid; place-items:center; border-radius:8px;
  background:#EEF2FF; color:#1D4ED8; font-weight:800;
}

/* 7) CENA + FORMULÁŘ - MERGED */
.pricing{
  margin:14px auto 0; max-width:100%; border:1px solid #1e3a8a; margin-top: 40px; background:#1e3a8a;
  border-radius:14px; box-shadow:var(--shadow); padding:30px;
}
.price-row{ display:flex; align-items:last baseline; gap:12px; flex-wrap:wrap }
.old{width: 100%; color:#cbd5e1; text-decoration:line-through; text-align: center; font-weight:600 }
.price{ font-size:44px; font-weight:800; color:#fff; line-height: 1;}
.benefits-title{ color:#fff; font-size:26px; font-weight:600; text-align:center; margin:50px 0 10px; }
.benefits{ display:grid; gap:8px; margin-top:10px; padding: 0 20px;}
.benefit{ display:grid; grid-template-columns:22px 1fr; gap:10px; font-size: 18px; align-items:start; color:#fff; }

/* 8) FORMULÁŘ */
.form{
  margin-top:24px; border:none; background:transparent;
  padding:0;
}
.form h3{ margin:20px 0 10px; color:#fff; font-size:26px; font-weight:600; text-align:center; }
.row{ display:grid; grid-template-columns:1fr; gap:12px }
@media(min-width:680px){ .row{ grid-template-columns:1fr 1fr } }
.field{ display:grid; gap:6px }
.field label{ font-size:14px; color:#fff }
input[type="text"],input[type="email"],input[type="tel"],select,textarea{
  width:100%; padding:12px 12px; border-radius:10px; border:1px solid #D0D5DD; background:#fff; color:#101828;
  outline:none; transition: box-shadow .15s, border-color .15s;
  font-size:14px;
}
input:focus,select:focus,textarea:focus{ border-color:#84CAFF; box-shadow:0 0 0 4px rgba(99,102,241,.15) }
.consent{ margin-top:6px; display:flex; gap:10px; align-items:flex-start; color:#cbd5e1; font-size:13px }
.note{ color:#cbd5e1; font-size:13px; margin-top:10px }

/* FLOATING CTA */
.floating-cta{
  position:fixed; bottom:20px; left:50%; transform:translateX(-50%);
  z-index:1000; animation:bounce 2s infinite ease-in-out;
  transition:opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
.floating-btn{
  box-shadow:0 8px 24px rgba(220,38,38,.35);
  font-size:18px; padding:12px 24px 16px 24px; min-width:360px;
  border-radius:50px;
  font-weight: 400;
  line-height: 1.3;
}
.floating-btn:hover{
  transform:translateY(-2px); 
  box-shadow:0 12px 32px rgba(220,38,38,.45);
}

@keyframes bounce {
  0%, 100% { transform:translateX(-50%) translateY(0); }
  50% { transform:translateX(-50%) translateY(-8px); }
}

/* TESTIMONIALS */
.testimonials{
  margin-top:0px;
  padding:20px 0;
}
.testimonials-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:30px;
  margin-top:30px;
}
@media(min-width:768px){

	
  .testimonials-grid{
    grid-template-columns:1fr 1fr;
  }
}
.testimonial{
  display:flex;
  flex-direction:column;
  gap:16px;
  background:#fff;
  padding:24px;
  border-radius:16px;
  box-shadow:0 4px 12px rgba(0,0,0,0.05);
  border:1px solid #e5e7eb;
  text-align:center;
}
.testimonial-image{
  display:flex;
  justify-content:center;
}
.testimonial-image img{
  width:120px;
  height:auto;
  object-fit:cover;
}
.testimonial-content{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.testimonial-text{
  font-size:14px;
  line-height:1.4;
  color:#374151;
  margin:0;
  font-style:italic;
  text-align: center;
}
.testimonial-author{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.testimonial-author strong{
  font-size:14px;
  color:#1f2937;
  font-weight:600;
}
.weight-loss{
  font-size:16px;
  font-weight:700;
  color:#3b82f6;
}

/* GOOGLE RATING */
.google-rating{
  text-align:center;
  margin-top:40px;
  padding:30px 20px;
}
.rating-text{
  font-size:24px;
  color:#dc2626;
  font-weight:600;
  margin-bottom:12px;
}
.google-logo{
  font-size:32px;
  font-weight:400;
  margin-bottom:8px;
  background:linear-gradient(to right, #4285f4, #ea4335, #fbbc05, #4285f4, #34a853, #ea4335);
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  font-family:Product Sans, Arial, sans-serif;
}
.stars{
  display:flex;
  justify-content:center;
  gap:4px;
}
.star{
  font-size:28px;
  color:#fbbf24;
}

footer{ text-align:center; color:#667085; font-size:13px; margin-top:36px; margin-bottom:80px; }
.center{ text-align:center }




@media(max-width:600px){
	
.main-content{
  border:1px solid #89b1f7; border-radius: 40px;
  box-shadow:0 8px 30px rgba(59,130,246,.3); background:var(--surface);
  padding:16px; margin-bottom:40px;
}
	
.pricing {
  padding: 15px;
}
.landing-start-wrapper {margin: 0 0 60px 0;}
.landing-company-info {
    text-align: center;
    font-size: 11px;
    color: #9ca3af;
    line-height: 1.3;
    margin-top: 50px;
    opacity: 0.8;
}
	
.risk-card {padding: 22px 20px;}
.risk-title { font-size: 32px;}

.lead h1 { font-size: 26px;}
.top-section { padding: 16px;}

.subhead {
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  margin: 40px 0 20px 0;
    margin-top: 40px;
	line-height: 1.3;
}

.reason-list {
  margin: 14px auto 10px;
  max-width: 100%;
  padding: 0 0px;
  display: grid;
  gap: 12px;
}

.how-steps {
  list-style: none;
  padding: 0;
  margin: 8px auto 0;
  padding: 0 0px;
  max-width: 100%;
  display: grid;
  gap: 10px;
}
.benefits {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding: 0 0;
  line-height: 1.3;
}
.question {
  font-size: 22px;
  line-height: 1.3;
  margin: 0px 0 22px 0;
  text-align: center;
}

.choice {
  display: flex;
  align-items: center;
  border: 1px solid #e8e6e4;
  border-radius: 16px;
  padding: 10px 26px;
  cursor: pointer;
  transition: box-shadow .15s,border-color .15s;
}
	
.gender-choice {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  border: 2px solid #e8e6e4;
  border-radius: 20px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  min-width: 80px;
}

.landing-start-wrapper {
  border: 1px solid #89b1f7;
  border-radius: 40px;
  box-shadow: 0 8px 30px rgba(59,130,246,.3);
  background: #fff;
  padding: 20px 15px;
  margin: 30px 0 30px 0;
}

.landing-headline {
  font-size: 24px;
}

.landing-image {
  text-align: center;
  margin: 0 0 0 0;
}
.landing-marketing-text{
  display: none;
}

/* Mobile-specific click animation improvements */
.choice.clicked{
  transform:scale(1.05);
  box-shadow:0 12px 32px rgba(33,150,243,.4) !important;
}

.choice.clicked::before{
  font-size:20px;
  right:16px;
}

}