#cardtalkerdemo {
  background-image: url("cardtalker_demo.b2f72072f49d.jpg");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;
  padding: 100% 0;
}

.container-for-cardtalker {
  --blue-50:#eff6ff; --blue-600:#2563eb; --blue-700:#1d4ed8;
  --green-600:#16a34a; --green-700:#15803d;
  --gray-800:#1f2937; --gray-700:#374151; --gray-600:#4b5563; --gray-200:#e5e7eb;
  --white:#ffffff;
}

.download-button {
    cursor:pointer;
}

/* Layout & spacing */
.min-h-screen{min-height:100vh;}
.px-6{padding-left:1.5rem;padding-right:1.5rem;}
.py-4{padding-top:1rem;padding-bottom:1rem;}
.py-10{padding-top:2.5rem;padding-bottom:2.5rem;}
.py-16{padding-top:4rem;padding-bottom:4rem;}
.py-20{padding-top:5rem;padding-bottom:5rem;}
.p-6{padding:1.5rem;}
.p-8{padding:2rem;}
.mb-4{margin:1rem;}
.mb-6{margin-bottom:1.5rem;}
.mb-10{margin-bottom:2.5rem;}
.mt-4{margin-top:1rem;}
.mt-6{margin-top:1.5rem;}
.mx-auto{margin-left:auto;margin-right:auto;}
.text-center{text-align:center;}

/* Flex & Grid */
.flex{display:flex;}
.grid{display:grid;}
.items-center{align-items:center;}
.justify-between{justify-content:space-between;}
.justify-center{justify-content:center;}
.gap-4{gap:1rem;}
.gap-8{gap:2rem;}
.gap-10{gap:2.5rem;}

/* Typography */
.text-sm{font-size:.875rem;line-height:1.25rem;}
.text-lg{font-size:1.125rem;line-height:1.75rem;}
.text-2xl{font-size:1.5rem;line-height:2rem;}
.text-3xl{font-size:1.875rem;line-height:2.25rem;}
.text-4xl{font-size:2.25rem;line-height:2.5rem;}
.font-medium{font-weight:500;}
.font-semibold{font-weight:600;}
.font-bold{font-weight:700;}
.font-extrabold{font-weight:800;}

/* Colors */
.text-gray-800{color:var(--gray-800);}
.text-gray-700{color:var(--gray-700);}
.text-gray-600{color:var(--gray-600);}
.text-blue-600{color:var(--blue-600);}
.text-blue-700{color:var(--blue-700);}
.text-white{color:var(--white);}
.bg-white{background:var(--white);}
.bg-blue-50{background:var(--blue-50);}
.bg-blue-600{background:var(--blue-600);}
.bg-blue-700{background:var(--blue-700);}
.bg-green-600{background:var(--green-600);}
.bg-gray-200{background:var(--gray-200);}
.hover\:bg-blue-700:hover{background:var(--blue-700);}
.hover\:bg-green-700:hover{background:var(--green-700);}
.hover\:text-blue-600:hover{color:var(--blue-600);}
.hover\:underline:hover{text-decoration:underline;}

/* Buttons & radius */
.px-6{padding-left:1.5rem;padding-right:1.5rem;}
.py-3{padding-top:.75rem;padding-bottom:.75rem;}
.rounded-2xl{border-radius:1rem;}

/* Shadows & transitions */
.shadow{box-shadow:0 1px 3px rgba(0,0,0,.1),0 1px 2px rgba(0,0,0,.06);}
.shadow-md{box-shadow:0 4px 6px rgba(0,0,0,.1),0 2px 4px rgba(0,0,0,.06);}
.shadow-lg{box-shadow:0 10px 15px rgba(0,0,0,.1),0 4px 6px rgba(0,0,0,.05);}
.hover\:shadow-lg:hover{box-shadow:0 10px 15px rgba(0,0,0,.1),0 4px 6px rgba(0,0,0,.05);}
.transition{transition:all .2s ease;}

/* Positioning */
.sticky{position:sticky;}
.top-0{top:0;}
.z-50{z-index:50;}

/* Width constraints */
.max-w-2xl{max-width:42rem;}
.max-w-4xl{max-width:56rem;}
.max-w-5xl{max-width:64rem;}

/* Gradient background */
.bg-gradient-to-b{
  background-image:linear-gradient(to bottom,var(--from-color,#eff6ff),var(--to-color,#ffffff));
}
.from-blue-50{--from-color:var(--blue-50);}
.to-white{--to-color:var(--white);}

/* Rounded media */
img.rounded-2xl{border-radius:1rem;}

/* Utilities */
.space-x-6 > * + *{margin-left:1.5rem;}
.space-x-4 > * + *{margin-left:1rem;}
.space-y-4 > * + *{margin-top:1rem;}
.hidden{display:none;}
.text-center{text-align:center;}

/* Responsive (md: ≥768px) — escape colon with backslash */
@media (min-width:768px){
  .md\:block{display:block;}
  .md\:text-xl{font-size:1.25rem;line-height:1.75rem;}
  .md\:text-5xl{font-size:3rem;line-height:1;}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
}

/* Links */
a{color:inherit;text-decoration:none;}
a:hover{opacity:.9;}

footer {
  background-color: #333;
  color: #fff;
  padding: 20px 0;
  text-align: center;
}