/* --- DT Feature Stack Styles --- */

.dt-feature-stack-section {
    padding: 40px 20px;
    width: 100%;
    box-sizing: border-box;
}

.dtfs-container {
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Individual Card */
.dtfs-item {
    border-radius: 12px;
    padding: 25px 30px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    text-align: left;
    transition: transform 0.2s ease;
    overflow: hidden; /* Ensure image corners clip */
}

.dtfs-item:hover {
    transform: translateY(-2px);
}

/* Header */
.dtfs-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 10px;
}

.dtfs-icon svg {
    width: 28px; height: 28px; display: block;
    filter: drop-shadow(0px 1px 2px rgba(0,0,0,0.2)); 
}

.dtfs-title {
    font-family: 'Fredoka', sans-serif;
    font-size: 1.25rem; font-weight: 700; margin: 0; line-height: 1.2;
    color: inherit;
}

/* Content */
.dtfs-content {
    padding-left: 43px; /* Align with title */
    font-family: 'Poppins', sans-serif;
    font-size: 1rem; line-height: 1.5;
    opacity: 0.95;
}

.dtfs-content p { margin: 0; color: inherit; }


/* --- NEW: Image Styling --- */
.dtfs-media-wrap {
    width: 100%;
    margin-bottom: 15px;
}
.dtfs-media-wrap img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px; /* Rounded corners for image */
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* Adjust margins based on position */

/* Top: Margin below */
.dtfs-pos-top { margin-bottom: 20px; margin-top: 0; }

/* Middle: Margin top/bottom, indented to match content */
.dtfs-pos-middle { 
    margin-top: 15px; margin-bottom: 15px;
    padding-left: 43px; /* Indent like text */
}

/* Bottom: Margin top, indented */
.dtfs-pos-bottom { 
    margin-top: 20px; margin-bottom: 0;
    padding-left: 43px; /* Indent like text */
}


/* Responsive */
@media (max-width: 600px) {
    .dtfs-item { padding: 20px; }
    .dtfs-header { align-items: flex-start; }
    .dtfs-icon svg { margin-top: 2px; }
    
    .dtfs-content, 
    .dtfs-pos-middle, 
    .dtfs-pos-bottom {
        padding-left: 0; /* Remove indent on mobile */
    }
}