/**
 * Developer Hosting — unified icon system (24px grid, refined stroke, crisp scaling)
 */

:root {
    --dh-icon-stroke: 1.75;
    --dh-icon-stroke-sm: 1.5;
}

/* Base: theme stroke icons inherit professional caps/joins */
.dh-icon,
.site-header svg[fill="none"],
.site-main svg[fill="none"],
.site-footer svg[fill="none"] {
    stroke-linecap: round;
    stroke-linejoin: round;
    flex-shrink: 0;
    vertical-align: middle;
    shape-rendering: geometricPrecision;
}

.dh-icon {
    display: inline-block;
    vector-effect: non-scaling-stroke;
}

.dh-icon--sm {
    width: 1.125rem;
    height: 1.125rem;
}

.dh-icon--md {
    width: 1.25rem;
    height: 1.25rem;
}

/* Harmonize root stroke on outline icons (child paths inherit) */
.dh-icon[fill="none"],
.pkg-feature-icon[fill="none"],
.hero-card-icon svg[fill="none"],
.feature-icon svg[fill="none"],
.trust-icon svg[fill="none"],
.why-icon svg[fill="none"],
.stat-icon svg[fill="none"],
.section-badge-v2 svg[fill="none"],
.hero-feature-item svg[fill="none"] {
    stroke-width: var(--dh-icon-stroke);
}

/* Small UI checks / list markers */
.pkg-check-icon,
.package-expand-btn svg,
.value-check svg {
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

.value-check svg {
    stroke-width: 2;
}

/* Filled brand marks: no accidental hairline stroke */
.dh-icon--filled,
.social-link svg,
.whatsapp-float svg {
    stroke: none;
    stroke-width: 0;
}

/* Buttons: optical alignment */
.btn svg,
button svg,
.pkg-buy-btn svg {
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

/* Major page shells: consistent stroke weight for outline icons */
.hosting-page svg[fill="none"],
.hosting-service-page svg[fill="none"],
.vds-page-premium svg[fill="none"],
.ssl-page-v2 svg[fill="none"],
.domain-page svg[fill="none"],
.contact-page svg[fill="none"],
.about-page svg[fill="none"],
.packages-section svg[fill="none"],
.blog-page svg[fill="none"],
.legal-page svg[fill="none"],
.legal-page-v2 svg[fill="none"] {
    stroke-width: var(--dh-icon-stroke);
}