/**
 * ECIP Core - Frontend Styles
 *
 * @package ECIP_Core
 */

/* ==========================================================================
   NFC Scanner
   ========================================================================== */

.ecip-nfc-container,
.ecip-nfc-product-scanner {
    margin: 20px 0;
    padding: 15px;
    background: linear-gradient(135deg, #e8f6ee 0%, #f8fafc 100%);
    border: 1px solid #cbe6d7;
    border-radius: 12px;
}

.scanner-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
}

.scanner-icon {
    font-size: 1.5em;
}

.scanner-text {
    font-weight: 600;
    color: #15a34f;
}

.scanner-hint {
    font-size: 0.85em;
    color: #64748b;
    margin-top: 10px;
}

.ecip-nfc-scanner {
    text-align: center;
}

.ecip-nfc-scan-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    font-size: 1em;
    background: #15a34f;
    color: #fff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.ecip-nfc-scan-btn:hover {
    background: #10893f;
    transform: translateY(-1px);
}

.ecip-nfc-scan-btn:disabled {
    background: #94a3b8;
    cursor: not-allowed;
    transform: none;
}

.ecip-nfc-status {
    margin: 15px 0;
    padding: 12px;
    border-radius: 8px;
    font-weight: 500;
}

.ecip-nfc-status.scanning {
    background: #fef3c7;
    color: #92400e;
    animation: pulse 1.5s infinite;
}

.ecip-nfc-status.success {
    background: #d1fae5;
    color: #065f46;
}

