/* Home page specific styles */
.content-row { display: flex; gap: 20px; }
.intro-section { background: white; padding: 12px 20px; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); flex: 1; }
.intro-text { font-size: 16px; line-height: 1.6; color: #333; margin-bottom: 8px; }
.intro-text:last-child { margin-bottom: 0; }
.cards-container { display: flex; gap: 12px; flex: 2; }

/* Cards */
.card { transition: transform 0.3s; flex: 1; }
.card:hover { transform: translateY(-5px); }
.card-header { padding: 10px 20px; color: white; font-weight: bold; font-size: 14px; background: #FF8C42; display: flex; align-items: center; justify-content: center; border-radius: 20px; margin-bottom: 8px; height: auto; min-height: 36px; }
.card-content { padding: 16px; background: white; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); position: relative; overflow: hidden; }
.card-preview { width: 100%; height: 272px; border-radius: 8px; overflow: hidden; position: relative; border: 1px solid #e0e0e0; }

/* Preview iframe styling */
.preview-iframe { width: 1200px; height: 1400px; border: none; pointer-events: none; transform: scale(0.32); transform-origin: 0 0; position: absolute; top: 0; left: 0; }