/* --- Card Architecture --- */
.solution-card {
    background: #ffffff;
    border: 1px solid #f1f5f9;
    border-radius: 32px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.solution-card:hover { transform: translateY(-5px); }

/* --- Mockup Canvas --- */
.solution-canvas {
    background: #f1f7ff; /* Soft Blue/Indigo Tint */
    background-image: radial-gradient(#cbd5e1 1px, transparent 1px); /* Subtle Dot Pattern */
    background-size: 20px 20px;
    border-radius: 24px;
    height: 380px;
    display: flex;
    justify-content: center;
    align-items: flex-end; /* Mockup sits on the bottom edge */
    overflow: hidden;
    padding: 0 20px;
}

/* iPhone Hardware */
.iphone-frame {
    width: 100%;
    max-width: 340px;
    border: 8px solid #1e293b; /* Dark hardware frame */
    border-bottom: none;
    border-radius: 36px 36px 0 0;
    background: #fff;
    box-shadow: 0 20px 50px rgba(0,0,0,0.1);
}

.iphone-frame img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 28px 28px 0 0;
}

/* --- Typography Reset --- */
.solution-copy { padding: 0 24px 24px 24px; text-align: center; }

.solution-h3 { 
    margin: 0 !important; 
    font-size: 28px; 
    font-weight: 850; 
    color: #1e293b; 
    line-height: 1.2;
    letter-spacing: -0.5px;
}

.solution-p { 
    margin: 16px 0 0 0 !important; 
    font-size: 16px; 
    color: #64748b; 
    line-height: 1.6; 
}