.ecip-nfc-status.error {
    background: #fee2e2;
    color: #991b1b;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.ecip-nfc-result {
    margin-top: 20px;
    padding: 15px;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.result-title {
    margin: 0 0 15px;
    font-size: 1.1em;
    color: #1e293b;
}

.result-table {
    width: 100%;
    border-collapse: collapse;
}

.result-table td {
    padding: 8px;
    border-bottom: 1px solid #f1f5f9;
}

.result-table .label {
    font-weight: 600;
    color: #64748b;
    width: 40%;
}

.result-table .value {
    font-family: 'Monaco', 'Menlo', monospace;
    color: #1e293b;
}

.copyable-yes {
    color: #059669;
}

.copyable-no,
.copyable-unknown {
    color: #d97706;
}

.ecip-nfc-use-btn {
    margin-top: 15px;
    width: 100%;
}

.ecip-nfc-unsupported {
    text-align: center;
    padding: 20px;
}

.unsupported-message {
    font-size: 1.1em;
    color: #dc2626;
    margin-bottom: 10px;
}

.unsupported-hint {
    color: #64748b;
    font-size: 0.9em;
}


/* ==========================================================================
   Product Options
   ========================================================================== */

.ecip-product-options {
    margin: 20px 0;
    padding: 20px;
    background: #f8fafc;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
}

.ecip-option {
    margin-bottom: 15px;
}

.ecip-option:last-child {
    margin-bottom: 0;
}

.ecip-option > label {
    display: block;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 6px;
}

.ecip-option .required {
    color: #dc2626;
}

.ecip-option .description {
    font-size: 0.85em;
    color: #64748b;
    margin-top: 5px;
}

.ecip-option select,
.ecip-option input[type="text"],
.ecip-option input[type="file"] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    font-size: 1em;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.ecip-option select:focus,
.ecip-option input:focus {
    outline: none;
    border-color: #15a34f;
    box-shadow: 0 0 0 3px rgba(21,163,79, 0.1);
}


/* Color Swatches */
.ecip-color-swatches {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.color-swatch {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    padding: 4px;
    border-radius: 8px;
    transition: background 0.2s;
}

.color-swatch:hover {
    background: #f1f5f9;
}

.color-swatch input {
    display: none;
}

.swatch-color {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 2px solid #e2e8f0;
    transition: all 0.2s;
}

.color-swatch input:checked + .swatch-color {
    border-color: #15a34f;
    box-shadow: 0 0 0 3px rgba(21,163,79, 0.3);
    transform: scale(1.1);
}

.swatch-name {
    margin-left: 8px;
    font-size: 0.9em;
    color: #475569;
}


/* ==========================================================================
   Sample Instructions
   ========================================================================== */

.ecip-sample-instructions {
    margin: 20px 0;
    padding: 20px;
    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
    border: 1px solid #fbbf24;
    border-radius: 12px;
}

.ecip-sample-instructions h3 {
    margin-top: 0;
    color: #92400e;
}

.reception-address {
    margin: 15px 0;
    padding: 15px;
    background: #fff;
    border-radius: 8px;
}

.reception-address address {
    font-style: normal;
    white-space: pre-line;
    color: #1e293b;
}

.important-notes {
    margin-top: 20px;
}

.important-notes h4 {
    color: #dc2626;
    margin-bottom: 10px;
}

.important-notes ul {
    margin: 0;
    padding-left: 20px;
}

.important-notes li {
    margin-bottom: 8px;
    color: #475569;
}


/* ==========================================================================
   Save Chip Offer (Thank You Page)
   ========================================================================== */

.ecip-save-chip-offer {
    margin: 20px 0;
    padding: 20px;
    background: #e8f6ee;
    border: 1px solid #cbe6d7;
    border-radius: 12px;
}

.ecip-chip-save-form {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background: #fff;
    border-radius: 8px;
    margin-bottom: 10px;
}

.ecip-chip-save-form .chip-uid {
    color: #64748b;
    font-size: 0.9em;
}

.ecip-chip-save-form .save-form {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.ecip-chip-save-form input[type="text"] {
    padding: 8px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    width: 200px;
}

.saved-message {
    color: #059669;
    font-weight: 600;
}


/* ==========================================================================
   Content Pages (VOP, GDPR, FAQ, etc.)
   ========================================================================== */

/* Page wrapper */
.entry-content,
.page-content,
.post-content,
article.page .entry-content {
    max-width: 900px;
    margin: 0 auto;
    padding: 40px 20px;
    font-size: 16px;
    line-height: 1.7;
    color: #1e293b;
}

/* Main headings */
.entry-content h2:first-of-type,
.page-content h2:first-of-type {
    font-size: 2.2em;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 0.5em;
    padding-bottom: 0.5em;
    border-bottom: 3px solid #15a34f;
}

/* Section headings */
.entry-content h3,
.page-content h3 {
    font-size: 1.5em;
    font-weight: 600;
    color: #0f172a;
    margin: 2em 0 1em;
    padding: 0.75em 1em;
    background: linear-gradient(135deg, #e8f6ee 0%, #f8fafc 100%);
    border-left: 4px solid #15a34f;
    border-radius: 0 8px 8px 0;
}

/* Subsection headings */
.entry-content h4,
.page-content h4 {
    font-size: 1.15em;
    font-weight: 600;
    color: #334155;
    margin: 1.5em 0 0.75em;
    padding-bottom: 0.5em;
    border-bottom: 1px solid #e2e8f0;
}

/* Paragraphs */
.entry-content p,
.page-content p {
    margin-bottom: 1.25em;
    color: #475569;
}

/* Emphasis text */
.entry-content em,
.page-content em {
    color: #64748b;
    font-style: italic;
}

/* Strong text */
.entry-content strong,
.page-content strong {
    color: #1e293b;
    font-weight: 600;
}

/* Links */
.entry-content a,
.page-content a {
    color: #15a34f;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: all 0.2s ease;
}

.entry-content a:hover,
.page-content a:hover {
    color: #10893f;
    border-bottom-color: #15a34f;
}

/* Horizontal rules */
.entry-content hr,
.page-content hr {
    border: none;
    height: 2px;
    background: linear-gradient(90deg, #15a34f 0%, #e2e8f0 100%);
    margin: 3em 0;
}

/* Lists */
.entry-content ul,
.entry-content ol,
.page-content ul,
.page-content ol {
    margin: 1em 0 1.5em;
    padding-left: 1.5em;
}

.entry-content li,
.page-content li {
    margin-bottom: 0.5em;
    color: #475569;
    padding-left: 0.5em;
}

.entry-content ul li::marker {
    color: #15a34f;
}

.entry-content ol li::marker {
    color: #15a34f;
    font-weight: 600;
}

/* Nested lists */
.entry-content ul ul,
.entry-content ol ol,
.page-content ul ul,
.page-content ol ol {
    margin: 0.5em 0;
}

/* Tables */
.entry-content table,
.page-content table {
    width: 100%;
    margin: 1.5em 0;
    border-collapse: collapse;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.entry-content thead tr,
.page-content thead tr {
    background: linear-gradient(135deg, #15a34f 0%, #10893f 100%);
}

.entry-content thead th,
.page-content thead th {
    padding: 14px 16px;
    text-align: left;
    font-weight: 600;
    color: #fff;
    font-size: 0.95em;
}

.entry-content tbody tr,
.page-content tbody tr {
    background: #fff;
    transition: background 0.2s;
}

.entry-content tbody tr:nth-child(even),
.page-content tbody tr:nth-child(even) {
    background: #f8fafc;
}

.entry-content tbody tr:hover,
.page-content tbody tr:hover {
    background: #e8f6ee;
}

.entry-content td,
.page-content td {
    padding: 14px 16px;
    border-bottom: 1px solid #e2e8f0;
    color: #475569;
}

.entry-content td:first-child,
.page-content td:first-child {
    font-weight: 500;
    color: #1e293b;
}

/* Info boxes - using paragraph styles */
.entry-content p:has(strong:first-child),
.page-content p:has(strong:first-child) {
    padding: 1em 1.25em;
    background: #e8f6ee;
    border-left: 4px solid #15a34f;
    border-radius: 0 8px 8px 0;
    margin: 1.5em 0;
}

/* Table of contents */
.entry-content > ol:first-of-type,
.page-content > ol:first-of-type {
    background: #f8fafc;
    padding: 1.5em 1.5em 1.5em 2.5em;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    margin: 1.5em 0 2em;
}

.entry-content > ol:first-of-type li,
.page-content > ol:first-of-type li {
    padding: 0.4em 0;
    color: #15a34f;
}

.entry-content > ol:first-of-type a,
.page-content > ol:first-of-type a {
    color: #475569;
    font-weight: 500;
}

.entry-content > ol:first-of-type a:hover,
.page-content > ol:first-of-type a:hover {
    color: #15a34f;
}

/* FAQ specific styles */
.entry-content h4 + p,
.page-content h4 + p {
    margin-top: 0;
}


/* ==========================================================================
   Site Header Improvements
   ========================================================================== */

.site-header,
.site-branding {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
}

.site-title a,
.site-title {
    color: #15a34f !important;
    font-weight: 700;
}

.main-navigation a {
    color: #f8fafc !important;
    transition: color 0.2s;
}

.main-navigation a:hover {
    color: #3fd183 !important;
}


/* ==========================================================================
   WooCommerce Buttons
   ========================================================================== */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .cart .button,
.woocommerce .checkout-button,
.button,
input[type="submit"],
button[type="submit"] {
    background: linear-gradient(135deg, #15a34f 0%, #10893f 100%) !important;
    color: #fff !important;
    border: none !important;
    padding: 12px 24px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 4px rgba(21,163,79, 0.3) !important;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce .cart .button:hover,
.woocommerce .checkout-button:hover,
.button:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
    background: linear-gradient(135deg, #10893f 0%, #0b2a1b 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(21,163,79, 0.4) !important;
}

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
    background: linear-gradient(135deg, #15a34f 0%, #10893f 100%) !important;
}


/* ==========================================================================
   Footer
   ========================================================================== */

.site-footer,
footer {
    background: #0f172a !important;
    color: #94a3b8 !important;
    padding: 40px 20px !important;
}

.site-footer a {
    color: #3fd183 !important;
}

.site-footer a:hover {
    color: #3fd183 !important;
}


/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 768px) {
    .ecip-product-options {
        padding: 15px;
    }

    .ecip-color-swatches {
        gap: 8px;
    }

    .color-swatch {
        flex-direction: column;
        text-align: center;
    }

    .swatch-name {
        margin-left: 0;
        margin-top: 4px;
        font-size: 0.8em;
    }

    .ecip-chip-save-form {
        flex-direction: column;
        align-items: flex-start;
    }

    .ecip-chip-save-form .save-form {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .ecip-chip-save-form input[type="text"] {
        width: 100%;
    }

    /* Content pages responsive */
    .entry-content,
    .page-content {
        padding: 20px 15px;
    }

    .entry-content h2:first-of-type,
    .page-content h2:first-of-type {
        font-size: 1.75em;
    }

    .entry-content h3,
    .page-content h3 {
        font-size: 1.25em;
        padding: 0.5em 0.75em;
    }

    .entry-content table,
    .page-content table {
        font-size: 0.9em;
    }

    .entry-content td,
    .entry-content th,
    .page-content td,
    .page-content th {
        padding: 10px 12px;
    }
}


/* ==========================================================================
   HOMEPAGE STYLES - ECIP Landing Page (Professional Design)
   ========================================================================== */

.ecip-homepage {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Gradient Text */
.gradient-text {
    background: linear-gradient(135deg, #3fd183 0%, #3fd183 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ==========================================================================
   CSS Icons (using SVG data URIs)
   ========================================================================== */

/* Arrow icon */
.icon-arrow {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 6px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}

.btn-primary .icon-arrow {
    filter: brightness(0) saturate(100%);
}

.btn-cta .icon-arrow {
    filter: brightness(0) saturate(100%);
}

/* Check icon */
.icon-check {
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 8px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%233fd183' stroke-width='2'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}

/* Key icon */
.icon-key {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 8px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23cbe6d7' stroke-width='2'%3E%3Cpath d='M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}

/* Tag icon */
.icon-tag {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 10px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2315a34f' stroke-width='2'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z'/%3E%3Cline x1='7' y1='7' x2='7.01' y2='7'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}

/* Feature icons */
.feature-icon {
    width: 70px;
    height: 70px;
    margin: 0 auto 20px;
    background-color: #cbe6d7;
    background-position: center;
    background-size: 32px 32px;
    background-repeat: no-repeat;
    border-radius: 20px;
}

.feature-icon.icon-fast {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='%2315a34f' stroke-width='2'%3E%3Cpath d='M13 2L3 14h9l-1 8 10-12h-9l1-8z'/%3E%3C/svg%3E");
}

.feature-icon.icon-secure {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='%2315a34f' stroke-width='2'%3E%3Crect x='3' y='11' width='18' height='11' rx='2' ry='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E");
}

.feature-icon.icon-price {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='none' stroke='%2315a34f' stroke-width='2'%3E%3Cline x1='12' y1='1' x2='12' y2='23'/%3E%3Cpath d='M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6'/%3E%3C/svg%3E");
}

/* Quick link icons */
.ql-icon {
    width: 60px;
    height: 60px;
    margin: 0 auto 15px;
    background-color: #cbe6d7;
    background-position: center;
    background-size: 28px 28px;
    background-repeat: no-repeat;
    border-radius: 16px;
}

.ql-icon.icon-faq {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%2315a34f' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E");
}

.ql-icon.icon-doc {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%2315a34f' stroke-width='2'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3Cline x1='16' y1='13' x2='8' y2='13'/%3E%3Cline x1='16' y1='17' x2='8' y2='17'/%3E%3C/svg%3E");
}

.ql-icon.icon-phone {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%2315a34f' stroke-width='2'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
}

.ql-icon.icon-file {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%2315a34f' stroke-width='2'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3C/svg%3E");
}

/* Section Containers */
.hero-container,
.stats-container,
.features-container,
.hiw-container,
.products-container,
.discounts-container,
.ql-container,
.cta-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.section-title {
    font-size: 2.2em;
    font-weight: 700;
    color: #0f172a;
    text-align: center;
    margin-bottom: 15px;
}

.section-subtitle {
    text-align: center;
    color: #64748b;
    font-size: 1.1em;
    margin-bottom: 40px;
}

/* ==========================================================================
   Hero Section
   ========================================================================== */

.ecip-hero {
    background: linear-gradient(135deg, #071710 0%, #10893f 50%, #15a34f 100%);
    color: #fff;
    padding: 80px 20px 100px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.ecip-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(circle at 20% 80%, rgba(63,209,131, 0.15) 0%, transparent 50%),
                      radial-gradient(circle at 80% 20%, rgba(20, 184, 166, 0.1) 0%, transparent 50%);
    pointer-events: none;
}

.ecip-hero .hero-container {
    position: relative;
    z-index: 1;
    max-width: 800px;
}

.ecip-hero .hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 255, 255, 0.15);
    color: #cbe6d7;
    padding: 10px 20px;
    border-radius: 30px;
    font-size: 0.9em;
    font-weight: 500;
    margin-bottom: 25px;
    backdrop-filter: blur(10px);
}

.ecip-hero .hero-badge svg {
    width: 16px;
    height: 16px;
    stroke: currentColor;
}

.ecip-hero .hero-title {
    font-size: 3.2em;
    font-weight: 800;
    line-height: 1.15;
    margin-bottom: 20px;
    color: #fff;
}

.ecip-hero .hero-title .gradient-text {
    background: linear-gradient(135deg, #3fd183 0%, #3fd183 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.ecip-hero .hero-subtitle {
    font-size: 1.2em;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 35px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.7;
}

.ecip-hero .hero-buttons {
    display: flex;
    gap: 15px;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.ecip-hero .btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    color: #1e293b !important;
    padding: 16px 32px;
    border-radius: 50px;
    font-weight: 600;
    text-decoration: none !important;
    box-shadow: 0 4px 20px rgba(251, 191, 36, 0.4);
    transition: all 0.3s ease;
}

.ecip-hero .btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(251, 191, 36, 0.5);
}

.ecip-hero .btn-primary svg {
    width: 16px;
    height: 16px;
    stroke: currentColor;
}

.ecip-hero .btn-secondary {
    display: inline-flex;
    align-items: center;
    padding: 16px 32px;
    border-radius: 50px;
    font-weight: 600;
    text-decoration: none !important;
    background: transparent;
    color: #fff !important;
    border: 2px solid rgba(255, 255, 255, 0.4);
    transition: all 0.3s ease;
}

.ecip-hero .btn-secondary:hover {
    border-color: #fff;
    background: rgba(255, 255, 255, 0.1);
}

.ecip-hero .hero-trust {
    display: flex;
    gap: 30px;
    justify-content: center;
    flex-wrap: wrap;
}

.ecip-hero .trust-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.95em;
    color: rgba(255, 255, 255, 0.85);
}

.ecip-hero .trust-item svg {
    width: 18px;
    height: 18px;
    stroke: #3fd183;
}

.ecip-hero .hero-bg-pattern {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(circle at 20% 80%, rgba(63,209,131, 0.15) 0%, transparent 50%),
                      radial-gradient(circle at 80% 20%, rgba(20, 184, 166, 0.1) 0%, transparent 50%);
    pointer-events: none;
}

.ecip-hero .hero-content {
    position: relative;
    z-index: 1;
    max-width: 800px;
    margin: 0 auto;
}

.ecip-hero .hero-badge {
    display: inline-block;
    background: rgba(255, 255, 255, 0.15);
    color: #cbe6d7;
    padding: 10px 20px;
    border-radius: 30px;
    font-size: 0.95em;
    font-weight: 500;
    margin-bottom: 25px;
    backdrop-filter: blur(10px);
}

.ecip-hero h1 {
    font-size: 3em;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 25px;
}

.ecip-hero h1 .highlight {
    color: #3fd183;
}

.ecip-hero .hero-description {
    font-size: 1.25em;
    color: #a7f3d0;
    margin-bottom: 35px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.6;
}

.ecip-hero .hero-cta {
    display: flex;
    gap: 15px;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 40px;
}

.ecip-hero .hero-trust {
    display: flex;
    gap: 30px;
    justify-content: center;
    flex-wrap: wrap;
}

.ecip-hero .trust-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.95em;
    color: #a7f3d0;
}

.ecip-hero .trust-check {
    color: #3fd183;
    font-weight: bold;
}

/* Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 32px;
    border-radius: 50px;
    font-weight: 600;
    text-decoration: none !important;
    transition: all 0.3s ease;
    cursor: pointer;
    border: none;
    font-size: 1em;
}

.btn-primary {
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    color: #1e293b !important;
    box-shadow: 0 4px 20px rgba(251, 191, 36, 0.4);
}

.btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(251, 191, 36, 0.5);
}

.btn-outline {
    background: transparent;
    color: #fff !important;
    border: 2px solid rgba(255, 255, 255, 0.4);
}

.btn-outline:hover {
    border-color: #fff;
    background: rgba(255, 255, 255, 0.1);
}

.btn-white {
    background: #fff;
    color: #10893f !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.btn-white:hover {
    background: #e8f6ee;
    transform: translateY(-3px);
}

.btn-large {
    padding: 18px 36px;
    font-size: 1.1em;
}

/* ==========================================================================
   Stats Section
   ========================================================================== */

.ecip-stats {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    padding: 60px 20px;
}

.ecip-stats .stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.ecip-stats .stat-card {
    text-align: center;
    padding: 25px 15px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.ecip-stats .stat-number {
    display: block;
    font-size: 2.2em;
    font-weight: 800;
    color: #3fd183;
    margin-bottom: 8px;
}

.ecip-stats .stat-label {
    color: #94a3b8;
    font-size: 0.9em;
}

/* ==========================================================================
   Features Section
   ========================================================================== */

.ecip-features {
    padding: 80px 20px;
    background: #fff;
}

.ecip-features .features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.ecip-features .feature-card {
    text-align: center;
    padding: 40px 30px;
    border-radius: 20px;
    background: #f8fafc;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}

.ecip-features .feature-card:hover {
    background: #e8f6ee;
    border-color: #cbe6d7;
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(21,163,79, 0.1);
}

.ecip-features .feature-icon {
    width: 70px;
    height: 70px;
    margin: 0 auto 20px;
    background: linear-gradient(135deg, #cbe6d7 0%, #e8f6ee 100%);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ecip-features .feature-icon svg {
    width: 32px;
    height: 32px;
    stroke: #15a34f;
}

.ecip-features .feature-card h3 {
    color: #0f172a;
    font-size: 1.25em;
    font-weight: 600;
    margin-bottom: 12px;
    background: none !important;
    padding: 0 !important;
    border: none !important;
}

.ecip-features .feature-card p {
    color: #64748b;
    font-size: 0.95em;
    line-height: 1.6;
    margin: 0;
}

/* ==========================================================================
   How It Works Section
   ========================================================================== */

.ecip-how-it-works {
    padding: 80px 20px;
    background: #f8fafc;
}

.ecip-how-it-works .hiw-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    margin-top: 50px;
}

.ecip-how-it-works .step-card {
    background: #fff;
    padding: 40px 25px 30px;
    border-radius: 20px;
    text-align: center;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    position: relative;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}

.ecip-how-it-works .step-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
    border-color: #cbe6d7;
}

.ecip-how-it-works .step-number {
    position: absolute;
    top: -18px;
    left: 50%;
    transform: translateX(-50%);
    width: 36px;
    height: 36px;
    background: linear-gradient(135deg, #15a34f 0%, #10893f 100%);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1em;
    box-shadow: 0 4px 15px rgba(21,163,79, 0.4);
}

.ecip-how-it-works .step-card h3 {
    color: #0f172a;
    font-size: 1.15em;
    font-weight: 600;
    margin: 10px 0;
    background: none !important;
    padding: 0 !important;
    border: none !important;
}

.ecip-how-it-works .step-card p {
    color: #64748b;
    font-size: 0.9em;
    line-height: 1.6;
    margin: 0;
}

.ecip-how-it-works .hiw-cta {
    text-align: center;
    margin-top: 50px;
}

.ecip-how-it-works .hiw-cta .btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #15a34f 0%, #10893f 100%);
    color: #fff !important;
    padding: 16px 32px;
    border-radius: 50px;
    font-weight: 600;
    text-decoration: none !important;
    box-shadow: 0 4px 20px rgba(21,163,79, 0.3);
    transition: all 0.3s ease;
}

.ecip-how-it-works .hiw-cta .btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(21,163,79, 0.4);
}

.ecip-how-it-works .hiw-cta .btn-primary svg {
    width: 16px;
    height: 16px;
    stroke: currentColor;
}

/* Products Section */
.ecip-products-section {
    padding: 80px 20px;
    background: #fff;
}

.ecip-products-section .products-cta {
    text-align: center;
    margin-top: 40px;
}

/* ==========================================================================
   Discounts Section
   ========================================================================== */

.ecip-discounts {
    padding: 60px 20px;
    background: #f8fafc;
}

.ecip-discounts .discounts-box {
    max-width: 600px;
    margin: 0 auto;
    background: linear-gradient(135deg, #e8f6ee 0%, #fff 100%);
    border: 2px solid #15a34f;
    border-radius: 20px;
    padding: 35px;
}

.ecip-discounts .discounts-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 25px;
}

.ecip-discounts .discounts-header svg {
    width: 24px;
    height: 24px;
    stroke: #15a34f;
}

.ecip-discounts .discounts-header h3 {
    color: #10893f;
    font-size: 1.4em;
    font-weight: 700;
    margin: 0;
    background: none !important;
    padding: 0 !important;
    border: none !important;
}

.ecip-discounts .discounts-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

.ecip-discounts .discounts-table th {
    background: linear-gradient(135deg, #15a34f 0%, #10893f 100%);
    color: #fff;
    padding: 14px 20px;
    text-align: left;
    font-weight: 600;
    font-size: 0.95em;
}

.ecip-discounts .discounts-table td {
    padding: 16px 20px;
    border-bottom: 1px solid #e2e8f0;
    color: #475569;
}

.ecip-discounts .discounts-table tr:last-child td {
    border-bottom: none;
}

.ecip-discounts .discounts-table .highlight-row {
    background: #e8f6ee;
}

.ecip-discounts .discount-badge {
    display: inline-block;
    background: linear-gradient(135deg, #15a34f 0%, #10893f 100%);
    color: #fff;
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 0.85em;
    font-weight: 600;
}

.ecip-discounts .discount-badge.best {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
}

/* ==========================================================================
   Quick Links Section
   ========================================================================== */

.ecip-quick-links {
    padding: 80px 20px;
    background: #fff;
}

.ecip-quick-links .ql-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.ecip-quick-links .ql-card {
    display: block;
    padding: 30px 25px;
    background: #f8fafc;
    border-radius: 16px;
    text-decoration: none !important;
    transition: all 0.3s ease;
    border: 1px solid transparent;
    text-align: center;
}

.ecip-quick-links .ql-card:hover {
    background: #e8f6ee;
    border-color: #cbe6d7;
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(21,163,79, 0.1);
}

.ecip-quick-links .ql-icon {
    width: 60px;
    height: 60px;
    margin: 0 auto 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #cbe6d7 0%, #e8f6ee 100%);
    border-radius: 16px;
}

.ecip-quick-links .ql-icon svg {
    width: 28px;
    height: 28px;
    stroke: #15a34f;
}

.ecip-quick-links .ql-card h3 {
    color: #0f172a;
    font-size: 1.1em;
    font-weight: 600;
    margin: 0 0 8px;
    background: none !important;
    padding: 0 !important;
    border: none !important;
}

.ecip-quick-links .ql-card p {
    color: #64748b;
    font-size: 0.9em;
    margin: 0;
}

/* ==========================================================================
   Final CTA Section
   ========================================================================== */

.ecip-final-cta {
    background: linear-gradient(135deg, #15a34f 0%, #10893f 100%);
    padding: 80px 20px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.ecip-final-cta::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(circle at 30% 70%, rgba(63,209,131, 0.1) 0%, transparent 50%);
    pointer-events: none;
}

.ecip-final-cta .cta-container {
    position: relative;
    z-index: 1;
    max-width: 600px;
}

.ecip-final-cta h2 {
    color: #fff;
    font-size: 2.2em;
    font-weight: 700;
    margin-bottom: 15px;
}

.ecip-final-cta p {
    color: rgba(255, 255, 255, 0.85);
    font-size: 1.15em;
    margin-bottom: 30px;
}

.ecip-final-cta .btn-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    color: #1e293b !important;
    padding: 18px 36px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 1.1em;
    text-decoration: none !important;
    box-shadow: 0 4px 20px rgba(251, 191, 36, 0.4);
    transition: all 0.3s ease;
}

.ecip-final-cta .btn-cta:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(251, 191, 36, 0.5);
}

.ecip-final-cta .btn-cta svg {
    width: 16px;
    height: 16px;
    stroke: currentColor;
}

/* ==========================================================================
   Products Section
   ========================================================================== */

.ecip-products-section {
    padding: 80px 20px;
    background: #fff;
}

.ecip-products-section .products-container {
    max-width: 1100px;
}

/* ==========================================================================
   Homepage Responsive
   ========================================================================== */

@media (max-width: 992px) {
    .ecip-stats .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .ecip-features .features-grid {
        grid-template-columns: 1fr;
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
    }

    .ecip-how-it-works .hiw-steps {
        grid-template-columns: repeat(2, 1fr);
    }

    .ecip-quick-links .ql-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .ecip-hero {
        padding: 60px 20px 80px;
    }

    .ecip-hero .hero-title {
        font-size: 2.2em;
    }

    .ecip-hero .hero-subtitle {
        font-size: 1em;
    }

    .ecip-hero .hero-buttons {
        flex-direction: column;
        align-items: center;
    }

    .ecip-hero .hero-trust {
        flex-direction: column;
        gap: 12px;
    }

    .ecip-stats {
        padding: 40px 20px;
    }

    .ecip-stats .stats-grid {
        gap: 15px;
    }

    .ecip-stats .stat-card {
        padding: 20px 10px;
    }

    .ecip-stats .stat-number {
        font-size: 1.6em;
    }

    .ecip-stats .stat-label {
        font-size: 0.8em;
    }

    .ecip-features,
    .ecip-how-it-works,
    .ecip-quick-links,
    .ecip-products-section {
        padding: 60px 20px;
    }

    .ecip-how-it-works .hiw-steps {
        grid-template-columns: 1fr;
        max-width: 350px;
        margin-left: auto;
        margin-right: auto;
    }

    .ecip-quick-links .ql-grid {
        grid-template-columns: 1fr;
        max-width: 350px;
        margin-left: auto;
        margin-right: auto;
    }

    .section-title {
        font-size: 1.7em;
    }

    .ecip-final-cta {
        padding: 60px 20px;
    }

    .ecip-final-cta h2 {
        font-size: 1.7em;
    }

    .ecip-discounts .discounts-box {
        padding: 25px 20px;
    }

    .ecip-discounts .discounts-table th,
    .ecip-discounts .discounts-table td {
        padding: 12px 15px;
        font-size: 0.9em;
    }
}

/* ==========================================================================
   Homepage V2 - Matching original ecip.sk design
   ========================================================================== */

.ecip-homepage-v2 {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Hero Section V2 - Full Width */
.ecip-homepage-v2 .hero-section {
    background: linear-gradient(135deg, #071710 0%, #10893f 50%, #15a34f 100%);
    color: #fff;
    padding: 80px 20px 80px;
    position: relative;
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    box-sizing: border-box;
}

/* Extra override for stubborn containers */
.page-id-54 .ecip-homepage-v2 .hero-section {
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    left: 50% !important;
    right: 50% !important;
    position: relative !important;
    width: 100vw !important;
}

.ecip-homepage-v2 .hero-content {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.ecip-homepage-v2 .hero-headline {
    font-size: 2.5em;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 20px;
    color: #fff;
}

.ecip-homepage-v2 .hero-headline .highlight {
    color: #3fd183;
}

.ecip-homepage-v2 .hero-subtitle {
    font-size: 1.1em;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.7;
    max-width: 700px;
    margin: 0 auto 40px;
}

/* Hero Cards */
.ecip-homepage-v2 .hero-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    max-width: 800px;
    margin: 0 auto 40px;
}

.ecip-homepage-v2 .hero-card {
    padding: 30px;
    border-radius: 16px;
    text-align: center;
}

.ecip-homepage-v2 .hero-card-primary {
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.ecip-homepage-v2 .hero-card-secondary {
    background: rgba(21,163,79, 0.3);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(63,209,131, 0.2);
}

.ecip-homepage-v2 .hero-card .card-icon {
    width: 50px;
    height: 50px;
    margin: 0 auto 15px;
    background-color: rgba(63,209,131, 0.2);
    border-radius: 12px;
    background-position: center;
    background-size: 24px;
    background-repeat: no-repeat;
}

.ecip-homepage-v2 .hero-card .card-icon.icon-copy {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%233fd183' stroke-width='2'%3E%3Crect x='9' y='9' width='13' height='13' rx='2' ry='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E");
}

.ecip-homepage-v2 .hero-card .card-icon.icon-user {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%233fd183' stroke-width='2'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E");
}

.ecip-homepage-v2 .hero-card h3 {
    font-size: 1.2em;
    font-weight: 600;
    margin: 0 0 10px;
    color: #fff !important;
    background: none !important;
    -webkit-text-fill-color: #fff !important;
}

/* Hide page title and remove all padding/margins on homepage */
.page-id-54 .entry-title,
.home .entry-title,
body.page-template-default.page-id-54 header.entry-header,
.page-id-54 .entry-header {
    display: none !important;
}

/* Remove all WordPress container restrictions on homepage */
.page-id-54 #primary,
.page-id-54 .site-content,
.page-id-54 .ast-container,
.page-id-54 article,
.page-id-54 .entry-content,
.page-id-54 .ast-article-single {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

.page-id-54 #content.site-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.page-id-54 .ast-separate-container .ast-article-single {
    background: transparent !important;
    padding: 0 !important;
}

/* ==========================================================================
   Footer Customization
   ========================================================================== */

/* Hide "Powered by Astra" text */
.ast-footer-copyright .ast-footer-site-title,
.site-footer .ast-footer-html-inner a[href*="developer.wordpress.org"],
.site-footer .ast-footer-html-inner a[href*="developer.wordpress"],
.ast-small-footer .ast-footer-site-title,
.ast-small-footer-wrap .ast-footer-copyright a {
    display: none !important;
}

/* Custom footer styling */
.site-footer {
    background: #0f172a !important;
    color: #94a3b8 !important;
    padding: 40px 20px 20px !important;
}

.site-footer a {
    color: #3fd183 !important;
}

.ast-small-footer {
    background: #0f172a !important;
    border-top: 1px solid #1e293b !important;
}

/* ==========================================================================
   Subpage Styling - Hide duplicate titles
   ========================================================================== */

/* Hide page title when content has its own h1/h2 */
.page-id-28 .entry-title, /* FAQ */
.page-id-21 .entry-title, /* Kontakt */
.page-id-27 .entry-title, /* Ako to funguje */
.page-id-31 .entry-title, /* Obchodne podmienky */
.page-id-32 .entry-title  /* GDPR */
{
    display: none !important;
}

/* Subpage content styling */
.entry-content h2 {
    color: #0f172a;
    font-size: 1.8em;
    margin-top: 0;
}

.entry-content h3 {
    color: #15a34f;
    font-size: 1.3em;
    border-left: 4px solid #15a34f;
    padding-left: 15px;
    margin: 30px 0 15px;
}

.ecip-homepage-v2 .hero-card p {
    font-size: 0.9em;
    color: rgba(255, 255, 255, 0.75);
    margin: 0 0 20px;
    line-height: 1.5;
}

.ecip-homepage-v2 .btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #10b981;
    color: #fff;
    padding: 14px 28px;
    border-radius: 8px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
}

.ecip-homepage-v2 .btn-primary:hover {
    background: #059669;
    transform: translateY(-2px);
}

.ecip-homepage-v2 .btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    color: #fff;
    padding: 14px 28px;
    border-radius: 8px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
}

.ecip-homepage-v2 .btn-outline:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.5);
}

.ecip-homepage-v2 .icon-arrow-right {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

/* Chip Types */
.ecip-homepage-v2 .chip-types {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 0.9em;
    color: rgba(255, 255, 255, 0.7);
}

.ecip-homepage-v2 .chip-type strong {
    color: #3fd183;
}

.ecip-homepage-v2 .chip-divider {
    color: rgba(255, 255, 255, 0.3);
}

.ecip-homepage-v2 .icon-check-small {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 4px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2310b981' stroke-width='3'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}

/* Stats Bar - Full Width */
.ecip-homepage-v2 .stats-bar {
    background: #071710;
    padding: 40px 20px;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

.ecip-homepage-v2 .stats-bar .stats-container {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.ecip-homepage-v2 .stat-item {
    display: flex;
    align-items: center;
    gap: 15px;
    color: #fff;
}

.ecip-homepage-v2 .stat-icon {
    width: 40px;
    height: 40px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    flex-shrink: 0;
}

.ecip-homepage-v2 .stat-icon.icon-clock {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 24' fill='none' stroke='%233fd183' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E");
}

.ecip-homepage-v2 .stat-number {
    font-size: 1.8em;
    font-weight: 700;
    color: #3fd183;
    flex-shrink: 0;
}

.ecip-homepage-v2 .stat-text {
    display: flex;
    flex-direction: column;
}

.ecip-homepage-v2 .stat-label {
    font-weight: 600;
    font-size: 0.95em;
}

.ecip-homepage-v2 .stat-sublabel {
    font-size: 0.8em;
    color: rgba(255, 255, 255, 0.6);
}

/* Section Containers */
.ecip-homepage-v2 .section-container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}

.ecip-homepage-v2 .section-title {
    font-size: 2em;
    font-weight: 700;
    color: #0f172a;
    text-align: center;
    margin: 0 0 15px;
}

.ecip-homepage-v2 .section-subtitle {
    text-align: center;
    color: #64748b;
    font-size: 1.05em;
    margin: 0 0 40px;
}

/* How It Works - Full Width */
.ecip-homepage-v2 .how-it-works {
    padding: 80px 20px;
    background: #fff;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

.ecip-homepage-v2 .steps-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.ecip-homepage-v2 .step-item {
    text-align: center;
}

.ecip-homepage-v2 .step-number {
    width: 50px;
    height: 50px;
    background: #15a34f;
    color: #fff;
    font-size: 1.3em;
    font-weight: 700;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.ecip-homepage-v2 .step-item h3 {
    font-size: 1.1em;
    font-weight: 600;
    color: #0f172a !important;
    margin: 0 0 10px;
    background: none !important;
    -webkit-text-fill-color: #0f172a !important;
}

.ecip-homepage-v2 .step-item p {
    font-size: 0.9em;
    color: #64748b;
    line-height: 1.6;
    margin: 0;
}

/* Products Section - Full Width */
.ecip-homepage-v2 .products-section {
    padding: 80px 20px;
    background: #f8fafc;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

/* Pricing Section - Full Width */
.ecip-homepage-v2 .pricing-section {
    padding: 80px 20px;
    background: #fff;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

.ecip-homepage-v2 .pricing-box {
    max-width: 600px;
    margin: 0 auto;
    background: #e8f6ee;
    border: 1px solid #cbe6d7;
    border-radius: 16px;
    padding: 40px;
}

.ecip-homepage-v2 .pricing-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 15px;
}

.ecip-homepage-v2 .pricing-header .icon-tag {
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%2315a34f' stroke-width='2'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z'/%3E%3Cline x1='7' y1='7' x2='7.01' y2='7'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

.ecip-homepage-v2 .pricing-header h3 {
    font-size: 1.3em;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.ecip-homepage-v2 .pricing-intro {
    color: #64748b;
    margin: 0 0 25px;
}

.ecip-homepage-v2 .pricing-table {
    width: 100%;
    border-collapse: collapse;
}

.ecip-homepage-v2 .pricing-table th,
.ecip-homepage-v2 .pricing-table td {
    padding: 14px 16px;
    text-align: left;
    border-bottom: 1px solid #d1fae5;
}

.ecip-homepage-v2 .pricing-table th {
    background: #cbe6d7;
    font-weight: 600;
    color: #10893f;
    font-size: 0.85em;
    text-transform: uppercase;
}

.ecip-homepage-v2 .pricing-table td {
    color: #334155;
}

.ecip-homepage-v2 .pricing-table .highlight-row td {
    background: #d1fae5;
    font-weight: 600;
}

.ecip-homepage-v2 .discount-badge {
    display: inline-block;
    background: #15a34f;
    color: #fff;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 0.85em;
    font-weight: 600;
}

.ecip-homepage-v2 .discount-badge.best {
    background: #059669;
}

.ecip-homepage-v2 .pricing-note {
    font-size: 0.85em;
    color: #94a3b8;
    margin: 20px 0 0;
    text-align: center;
}

/* FAQ Section - Full Width */
.ecip-homepage-v2 .faq-section {
    padding: 80px 20px;
    background: #f8fafc;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

.ecip-homepage-v2 .faq-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    margin-bottom: 40px;
}

.ecip-homepage-v2 .faq-item {
    background: #fff;
    padding: 25px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
}

.ecip-homepage-v2 .faq-item h4 {
    font-size: 1em;
    font-weight: 600;
    color: #0f172a;
    margin: 0 0 10px;
}

.ecip-homepage-v2 .faq-item p {
    font-size: 0.9em;
    color: #64748b;
    line-height: 1.6;
    margin: 0;
}

.ecip-homepage-v2 .faq-cta {
    text-align: center;
}

/* Final CTA - Full Width */
.ecip-homepage-v2 .final-cta {
    background: linear-gradient(135deg, #10893f 0%, #15a34f 100%);
    padding: 80px 20px;
    text-align: center;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

.ecip-homepage-v2 .final-cta .cta-container {
    max-width: 600px;
    margin: 0 auto;
}

.ecip-homepage-v2 .final-cta h2 {
    font-size: 2em;
    font-weight: 700;
    color: #fff;
    margin: 0 0 15px;
}

.ecip-homepage-v2 .final-cta p {
    color: rgba(255, 255, 255, 0.85);
    font-size: 1.1em;
    margin: 0 0 30px;
}

.ecip-homepage-v2 .btn-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #fff;
    color: #15a34f;
    padding: 16px 32px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 1.05em;
    text-decoration: none;
    transition: all 0.2s ease;
}

.ecip-homepage-v2 .btn-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

/* Responsive - Homepage V2 */
@media (max-width: 900px) {
    .ecip-homepage-v2 .hero-cards {
        grid-template-columns: 1fr;
        max-width: 400px;
    }

    .ecip-homepage-v2 .stats-bar .stats-container {
        grid-template-columns: repeat(2, 1fr);
    }

    .ecip-homepage-v2 .steps-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .ecip-homepage-v2 .faq-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .ecip-homepage-v2 .hero-headline {
        font-size: 1.8em;
    }

    .ecip-homepage-v2 .hero-subtitle {
        font-size: 1em;
    }

    .ecip-homepage-v2 .stats-bar .stats-container {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .ecip-homepage-v2 .stat-item {
        justify-content: center;
    }

    .ecip-homepage-v2 .steps-grid {
        grid-template-columns: 1fr;
    }

    .ecip-homepage-v2 .chip-types {
        flex-direction: column;
        gap: 10px;
    }

    .ecip-homepage-v2 .chip-divider {
        display: none;
    }

    .ecip-homepage-v2 .section-title {
        font-size: 1.6em;
    }

    .ecip-homepage-v2 .pricing-box {
        padding: 25px 20px;
    }
}

/* ==========================================================================
   FAQ Page Styling
   ========================================================================== */

.page-id-28 .entry-content h2:first-of-type {
    font-size: 2.2em;
    color: #0f172a;
    margin-bottom: 10px;
}

.page-id-28 .entry-content > p:first-of-type {
    color: #64748b;
    font-size: 1.1em;
    margin-bottom: 40px;
}

/* FAQ Accordion Style */
.page-id-28 .entry-content h4,
.faq-question {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 18px 20px;
    margin: 10px 0;
    font-size: 1em;
    font-weight: 500;
    color: #0f172a;
    cursor: pointer;
    transition: all 0.2s ease;
}

.page-id-28 .entry-content h4:hover {
    border-color: #15a34f;
    background: #e8f6ee;
}

.page-id-28 .entry-content h4 + p,
.page-id-28 .entry-content h4 + ul {
    background: #f8fafc;
    border-left: 3px solid #15a34f;
    padding: 15px 20px;
    margin: -5px 0 15px 0;
    border-radius: 0 0 8px 8px;
}

/* ==========================================================================
   Shop/Product Styling
   ========================================================================== */

/* Shop page title */
.woocommerce-page.post-type-archive-product .entry-title,
.woocommerce-page .woocommerce-products-header__title {
    font-size: 2em;
    color: #0f172a;
    margin-bottom: 30px;
}

/* Product grid */
.woocommerce ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.woocommerce ul.products li.product {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 20px;
    margin: 0 !important;
    width: 100% !important;
    transition: all 0.3s ease;
}

.woocommerce ul.products li.product:hover {
    border-color: #15a34f;
    box-shadow: 0 10px 40px rgba(21,163,79, 0.1);
    transform: translateY(-5px);
}

/* Product image */
.woocommerce ul.products li.product a img {
    border-radius: 12px;
    margin-bottom: 15px;
}

/* Product title */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 1.1em !important;
    font-weight: 600;
    color: #0f172a;
    padding: 0;
    margin-bottom: 8px;
}

/* Product price */
.woocommerce ul.products li.product .price {
    color: #15a34f !important;
    font-size: 1.3em !important;
    font-weight: 700;
    margin-bottom: 15px;
}

/* Add to cart button */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button {
    width: 100%;
    text-align: center;
    background: #15a34f !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 14px 20px !important;
    font-weight: 600;
    transition: all 0.2s ease;
}

.woocommerce ul.products li.product .button:hover {
    background: #10893f !important;
}

/* Responsive shop grid */
@media (max-width: 900px) {
    .woocommerce ul.products {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .woocommerce ul.products {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   Contact Page Styling
   ========================================================================== */

.page-id-21 .entry-content h2:first-of-type {
    font-size: 2em;
    color: #0f172a;
}

/* Contact info table */
.page-id-21 table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
}

.page-id-21 table td {
    padding: 15px 20px;
    border-bottom: 1px solid #e2e8f0;
}

.page-id-21 table td:first-child {
    font-weight: 600;
    color: #64748b;
    width: 150px;
}

/* ==========================================================================
   Footer - Complete Override
   ========================================================================== */

/* Hide Astra credit completely */
.ast-footer-copyright,
.site-footer .ast-row,
.ast-small-footer .ast-container {
    position: relative;
}

.ast-footer-copyright a[href*="developer.wordpress"],
.ast-footer-copyright a[href*="developer.wordpress.org"],
.ast-footer-copyright a[href*="developer.wordpress.com"],
a[href*="developer.wordpress"],
.ast-footer-html-inner a[href*="developer"],
.ast-theme-text,
.site-footer a[rel*="nofollow"] {
    display: none !important;
    visibility: hidden !important;
}

/* Override the "Powered by" text */
.ast-footer-copyright .ast-footer-site-title {
    font-size: 0 !important;
}

.ast-footer-copyright .ast-footer-site-title::after {
    content: "© 2026 ECIP.sk - Kopírovanie prístupových čipov" !important;
    font-size: 14px !important;
    color: #94a3b8 !important;
}

/* Style the footer container */
footer.site-footer,
.site-footer {
    background: #0f172a !important;
    padding: 30px 0 !important;
}

/* ==========================================================================
   FULL-WIDTH LAYOUT FIX - All Pages
   ========================================================================== */

/* Make all pages full-width */
body .ast-container,
body .ast-separate-container .ast-container,
body #primary,
body .site-content .ast-container {
    max-width: 100% !important;
}

/* Fix for Astra's content width */
body .site-content {
    width: 100% !important;
    max-width: 100% !important;
}

/* Keep content readable */
body .ast-separate-container .ast-article-single,
body .ast-plain-container .ast-article-single,
body article.page {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Entry content still has max-width for readability */
body .entry-content,
body .page-content {
    max-width: 900px;
    margin: 0 auto;
    padding: 40px 20px;
}

/* Full-width sections override */
.full-width-section,
.ecip-hero,
.ecip-stats,
.ecip-features,
.ecip-how-it-works,
.ecip-discounts,
.ecip-quick-links,
.ecip-final-cta,
.ecip-products-section {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
}

/* Remove Astra box styling */
body .ast-separate-container .ast-article-single {
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

body .ast-separate-container .ast-comment-list li.depth-1 {
    background: transparent !important;
}

/* Remove all container restrictions */
.ast-page-builder-template .entry-content,
.ast-page-builder-template .site-content > .ast-container {
    max-width: 100% !important;
}

.ast-small-footer {
    background: #0f172a !important;
    border-top: none !important;
    padding: 20px 0 !important;
}

.ast-small-footer .ast-footer-copyright {
    color: #64748b !important;
    text-align: center !important;
}

.ast-small-footer a {
    color: #3fd183 !important;
}

/* Hide page title on wizard pages */
.page-id-115 .entry-title,
.page-id-112 .entry-title {
    display: none !important;
}

/* Order Wizard - Full width */
.page-id-115 .entry-content,
.page-id-112 .entry-content {
    max-width: 100% !important;
    padding: 0 !important;
}

/* ==========================================================================
   FAQ PAGE
   ========================================================================== */

.ecip-faq-page {
    max-width: 800px;
    margin: 0 auto;
    padding: 48px 16px;
}

.ecip-faq-page h1 {
    font-size: 2.25rem;
    font-weight: 700;
    color: #0f172a;
    text-align: center;
    margin-bottom: 8px;
}

.ecip-faq-page .faq-subtitle {
    text-align: center;
    color: #64748b;
    font-size: 1.1rem;
    margin-bottom: 48px;
}

.ecip-faq-category {
    margin-bottom: 40px;
}

.ecip-faq-category h2 {
    font-size: 1.5rem;
    font-weight: 700;
    color: #15a34f;
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 2px solid #e8f6ee;
}

.ecip-faq-item {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    margin-bottom: 12px;
    overflow: hidden;
    transition: all 0.2s ease;
}

.ecip-faq-item:hover {
    border-color: #15a34f;
}

.ecip-faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 16px 20px;
    background: transparent;
    border: none;
    cursor: pointer;
    text-align: left;
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    transition: all 0.2s ease;
}

.ecip-faq-question:hover {
    background: #e8f6ee;
}

.ecip-faq-question .faq-icon {
    width: 24px;
    height: 24px;
    color: #15a34f;
    transition: transform 0.3s ease;
    flex-shrink: 0;
    margin-left: 16px;
}

.ecip-faq-item.open .ecip-faq-question .faq-icon {
    transform: rotate(180deg);
}

.ecip-faq-answer {
    display: none;
    padding: 0 20px 16px;
    color: #475569;
    line-height: 1.7;
    font-size: 0.95rem;
}

.ecip-faq-item.open .ecip-faq-answer {
    display: block;
}

/* ==========================================================================
   LEGAL PAGES (VOP, GDPR)
   ========================================================================== */

.ecip-legal-page {
    max-width: 800px;
    margin: 0 auto;
    padding: 48px 16px;
}

.ecip-legal-page h1 {
    font-size: 2.25rem;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 8px;
}

.ecip-legal-page .legal-subtitle {
    color: #64748b;
    font-size: 0.9rem;
    margin-bottom: 40px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e2e8f0;
}

.ecip-legal-page h2 {
    font-size: 1.4rem;
    font-weight: 700;
    color: #15a34f;
    margin-top: 40px;
    margin-bottom: 16px;
}

.ecip-legal-page h3 {
    font-size: 1.15rem;
    font-weight: 600;
    color: #1e293b;
    margin-top: 24px;
    margin-bottom: 12px;
}

.ecip-legal-page p {
    color: #475569;
    line-height: 1.8;
    margin-bottom: 16px;
}

.ecip-legal-page ul,
.ecip-legal-page ol {
    color: #475569;
    line-height: 1.8;
    margin-bottom: 16px;
    padding-left: 24px;
}

.ecip-legal-page li {
    margin-bottom: 8px;
}

.ecip-legal-page strong {
    color: #1e293b;
}

.ecip-legal-page a {
    color: #15a34f;
    text-decoration: underline;
}

.ecip-legal-page a:hover {
    color: #10893f;
}

/* Table of contents */
.ecip-legal-toc {
    background: #f8fafc;
    border-radius: 12px;
    padding: 20px 24px;
    margin-bottom: 32px;
}

.ecip-legal-toc h3 {
    font-size: 1rem;
    margin-top: 0;
    margin-bottom: 12px;
    color: #15a34f;
}

.ecip-legal-toc ol {
    padding-left: 20px;
    margin-bottom: 0;
}

.ecip-legal-toc li {
    margin-bottom: 4px;
}

.ecip-legal-toc a {
    text-decoration: none;
    font-size: 0.9rem;
}

/* ==========================================================================
   HOW TO SEND (POSTUP) PAGE
   ========================================================================== */

.ecip-howto-page {
    max-width: 800px;
    margin: 0 auto;
    padding: 48px 16px;
}

.ecip-howto-page h1 {
    font-size: 2.25rem;
    font-weight: 700;
    color: #0f172a;
    text-align: center;
    margin-bottom: 8px;
}

.ecip-howto-page .howto-subtitle {
    text-align: center;
    color: #64748b;
    font-size: 1.1rem;
    margin-bottom: 48px;
}

.ecip-howto-step {
    display: flex;
    gap: 20px;
    margin-bottom: 32px;
    padding: 24px;
    background: #f8fafc;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    transition: all 0.2s ease;
}

.ecip-howto-step:hover {
    border-color: #15a34f;
    box-shadow: 0 4px 12px rgba(21,163,79, 0.1);
}

.ecip-howto-step-number {
    width: 48px;
    height: 48px;
    min-width: 48px;
    background: linear-gradient(135deg, #15a34f 0%, #10893f 100%);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    font-weight: 700;
}

.ecip-howto-step-content h3 {
    font-size: 1.15rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0 0 8px;
}

.ecip-howto-step-content p {
    color: #475569;
    margin: 0;
    line-height: 1.6;
}

.ecip-howto-address {
    background: linear-gradient(135deg, #e8f6ee 0%, #cbe6d7 100%);
    border: 1px solid #cbe6d7;
    border-radius: 12px;
    padding: 24px;
    margin: 32px 0;
    text-align: center;
}

.ecip-howto-address h3 {
    color: #15a34f;
    margin-bottom: 12px;
}

.ecip-howto-address address {
    font-style: normal;
    color: #1e293b;
    line-height: 1.8;
    font-weight: 500;
}

/* Responsive */
@media (max-width: 640px) {
    .ecip-howto-step {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}

/* ==========================================================================
   WIZARD FORMS (Complaint, Withdrawal, Order)
   ========================================================================== */

/* Override any global h2 color for wizard pages */
.ecip-complaint-wizard h2,
.ecip-order-wizard h2 {
    color: #0f172a !important;
    font-size: 1.75rem !important;
}

/* Make wizard buttons match ECIP design */
.ecip-complaint-wizard .btn,
.ecip-order-wizard .btn {
    font-family: 'Inter', sans-serif;
}

/* Ensure wizard styles don't get overridden by WC */
body.ecip-theme .ecip-complaint-wizard .option-card,
body.ecip-theme .ecip-order-wizard .option-card {
    background: #f8fafc;
}

body.ecip-theme .ecip-complaint-wizard .option-card:hover,
body.ecip-theme .ecip-order-wizard .option-card:hover {
    background: #e8f6ee;
    border-color: #15a34f;
}

/* ==========================================================================
   PUBLIC TRACKING PAGE
   ========================================================================== */

.ecip-tracking-page {
    max-width: 600px;
    margin: 0 auto;
    padding: 48px 16px;
}

.ecip-tracking-page h1 {
    font-size: 2rem;
    font-weight: 700;
    color: #0f172a;
    text-align: center;
    margin-bottom: 8px;
}

.ecip-tracking-form {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 32px;
    margin-bottom: 32px;
}

.ecip-tracking-result {
    background: #f8fafc;
    border-radius: 16px;
    padding: 32px;
    border: 1px solid #e2e8f0;
}

.ecip-tracking-timeline {
    position: relative;
    padding-left: 32px;
}

.ecip-tracking-timeline::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #e2e8f0;
}

.ecip-tracking-event {
    position: relative;
    margin-bottom: 24px;
}

.ecip-tracking-event::before {
    content: '';
    position: absolute;
    left: -28px;
    top: 4px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #e2e8f0;
    border: 2px solid white;
}

.ecip-tracking-event.active::before {
    background: #15a34f;
    box-shadow: 0 0 0 4px rgba(21,163,79, 0.2);
}

.ecip-tracking-event-date {
    font-size: 0.85rem;
    color: #94a3b8;
    margin-bottom: 4px;
}

.ecip-tracking-event-text {
    font-weight: 600;
    color: #1e293b;
}