.contact-simple-page {
            background: var(--paper);
            min-height: 100vh;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 2rem 1rem 3rem;
        }

        /* ---------- Header Brand ---------- */
        .contact-brand-header {
            text-align: center;
            margin-bottom: 2.5rem;
        }

        .contact-brand-header .brand-logo {
            width: 80px;
            height: 80px;
            object-fit: contain;
            margin-bottom: 0.75rem;
            display: block;
            margin-left: auto;
            margin-right: auto;
        }

        .contact-brand-header .brand-name {
            font-family: var(--font-display);
            font-weight: 700;
            font-size: 1.8rem;
            color: var(--ink);
            line-height: 1.2;
        }

        .contact-brand-header .brand-name span {
            color: var(--brick);
        }

        .contact-brand-header .brand-tagline {
            font-family: var(--font-label);
            font-size: 0.8rem;
            font-weight: 600;
            letter-spacing: 0.08em;
            color: var(--ink-soft);
            text-transform: uppercase;
            margin-top: 0.2rem;
        }

        /* ---------- Pulse Rule Decoration ---------- */
        .contact-pulse-rule {
            width: 120px;
            height: 10px;
            margin: 0.5rem auto 1.5rem;
            opacity: 0.4;
        }

        .contact-pulse-rule svg {
            width: 100%;
            height: 100%;
            display: block;
        }

        .contact-pulse-rule path {
            fill: none;
            stroke: var(--sea);
            stroke-width: 1.5;
        }

        /* ---------- Content Wrapper ---------- */
        .contact-content-wrapper {
            max-width: 720px;
            width: 100%;
            background: var(--paper-card);
            border: 1px solid var(--line);
            border-radius: var(--radius);
            padding: 2rem 1.5rem;
        }

        @media (min-width: 576px) {
            .contact-content-wrapper {
                padding: 2.5rem 2.5rem;
            }
        }

        @media (min-width: 768px) {
            .contact-content-wrapper {
                padding: 3rem 3.5rem;
            }
        }

        /* ---------- Contact Section Title ---------- */
        .contact-section-title {
            font-family: var(--font-display);
            font-weight: 700;
            font-size: 1.4rem;
            color: var(--ink);
            text-align: center;
            margin-bottom: 0.5rem;
        }

        .contact-section-sub {
            text-align: center;
            color: var(--ink-soft);
            font-size: 0.95rem;
            margin-bottom: 2rem;
        }

        /* ---------- Contact Grid ---------- */
        .contact-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
        }

        @media (max-width: 576px) {
            .contact-grid {
                grid-template-columns: 1fr;
                gap: 0.75rem;
            }
        }

        /* ---------- Contact Card ---------- */
        .contact-card {
            display: flex;
            align-items: center;
            gap: 0.85rem;
            padding: 0.9rem 1rem;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            transition: background 0.2s, border-color 0.2s, transform 0.15s;
            text-decoration: none !important;
            color: var(--ink) !important;
            background: var(--paper-card);
        }

        .contact-card:hover {
            background: var(--sea-tint);
            border-color: var(--sea);
            transform: translateY(-2px);
        }

        .contact-card .icon-wrap {
            width: 44px;
            height: 44px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            flex: none;
            font-size: 1.4rem;
            color: #fff;
        }

        /* --- Warna khusus masing-masing platform --- */
        .contact-card.facebook .icon-wrap {
            background: #1877F2;
        }

        .contact-card.whatsapp .icon-wrap {
            background: #25D366;
        }

        .contact-card.twitter .icon-wrap {
            background: #000000;
        }

        .contact-card.instagram .icon-wrap {
            background: radial-gradient(circle at 30% 30%, #fdf497, #fd5949, #d6249f, #285AEB);
        }

        .contact-card.email .icon-wrap {
            background: var(--sea);
        }

        .contact-card.email-alt .icon-wrap {
            background: var(--brick);
        }

        .contact-card .info {
            flex: 1;
            min-width: 0;
        }

        .contact-card .info .label {
            font-family: var(--font-label);
            font-size: 0.68rem;
            font-weight: 600;
            letter-spacing: 0.04em;
            color: var(--ink-soft);
            text-transform: uppercase;
        }

        .contact-card .info .value {
            font-weight: 600;
            font-size: 0.92rem;
            color: var(--ink);
            word-break: break-word;
        }

        .contact-card .info .value small {
            font-weight: 400;
            color: var(--ink-soft);
            font-size: 0.78rem;
        }

        .contact-card .arrow {
            color: var(--line);
            font-size: 0.9rem;
            flex: none;
            transition: transform 0.2s;
        }

        .contact-card:hover .arrow {
            color: var(--sea);
            transform: translateX(4px);
        }

        /* ---------- Email khusus (multiple) ---------- */
        .contact-card.email-list {
            align-items: flex-start;
            grid-column: span 2;
            max-width: 100%;
            cursor: default;
        }

        .contact-card.email-list:hover {
            transform: none;
        }

        .contact-card.email-list .info .label {
            margin-bottom: 0.4rem;
        }

        .contact-card.email-list .email-items {
            list-style: none;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            gap: 0.3rem;
        }

        .contact-card.email-list .email-items li {
            display: flex;
            align-items: baseline;
            gap: 0.4rem;
        }

        .contact-card.email-list .email-items li::before {
            content: "-";
            color: var(--sea);
            flex: none;
        }

        .contact-card.email-list .email-items a {
            font-weight: 600;
            font-size: 0.92rem;
            color: var(--ink);
            text-decoration: none;
            word-break: break-word;
        }

        .contact-card.email-list .email-items a:hover {
            color: var(--sea);
            text-decoration: underline;
        }

        @media (max-width: 480px) {
            .contact-card.email-list .email-items a {
                font-size: 0.82rem;
            }
        }

        /* ---------- Responsive ---------- */
        @media (max-width: 576px) {
            .contact-simple-page {
                padding: 1.5rem 0.75rem 2rem;
            }

            .contact-brand-header {
                margin-bottom: 1.75rem;
            }

            .contact-brand-header .brand-logo {
                width: 60px;
                height: 60px;
            }

            .contact-brand-header .brand-name {
                font-size: 1.4rem;
            }

            .contact-content-wrapper {
                padding: 1.25rem 1rem;
            }

            .contact-section-title {
                font-size: 1.2rem;
            }

            .contact-section-sub {
                font-size: 0.85rem;
                margin-bottom: 1.5rem;
            }

            .contact-card {
                padding: 0.7rem 0.85rem;
                gap: 0.65rem;
            }

            .contact-card .icon-wrap {
                width: 38px;
                height: 38px;
                font-size: 1.1rem;
            }

            .contact-card .info .value {
                font-size: 0.82rem;
            }

            .contact-card .info .label {
                font-size: 0.64rem;
            }

            .contact-card.email-list {
                grid-column: span 1;
            }
        }

        /* ---------- Hover effect untuk email card ---------- */
        .contact-card.email:hover {
            background: var(--sea-tint);
            border-color: var(--sea);
        }

        .contact-card.email-alt:hover {
            background: #FCE8E5;
            border-color: var(--brick);
        }