/* Full multi-page company-profile presentation layer. Content markup remains unchanged. */

/* Headings share a bounded scale; their content remains in normal document flow. */
main :is(.section-title, .technology-content h2, .about-introduction-content h2,
    .about-mission > h2) {
    font-size: var(--type-section) !important;
    line-height: 1.18 !important;
    letter-spacing: -.035em !important;
    margin-bottom: 20px;
}

main :is(.cta-content, .about-cta-content, .registration-cta-content, .report-cta) h2 {
    font-size: var(--type-cta) !important;
    line-height: 1.2 !important;
    letter-spacing: -.03em !important;
    margin: 0 0 20px;
}

/* A logo beside the homepage CTA must never cover its heading. */
#cta .cta-box {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 180px;
    gap: clamp(24px, 4vw, 56px);
}

#cta .cta-orbit {
    position: relative;
    inset: auto;
    width: 180px;
    height: 180px;
}

@media (max-width: 800px) {
    #cta .cta-box { grid-template-columns: minmax(0, 1fr); }
    #cta .cta-orbit { display: none; }
}
:root { --ink: #0b0714; --ink-soft: #171025; --violet: #8b5cf6; --magenta: #d946ef; --gold: #f4d35e; --paper: #faf9ff; --muted: #766e87; }
body { background: var(--paper); color: #201832; }
main { background: linear-gradient(180deg,#faf9ff 0%,#f5f2ff 42%,#faf9ff 100%); }
main > section { position: relative; overflow: clip; }
main > section:nth-of-type(even):not(.hero):not(.page-hero) { background: #fff; }
.hero, .page-hero, .registration-hero, .report-hero, .contact-hero { isolation: isolate; min-height: min(760px,100svh); color: #fff !important; background: radial-gradient(circle at 78% 24%,rgba(143,86,255,.42),transparent 23rem), radial-gradient(circle at 5% 82%,rgba(217,70,239,.2),transparent 28rem), #0b0714 !important; }
.hero::after, .page-hero::after { position: absolute; z-index: -1; inset: 0; background-image: linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px); background-size: 52px 52px; content:""; mask-image: linear-gradient(to bottom,black,transparent 88%); }
.hero h1, .page-hero h1, .hero-content h1, .page-hero-content h1 { max-width: 13ch; color: #fff !important; font-size: var(--type-hero) !important; letter-spacing: -.04em !important; line-height: 1.12 !important; }
.hero .gradient-text, .page-hero .gradient-text, .contact-hero h1 span { background: linear-gradient(90deg,#c4b5fd,#f0abfc 62%,#fde68a); -webkit-background-clip:text; background-clip:text; color:transparent !important; }
.hero-description, .page-hero-content > p, .contact-hero-description { max-width: 57ch; color: rgba(255,255,255,.72) !important; font-size: 1rem !important; }
.hero .eyebrow, .page-hero .eyebrow, .contact-kicker, .section-kicker { color: #d8b4fe !important; font-weight: 800 !important; letter-spacing: .14em !important; }
.hero-actions a, .button-primary, .button.button-primary, .contact-submit .button, .cta-actions a, .registration-cta-actions a, .about-cta-actions a { border-radius: 7px !important; background: linear-gradient(135deg,#7c3aed,#a855f7) !important; box-shadow: 0 14px 32px rgba(124,58,237,.26) !important; }
.hero-actions a:hover, .button-primary:hover { transform: translateY(-2px) !important; box-shadow: 0 18px 38px rgba(124,58,237,.34) !important; }
.hero-meta, .trust-grid { border-color: rgba(124,92,246,.16) !important; }
.hero-meta-item, .stat-card { border-radius: 12px !important; }
.hero-visual-scene .visual-card, .report-dashboard-card, .about-company-card, .registration-notice-card { border: 1px solid rgba(216,180,254,.28) !important; border-radius: 18px !important; background: rgba(255,255,255,.1) !important; box-shadow: 0 28px 75px rgba(0,0,0,.3) !important; backdrop-filter: blur(18px); }
.floating-card { border-radius: 10px !important; box-shadow: 0 18px 44px rgba(12,5,28,.25) !important; }
.section-header, .registration-process-header, .contact-location-header { max-width: 760px; }
.section-header h2, .registration-process-header h2, .contact-location-header h2, .report-security-content h2, .contact-form-area h2 { color: #1a102c !important; font-size: var(--type-section) !important; letter-spacing: -.035em !important; line-height: 1.18 !important; }
.section-header h2 .gradient-text, .section-header .gradient-text { background: linear-gradient(90deg,#6d28d9,#c026d3); -webkit-background-clip:text; background-clip:text; color:transparent !important; }
.section-header p, .registration-process-header p, .contact-location-header p { color: var(--muted) !important; font-size: 1rem !important; }
.solution-card, .service-card, .advantage-card, .product-category, .legal-card, .about-value-card, .integrity-card, .report-feature-card, .contact-info-card, .registration-step, .contact-side-card, .response-card { border: 1px solid #e9e3f5 !important; border-radius: 14px !important; background: rgba(255,255,255,.86) !important; box-shadow: 0 15px 34px rgba(41,22,82,.06) !important; transition: transform .26s ease, box-shadow .26s ease, border-color .26s ease !important; }
.solution-card:hover, .service-card:hover, .advantage-card:hover, .product-category:hover, .legal-card:hover, .about-value-card:hover, .integrity-card:hover, .report-feature-card:hover, .contact-info-card:hover, .registration-step:hover { border-color: rgba(124,58,237,.42) !important; box-shadow: 0 24px 50px rgba(67,35,134,.14) !important; transform: translateY(-6px) !important; }
.solution-card::before, .service-card::before, .advantage-card::before, .product-category::before, .report-feature-card::before { height: 3px !important; background: linear-gradient(90deg,#7c3aed,#d946ef,#f4d35e) !important; }
.trust { background: #11091f !important; color:#fff; }.stat-card { background: transparent !important; }.stat-value { color:#e9d5ff !important; }.stat-label, .stat-description { color:rgba(255,255,255,.66) !important; }
.section-light, .about-values, .report-access, .contact-main { background: linear-gradient(135deg,#f4efff,#fff) !important; }
.about-vision, .report-security, .registration-cta-section, .report-cta-section, .contact-cta-section, .about-cta-section { background: #10091d !important; color:#fff; }
.about-vision h2, .about-vision p, .report-security h2, .report-security p, .registration-cta h2, .registration-cta p, .report-cta h2, .report-cta p, .contact-cta h2, .contact-cta p, .about-cta h2, .about-cta p { color:#fff !important; }
.registration-cta, .report-cta, .contact-cta, .about-cta, .cta-box { border: 1px solid rgba(216,180,254,.26) !important; border-radius: 20px !important; background: radial-gradient(circle at 85% 15%,rgba(168,85,247,.44),transparent 24rem), #171025 !important; box-shadow: 0 28px 66px rgba(8,3,20,.28) !important; }
.report-access-card, .contact-form-area { border: 1px solid rgba(124,58,237,.16) !important; border-radius: 16px !important; box-shadow: 0 20px 45px rgba(40,20,83,.1) !important; }
.contact-form input, .contact-form textarea, .contact-form select { border-color: #ded5f0 !important; border-radius: 7px !important; background:#fcfbff !important; }.contact-form input:focus, .contact-form textarea:focus, .contact-form select:focus { border-color:#8b5cf6 !important; box-shadow:0 0 0 4px rgba(139,92,246,.12) !important; }
.footer { background: radial-gradient(circle at 18% 0%,rgba(124,58,237,.25),transparent 26rem),#0b0714 !important; }
@media (max-width: 800px) { .hero, .page-hero, .registration-hero, .report-hero, .contact-hero { min-height: auto; }.hero h1, .page-hero h1, .hero-content h1, .page-hero-content h1 { font-size: var(--type-hero) !important; }.section-header h2, .registration-process-header h2, .contact-location-header h2 { font-size: var(--type-section) !important; } }

/* Contact page: bring information, form, location, and CTA into the shared grid system. */
.contact-information .container, .contact-main .container, .contact-location .container { max-width: var(--container-width) !important; }
.contact-info-grid { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 18px !important; }
.contact-info-card { min-height: 210px; padding: 28px !important; border-top: 3px solid transparent !important; border-image: linear-gradient(90deg,#7c3aed,#d946ef) 1 !important; }
.contact-info-card .contact-info-icon { border-radius: 9px !important; background: linear-gradient(135deg,#ede9fe,#fae8ff) !important; }
.contact-main-layout { display: grid !important; grid-template-columns: minmax(0,1.25fr) minmax(280px,.75fr) !important; align-items: start !important; gap: 28px !important; }
.contact-form-area, .contact-side-card, .response-card { border: 1px solid #e9e3f5 !important; border-radius: 16px !important; background: #fff !important; box-shadow: 0 20px 45px rgba(40,20,83,.08) !important; }
.contact-form-area { padding: clamp(24px,4vw,44px) !important; }.contact-side { display:grid; gap:18px; }.quick-contact-list { display:grid; gap:10px; }.quick-contact-item { border-radius:9px; background:#faf9ff; }
.contact-location { background: linear-gradient(180deg,#fff,#f7f3ff) !important; }.contact-location-card { border: 1px solid #e9e3f5 !important; border-radius: 18px !important; box-shadow: 0 18px 42px rgba(40,20,83,.08) !important; overflow:hidden; }
.contact-cta-section { padding-block: clamp(72px,10vw,130px) !important; }

/* About page: align all company-story modules with the editorial card language. */
.about-page .section:not(.page-hero) { padding-block: clamp(78px,10vw,130px) !important; }
.about-company-card { min-height: 100%; padding: clamp(26px,4vw,48px) !important; background: radial-gradient(circle at 86% 13%,rgba(168,85,247,.18),transparent 16rem),#160d2a !important; }
.about-company-card h3, .about-company-card p, .about-company-card strong { color:#fff !important; }
.about-values-grid { display:grid !important; grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap:18px !important; }
.about-value-card { min-height: 260px; padding: 26px !important; }.about-value-number { color:#8b5cf6 !important; }
.about-vision-layout { display:grid !important; grid-template-columns: 1.1fr .9fr !important; gap:22px !important; }.about-vision-card { border-radius:16px !important; }
.about-timeline, .journey-timeline { max-width: 960px; margin-inline:auto; }
.about-cta-section { padding-block: clamp(72px,10vw,130px) !important; }

@media (max-width: 900px) { .contact-info-grid, .about-values-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }.contact-main-layout, .about-vision-layout { grid-template-columns: 1fr !important; } }
@media (max-width: 600px) { .contact-info-grid, .about-values-grid { grid-template-columns: 1fr !important; }.contact-info-card { min-height: auto; }.contact-form-area { padding: 22px !important; } }

/* Premium contact form — keeps the existing company-profile visual language. */
.contact-main {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 8% 12%, rgba(124,58,237,.07), transparent 27%),
        radial-gradient(circle at 92% 82%, rgba(217,70,239,.05), transparent 25%),
        #faf9fc !important;
}

.contact-form-area {
    position: relative;
    overflow: hidden;
    padding: clamp(30px,4vw,48px) !important;
    border-color: rgba(124,58,237,.14) !important;
    border-radius: 22px !important;
    background: rgba(255,255,255,.94) !important;
    box-shadow: 0 28px 70px rgba(45,25,82,.1), inset 0 1px 0 #fff !important;
}

.contact-form-area::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    background: linear-gradient(90deg,#7c3aed,#a855f7 58%,#d946ef);
    content: "";
}

.contact-form-area::after {
    position: absolute;
    top: -150px;
    right: -150px;
    width: 330px;
    height: 330px;
    border-radius: 50%;
    background: radial-gradient(circle,rgba(196,181,253,.18),transparent 68%);
    content: "";
    pointer-events: none;
}

.contact-form-area > * { position: relative; z-index: 1; }
.contact-form-area > .section-kicker { display: inline-flex; margin-bottom: 14px; padding: 7px 11px; border: 1px solid rgba(124,58,237,.13); border-radius: 999px; background: #f6f2ff; }
.contact-form-area > h2 { max-width: 680px; margin: 0 0 15px !important; font-size: clamp(2rem,3.4vw,3.15rem) !important; }
.contact-form-area > p { max-width: 650px; margin: 0 0 34px !important; color: #746a83 !important; font-size: .92rem !important; line-height: 1.7 !important; }

.contact-form { display: grid; gap: 22px; }
.contact-form .form-row { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.contact-form .form-group { position: relative; display: grid; gap: 9px; }
.contact-form .form-group > label { color: #2a1d3d; font-size: .76rem; font-weight: 800; letter-spacing: -.01em; }
.contact-form .form-group > label span { color: #8b5cf6; }

.contact-form input:not([type="checkbox"]),
.contact-form select,
.contact-form textarea {
    width: 100%;
    min-height: 54px;
    padding: 0 16px;
    border: 1px solid #e5dfed;
    border-radius: 12px;
    outline: 0;
    color: #241733;
    background-color: #fcfbfd;
    font: 500 .86rem/1.4 var(--font-body);
    box-shadow: inset 0 1px 2px rgba(39,20,68,.025);
    transition: border-color .22s ease, box-shadow .22s ease, background-color .22s ease, transform .22s ease;
}

.contact-form textarea { min-height: 150px; padding: 15px 16px 35px; resize: vertical; }
.contact-form select { padding-right: 48px; cursor: pointer; appearance: none; background-image: linear-gradient(45deg,transparent 50%,#765d92 50%),linear-gradient(135deg,#765d92 50%,transparent 50%); background-position: calc(100% - 21px) 24px,calc(100% - 16px) 24px; background-repeat: no-repeat; background-size: 5px 5px,5px 5px; }
.contact-form input::placeholder,.contact-form textarea::placeholder { color: #aaa1b6; font-weight: 500; }
.contact-form input:not([type="checkbox"]):hover,.contact-form select:hover,.contact-form textarea:hover { border-color: #cfc3de; background-color: #fff; }
.contact-form input:not([type="checkbox"]):focus,.contact-form select:focus,.contact-form textarea:focus { border-color: #8b5cf6; background-color: #fff; box-shadow: 0 0 0 4px rgba(124,58,237,.1),0 8px 20px rgba(72,38,124,.06); transform: translateY(-1px); }

.form-character-counter { position: absolute; right: 13px; bottom: 10px; color: #9a90a8; font-size: .65rem; font-weight: 700; pointer-events: none; }

.form-consent { display: grid; grid-template-columns: 20px minmax(0,1fr); align-items: start; gap: 12px; padding: 15px 16px; border: 1px solid #ece7f2; border-radius: 12px; color: #716679; background: #faf9fc; font-size: .76rem; line-height: 1.6; cursor: pointer; transition: border-color .2s ease,background-color .2s ease; }
.form-consent:hover { border-color: #d8cbee; background: #f8f5ff; }
.form-consent input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: #7c3aed; cursor: pointer; }

.contact-form .form-submit { display: flex; width: 100%; min-height: 56px; padding: 8px 9px 8px 22px; align-items: center; justify-content: space-between; border: 0; border-radius: 13px; color: #fff; background: linear-gradient(135deg,#6d28d9,#8b5cf6 58%,#a855f7); font-size: .82rem; font-weight: 800; box-shadow: 0 15px 30px rgba(109,40,217,.22); cursor: pointer; transition: transform .22s ease,box-shadow .22s ease,filter .22s ease; }
.contact-form .form-submit > span:last-child { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 10px; background: rgba(255,255,255,.16); font-size: 1.05rem; transition: transform .22s ease,background-color .22s ease; }
.contact-form .form-submit:hover { color: #fff; filter: saturate(1.08); box-shadow: 0 19px 36px rgba(109,40,217,.29); transform: translateY(-2px); }
.contact-form .form-submit:hover > span:last-child { background: rgba(255,255,255,.24); transform: translateX(3px); }
.contact-form .form-submit:focus-visible { outline: 3px solid rgba(124,58,237,.25); outline-offset: 3px; }

.form-note:empty { display: none; }
.form-note:not(:empty) { margin: -5px 0 0; padding: 12px 14px; border-radius: 10px; font-size: .75rem; font-weight: 700; }
.form-note.is-error { color: #a12635; background: #fff1f2; }.form-note.is-success { color: #137a4b; background: #ecfdf5; }

.form-security-note { display: grid; grid-template-columns: 34px minmax(0,1fr); align-items: center; gap: 12px; margin: 0 !important; padding: 14px 15px; border-top: 1px solid #eee9f3; color: #887e94 !important; font-size: .7rem !important; line-height: 1.55 !important; }
.form-security-icon { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; color: #168653; background: #eafaf2; font-size: .76rem; font-weight: 900; }
.form-security-note strong { display: block; margin-bottom: 1px; color: #443550; font-size: .72rem; }

@media (max-width: 700px) {
    .contact-form .form-row { grid-template-columns: 1fr; }
    .contact-form-area { padding: 27px 21px !important; border-radius: 18px !important; }
    .contact-form-area > p { margin-bottom: 27px !important; }
    .contact-form { gap: 19px; }
}

@media (prefers-reduced-motion: reduce) {
    .contact-form input,.contact-form select,.contact-form textarea,.contact-form .form-submit,.contact-form .form-submit > span:last-child { transition: none !important; }
}

/* Homepage entry point for the dedicated H2H integration page. */
.technology-integration-action {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    margin-top: 26px;
    padding: 13px 18px;
    border: 1px solid rgba(124, 58, 237, 0.18);
    border-radius: 10px;
    color: #6d35dc;
    background: rgba(124, 58, 237, 0.055);
    font-size: 0.84rem;
    font-weight: 800;
    text-decoration: none;
    transition: transform 260ms ease, border-color 260ms ease, background 260ms ease;
}

.technology-integration-action:hover {
    transform: translateY(-2px);
    border-color: rgba(124, 58, 237, 0.32);
    background: rgba(124, 58, 237, 0.1);
}

.technology-integration-action span:last-child {
    transition: transform 260ms ease;
}

.technology-integration-action:hover span:last-child {
    transform: translateX(4px);
}

/* Refined contact channel cards. */
.contact-info-grid { align-items: stretch; }
.contact-info-card {
    position: relative;
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    min-height: 278px;
    padding: 30px !important;
    overflow: hidden;
    border: 1px solid rgba(124,58,237,.16) !important;
    border-image: none !important;
    background: linear-gradient(145deg,#fff 0%,#fbfaff 100%) !important;
}
.contact-info-card::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 3px !important;
    background: linear-gradient(90deg,#7c3aed,#d946ef 60%,#f4d35e) !important;
    content: "";
}
.contact-info-card::after {
    position: absolute;
    top: -72px;
    right: -72px;
    width: 158px;
    height: 158px;
    border-radius: 50%;
    background: radial-gradient(circle,rgba(196,181,253,.28),transparent 68%);
    content: "";
    pointer-events: none;
}
.contact-info-icon {
    position: relative;
    z-index: 1;
    display: grid !important;
    width: 52px !important;
    height: 52px !important;
    place-items: center;
    margin-bottom: 20px;
    border: 1px solid rgba(124,58,237,.18);
    border-radius: 14px !important;
    background: linear-gradient(135deg,#efe9ff,#fdf4ff) !important;
    color: #6d28d9 !important;
    font-size: .7rem !important;
    font-weight: 900 !important;
    letter-spacing: .05em;
    box-shadow: 0 8px 20px rgba(91,33,182,.1);
}
.contact-icon-whatsapp { color: #0f9f61 !important; background: linear-gradient(135deg,#dcfce7,#f0fdf4) !important; }
.contact-icon-whatsapp svg { width: 25px; height: 25px; fill: currentColor; }
.contact-info-label { color: #7c3aed !important; font-size: .67rem !important; font-weight: 800 !important; letter-spacing: .12em !important; }
.contact-info-card h3 { margin: 8px 0 10px !important; color: #1b1130 !important; font-size: 1.22rem !important; line-height: 1.18 !important; letter-spacing: -.025em; }
.contact-info-card p { margin: 0 !important; color: #6d647c !important; font-size: .87rem !important; line-height: 1.68 !important; }
.contact-info-link, .contact-info-status { margin-top: auto !important; padding-top: 20px; color: #6d28d9 !important; font-size: .82rem !important; font-weight: 800 !important; }
.contact-info-link { display: inline-flex; align-items: center; gap: 9px; }.contact-info-link span { font-size: 1rem; transition: transform .2s ease; }.contact-info-card:hover .contact-info-link span { transform: translate(3px,-2px); }
.contact-info-status { display: inline-flex; align-items: center; gap: 8px; color: #168653 !important; }.contact-info-status .status-dot { width: 8px; height: 8px; box-shadow: 0 0 0 4px rgba(34,197,94,.12); }
.form-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.cs-availability { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; color: #168653; font-size: .8rem; font-weight: 800; }.cs-availability .status-dot { width: 8px; height: 8px; box-shadow: 0 0 0 4px rgba(34,197,94,.12); }

/* Quick Contact: clear action hierarchy and consistent alignment. */
.contact-side-card { padding: 30px !important; }
.contact-side-card > h3 { margin: 9px 0 10px !important; color: #1b1130 !important; font-size: 1.42rem !important; line-height: 1.18 !important; letter-spacing: -.035em; }
.contact-side-card > p { margin: 0 !important; color: #6d647c !important; font-size: .88rem !important; line-height: 1.65 !important; }
.cs-availability { width: 100%; margin: 20px 0 15px !important; padding: 10px 12px; border: 1px solid rgba(34,197,94,.18); border-radius: 8px; background: #f0fdf4; }
.quick-contact-list { display: grid !important; gap: 10px !important; margin: 0 !important; }
.quick-contact-item { display: grid !important; grid-template-columns: 44px minmax(0,1fr) auto !important; align-items: center !important; gap: 12px !important; min-height: 70px; padding: 12px !important; border: 1px solid #e9e3f5; border-radius: 10px !important; background: #fff; color: #211632 !important; text-decoration: none; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease !important; }
.quick-contact-item:hover { border-color: rgba(124,58,237,.42); box-shadow: 0 12px 24px rgba(69,35,137,.1); transform: translateX(3px); }
.quick-contact-icon { display: grid !important; width: 44px !important; height: 44px !important; place-items: center; border-radius: 10px !important; background: linear-gradient(135deg,#eee8ff,#faf5ff) !important; color: #6d28d9 !important; font-size: .64rem !important; font-weight: 900 !important; letter-spacing: .04em; }
.quick-contact-item:first-child .quick-contact-icon { background: linear-gradient(135deg,#dcfce7,#f0fdf4) !important; color: #0f9f61 !important; }
.quick-contact-item > span:nth-child(2) { display: grid; min-width: 0; gap: 3px; }.quick-contact-item small { color: #8a819b !important; font-size: .62rem !important; font-weight: 800; letter-spacing: .1em; }.quick-contact-item strong { overflow: hidden; color: #27183b !important; font-size: .88rem !important; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }.quick-contact-item > span:last-child { color: #7c3aed; font-size: 1.05rem; font-weight: 800; }
.response-card { display: grid !important; grid-template-columns: 48px minmax(0,1fr) !important; align-items: start !important; gap: 14px !important; padding: 20px !important; border-left: 3px solid #8b5cf6 !important; }.response-card-icon { display: grid; width: 48px; height: 48px; place-items:center; border-radius: 12px; background: #1b1030; color: #fff; font-size: .75rem; font-weight: 900; }.response-card span { color: #7c3aed !important; font-size: .63rem !important; font-weight: 800; letter-spacing: .1em; }.response-card strong { display:block; margin-top: 3px; color: #211432 !important; font-size: 1rem !important; }.response-card p { margin: 5px 0 0 !important; color: #756b86 !important; font-size: .78rem !important; line-height:1.55 !important; }

/* Premium closing CTA */
.contact-cta-section {
    position: relative;
    padding-block: clamp(76px,9vw,118px) !important;
    overflow: hidden;
    background: linear-gradient(180deg,#faf9fc 0%,#f7f4fb 100%) !important;
}

.contact-cta {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    min-height: 410px;
    padding: clamp(40px,6vw,72px);
    align-items: center;
    gap: 54px;
    overflow: hidden;
    border: 1px solid rgba(216,180,254,.22) !important;
    border-radius: 30px !important;
    background:
        linear-gradient(115deg,rgba(255,255,255,.035),transparent 45%),
        linear-gradient(135deg,#140b24 0%,#1c1031 52%,#241240 100%) !important;
    box-shadow: 0 35px 90px rgba(24,10,47,.25),inset 0 1px 0 rgba(255,255,255,.09) !important;
    isolation: isolate;
}

.contact-cta::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .32;
    background-image: linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
    background-size: 46px 46px;
    mask-image: linear-gradient(90deg,transparent,black 55%,black);
    content: "";
}

.contact-cta::after {
    position: absolute;
    right: -80px;
    bottom: -145px;
    z-index: -1;
    width: 430px;
    height: 430px;
    border: 1px solid rgba(216,180,254,.13);
    border-radius: 50%;
    box-shadow: 0 0 0 55px rgba(168,85,247,.035),0 0 0 110px rgba(168,85,247,.025);
    content: "";
}

.contact-cta-orb { position: absolute; z-index: -1; border-radius: 50%; filter: blur(2px); pointer-events: none; }
.contact-cta-orb-one { top: -100px; right: 18%; width: 280px; height: 280px; background: radial-gradient(circle,rgba(168,85,247,.34),transparent 68%); }
.contact-cta-orb-two { bottom: -120px; left: 28%; width: 260px; height: 260px; background: radial-gradient(circle,rgba(217,70,239,.15),transparent 68%); }
.contact-cta-content { position: relative; z-index: 2; max-width: 720px; }

.contact-cta-kicker {
    display: inline-flex !important;
    margin-bottom: 20px !important;
    padding: 8px 12px;
    border: 1px solid rgba(216,180,254,.2);
    border-radius: 999px;
    color: #d8b4fe !important;
    background: rgba(255,255,255,.055);
    font-size: .65rem !important;
    font-weight: 800;
    letter-spacing: .14em;
    backdrop-filter: blur(10px);
}

.contact-cta-content h2 {
    max-width: 710px;
    margin: 0 0 20px !important;
    color: #fff !important;
    font-family: var(--font-heading);
    font-size: var(--type-cta) !important;
    line-height: 1.18 !important;
    letter-spacing: -.035em !important;
}

.contact-cta-content h2 .gradient-text { display: block; margin-top: .15em; font-size: inherit; line-height: inherit; letter-spacing: inherit; text-transform: none; color: transparent !important; background: linear-gradient(90deg,#d8b4fe,#f0abfc 62%,#fde68a); -webkit-background-clip: text; background-clip: text; }
.contact-cta-content > p { max-width: 620px; margin: 0 !important; color: #bcb1ca !important; font-size: clamp(.88rem,1.4vw,1rem) !important; line-height: 1.72 !important; }

.contact-cta-points { display: flex; margin-top: 27px; flex-wrap: wrap; gap: 10px 20px; }
.contact-cta-points span { display: inline-flex; align-items: center; gap: 8px; color: #d7ccdf; font-size: .72rem; font-weight: 700; }
.contact-cta-points i { width: 6px; height: 6px; border-radius: 50%; background: #c084fc; box-shadow: 0 0 0 4px rgba(192,132,252,.11); }

.contact-cta-actions { position: relative; z-index: 2; display: grid; width: min(100%,230px); gap: 12px; }
.contact-cta-actions .button { display: flex; width: 100%; min-height: 56px; padding: 9px 10px 9px 19px; align-items: center; justify-content: space-between; border-radius: 13px !important; font-size: .77rem; font-weight: 800; transition: transform .22s ease,box-shadow .22s ease,border-color .22s ease,background-color .22s ease !important; }
.contact-cta-actions .button span:last-child { display: grid; width: 37px; height: 37px; place-items: center; border-radius: 9px; font-size: .95rem; transition: transform .22s ease; }
.contact-cta-actions .button-primary { border: 1px solid transparent !important; color: #fff !important; background: linear-gradient(135deg,#7c3aed,#a855f7) !important; box-shadow: 0 16px 32px rgba(124,58,237,.3); }
.contact-cta-actions .button-primary span:last-child { background: rgba(255,255,255,.17); }
.contact-cta-actions .button-secondary { border: 1px solid rgba(255,255,255,.16) !important; color: #eee8f6 !important; background: rgba(255,255,255,.055) !important; backdrop-filter: blur(10px); }
.contact-cta-actions .button-secondary span:last-child { background: rgba(255,255,255,.075); }
.contact-cta-actions .button:hover { color: #fff !important; transform: translateY(-3px); }
.contact-cta-actions .button-primary:hover { box-shadow: 0 20px 40px rgba(124,58,237,.4); }
.contact-cta-actions .button-secondary:hover { border-color: rgba(216,180,254,.38) !important; background: rgba(255,255,255,.1) !important; }
.contact-cta-actions .button:hover span:last-child { transform: translate(2px,-1px); }

.contact-cta.visible .contact-cta-orb-one { animation: contactCtaGlow 7s ease-in-out infinite alternate; }
.contact-cta.visible .contact-cta-orb-two { animation: contactCtaGlow 9s ease-in-out 1s infinite alternate-reverse; }

@keyframes contactCtaGlow { from { opacity: .65; transform: translate3d(-8px,3px,0) scale(.96); } to { opacity: 1; transform: translate3d(12px,-9px,0) scale(1.08); } }

@media (max-width: 900px) {
    .contact-cta { grid-template-columns: 1fr; min-height: auto; gap: 38px; }
    .contact-cta-actions { width: 100%; grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 600px) {
    .contact-cta-section { padding-block: 70px !important; }
    .contact-cta { padding: 34px 22px; gap: 32px; border-radius: 22px !important; }
    .contact-cta-content h2 { font-size: var(--type-cta) !important; }
    .contact-cta-points { gap: 10px 16px; }
    .contact-cta-actions { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .contact-cta.visible .contact-cta-orb-one,.contact-cta.visible .contact-cta-orb-two { animation: none; }
}

/* Homepage H2H FAQ */
.home-faq { background: #faf9fc; }
.home-faq-layout { display: grid; grid-template-columns: minmax(280px,.75fr) minmax(0,1.25fr); align-items: start; gap: clamp(36px,6vw,84px); }
.home-faq-intro { position: sticky; top: 110px; }
.home-faq-intro .section-title { margin: 14px 0 16px; color: #1a102c; font-size: var(--type-section); line-height: 1.18; letter-spacing: -.035em; }
.home-faq-intro .section-description { margin-bottom: 26px; color: #746a83; font-size: .9rem; line-height: 1.7; }
.home-faq-list { display: grid; gap: 12px; }
.home-faq-list details { overflow: hidden; border: 1px solid #e8e1f1; border-radius: 14px; background: #fff; box-shadow: 0 12px 28px rgba(49,28,86,.055); transition: border-color .22s ease,box-shadow .22s ease,transform .22s ease; }
.home-faq-list details:hover { border-color: rgba(124,58,237,.3); box-shadow: 0 16px 34px rgba(64,35,113,.085); transform: translateY(-1px); }
.home-faq-list summary { position: relative; padding: 21px 58px 21px 22px; color: #28183d; font-family: var(--font-heading); font-size: .92rem; font-weight: 800; line-height: 1.45; cursor: pointer; list-style: none; }
.home-faq-list summary::-webkit-details-marker { display: none; }
.home-faq-list summary::after { position: absolute; top: 50%; right: 20px; display: grid; width: 28px; height: 28px; place-items: center; border-radius: 8px; color: #7c3aed; background: #f2edff; content: "+"; font-size: 1.05rem; transform: translateY(-50%); transition: transform .22s ease,background-color .22s ease; }
.home-faq-list details[open] summary::after { color: #fff; background: #7c3aed; content: "−"; transform: translateY(-50%) rotate(180deg); }
.home-faq-list details p { margin: 0; padding: 0 22px 22px; color: #746a83; font-size: .82rem; line-height: 1.72; }

@media (max-width: 850px) {
    .home-faq-layout { grid-template-columns: 1fr; }
    .home-faq-intro { position: static; }
}

@media (max-width: 600px) {
    .home-faq-list summary { padding: 18px 52px 18px 18px; }
    .home-faq-list details p { padding: 0 18px 19px; }
}

/* Cross-page contrast correction */
.section-kicker {
    color: #6d28d9 !important;
}

.hero-description strong {
    color: #f1eaff !important;
    font-weight: 800;
}

.hero-visual-scene .visual-card-body > strong {
    color: #ffffff !important;
}

.hero-visual-scene .visual-label,
.hero-visual-scene .visual-data small {
    color: rgba(255,255,255,.66) !important;
}

.hero-visual-scene .visual-data strong {
    color: #eadcff !important;
}

.hero-actions .button-secondary {
    border: 1px solid rgba(255,255,255,.28) !important;
    color: #ffffff !important;
    background: rgba(255,255,255,.1) !important;
    box-shadow: none !important;
    backdrop-filter: blur(10px);
}

.hero-actions .button-secondary:hover {
    border-color: rgba(216,180,254,.55) !important;
    background: rgba(255,255,255,.16) !important;
}

.about-vision .mission-item strong {
    color: #ffffff !important;
}

.about-vision .mission-item > span {
    color: #e9d5ff !important;
    background: rgba(216,180,254,.12) !important;
}

.report-mini-stats small {
    color: #667085 !important;
}

.cta-box .section-kicker,
.page-hero .section-kicker,
.registration-hero .section-kicker,
.report-hero .section-kicker,
.contact-hero .section-kicker,
.about-vision .section-kicker,
.report-security .section-kicker,
.registration-cta-section .section-kicker,
.report-cta-section .section-kicker,
.contact-cta-section .section-kicker,
.about-cta-section .section-kicker {
    color: #d8b4fe !important;
}

/* Homepage ambient section transitions */
main#content > .hero::before {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    height: 150px;
    background: linear-gradient(180deg,transparent 0%,rgba(17,9,31,.28) 55%,#11091f 100%);
    content: "";
    pointer-events: none;
}

main#content > .trust {
    background:
        radial-gradient(circle at 18% 0%,rgba(139,92,246,.16),transparent 31%),
        radial-gradient(circle at 82% 100%,rgba(217,70,239,.09),transparent 28%),
        linear-gradient(180deg,#11091f 0%,#150c25 100%) !important;
    box-shadow: inset 0 1px 0 rgba(216,180,254,.1),0 20px 55px rgba(24,10,45,.12) !important;
}

main#content > .trust::after {
    position: absolute;
    right: 8%;
    bottom: 0;
    left: 8%;
    height: 1px;
    background: linear-gradient(90deg,transparent,rgba(216,180,254,.25),transparent);
    content: "";
    pointer-events: none;
}

main#content > #tentang-preview {
    background:
        linear-gradient(180deg,rgba(109,40,217,.035) 0%,transparent 105px),
        #faf9ff !important;
}

main#content > #produk {
    background:
        radial-gradient(circle at 8% 8%,rgba(139,92,246,.08),transparent 28%),
        radial-gradient(circle at 92% 88%,rgba(217,70,239,.055),transparent 26%),
        linear-gradient(180deg,#f8f5ff 0%,#ffffff 48%,#f6f2ff 100%) !important;
    box-shadow: inset 0 1px 0 rgba(124,58,237,.055),inset 0 -1px 0 rgba(124,58,237,.05);
}

main#content > #produk::after {
    position: absolute;
    right: 10%;
    bottom: 0;
    left: 10%;
    height: 70px;
    background: radial-gradient(ellipse at center bottom,rgba(124,58,237,.06),transparent 70%);
    content: "";
    pointer-events: none;
}

main#content > #teknologi {
    background:
        radial-gradient(circle at 84% 22%,rgba(124,58,237,.11),transparent 28%),
        radial-gradient(circle at 12% 86%,rgba(22,184,212,.07),transparent 25%),
        linear-gradient(135deg,#f3f0fb 0%,#fbfaff 46%,#eff6f7 100%) !important;
    box-shadow: inset 0 1px 0 rgba(124,58,237,.07),inset 0 -1px 0 rgba(22,184,212,.06);
}

@media (max-width: 600px) {
    main#content > .hero::before { height: 100px; }
    main#content > #produk,
    main#content > #teknologi { background-size: auto !important; }
}

/* About page — premium vision and mission composition */
.about-vision-main {
    min-height: 530px !important;
    padding: clamp(34px,4vw,54px) !important;
    border: 1px solid rgba(216,180,254,.28) !important;
    border-radius: 24px !important;
    background:
        radial-gradient(circle at 86% 14%,rgba(192,132,252,.36),transparent 31%),
        radial-gradient(circle at 8% 92%,rgba(34,211,238,.18),transparent 30%),
        linear-gradient(145deg,#30165a 0%,#231141 47%,#12263b 100%) !important;
    box-shadow: 0 32px 74px rgba(5,2,16,.34),inset 0 1px 0 rgba(255,255,255,.12) !important;
}

.about-vision-main::before {
    width: 390px !important;
    height: 390px !important;
    right: -170px !important;
    top: -185px !important;
    background: radial-gradient(circle,rgba(244,211,94,.12),transparent 68%) !important;
}

.about-vision-main::after {
    width: 300px !important;
    height: 300px !important;
    left: -150px !important;
    bottom: -155px !important;
    background: radial-gradient(circle,rgba(34,211,238,.18),transparent 68%) !important;
}

.about-vision-main .section-kicker {
    color: #f0abfc !important;
}

.about-vision-main .section-kicker::before {
    background: linear-gradient(90deg,#c084fc,#f0abfc) !important;
}

.about-vision-main h2 {
    max-width: 590px !important;
    color: #ffffff !important;
    font-size: clamp(2rem,3.4vw,3.15rem) !important;
    line-height: 1.18 !important;
    letter-spacing: -.055em !important;
    text-shadow: 0 12px 32px rgba(5,2,16,.22);
}

.about-vision-main p {
    max-width: 570px !important;
    color: rgba(240,235,248,.76) !important;
    font-size: .83rem !important;
    line-height: 1.82 !important;
}

.about-vision-main .vision-symbol {
    right: 34px !important;
    top: 25px !important;
    color: rgba(255,255,255,.1) !important;
    font-size: 8.5rem !important;
    text-shadow: 0 0 45px rgba(192,132,252,.2);
}

.about-mission {
    padding-top: 14px !important;
}

.about-mission > h2 {
    margin-bottom: 26px !important;
}

.about-mission .mission-list {
    gap: 9px;
    border-top: 0 !important;
}

.about-mission .mission-item {
    grid-template-columns: 48px minmax(0,1fr) !important;
    align-items: center;
    padding: 15px 16px !important;
    border: 1px solid rgba(216,180,254,.12) !important;
    border-radius: 13px;
    background: rgba(255,255,255,.035);
    transition: border-color .24s ease,background-color .24s ease,transform .24s ease,box-shadow .24s ease !important;
}

.about-mission .mission-item:hover {
    padding-left: 16px !important;
    border-color: rgba(192,132,252,.34) !important;
    background: rgba(168,85,247,.09);
    box-shadow: 0 15px 30px rgba(5,2,16,.15);
    transform: translateX(4px);
}

.about-mission .mission-item > span {
    width: 39px !important;
    height: 39px !important;
    border: 1px solid rgba(216,180,254,.16);
    border-radius: 10px !important;
    color: #eadcff !important;
    background: linear-gradient(135deg,rgba(124,58,237,.24),rgba(217,70,239,.12)) !important;
}

.about-mission .mission-item strong {
    margin-bottom: 4px !important;
    color: #ffffff !important;
    font-size: .82rem !important;
}

.about-mission .mission-item p {
    color: rgba(231,224,240,.68) !important;
    font-size: .66rem !important;
}

@media (max-width: 600px) {
    .about-vision-main { min-height: 470px !important; padding: 30px 24px !important; border-radius: 19px !important; }
    .about-vision-main .vision-symbol { right: 20px !important; font-size: 6.5rem !important; }
    .about-mission .mission-item { padding: 14px 13px !important; }
    .about-mission .mission-item:hover { padding-left: 13px !important; transform: none; }
}

/* Homepage hero — original H2H Network Core */
.h2h-network {
    position: relative;
    width: min(620px,100%);
    aspect-ratio: 1;
    margin-inline: auto;
    isolation: isolate;
}

.network-ambient {
    position: absolute;
    inset: 8%;
    z-index: -2;
    border-radius: 50%;
    background: radial-gradient(circle,rgba(139,92,246,.2) 0%,rgba(217,70,239,.07) 38%,transparent 70%);
    filter: blur(8px);
    animation: networkAmbient 5s ease-in-out infinite alternate;
}

.network-orbit {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    border: 1px dashed rgba(216,180,254,.2);
    border-radius: 50%;
    transform: translate(-50%,-50%);
    pointer-events: none;
}

.network-orbit::after {
    position: absolute;
    top: 50%;
    left: -4px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #c084fc;
    box-shadow: 0 0 0 5px rgba(192,132,252,.1),0 0 20px #c084fc;
    content: "";
}

.network-orbit-one { width: 47%; height: 47%; animation: networkOrbit 18s linear infinite; }
.network-orbit-two { width: 68%; height: 68%; border-color: rgba(34,211,238,.15); animation: networkOrbitReverse 26s linear infinite; }
.network-orbit-two::after { top: 12%; left: 82%; background: #22d3ee; box-shadow: 0 0 0 5px rgba(34,211,238,.09),0 0 20px #22d3ee; }
.network-orbit-three { width: 88%; height: 88%; border-style: solid; border-color: rgba(255,255,255,.07); animation: networkOrbit 34s linear infinite; }
.network-orbit-three::after { top: 88%; left: 22%; width: 6px; height: 6px; background: #f4d35e; box-shadow: 0 0 16px #f4d35e; }

.network-core {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 5;
    display: flex;
    width: 190px;
    height: 190px;
    margin: -95px 0 0 -95px;
    padding: 20px;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    border: 1px solid rgba(216,180,254,.3);
    border-radius: 50%;
    color: #fff;
    background: radial-gradient(circle at 35% 28%,rgba(255,255,255,.15),transparent 25%),linear-gradient(145deg,rgba(58,31,100,.96),rgba(15,10,31,.96));
    box-shadow: 0 25px 65px rgba(2,0,10,.45),0 0 0 12px rgba(124,58,237,.06),inset 0 1px 0 rgba(255,255,255,.16);
    backdrop-filter: blur(14px);
    transition: transform .18s ease;
}

.network-core-pulse { position: absolute; inset: -13px; z-index: -1; border: 1px solid rgba(192,132,252,.4); border-radius: 50%; animation: networkCorePulse 2.7s ease-out infinite; }
.network-core-logo { display: grid; width: 66px; height: 66px; margin-bottom: 8px; place-items: center; border-radius: 20px; background: rgba(255,255,255,.08); box-shadow: inset 0 1px 0 rgba(255,255,255,.12); }
.network-core-logo img { width: 50px; height: 50px; object-fit: contain; filter: drop-shadow(0 10px 14px rgba(0,0,0,.25)); }
.network-core > small { color: #cbbce2; font-size: .48rem; font-weight: 800; letter-spacing: .14em; }
.network-core > strong { margin-top: 3px; color: #fff; font-family: var(--font-heading); font-size: .65rem; letter-spacing: .04em; }
.network-core-status { display: inline-flex; margin-top: 9px; padding: 5px 8px; align-items: center; gap: 5px; border: 1px solid rgba(52,211,153,.18); border-radius: 999px; color: #8ff0c5; background: rgba(16,185,129,.08); font-size: .43rem; font-weight: 800; letter-spacing: .08em; }
.network-core-status i { width: 5px; height: 5px; border-radius: 50%; background: #34d399; box-shadow: 0 0 9px #34d399; animation: networkStatus 1.7s ease-in-out infinite; }

.network-node {
    position: absolute;
    z-index: 6;
    display: grid;
    min-width: 132px;
    padding: 10px 12px;
    grid-template-columns: 31px minmax(0,1fr);
    align-items: center;
    gap: 9px;
    border: 1px solid rgba(216,180,254,.2);
    border-radius: 12px;
    color: #fff;
    background: rgba(19,11,37,.78);
    box-shadow: 0 16px 34px rgba(3,1,12,.3),inset 0 1px 0 rgba(255,255,255,.08);
    backdrop-filter: blur(14px);
    transition: border-color .22s ease,background-color .22s ease,box-shadow .22s ease,transform .18s ease;
}

.network-node:hover { border-color: rgba(192,132,252,.5); background: rgba(42,22,75,.9); box-shadow: 0 19px 42px rgba(3,1,12,.4),0 0 25px rgba(124,58,237,.1); }
.network-node > span { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 9px; color: #eadcff; background: linear-gradient(135deg,rgba(124,58,237,.28),rgba(217,70,239,.13)); font-size: .5rem; font-weight: 900; }
.network-node small { display: block; color: #9185a5; font-size: .42rem; font-weight: 800; letter-spacing: .12em; }
.network-node strong { display: block; margin-top: 2px; color: #fff; font-size: .59rem; font-weight: 800; letter-spacing: .015em; white-space: nowrap; }
.node-partner { top: 43%; left: 0; }
.node-api { top: 3%; left: 42%; }
.node-provider { top: 26%; right: 0; }
.node-report { right: 4%; bottom: 10%; }
.node-product { bottom: 8%; left: 4%; min-width: 145px; }

.network-link { position: absolute; top: 50%; left: 50%; z-index: 1; display: block; height: 1px; overflow: visible; background: linear-gradient(90deg,rgba(192,132,252,.5),rgba(192,132,252,.05)); transform-origin: left center; }
.network-link::after { position: absolute; top: -2px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #f0abfc; box-shadow: 0 0 12px #d946ef; content: ""; animation: networkSignal 2.5s linear infinite; }
.link-partner { width: 43%; transform: rotate(180deg); }
.link-api { width: 43%; transform: rotate(-82deg); }.link-api::after { animation-delay: .45s; }
.link-provider { width: 42%; transform: rotate(-32deg); }.link-provider::after { animation-delay: .9s; }
.link-report { width: 42%; transform: rotate(37deg); }.link-report::after { animation-delay: 1.35s; }
.link-product { width: 42%; transform: rotate(143deg); }.link-product::after { animation-delay: 1.8s; }

.network-transaction-status { position: absolute; bottom: 0; left: 50%; z-index: 7; display: grid; min-width: 200px; padding: 10px 14px 10px 38px; border: 1px solid rgba(52,211,153,.16); border-radius: 11px; background: rgba(10,7,21,.82); box-shadow: 0 15px 32px rgba(2,0,10,.28); transform: translateX(-50%); backdrop-filter: blur(12px); }
.network-transaction-status small { color: #34d399; font-size: .43rem; font-weight: 800; letter-spacing: .13em; }
.network-transaction-status strong { margin-top: 2px; color: #eee8f6; font-size: .58rem; }
.transaction-signal { position: absolute; top: 50%; left: 15px; width: 10px; height: 10px; border: 2px solid #34d399; border-radius: 50%; transform: translateY(-50%); }
.transaction-signal::after { position: absolute; inset: -6px; border: 1px solid rgba(52,211,153,.35); border-radius: 50%; content: ""; animation: networkCorePulse 2s ease-out infinite; }

@keyframes networkOrbit { to { transform: translate(-50%,-50%) rotate(360deg); } }
@keyframes networkOrbitReverse { to { transform: translate(-50%,-50%) rotate(-360deg); } }
@keyframes networkSignal { 0% { opacity: 0; transform: translateX(0) scale(.7); } 15% { opacity: 1; } 80% { opacity: 1; } 100% { opacity: 0; transform: translateX(250px) scale(1.15); } }
@keyframes networkCorePulse { 0% { opacity: .65; transform: scale(.82); } 75%,100% { opacity: 0; transform: scale(1.18); } }
@keyframes networkAmbient { from { opacity: .68; transform: scale(.95); } to { opacity: 1; transform: scale(1.06); } }
@keyframes networkStatus { 50% { opacity: .45; box-shadow: 0 0 3px #34d399; } }

@media (max-width: 950px) {
    .h2h-network { width: min(560px,100%); }
}

@media (max-width: 600px) {
    .h2h-network { width: 100%; min-width: 340px; margin-left: 50%; transform: translateX(-50%); }
    .network-core { width: 150px; height: 150px; margin: -75px 0 0 -75px; padding: 15px; }
    .network-core-logo { width: 52px; height: 52px; border-radius: 16px; }.network-core-logo img { width: 41px; height: 41px; }
    .network-node { min-width: 105px; padding: 8px; grid-template-columns: 27px minmax(0,1fr); gap: 7px; }
    .network-node > span { width: 27px; height: 27px; }.network-node strong { font-size: .5rem; }.network-node small { font-size: .36rem; }
    .node-product { min-width: 120px; }
    .network-transaction-status { bottom: -5px; min-width: 180px; }
}

@media (prefers-reduced-motion: reduce) {
    .network-ambient,.network-orbit,.network-core-pulse,.network-link::after,.network-core-status i,.transaction-signal::after { animation: none !important; }
}

/* H2H Network Core v2 — cinematic corporate reactor */
.h2h-network {
    perspective: 1100px;
    transform-style: preserve-3d;
}

.network-ambient {
    inset: 1% !important;
    background:
        radial-gradient(circle at 50% 50%,rgba(139,92,246,.34) 0%,rgba(217,70,239,.12) 29%,transparent 63%),
        radial-gradient(circle at 70% 34%,rgba(34,211,238,.16),transparent 33%) !important;
    filter: blur(4px) !important;
}

.network-orbit {
    border-style: solid !important;
    transform: translate(-50%,-50%) rotateX(68deg) rotateZ(0deg);
    box-shadow: 0 0 24px rgba(124,58,237,.055);
}

.network-orbit-one { width: 53% !important; height: 53% !important; border-color: rgba(240,171,252,.3) !important; animation: networkOrbitCinematic 16s linear infinite !important; }
.network-orbit-two { width: 73% !important; height: 73% !important; border-color: rgba(34,211,238,.23) !important; animation: networkOrbitCinematicReverse 24s linear infinite !important; }
.network-orbit-three { width: 96% !important; height: 96% !important; border-color: rgba(192,132,252,.13) !important; animation: networkOrbitCinematic 34s linear infinite !important; }

.network-core {
    width: 248px !important;
    height: 248px !important;
    margin: -124px 0 0 -124px !important;
    padding: 0 !important;
    border-color: rgba(216,180,254,.38) !important;
    background:
        radial-gradient(circle at 50% 48%,rgba(124,58,237,.26),transparent 44%),
        radial-gradient(circle at 38% 30%,rgba(255,255,255,.13),transparent 22%),
        rgba(10,6,23,.86) !important;
    box-shadow:
        0 34px 90px rgba(2,0,10,.55),
        0 0 70px rgba(124,58,237,.25),
        0 0 0 14px rgba(124,58,237,.055),
        inset 0 1px 0 rgba(255,255,255,.18) !important;
}

.network-core-pulse { inset: -20px !important; border-color: rgba(34,211,238,.42) !important; animation-duration: 3.4s !important; }
.network-core-logo { position: relative; z-index: 5; width: 142px !important; height: 142px !important; margin: 0 !important; border: 1px solid rgba(255,255,255,.11); border-radius: 50% !important; background: radial-gradient(circle,rgba(255,255,255,.13),rgba(124,58,237,.08) 54%,transparent 70%) !important; box-shadow: 0 0 45px rgba(192,132,252,.2),inset 0 1px 0 rgba(255,255,255,.15) !important; animation: reactorLogoFloat 4.8s ease-in-out infinite; }
.network-core-logo img { width: 112px !important; height: 112px !important; filter: drop-shadow(0 18px 25px rgba(0,0,0,.34)) drop-shadow(0 0 13px rgba(192,132,252,.28)) !important; animation: reactorLogoGlow 3.2s ease-in-out infinite alternate; }

.reactor-ring { position: absolute; top: 50%; left: 50%; z-index: 2; border-radius: 50%; pointer-events: none; }
.reactor-ring::before,.reactor-ring::after { position: absolute; border-radius: 50%; content: ""; }
.reactor-ring-a { width: 188px; height: 188px; margin: -94px 0 0 -94px; border: 1px dashed rgba(240,171,252,.43); animation: reactorRingSpin 13s linear infinite; }
.reactor-ring-a::before { top: -4px; left: 50%; width: 8px; height: 8px; background: #f0abfc; box-shadow: 0 0 18px #d946ef; }
.reactor-ring-b { width: 218px; height: 218px; margin: -109px 0 0 -109px; border: 1px solid rgba(34,211,238,.25); animation: reactorRingSpinReverse 19s linear infinite; }
.reactor-ring-b::before { right: 15px; bottom: 26px; width: 7px; height: 7px; background: #22d3ee; box-shadow: 0 0 17px #22d3ee; }
.reactor-ring-c { width: 232px; height: 232px; margin: -116px 0 0 -116px; border: 1px solid rgba(244,211,94,.1); box-shadow: inset 0 0 30px rgba(124,58,237,.06); animation: reactorRingBreath 4s ease-in-out infinite; }

.network-node {
    min-width: 148px !important;
    padding: 12px 14px !important;
    grid-template-columns: 36px minmax(0,1fr) !important;
    border-color: rgba(216,180,254,.27) !important;
    background: linear-gradient(135deg,rgba(31,16,55,.9),rgba(12,8,27,.84)) !important;
}
.network-node > span { width: 36px !important; height: 36px !important; font-size: .55rem !important; }
.network-node small { color: #a99bbd !important; font-size: .46rem !important; }
.network-node strong { font-size: .66rem !important; letter-spacing: .025em !important; }
.node-partner { top: 42% !important; left: -2% !important; }
.node-api { top: 1% !important; left: 40% !important; }
.node-provider { top: 24% !important; right: -3% !important; }
.node-report { right: 0 !important; bottom: 7% !important; }

.network-link { height: 2px !important; background: linear-gradient(90deg,rgba(240,171,252,.65),rgba(34,211,238,.1)) !important; box-shadow: 0 0 9px rgba(192,132,252,.12); }
.network-link::after { width: 7px !important; height: 7px !important; top: -3px !important; background: #ffffff !important; box-shadow: 0 0 8px #fff,0 0 18px #d946ef !important; animation: networkSignalOut 5.6s ease-in-out infinite !important; }
.link-partner::after { animation-name: networkSignalIn !important; animation-delay: 0s !important; }
.link-api::after { animation-delay: 1.1s !important; background: #22d3ee !important; box-shadow: 0 0 8px #fff,0 0 18px #22d3ee !important; }
.link-provider::after { animation-delay: 2.15s !important; }
.link-report::after { animation-delay: 4.15s !important; background: #34d399 !important; box-shadow: 0 0 8px #fff,0 0 18px #34d399 !important; }

.network-product-satellite { position: absolute; top: 50%; left: 50%; z-index: 8; display: inline-flex; padding: 8px 12px; align-items: center; gap: 7px; border: 1px solid rgba(244,211,94,.2); border-radius: 999px; color: #f6edc4; background: rgba(20,13,35,.88); box-shadow: 0 12px 26px rgba(2,0,10,.28),0 0 18px rgba(244,211,94,.07); animation: productSatelliteOrbit 18s linear infinite; pointer-events: none; }
.network-product-satellite span { width: 7px; height: 7px; border-radius: 50%; background: #f4d35e; box-shadow: 0 0 12px #f4d35e; }
.network-product-satellite strong { font-size: .5rem; font-weight: 800; letter-spacing: .08em; white-space: nowrap; }

.network-particles { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.network-particles i { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: #c084fc; box-shadow: 0 0 10px #c084fc; opacity: 0; animation: particleToCore 4.8s ease-in infinite; }
.network-particles i:nth-child(1) { top: 14%; left: 12%; --tx: 220px; --ty: 190px; }
.network-particles i:nth-child(2) { top: 24%; right: 8%; --tx: -230px; --ty: 140px; animation-delay: .8s; background:#22d3ee; }
.network-particles i:nth-child(3) { bottom: 12%; left: 18%; --tx: 190px; --ty: -175px; animation-delay: 1.6s; background:#f0abfc; }
.network-particles i:nth-child(4) { right: 14%; bottom: 18%; --tx: -195px; --ty: -150px; animation-delay: 2.4s; background:#34d399; }
.network-particles i:nth-child(5) { top: 4%; left: 62%; --tx: -65px; --ty: 255px; animation-delay: 3.2s; background:#f4d35e; }
.network-particles i:nth-child(6) { bottom: 3%; left: 45%; --tx: 30px; --ty: -240px; animation-delay: 4s; background:#22d3ee; }

.network-stage { position: absolute; top: 73%; left: 50%; z-index: 9; width: 118px; height: 27px; margin-left: -59px; overflow: hidden; border: 1px solid rgba(216,180,254,.16); border-radius: 999px; background: rgba(10,6,21,.82); box-shadow: 0 10px 22px rgba(2,0,10,.3); backdrop-filter: blur(10px); }
.network-stage span { position: absolute; inset: 0; display: grid; place-items: center; opacity: 0; font-size: .45rem; font-weight: 900; letter-spacing: .12em; }
.stage-request { color: #e9d5ff; animation: stageRequest 6s linear infinite; }
.stage-processing { color: #67e8f9; animation: stageProcessing 6s linear infinite; }
.stage-success { color: #6ee7b7; animation: stageSuccess 6s linear infinite; }

@keyframes networkOrbitCinematic { to { transform: translate(-50%,-50%) rotateX(68deg) rotateZ(360deg); } }
@keyframes networkOrbitCinematicReverse { to { transform: translate(-50%,-50%) rotateX(68deg) rotateZ(-360deg); } }
@keyframes reactorRingSpin { to { transform: rotate(360deg); } }
@keyframes reactorRingSpinReverse { to { transform: rotate(-360deg); } }
@keyframes reactorRingBreath { 50% { opacity: .55; transform: scale(1.045); } }
@keyframes reactorLogoFloat { 50% { transform: translateY(-5px) scale(1.025); } }
@keyframes reactorLogoGlow { to { filter: drop-shadow(0 20px 28px rgba(0,0,0,.34)) drop-shadow(0 0 24px rgba(192,132,252,.5)); } }
@keyframes networkSignalIn { 0%,4% { opacity:0; transform:translateX(250px) scale(.7); } 12%,30% { opacity:1; } 42%,100% { opacity:0; transform:translateX(0) scale(1.2); } }
@keyframes networkSignalOut { 0%,20% { opacity:0; transform:translateX(0) scale(.7); } 29%,47% { opacity:1; } 58%,100% { opacity:0; transform:translateX(250px) scale(1.15); } }
@keyframes productSatelliteOrbit { from { transform: translate(-50%,-50%) rotate(0deg) translateX(230px) rotate(0deg); } to { transform: translate(-50%,-50%) rotate(360deg) translateX(230px) rotate(-360deg); } }
@keyframes particleToCore { 0% { opacity:0; transform:translate(0,0) scale(.5); } 18% { opacity:.9; } 78% { opacity:.7; } 100% { opacity:0; transform:translate(var(--tx),var(--ty)) scale(.15); } }
@keyframes stageRequest { 0%,28% { opacity:1; } 33%,100% { opacity:0; } }
@keyframes stageProcessing { 0%,31% { opacity:0; } 36%,62% { opacity:1; } 67%,100% { opacity:0; } }
@keyframes stageSuccess { 0%,65% { opacity:0; } 70%,95% { opacity:1; } 100% { opacity:0; } }

@media (max-width: 600px) {
    .network-core { width: 185px !important; height: 185px !important; margin: -92.5px 0 0 -92.5px !important; }
    .network-core-logo { width: 105px !important; height: 105px !important; }.network-core-logo img { width: 84px !important; height: 84px !important; }
    .reactor-ring-a { width: 138px; height: 138px; margin: -69px 0 0 -69px; }.reactor-ring-b { width: 164px; height: 164px; margin: -82px 0 0 -82px; }.reactor-ring-c { width: 176px; height: 176px; margin: -88px 0 0 -88px; }
    .network-node { min-width: 112px !important; padding: 8px 9px !important; grid-template-columns: 28px minmax(0,1fr) !important; }
    .network-node > span { width: 28px !important; height: 28px !important; }.network-node strong { font-size: .51rem !important; }.network-node small { font-size: .36rem !important; }
    .network-product-satellite { padding: 6px 9px; }.network-product-satellite strong { font-size: .4rem; }
    .network-stage { top: 76%; }
}

@media (prefers-reduced-motion: reduce) {
    .reactor-ring,.network-core-logo,.network-core-logo img,.network-product-satellite,.network-particles i,.network-stage span { animation: none !important; }
    .network-stage .stage-request { opacity: 1; }
}

/* Homepage performance — pause cinematic layers outside the viewport. */
.hero:not(.is-motion-active) .hero-orb,
.hero:not(.is-motion-active) .network-ambient,
.hero:not(.is-motion-active) .network-orbit,
.hero:not(.is-motion-active) .network-core-pulse,
.hero:not(.is-motion-active) .network-core-logo,
.hero:not(.is-motion-active) .network-core-logo img,
.hero:not(.is-motion-active) .reactor-ring,
.hero:not(.is-motion-active) .network-link::after,
.hero:not(.is-motion-active) .network-product-satellite,
.hero:not(.is-motion-active) .network-particles i,
.hero:not(.is-motion-active) .network-stage span,
#cta:not(.is-motion-active) .cta-orbit-ring,
.motion-paused .hero-orb,
.motion-paused .network-ambient,
.motion-paused .network-orbit,
.motion-paused .network-core-pulse,
.motion-paused .network-core-logo,
.motion-paused .network-core-logo img,
.motion-paused .reactor-ring,
.motion-paused .network-link::after,
.motion-paused .network-product-satellite,
.motion-paused .network-particles i,
.motion-paused .network-stage span,
.motion-paused .cta-orbit-ring {
    animation-play-state: paused !important;
}

/* Homepage reveal — softer and slightly staggered between heading and content. */
.home-reveal {
    transform: translate3d(0, 20px, 0);
    transition-duration: 850ms;
    transition-timing-function: cubic-bezier(.22, 1, .36, 1);
}

.home-reveal-secondary {
    transition-delay: 90ms;
}

.home-reveal.visible {
    transform: translate3d(0, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
    .home-reveal,
    .home-reveal-secondary {
        transition-delay: 0ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* Verified company facts — five-column trust strip. */
.trust-grid {
    grid-template-columns: repeat(5,minmax(0,1fr)) !important;
}

.trust .stat-card {
    min-width: 0;
    padding: 12px 20px;
}

.trust .stat-card-pse .stat-value {
    font-size: clamp(.82rem,1.08vw,1.08rem);
    line-height: 1.22;
    letter-spacing: -.015em;
    overflow-wrap: anywhere;
}

.trust .stat-card-support .stat-value {
    color: #f4d35e !important;
}

.stat-support-links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
}

.stat-support-links a {
    color: #d8b4fe;
    font-weight: 750;
    text-decoration: none;
    transition: color .2s ease;
}

.stat-support-links a:hover {
    color: #fff;
}

@media (max-width: 1100px) {
    .trust-grid {
        grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    }

    .trust .stat-card {
        border-right: 1px solid var(--border-color);
        border-bottom: 1px solid var(--border-color);
    }

    .trust .stat-card:nth-child(3) {
        border-right: 0;
    }

    .trust .stat-card:nth-child(4),
    .trust .stat-card:nth-child(5) {
        border-bottom: 0;
    }
}

@media (max-width: 700px) {
    .trust-grid {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .trust .stat-card:nth-child(3) {
        border-right: 1px solid var(--border-color);
    }

    .trust .stat-card:nth-child(even) {
        border-right: 0;
    }

    .trust .stat-card:nth-child(4) {
        border-bottom: 1px solid var(--border-color);
    }

    .trust .stat-card:last-child {
        grid-column: 1 / -1;
        align-items: center;
        border-right: 0;
        text-align: center;
    }
}

@media (max-width: 430px) {
    .trust-grid {
        grid-template-columns: 1fr !important;
    }

    .trust .stat-card,
    .trust .stat-card:nth-child(3),
    .trust .stat-card:nth-child(4) {
        align-items: flex-start;
        grid-column: auto;
        border-right: 0;
        border-bottom: 1px solid var(--border-color);
        text-align: left;
    }

    .trust .stat-card:last-child {
        align-items: flex-start;
        grid-column: auto;
        border-bottom: 0;
        text-align: left;
    }
}

@media (prefers-reduced-motion: reduce) {
    .stat-support-links a {
        transition: none;
    }
}

/* Official company email and balanced five-card contact layout. */
.footer-company-email {
    display: table;
    margin-top: 13px;
    color: #b9abc9;
    font-size: .72rem;
    font-weight: 650;
    transition: color .2s ease;
}

.footer-company-email:hover {
    color: #fff;
}

.contact-info-operation {
    grid-column: 1 / -1;
}

@media (max-width: 600px) {
    .contact-info-operation {
        grid-column: auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    .footer-company-email {
        transition: none;
    }
}

/* About legality — verified essentials with a more premium hierarchy. */
.about-legality {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 18%,rgba(124,58,237,.07),transparent 23rem),
        linear-gradient(180deg,#fff 0%,#fbf9ff 100%) !important;
}

.about-legality .section-header {
    max-width: 760px;
}

.about-legality .legal-grid {
    max-width: 1120px;
    gap: 18px;
}

.about-legality .legal-card {
    min-height: 178px;
    padding: 25px 24px !important;
    align-items: start;
    grid-template-columns: 52px minmax(0,1fr) auto;
    gap: 18px;
    overflow: hidden;
    border-top: 1px solid #e9e3f5 !important;
    background:
        radial-gradient(circle at 100% 0%,rgba(124,58,237,.06),transparent 12rem),
        rgba(255,255,255,.92) !important;
}

.about-legality .legal-card::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 3px;
    background: linear-gradient(180deg,#7c3aed,#d946ef 58%,#22d3ee);
    content: "";
}

.about-legality .legal-icon {
    width: 48px;
    height: 48px;
    border: 1px solid rgba(124,58,237,.12);
    border-radius: 13px;
    background: linear-gradient(135deg,#ede9fe,#fae8ff);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}

.about-legality .legal-type {
    margin-bottom: 7px;
    color: #7c3aed;
    font-size: .51rem;
}

.about-legality .legal-card h3 {
    margin-bottom: 7px;
    color: #211333;
    font-family: var(--font-heading);
    font-size: .91rem;
    line-height: 1.35;
}

.about-legality .legal-card p {
    color: #716679;
    font-size: .65rem;
    line-height: 1.65;
}

.about-legality .legal-status {
    border-color: rgba(52,211,153,.18);
    color: #11845e;
    background: rgba(52,211,153,.08);
    white-space: nowrap;
}

.legal-card-link {
    display: inline-flex;
    margin-top: 13px;
    align-items: center;
    gap: 8px;
    color: #6d28d9;
    font-size: .63rem;
    font-weight: 800;
    text-decoration: none;
}

.legal-card-link span {
    transition: transform .2s ease;
}

.legal-card-link:hover span {
    transform: translate(2px,-2px);
}

@media (max-width: 600px) {
    .about-legality .legal-card {
        min-height: auto;
        padding: 21px 19px !important;
        grid-template-columns: 44px minmax(0,1fr);
        gap: 14px;
    }

    .about-legality .legal-icon {
        width: 42px;
        height: 42px;
    }

    .about-legality .legal-status {
        grid-column: 2;
        justify-self: start;
        margin-top: 2px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .legal-card-link span {
        transition: none;
    }
}

/* Concise legality layout: three facts, followed by one full-width address. */
.about-legality .legal-grid {
    grid-template-columns: repeat(3,minmax(0,1fr));
}

.about-legality .legal-card-company {
    order: 1;
}

.about-legality .legal-card-pse {
    order: 2;
}

.about-legality .legal-card-year {
    order: 3;
}

.about-legality .legal-card-address {
    order: 4;
    grid-column: 1 / -1;
}

.about-legality .legal-card:not(.legal-card-address) {
    min-height: 138px;
    align-items: center;
}

.about-legality .legal-card-address p {
    max-width: 760px;
}

@media (max-width: 900px) {
    .about-legality .legal-grid {
        grid-template-columns: 1fr;
    }

    .about-legality .legal-card-address {
        grid-column: auto;
    }
}

/* Price CTA system — consistent across navigation, hero, catalogue and footer. */
.nav-links a.nav-price-cta {
    min-height: 40px;
    margin-left: 8px;
    padding: 0 14px;
    gap: 7px;
    border: 1px solid rgba(124,58,237,.2);
    border-radius: 8px;
    color: #5b21b6;
    background: linear-gradient(135deg,#fbf9ff,#f4efff);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}

.nav-links a.nav-price-cta span {
    color: #a855f7;
    font-size: .82rem;
    transition: transform .2s ease;
}

.nav-links a.nav-price-cta:hover {
    border-color: rgba(124,58,237,.42);
    color: #4c1d95;
    background: #eee7ff;
    transform: translateY(-1px);
}

.nav-links a.nav-price-cta:hover span {
    transform: translate(2px,-2px);
}

.button.button-price,
.hero-actions .button-price {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    border: 1px solid rgba(255,255,255,.45) !important;
    color: #28163c !important;
    background: linear-gradient(135deg,#fff1a8,#f4d35e) !important;
    box-shadow: 0 14px 30px rgba(244,211,94,.17) !important;
}

.button.button-price:hover,
.hero-actions .button-price:hover {
    box-shadow: 0 18px 36px rgba(244,211,94,.26) !important;
    transform: translateY(-2px) !important;
}

.button-price span,
.page-price-cta span {
    transition: transform .2s ease;
}

.button-price:hover span,
.page-price-cta:hover span {
    transform: translate(2px,-2px);
}

.page-price-cta {
    display: inline-flex;
    min-height: 45px;
    margin-top: 21px;
    padding: 0 17px;
    align-items: center;
    gap: 9px;
    border: 1px solid rgba(124,58,237,.18);
    border-radius: 9px;
    color: #5b21b6;
    background: linear-gradient(135deg,#fff,#f4efff);
    box-shadow: 0 12px 28px rgba(76,29,149,.08);
    font-size: .76rem;
    font-weight: 800;
    transition: transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}

.page-price-cta:hover {
    border-color: rgba(124,58,237,.4);
    box-shadow: 0 16px 34px rgba(76,29,149,.13);
    transform: translateY(-2px);
}

.catalog-price-cta {
    display: flex;
    margin-top: 30px;
    padding: 22px 24px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    overflow: hidden;
    border: 1px solid rgba(216,180,254,.2);
    border-radius: 16px;
    background:
        radial-gradient(circle at 82% 20%,rgba(217,70,239,.18),transparent 15rem),
        linear-gradient(135deg,#170d2b,#281345 58%,#171029);
    box-shadow: 0 20px 45px rgba(49,28,86,.13);
}

.catalog-price-cta > div {
    display: grid;
    gap: 6px;
}

.catalog-price-cta > div > span {
    color: #d8b4fe;
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .14em;
}

.catalog-price-cta strong {
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(.95rem,1.5vw,1.2rem);
}

.footer-price-cta {
    display: inline-flex;
    min-height: 42px;
    margin-top: 18px;
    padding: 0 8px 0 14px;
    align-items: center;
    gap: 12px;
    border: 1px solid rgba(216,180,254,.2);
    border-radius: 9px;
    color: #eee7f8 !important;
    background: rgba(255,255,255,.055);
    font-size: .72rem;
    font-weight: 800;
    transition: border-color .22s ease,background-color .22s ease,transform .22s ease;
}

.footer-price-cta span:last-child {
    display: grid;
    width: 27px;
    height: 27px;
    place-items: center;
    border-radius: 7px;
    color: #f4d35e;
    background: rgba(244,211,94,.08);
}

.footer-price-cta:hover {
    border-color: rgba(216,180,254,.42);
    color: #fff !important;
    background: rgba(255,255,255,.09);
    transform: translateY(-2px) !important;
}

@media (max-width: 900px) {
    .nav-links a.nav-price-cta {
        justify-content: center;
        margin: 4px 0 0;
    }
}

@media (max-width: 640px) {
    .catalog-price-cta {
        padding: 20px;
        align-items: stretch;
        flex-direction: column;
    }

    .catalog-price-cta .button {
        width: 100%;
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .nav-price-cta,
    .nav-price-cta span,
    .button-price,
    .button-price span,
    .page-price-cta,
    .page-price-cta span,
    .footer-price-cta {
        transition: none !important;
    }
}
/* =========================================================
   HOME — PROVIDER SHOWCASE
   ========================================================= */

.provider-showcase {
    position: relative;
    isolation: isolate;
    margin: 38px 0 32px;
    padding: 26px;
    overflow: hidden;
    border: 1px solid rgba(107, 73, 255, 0.13);
    border-radius: 24px;
    background:
        radial-gradient(circle at 7% 0%, rgba(127, 69, 255, 0.1), transparent 34%),
        radial-gradient(circle at 96% 100%, rgba(0, 191, 166, 0.08), transparent 30%),
        linear-gradient(135deg, #ffffff 0%, #fbfaff 52%, #f7f5ff 100%);
    box-shadow: 0 22px 60px rgba(38, 24, 80, 0.08);
}

.provider-showcase::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: -90px;
    right: 14%;
    width: 210px;
    height: 210px;
    border-radius: 50%;
    background: rgba(125, 62, 255, 0.09);
    filter: blur(44px);
    opacity: 0.78;
    animation: provider-ambient-glow 10s ease-in-out infinite alternate;
}

.provider-showcase::after {
    position: absolute;
    z-index: -1;
    right: -9%;
    bottom: -110px;
    width: 330px;
    height: 220px;
    border-radius: 50%;
    background: rgba(26, 194, 164, 0.075);
    filter: blur(52px);
    content: "";
    pointer-events: none;
}

.provider-showcase-copy {
    display: grid;
    grid-template-columns: minmax(240px, 0.9fr) minmax(320px, 1.1fr);
    align-items: end;
    gap: 16px 36px;
    margin-bottom: 22px;
}

.provider-showcase-kicker {
    grid-column: 1 / -1;
    color: #7540ee;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.16em;
}

.provider-showcase h3 {
    margin: 0;
    color: #1d1633;
    font-size: clamp(1.45rem, 2.2vw, 2.05rem);
    line-height: 1.08;
    letter-spacing: -0.035em;
}

.provider-showcase-copy p {
    margin: 0;
    color: #6b657b;
    font-size: 0.96rem;
    line-height: 1.7;
}

.provider-logo-viewport {
    position: relative;
    overflow: hidden;
    padding: 8px 0 4px;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

.provider-logo-viewport::before {
    position: absolute;
    top: 0;
    right: 5%;
    left: 5%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(117, 64, 238, 0.24), rgba(26, 194, 164, 0.2), transparent);
    content: "";
}

.provider-logo-track {
    display: flex;
    width: max-content;
    will-change: transform;
    animation: provider-logo-flow 34s linear infinite;
}

.provider-logo-viewport:hover .provider-logo-track {
    animation-play-state: paused;
}

.provider-logo-group {
    display: flex;
    flex: none;
    gap: 12px;
    padding-right: 12px;
}

.provider-logo-card {
    --provider-accent: #7540ee;
    position: relative;
    display: grid;
    grid-template-rows: 1fr auto;
    flex: none;
    width: 172px;
    height: 106px;
    place-items: center;
    gap: 8px;
    padding: 20px 16px 13px;
    overflow: hidden;
    border: 1px solid rgba(38, 24, 80, 0.09);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 10px 26px rgba(38, 24, 80, 0.055);
    opacity: 0.76;
    transition:
        transform 320ms cubic-bezier(0.22, 1, 0.36, 1),
        border-color 320ms ease,
        box-shadow 320ms ease,
        opacity 320ms ease;
}

.provider-logo-card::before {
    position: absolute;
    top: 0;
    right: 18px;
    left: 18px;
    height: 2px;
    border-radius: 0 0 4px 4px;
    background: linear-gradient(90deg, transparent, var(--provider-accent), transparent);
    opacity: 0.52;
    content: "";
}

.provider-logo-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        115deg,
        transparent 18%,
        rgba(255, 255, 255, 0.78) 46%,
        transparent 72%
    );
    transform: translateX(-130%);
    transition: transform 720ms ease;
    pointer-events: none;
}

.provider-logo-card:hover {
    transform: translateY(-5px);
    border-color: rgba(117, 64, 238, 0.24);
    box-shadow: 0 18px 36px rgba(58, 33, 122, 0.12);
    opacity: 1;
}

.provider-logo-card:hover::after {
    transform: translateX(130%);
}

.provider-logo-card img {
    display: block;
    width: auto;
    max-width: 72%;
    height: 36px;
    object-fit: contain;
    filter: saturate(0.78);
    transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.provider-logo-card:hover img {
    transform: scale(1.045);
    filter: saturate(1);
}

.provider-logo-card > span {
    color: #716a81;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.provider-logo-telkomsel { --provider-accent: #ff0025; }
.provider-logo-byu { --provider-accent: #61d9ff; background: linear-gradient(145deg, #071843, #102b66); border-color: rgba(75, 173, 255, 0.28); }
.provider-logo-byu > span { color: rgba(255, 255, 255, 0.72); }
.provider-logo-byu img { height: 44px; filter: none; }
.provider-logo-im3 { --provider-accent: #ed1c24; }
.provider-logo-tri { --provider-accent: #14a0e5; }
.provider-logo-xl { --provider-accent: #703382; }
.provider-logo-axis { --provider-accent: #7b2d91; }
.provider-logo-smartfren { --provider-accent: #ec167f; }

.provider-logo-im3 img {
    height: 42px;
}

.provider-logo-axis img,
.provider-logo-tri img {
    height: 43px;
}

.provider-logo-smartfren img {
    max-width: 78%;
    height: 34px;
}

.provider-showcase-note {
    margin: 17px 2px 0;
    color: #8a8496;
    font-size: 0.72rem;
    line-height: 1.55;
}

@keyframes provider-ambient-glow {
    from {
        transform: translate3d(-8px, -4px, 0) scale(0.94);
        opacity: 0.6;
    }
    to {
        transform: translate3d(14px, 10px, 0) scale(1.08);
        opacity: 1;
    }
}

@keyframes provider-logo-flow {
    to {
        transform: translate3d(-50%, 0, 0);
    }
}

/* Motion hierarchy: logo menjadi fokus, lapisan pendukung bergerak lebih tenang. */
.network-orbit-three,
.reactor-ring-c,
.network-core-logo,
.network-core-logo img {
    animation: none !important;
}

.network-orbit-one {
    animation-duration: 24s !important;
}

.network-orbit-two {
    animation-duration: 34s !important;
}

.reactor-ring-a {
    animation-duration: 19s;
}

.reactor-ring-b {
    animation-duration: 27s;
}

.network-particles i:nth-child(n + 5) {
    display: none;
}

@media (max-width: 720px) {
    .provider-showcase {
        margin-top: 30px;
        padding: 22px;
        border-radius: 20px;
    }

    .provider-showcase-copy {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .provider-showcase-kicker {
        grid-column: auto;
    }

    .provider-logo-viewport {
        padding-top: 12px;
        -webkit-mask-image: none;
        mask-image: none;
    }

    .provider-logo-track {
        display: block;
        width: 100%;
        animation: none;
    }

    .provider-logo-group:first-child {
        display: grid;
        width: 100%;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        padding: 0;
    }

    .provider-logo-group[aria-hidden="true"] {
        display: none;
    }

    .provider-logo-card {
        width: auto;
    }
}

@media (max-width: 480px) {
    .provider-showcase {
        padding: 18px;
    }

    .provider-logo-card {
        height: 94px;
        padding: 17px 12px 11px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .provider-showcase::before {
        animation: none;
    }

    .provider-logo-card,
    .provider-logo-card img,
    .provider-logo-card::after {
        transition: none;
    }

    .provider-logo-track {
        display: block;
        width: 100%;
        animation: none;
    }

    .provider-logo-group:first-child {
        display: grid;
        width: 100%;
        grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
        gap: 10px;
        padding: 0;
    }

    .provider-logo-group[aria-hidden="true"] {
        display: none;
    }

    .provider-logo-card {
        width: auto;
    }
}