﻿
        :root {
            --border: #e5e9f2;
            --ink: #0f172a;
            --muted: #6b7280;
            --surface: #ffffff;
            --pill: #f2f5fb;
            --primary: #0f172a;
            --accent: #dfe9ff;
        }
        .fs_12{
            font-size:12px;
        }
        .fs_16{
            font-size:16px;
        }
        * {
            box-sizing: border-box;
        }
        body {
            margin: 0;
            padding: 0;
            font-family: 'Inter', 'Open Sans', system-ui, -apple-system, sans-serif;
        }
        /* Hero area */
        .hero {
            position: relative;
            padding: 68px 18px 0px;
            background: radial-gradient(120% 120% at 15% 20%, #f0f4ff 0%, #f6f8fc 34%, #f7f8fb 48%, #f6f8fc 100%);
            overflow: hidden;
            background-image:url(../images/corporate_signup_bg.jpg);
            background-size:cover;
            background-position:center;
            background-repeat:no-repeat;
        }
        .hero::before {
            position: absolute;
            inset: -20% -10% auto;
            height: 120%;
            background: repeating-radial-gradient(circle at 50% 10%, rgba(69, 110, 255, 0.08), rgba(69, 110, 255, 0.08) 1px, transparent 1px, transparent 32px);
            opacity: 0.7;
        }
        .hero::after {
            position: absolute;
            inset: 0;
            background: radial-gradient(160% 120% at 80% 10%, rgba(54, 91, 255, 0.08), transparent 45%);
            mix-blend-mode: screen;
        }
        .hero-inner {
            position: relative;
            max-width: 1014px;
            margin: 0 auto;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 24px;
            z-index: 1;
            padding-bottom: 30px;
        }
        .hero-card {
           background: transparent linear-gradient(180deg, #F5F5F5 0%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
            border-radius: 26px;
            padding: 75px 100px 55px;
            width: 100%;
            text-align: center;
            box-shadow: 0px 3px 5px #BEBEBE99;
            border: 3px solid #FFFFFF;
        }
        .hero-pill {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 3px 14px;
            background: #DBEAFE;
            color: #4F39F6;
            font-weight: 600;
            font-size: 12px;
            border-radius: 999px;
            border: .5px solid #C0DCFF;

            letter-spacing: 0.03em;
            margin-bottom: 25px;
        }
        .hero-title {
            margin: 0 0 38px 0;
            font-size: 45px;
            line-height: 1.3;
            font-weight: 900;
            color: #000;
            font-family:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        }
        .hero-highlight {
            color: #3F51F6;
        }
        .hero-subtitle {
            margin: 0 auto 34px auto;
            max-width: 780px;
            font-size: 16px;
            color: #000000;
            line-height: 1.6;
        }
        .hero-actions {
            display: flex;
            justify-content: center;
            gap: 16px;
            flex-wrap: wrap;
            margin-bottom: 20px;
       }
       .hero-btn {
            border: none;
            border-radius: 999px;
            padding: 13px 20px;
            font-size: 14px;
            font-weight: 700;
            display: inline-flex;
            align-items: center;
            gap: 10px;
            cursor: pointer;
            box-shadow: 0 12px 24px rgba(15, 23, 42, 0.16);
            transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
        }
        .hero-btn.primary {
            background: #0f172a;
            color: #ffffff;
            padding: 13px 38px;
            font-weight: 400;
            font-size: 16px;
            box-shadow: 0px 6px 6px #00000042;
        }
        .hero-btn.primary::after {
            font-size: 18px;
            line-height: 1;
        }
        .hero-btn.secondary {
            background: #ffffff;
            color: #000000;
            border: 1px solid #e5e9f2;
            box-shadow: 0px 6px 6px #00000042;
            font-weight: 400;
            font-size: 16px;
        }
        .hero-btn:hover {
            transform: translateY(-1px);
            box-shadow: 0 14px 26px rgba(15, 23, 42, 0.2);
        }
        .hero-meta {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            flex-wrap: wrap;
            gap: 12px;
            color: #4b5563;
            font-size: 14px;
            padding: 0 8px;
            position: relative;
        }
        .meta-secure {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 10px 12px;
            border-radius: 12px;
            text-align: center;
            margin: auto;
            font-size: 16px;
            color: #707070;
            margin-bottom: 40px;
        }
        .meta-secure svg {
            width: 23px;
            height: 23px;
            color: #3054ff;
            flex-shrink: 0;
        }
        .socials {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-left: auto;
            position: absolute;
            right: 0px;
            margin-bottom: 40px;
            margin-right: 60px;
        }
        .socials a {
            font-size: 30px;
            width: 40px;
            height: 40px;
            border-radius: 12px;
            border: 1px solid #e5e9f2;
            background: #ffffff;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #0f172a;
            font-weight: 700;
            text-decoration: none;
            box-shadow: 0 10px 18px rgba(15, 23, 42, 0.1);
            transition: transform 0.16s ease, box-shadow 0.16s ease, color 0.16s ease;
        }
        .socials a:hover {
            transform: translateY(-1px);
            box-shadow: 0 14px 26px rgba(15, 23, 42, 0.16);
            color: #3054ff;
        }
        /* Why training section */
        .why-section {
            background: #ffffff;
            padding: 132px 0px 130px;
        }
        .why-inner {
            margin: 0 auto;
            text-align: center;
            display: flex;
            flex-direction: column;
            gap: 40px;
            padding: 0 16px;
            width:90%;
        }
        .why-header h2 {
            margin: 0;
            font-weight: bold;
            font-size: 32px;
            color: #0f172a;
        }
        .why-header p {
            margin: 10px auto 0 auto;
            color: #707070;
            font-size: 16px;
            width:100%;
        }
        .why-grid {
            display:flex;
            justify-content: center;
            gap: 44px;
        }
        .why-title {
            display: flex;
            align-items: center;
            gap: 10px;
            font-size: 20px;
            font-weight: 600;
            color: #0f172a;
            padding: 2px 6px;
            margin-bottom: 25px;
        }
        .why-card {
            background: #f8fafc;
            border: 3px solid #FFFFFF;
            border-radius: 20px;
            padding: 40px 27px;
            text-align: left;
            box-shadow: 0px 3px 3px #BEBEBE99;
            height: 100%;
            display: flex;
            flex-direction: column;
            width: 485px;
        }
        .why-item:nth-child(1) .why-card {
            background: #FAFAFA;
        }
        .why-item:nth-child(2) .why-card {
            background: #F6FAFF;
        }
        .why-card ul {
            margin: 14px 0 0;
            padding-left: 31px;
            display: flex;
            flex-direction: column;
            gap: 20px;
            color: #000000;
            font-size: 16px;
            line-height: 1.5;
            flex: 1 1 auto;
        }
        /* Case studies section */
        .cases-section {
            background: #fff;
            padding: 130px 0;
        }
       .cases-inner {
            margin: 0 auto;
            text-align: center;
            display: flex;
            flex-direction: column;
            gap: 22px;
            width: 85%;
        }
        .cases-header h2 {
            margin: 0;
            font-size: 32px;
            font-weight: bold;
            color: #000000;
            margin-bottom: 10px;
        }
        .cases-header p {
            margin: 0px 0 23px;
            color: #707070;
            font-size: 18px;
            width:60%;
            margin:auto;
        }
        .cases-pills {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            justify-content: center;
            margin: 10px 0 25px;
        }
        .cases-pill {
            padding: 9px 16px;
            border-radius: 999px;
            border: 1px solid #e5e7eb;
            background: #fff;
            color: #0f172a;
            font-size: 14px;
            cursor: pointer;
        }
        .cases-pill.active {
            background: #4F39F6;
            color: #fff;
            border-color: transparent;
            font-weight: 400;
        }
        .cases-grid {
            display: flex;
            gap: 16px;
            justify-content: center;
        }
       .case-card {
            background: #ffffff;
            border: 1px solid #e5e7eb;
            border-radius: 16px;
            text-align: left;
            width: 100%;
            display:flex;
        }
        .case-card h3 {
            margin: 0 0 6px 0;
            font-size: 24px;
            font-weight: 600;
            color: #000000;
        }
        .case-badge {
            display: inline-block;
            padding: 6px 12px 6px 0px;
            border-radius: 10px;
            background: #FAFAFA;
            font-weight: 600;
            font-size: 16px;
            margin-bottom: 12px;
            color: oklch(51.1% 0.262 276.966);
        }
        .case-copy {
            margin: 0 0 24px 0;
            color: #3B3B3B;
            font-size: 16px;
            line-height: 1.5;
        }
        .case-list {
            margin: 0 0;
            padding-left: 18px;
            color: #3B3B3B;
            font-size: 16px;
            line-height: 30px;
        }
        .case-outcome {
            margin: 0;
            font-weight: bold;
            color: #0f172a;
            font-size: 14px;
        }
        /* Logos + CTA section */
        .logos-cta-section {
            background: #ffffff;
        }
        .logos-strip {
            padding: 130px 0;
            text-align: center;
            background-color: #FAFAFA;
        }
        .logos-strip h3 {
            margin: 0 0 55px 0;
            font-size: 32px;
            font-weight: bold;
            color: #000000;
        }
        .logos-row {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
            gap: 12px;
            align-items: center;
            justify-items: center;
            overflow: hidden;
        }
        .cta-banner {
            position: relative;
            overflow: hidden;
            padding: 130px 0px ;
            background-image:url(../images/corporate_signup_footer_bg.jpg);
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
        }
        .cta-banner::after {
            position: absolute;
            inset: 0;
            background: url("data:image/svg+xml,%3Csvg width='400' height='400' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 200 Q200 100 400 200 T800 200' stroke='%23e5e9f2' stroke-width='1' fill='none'/%3E%3C/svg%3E");
            opacity: 0.35;
            pointer-events: none;
        }
        .cta-inner {
            position: relative;
            z-index: 1;
            max-width: 880px;
            margin: 0 auto;
            text-align: center;
            display: flex;
            flex-direction: column;
            gap: 12px;
            color: #0f172a;
        }
        .cta-inner h2 {
            color:#000000;
            margin: 0;
            font-size:32px;
            font-weight:  bold;
        }
        .cta-inner p {
            margin: 0;
            color: #707070;
            font-size: 18px;
        }
        .cta-button,.cta-button:hover {
            margin: 20px auto 0;
            padding: 10px 24px;
            border-radius: 999px;
            border: none;
            background: #155DFC;
            color: #ffffff;
            font-weight: 600;
            font-size: 18px;
            cursor: pointer;
        }
        @media (max-width: 992px) {
            .btn-minus, .btn-plus{
                height:0% !important;
            }
            .hero-highlight {
                white-space: wrap !important;
            }
            .why-grid{
               flex-direction: column;
            }
            .why-card{
                width: 100%;
            }
            .hero-card{
                width: auto;
            }
            .hero-title{
                font-size: 29px;
            }
            .hero-subtitle{
                font-size:12px;
            }
            .hero {
                padding: 0px;
            }
            .socials{
                position: static;
                margin: auto;
            }
            .why-header h2,.think-heading,.model-header ,.design-titlem,.action-header h2,.cases-header h2,.logos-strip h3,.cta-inner h2{
                font-size: 22px !important;
            }
            .why-section,.why-inner,.action-list{
                padding-left: 0 !important;
                padding-right: 0 !important;
            }
            .model-grid{
                flex-direction: column;
                gap: 50px !important;
            }
            .row-actions{
                flex-direction: unset !important;
                flex-wrap: nowrap !important;
                gap: 15px !important;
            }
            .qty-input{
                grid-row: unset !important;
            }
            .course-panel{
                padding-right: 0px !important;
                border-right: none !important;
            }
            .packs-grid{
                flex-direction: column;
                margin: auto;
            }
            .action-list::before,.action-item::before{
             display: none;
            }
            .action-cta{
             margin-bottom: 0px !important;
            }
            .cases-grid{
                flex-direction: column;
            }
            .cases-inner{
                padding: 0 0 !important;
            }
            .meta-secure{
                align-items:normal;
                gap:0px;
                font-size:14px;
            }
        }
        .hero-highlight {
            white-space: nowrap;
        }
        /* Think section */
        .think-section {
            background: #ffffff;
            padding: 70px 0px 130px;
            text-align: center;
        }
        .think-section.just_think{
            padding: 130px 0px 100px;
        }
        .think-pill {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 3px 14px;
            background: #ffffff;
            border-radius: 999px;
            font-weight: bold;
            font-size: 16px;
            box-shadow: 0 10px 18px rgba(15, 23, 42, 0.08);
            border: 1px solid #e5e9f2;
        }
        .think-heading {
            margin: 20px 0 28px;
            font-size: 28px;
            font-weight: 400;
            line-height: 50px;
            color: #3b3b3b;
        }
        /* Learning model section */
        .model-section {
            position: relative;
            padding: 130px 0px;
            overflow: hidden;
            border-bottom:1px solid #E7E4E4;
        }
.linear_border {
    background: transparent linear-gradient(90deg, #FFFFFF 0%, #BDBDBD 52%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
    opacity: 1;
    height:2px;
}
/*        .model-section::after {
            content: "";
            position: absolute;
            width: 1430px;
            height: 1200px;
            border-radius: 50%;
            border: 1px solid #d9dee8;
            left: 50%;
            top: 320px;
            transform: translateX(-50%);
            pointer-events: none;
            opacity: 0.8;
        }*/
        .model-inner {
            margin: 0 auto;
            position: relative;
            z-index: 1;
            text-align: center;
            display: flex;
            flex-direction: column;
        }
        .model-header h2 {
            margin-bottom: 60px;
            font-size: 32px;
            font-weight: bold;
            color: #000000;
        }
        .counting_cf .model-header {
            text-align: center;
            margin-bottom: 40px;
        }
        .model-header p {
            margin: 0px 0 50px;
            color: #707070;
            font-size: 18px;
        }
        .model-grid {
            display: flex;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            justify-content: center;
            gap: 30px;
            width: 100%;
            margin: auto;
        }
        .model-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 10px;
            padding: 8px 10px;
            width:80%;
        }
       .model-step {
            width: 58px;
            height: 58px;
            border-radius: 50%;
            background: #4F39F6;
            color: #ffffff;
            font-weight: bold;
            font-size: 20px;
            display: grid;
            place-items: center;
            margin-bottom: 30px;
        }
        .model-title {
            margin-bottom: 0px;
            font-size: 18px;
            font-weight: 600;
            color: #4f39f6;
            line-height:27px;
            letter-spacing: 0.02em;
        }
        .model-copy {
            margin: 0;
            color: #3B3B3B;
            font-size: 16px;
            line-height: 1.5;
            font-weight: 400;
            font-style:italic;
/*            max-width: 240px;*/
        }
        /* Design intro section */
        .design-section {
            background: #ffffff;
            padding: 130px 0px 30px;
            text-align: center;
        }
        .design-inner {
            max-width: 735px;
            margin: 0 auto;
            display: flex;
            flex-direction: column;
            gap: 25px;
        }
        .design-title {
            margin: 0;
            font-size:32px;
            font-weight: bold;
            color: #000000;
        }
        .design-lead {
            margin: 0;
            font-size: 18px;
            color: #000000;
            line-height: 1.6;
        }
        .design-sub {
            margin: 0;
            font-size: 16px;
            color: #707070;
            line-height: 1.5;
        }
        /* Action steps section */
        .action-section {
            background: #ffffff;
            padding: 130px 0 130px;
        }
        .action-inner {
            margin: 0 auto;
            text-align: center;
            display: flex;
            flex-direction: column;
            gap: 36px;
            position: relative;
        }
        .action-header h2 {
            margin: 0;
            font-size:32px;
            font-weight: bold;
            color: #000000;
        }
        .action-header p {
            margin: 10px 0 0;
            color: #707070;
            font-size: 18px;
        }
       .action-list {
            list-style: none;
            padding: 0 0 0 40px;
            margin: 14px auto 0;
            display: flex;
            flex-direction: column;
            gap: 24px;
            position: relative;
            align-items: stretch;
            width: 100%;
            max-width: 900px;
        }
        .action-list::before {
            content: "";
            position: absolute;
            left: -20px;
            top: 0;
            bottom: 0;
            width: 1px;
            background: #e5e7eb;
        }
        .action-item {
            background: #ffffff;
            border: 1px solid #e5e7eb;
            border-radius: 14px;
            padding: 20px 20px;
            display: grid;
            grid-template-columns: auto 1fr auto;
            gap: 18px;
            align-items: center;
            position: relative;
            overflow: visible;
        }
        .action-item::before {
            content: "";
            position: absolute;
            left: -60px;
            top: 50%;
            width: 30px;
            height: 1px;
            background: #e5e7eb;
            transform: translateY(-50%);
        }
        .action-icon {
            width: 38px;
            height: 38px;
            border-radius: 50%;
            border: 1px solid #d7dce3;
            display: grid;
            place-items: center;
            color: #0f172a;
            background: #ffffff;
            position: relative;
            z-index: 1;
            font-size: 20px;
        }
            .action-icon i{
                font-size:14px;
            }
            .action-copy {
                text-align: left;
            }
        .action-copy h4 {
            margin: 0 0 2px 0;
            font-size: 16px;
            font-weight: 600;
            color: #0f172a;
        }
        .action-copy p {
            margin: 0;
            color: #4b5563;
            font-size: 14px;
        }
        .action-cta {
            padding: 8px 14px;
            border-radius: 25px;
            border: 0.5px solid #155DFC;
            background: #ffffff;
            color: #155DFC;
            font-weight: 600;
            font-size: 14px;
            cursor: pointer;
        }
        @media (max-width: 720px) {
           .action-list::before {
                left: 32px;
            }
            .action-item {
                grid-template-columns: auto 1fr;
                grid-template-rows: auto auto;
                row-gap: 6px;
                overflow: visible;
            }
            .action-item::before {
                left: -32px;
                width: 32px;
            }
            .action-cta {
                justify-self: start;
                width: 70%;
                margin: auto;
                padding:11px 12px;
                font-size:16px;
            }
            .cases-inner {
                gap: 18px;
                padding: 0 12px;
            }
            .cases-pills {
                gap: 8px;
            }
            .cases-grid {
                grid-template-columns: 1fr;
            }
            .case-card {
                width:fit-content;
            }
            .logos-strip {
                padding: 28px 0 130px;
            }
            .logos-row {
                grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
                gap: 10px;
            }
        }
        /* Pack levels section */
        .packs-section {
            background-image:url(../images/corporate_signup_pack_level.jpg);
            color: #ffffff;
            padding: 90px 0px 90px;
            position: relative;
            overflow: hidden;
            margin-top: 130px;
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            background-color: #1e307c;
        }
        .packs-section::after {
            position: absolute;
            inset: 0;
            background: radial-gradient(80% 70% at 90% 90%, rgba(255, 255, 255, 0.06), transparent);
            pointer-events: none;
        }
        .packs-inner {
            position: relative;
            z-index: 1;
            margin: 0 auto;
            text-align: center;
            display: flex;
            flex-direction: column;
            gap: 50px;
        }
        .packs-header h2 {
            margin: 0;
            color: #FFFFFF;
            font-size:32px;
            font-weight:bold;
        }
        .packs-header p {
            margin: 8px 0 0;
            color: #92B3DB;
        }
        .packs-grid {
            display: flex;
            gap: 50px;
            justify-content: space-between ;
        }
        .pack-card {
            background: #F9F9F9;
            color: #0f172a;
            border-radius: 18px;
            padding: 30px 27px 40px;
            box-shadow: 0 16px 36px rgba(0, 0, 0, 0.14);
            display: flex;
            flex-direction: column;
/*            align-items: center;
            gap: 10px;*/
            position: relative;
            overflow: hidden;
            min-height: 200px;
            width: 300px;
            text-align:left;
        }
        .pack-badge {
            padding: 0px 12px 6px 0px;
            border-radius: 999px;
            font-size: 26px;
            font-weight: bold;
            color: #000;
            margin-right:auto;
        }       
        .pack-price {
            margin: 0;
            font-size:16px;
        }
        .pack-sub {
            margin: 0;
            color: #6b7280;
            margin-top:24px;
            margin-bottom: 15px;
            font-weight:600;
        }
        .pack-cta {
            margin-top: auto;
            padding: 10px 30px;
            border-radius: 25px;
            border: 1px solid #d1d5db;
            background: #F7F7F7;
            font-size: 16px;
            color: #000000;
            cursor: pointer;
            box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
        }
        .pack-card:nth-child(3) .pack-cta {
            background: linear-gradient(135deg, #2563eb, #1d4ed8);
            color: #ffffff;
            border-color: transparent;
        }
        .pack-card:nth-child(4)::after {
            position: absolute;
            top: 12px;
            right: 14px;
            color: #f59e0b;
            font-size: 18px;
        }
        .custom_plan_subhead{
            color:#009966;
            margin-bottom:40px;
        }
        @media (max-width: 768px) {
            .doc-prepared{
                flex-direction:column;
            }
            .choose_custom_plan {
                border: 1px solid #007CDC;
                border-radius: 23px;
                font-size: 20px;
                padding: 7px 15px;
                text-decoration: none;
                margin-top: 8px;
                display: inline-flex;
                width: 100%;
                justify-content: center;
                background-color: #fff;
                box-shadow: 0px 3px 3px #00000029;
            }
            .meta-secure svg {
                margin-right: 5px;
            }
            .meta-secure {
                display: unset;
            }
            .cta-inner p {
                font-size: 13px;
            }
            .case_card_point2 {
                border-radius: 0px 0px 15px 15px;
            }
            .case-list li {
                font-size: 13px;
                margin-bottom: 12px;
            }
            .case-copy {
                font-size: 13px;
                margin-bottom: 0px;
            }
            .case-card h3 {
                font-size: 20px;
                font-weight: bold;
            }
            .case-badge{
                font-weight:400;
                background-color:transparent;
            }
            .cases-pills {
                margin: 15px 0 25px;
            }
            .cases-header .capability_tools {
                margin-top: 23px !important;
                font-size: 13px !important;
            }
            .cta-primary, .cta-secondary {
                border-radius: 5px !important;
            }
            .course-info h4 {
                font-size: 18px !important;
            }
            .course-info p, .row-subtotal .money {
                font-size: 16px !important;
            }
            .price_patch {
                padding: 12px 20px !important;
            }
            .plan-card .price {
                font-size: 28px !important;
            }
            .plan-card h2 {
                font-size: 26px !important;
                font-weight: 600 !important;
                margin-bottom: 3px !important;
            }
            .plan-subtitle{
                margin-bottom:20px;
            }
            .plan-card {
                padding: 40px 24px !important;
            }
            .step-plans .header p, .capability_mix {
                font-size: 11px !important;
            }
            .step-plans .header p {
                margin-top: 12px !important;
            }
            .just_think .think-heading {
                font-size: 26px !important;
            }
            .model-title {
                font-size: 20px;
            }
            .corporate_fails_reason {
                font-size: 16px !important;
                font-weight: 600;
            }
            .why-inner{
                width:100% !important;
            }
            .cases-pill {
                white-space: nowrap;
            }
            .cases-pills{
                flex-wrap:nowrap;
                overflow-x:scroll;
                width:100%;
                justify-content:flex-start;
            }
            .row-subtotal {
                font-size: 14px !important;
            }
            .custom_plan_subhead {
                margin-bottom: 0px;
                font-size:13px;
            }
            .custom_plan_head {
                font-size: 22px !important;
                font-weight:bold;
            }
            .plan-card .badge {
                left: 24% !important;
                padding: 7px 35px !important;
            }
            .btn.btn-primary.btn-full {
                height: 46px;
            }
            .plan-card .features {
                margin-top: 30px !important;
            }
            .model-header h2, .step-plans .header h1 {
                font-size: 22px !important;
            }
            .plan-card .sub{
                font-size:13px !important;
            }
            .mob_fs14 {
                font-size: 14px;
            }
            .features li {
                font-size: 15px;
                color: #3B3B3B;
                margin-bottom:10px;
            }
            .bold_num {
                font-size: 40px !important;
            }
            .corporate_learning_div {
                margin-top: 20px !important;
                margin-bottom: 0px !important;
            }
            .corporate_learning_conslusion{
                font-size:14px;
            }
            .cases-header p, .cases-inner {
                width: 100%;
            }
            .case_card_point1,
            .case_card_point2 {
                width: 100% !important;
            }
            .case-card{
                flex-direction:column;
            }
            .why-section, .model-section, .think-section.just_think, .cases-section, .logos-strip, .cta-banner {
                padding: 100px 0px 100px;
            }
            .corporate_learning_main, .counting_cf {
                padding-top: 100px !important;
            }
            .counting_cf {
                padding-bottom: 100px !important;
            }
            .corporate_fails_reason {
                flex-direction: column;
            }
            .corporate_fail_cont{
                text-align:left;
            }
            .corporate_fail_cont1, .corporate_fail_cont3 {
                width: 100% !important;
                margin-bottom:45px;
                display:flex;
                margin-left:0px !important;
            }
            .corporate_fail_cont{
                display:flex;
            }
            .hero-card {
                padding: 24px 22px;
                margin-top: 20px;
            }
            .hero-meta {
                justify-content: center;
                text-align: center;
                flex-direction:column-reverse;
            }
            .why-header p{
                font-size:11px !important;
            }
            .why-header h2{
                text-align:center;
            }
            .corporate_learning_contents :nth-child(1){
                margin-bottom:15px;
            }
            .corporate_learning_contents :nth-child(2){
                margin-bottom:10px;
            }
            .corporate_learning_box_main{
                flex-direction:column;
                gap:30px !important;
            }
            .model-item{
                width:100%;
            }
            .left_quote {
                margin-top: 5px !important;
            }
            .right_quote {
                margin-top: 30px !important;
            }
            .plan-grid{
                gap:40px !important;
            }
            .hero .container {
                padding: 0px;
            }
        }
        .pricing-shell {
            margin: 0 auto;
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 20px;
            box-shadow: 0px 0px 5px #BEBEBE99;
            padding: 38px 35px;
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 24px;
/*            width:1014px;*/
        }
        .course-panel {
            display: flex;
            flex-direction: column;
            gap: 12px;
            padding-right: 20px;
            border-right: 1px solid var(--border);
        }
        .panel-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            padding: 4px 4px 8px 4px;
        }
        .panel-header h2 {
            margin: 0;
            font-size: 20px;
            font-weight: 600;
        }
        .header-labels {
            display: flex;
            align-items: center;
            gap: 18px;
            color: var(--muted);
            font-size: 13px;
        }
        .label-subtotal {
            min-width: 70px;
            text-align: right;
        }
        .course-list {
            display: flex;
            flex-direction: column;
            gap: 12px;
            padding-right: 4px;
        }
        .course-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            background: #FFFFFF;
            border: 1px solid var(--border);
            border-radius: 14px;
            padding: 14px 16px;
            gap: 12px;
        }
        .course-info h4 {
            margin: 0 0 4px 0;
            font-size: 16px;
            font-weight: 400;
        }

       .course-info p {
            margin: 0;
            color: var(--muted);
            font-size: 13px;
        }
        .row-actions {
            display: flex;
            align-items: center;
            gap: 18px;
            flex-shrink: 0;
        }
        .qty-selector {
            display: flex;
            align-items: center;
        }
        .qty-pill {
            display: grid;
            grid-template-columns: 1fr 26px;
            grid-template-rows: 22px 22px;
            align-items: stretch;
            background: #ffffff;
            border: 1px solid #dbe3ef;
            border-radius: 8px;
            padding: 0;
            width: 80px;
            height: 40px;
        }
        .qty-input {
            width: 50px;
            text-align: center;
            border: none;
            background: transparent;
            font-size: 16px;
            color: var(--ink);
            grid-column: 1;
            grid-row: 1 / 3;
            justify-self: center;
            align-self: center;
            appearance: textfield;
            outline:none;
        }
        .qty-input::-webkit-inner-spin-button,
        .qty-input::-webkit-outer-spin-button {
            -webkit-appearance: none;
            margin: 0;
        }
        .btn-minus,
        .btn-plus {
            width: 26px;
            height: 70%;
            border-radius: 0;
            border: none;
            background: #ffffff;
            color: #6b7280;
            font-size: 0;
            line-height: 1;
            cursor: pointer;
            transition: all 0.15s ease;
            display: flex;
            align-items: center;
            justify-content: center;
            opacity: 0;
            pointer-events: none;
        }
        .btn-minus:hover,
        .btn-plus:hover {
            background: #f5f7fa;
        }
        .btn-plus {
            grid-column: 2;
            grid-row: 1;
            border-top-right-radius: 6px;
        }
        .btn-minus {
            grid-column: 2;
            grid-row: 2;
            border-bottom-right-radius: 6px;
        }
        .btn-plus::before {
            content: "▲";
            font-size: 11px;
        }
        .btn-minus::before {
            content: "▼";
            font-size: 11px;
        }
        .qty-selector:hover .btn-plus,
        .qty-selector:hover .btn-minus {
            opacity: 1;
            pointer-events: auto;
        }
        .row-subtotal {
            color: var(--muted);
            font-size: 13px;
            text-align: right;
            min-width: 86px;
        }
        .row-subtotal .money {
            display: block;
            color: var(--ink);
            font-size: 15px;
        }
        .summary-panel {
            border-radius: 10px;
            display: flex;
            flex-direction: column;
            gap: 14px;
            height: fit-content;
            background-color: #FFFFFF;
            padding: 15px;
            position:sticky;
            top:60px;
        }
        .info-banner {
         /* background: #e5edff;*/
            color: oklch(50.8% 0.118 165.612);
            border-radius: 12px;
            padding: 12px 0px 12px 0px;
            font-weight: 600;
            font-size: 12px;
         /* border-color: oklch(88.2% 0.059 254.128) !important;
            border: 1px solid;*/
        }
        .eligibility-card {
            background: #FAFAFA;
            border:1px solid #F2F2F2;
            border-radius: 12px;
            padding: 14px;
            box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05);
        }
        .eligibility-card .badge {
            text-transform: uppercase;
            font-size: 12px;
            letter-spacing: 0.04em;
            color: #9B0909;
            margin-bottom: 6px;
            padding-left: 0px;
            font-weight: 400;
        }
        .pack-name {
            margin: 0 0 6px 0;
            font-size: 18px;
            font-weight: 700;
        }
        .pack-copy {
            margin: 0;
            color: var(--muted);
            font-size: 14px;
            line-height: 1.5;
        }
        .summary-list {
            list-style: none;
            padding: 10px 0 2px 0;
            margin: 6px 0 2px 0;
            border-top: 1px solid var(--border);
        }
        .summary-list li {
            display: flex;
            justify-content: space-between;
            font-size: 14px;
            padding: 4px 0;
            color: #707070;
        }
        .summary-list strong {
            color: var(--ink);
            font-size: 14px;
        }
        .savings {
            color: oklch(48.8% 0.243 264.376);
            font-size: 12px;
            font-weight: 600;
        }
        .support-note {
            color: var(--muted);
            font-size: 13px;
            margin: 0;
        }
        .cta-primary {
            width: 100%;
            padding: 12px;
            border-radius: 5px;
            border: none;
            background: #155DFC;
            color: #fff;
            font-weight: 600;
            cursor: pointer;
            font-size: 16px;
            box-shadow: 0px 3px 6px #00000029;
        }       
        .cta-secondary,.cta-secondary:hover {
            width: 100%;
            padding: 11px;
            border-radius: 5px;
            border: 1px solid var(--border);
            background: #FFFFFF;
            color: #9B0909;
            font-weight: 600;
            cursor: pointer;
            font-size: 16px;
            box-shadow: 0px 3px 6px #00000029;
        }
        @media (max-width: 960px) {
            .pricing-shell {
                grid-template-columns: 1fr;
                width:100%;
            }
            .header-labels {
                display: none;
            }
            .course-row {
                align-items: flex-start;
            }
            .row-actions {
                flex-wrap: wrap;
                justify-content: flex-end;
                width: 100%;
            }
                 .course-row{
                flex-direction: column !important;
            }
        }
        @media (max-width: 720px) {
            .page-wrap {
                padding:12px;
            }
            .pricing-shell {
                padding: 20px 18px;
                border-radius: 16px;
            }
            .course-list {
                max-height: none;
            }
            .course-row {
                flex-direction: column;
                align-items: flex-start;
                gap: 10px;
            }
            .row-actions {
                width: 100%;
                justify-content: space-between;
            }
            .qty-pill {
                width: 100%;
                max-width: 240px;
                padding: 8px 12px;
            }
            .row-subtotal {
                text-align: right;
                width: 100%;
            }
        }
        @media (max-width: 540px) {
            .pricing-shell {
                padding: 16px 14px;
                border-radius: 12px;
                box-shadow: none;
            }
            .course-row {
                padding: 12px 12px;
            }
           .qty-pill {
                max-width: 100%;
            }
            .row-actions {
                flex-direction: column;
                align-items: flex-start;
                gap: 6px;
            }
            .cta-primary,
            .cta-secondary {
                border-radius: 20px;
            }
        }
/*        .marquee {
            animation: marquee_nw 180s linear infinite;
            display: inline-flex;
            gap: 6px;
            padding: 10px 0px;
        }
        @keyframes marquee_nw {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-90%);
    }
}*/
.marquee-wrapper {
    overflow: hidden;
    white-space: nowrap;
}

.marquee {
    display: inline-flex;
    gap: 6px;
    animation: marquee 100s linear infinite;
}

@keyframes marquee {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

.fa-brands.fa-x-twitter{
    font-size:24px;
    font-weight:700;
}
.fa-solid.fa-video {
    color: #3f51f6;
}
.saved_seats_worth {
    display: flex !important;
    font-size: 14px !important;
    color: oklch(50.8% 0.118 165.612) !important;
    font-weight: 600;
}
.blue_text {
    color: #4F39F6;
    font-weight:bold;
}
.just_think_bottom_text {
    color: #707070;
    margin:0px 20px;
}
.just_think_line {
    height: 1px;
    width: 30px;
    background-color: #707070;
}
.just_think_div{
    display:flex;
    align-items:center;
    justify-content:center;
}
.left_quote {
    display: inline-block;
    transform: scaleX(-1);
    margin-top: 0px;
    margin-left: -50px;
}
.right_quote {
    margin-left: 10px;
    margin-top: 5px;
}
.right_quote, .left_quote {
    font-size: 75px;
    font-family: monospace;
    font-family: -apple-system, "Astoria", monospace;
    position: absolute;
}
.features {
    width: fit-content;
    padding: 3px 10px;
    border-radius: 50px;
}
.key_features {
    gap: 10px;
    display: flex;
    flex-wrap:wrap;
}
.away_to_pack {
    font-weight: 400;
    color: #6b7280;
}
.check_icon i{
    color: green;
    height: 24px;
    width: 24px;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size:14px;
}
.check_icon {
    display: inline-flex;
    margin-right: 15px;
}
.corporate_fails_reason {
    display: flex;
    font-size:18px;
}
.corporate_fail_cont1, .corporate_fail_cont3{
    width:57%;
    text-align:left;
    margin-left:100px;
}
.corporate_learning .fs_16{
    font-size:16px;
    text-align:center;
}
.corporate_learning_contents p{
    margin-bottom: 0px;
}
.corporate_learning_contents :nth-child(1) {
   font-size:20px;
   font-weight:bold;
}
.corporate_learning_contents :nth-child(2) {
    color: #000000;
    font-weight: 600;
}
.corporate_learning_contents :nth-child(3) {
    font-style: italic;
    font-size: 15px;
    color: #707070;
}
.corporate_learning_div{
    margin-top:66px;
    display:flex;
    gap:27px;
}
.corporate_learning_div img{
    height: max-content;
    margin-top: 10px;
}
.corporate_learning_contents{
    margin-bottom:39px;
}
.corporate_learning_contents .head1{
    color:#1EABDA;
}
.corporate_learning_contents .head2{
    color:#3CC583;
}
.corporate_learning_contents .head3{
    color:#92BD39;
}
.corporate_learning_contents .head4{
    color:#E0CB15;
}
.corporate_learning_conslusion {
    box-shadow: 0px 3px 2px #00000029;
    border-radius: 31px;
    padding:10px 22px;
}
.corporate_learning_conslusion{
    margin-bottom:50px;
}
.corporate_learning_box_main{
    display:flex;
    gap:20px;
}
.corporate_learning_box {
    box-shadow: 0px 3px 5px #BEBEBE99;
    border: 3px solid #FFFFFF;
    border-radius: 10px;
    padding: 10px 50px;
    width: 280px;
    text-align:center;
}
.bold_num{
    font-size:50px;
    font-weight:600;
    margin-bottom:0px;
    text-align:center
}
.corporate_learning_main {
    background-color: #FAFAFA !important;
    padding-top:130px;
}


/*claude style*/
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#ffffff;--bg-muted:#f5f6f8;--bg-dark:#0c1222;--bg-dark-card:#161d33;--border:#dde0e6;--border-light:#eceef2;--text:#222;--text-muted:#5e6278;--text-dim:#8f94a8;--text-light:#c5c9d6;--accent:#2e6ee1;--accent-hover:#2459c0;--accent-light:rgba(46,110,225,.07);--green:#10b981;--green-bg:#ecfdf5;--green-border:#a7f3d0;--blue:#2e6ee1;--blue-bg:#eef4ff;--blue-border:#bdd3f9;--amber:#e5a100;--amber-bg:#fef9eb;--amber-border:#fde68a;--radius:10px;--radius-sm:6px}
body{font-family:'Poppins',system-ui,sans-serif;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;line-height:1.6}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 22px;border-radius:var(--radius-sm);font-size:14px;font-weight:600;cursor:pointer;border:none;transition:all .2s;font-family:inherit}
.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-primary:disabled{background:#c5c9d6;cursor:not-allowed}
.btn-outline{background:#fff;color:var(--text);border:1px solid var(--border)}.btn-outline:hover{background:var(--bg-muted)}
.btn-green{background:var(--green);color:#fff}.btn-green:hover{background:#059669}.btn-green:disabled{background:#c5c9d6;cursor:not-allowed}
.btn-full{width:100%}.btn-lg{padding:13px 28px;font-size:15px;border-radius:var(--radius)}

/* INPUTS */
.input,.select{width:100%;padding:10px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:14px;font-family:inherit;outline:none;transition:border .15s;background:#fff;color:var(--text)}
.input:focus,.select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}
.input::placeholder{color:var(--text-dim)}.input.error{border-color:#ef4444}
.field-group{margin-bottom:20px}.field-label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.field-hint{font-size:12px;color:var(--text-muted);margin-top:4px}

/* RADIO CARDS */
.radio-group{display:flex;flex-direction:column;gap:10px}
.radio-card{border:1.5px solid var(--border);border-radius:var(--radius-sm);padding:14px 16px;cursor:pointer;transition:all .15s;display:flex;align-items:flex-start;gap:12px}
.radio-card:hover{border-color:#ccc}.radio-card.selected{border-color:var(--accent);background:var(--accent-light)}
.radio-card.disabled{opacity:.45;cursor:not-allowed;pointer-events:none}
.radio-dot{width:18px;height:18px;border-radius:50%;border:2px solid var(--border);flex-shrink:0;margin-top:1px;position:relative}
.radio-card.selected .radio-dot{border-color:var(--accent)}
.radio-card.selected .radio-dot::after{content:'';position:absolute;top:3px;left:3px;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.radio-content{flex:1}.radio-title{font-size:14px;font-weight:600}.radio-desc{font-size:12px;color:var(--text-muted);margin-top:2px}
.radio-tag{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:2px 8px;border-radius:4px;margin-left:8px}
.tag-green{background:var(--accent-light);color:var(--accent)}.tag-blue{background:var(--blue-bg);color:var(--blue)}

/* STEP BAR */
.step-bar{display:flex;align-items:center;max-width:480px;margin:0 auto 40px;padding:0 24px}
.step-dot{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;border:2px solid var(--border);color:var(--text-muted);flex-shrink:0;background:#fff}
.step-dot.active{border-color:var(--accent);color:var(--accent)}.step-dot.done{border-color:var(--green);background:var(--green);color:#fff}
.step-line{flex:1;height:2px;background:var(--border)}.step-line.done{background:var(--green)}

/* STEP 1 */
.step-plans{padding:48px 0px 0px;background:#F7F7F7}
.step-plans .header{max-width:1200px;margin:0 auto 40px;text-align:center}
.step-plans .header h1{font-family:'Poppins',sans-serif;font-size:28px;font-weight:700;color:var(--text)}
.step-plans .header p{margin-top:8px;font-size:14px;color:var(--text-muted);max-width:540px;margin-left:auto;margin-right:auto}
.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:1200px;margin:0 auto}
@media(max-width:1100px){.plan-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.plan-grid{grid-template-columns:1fr;max-width:400px}}
.plan-card{border:1px solid var(--border);border-radius:var(--radius);padding:24px;cursor:pointer;transition:all .25s;background:#fff;text-align:left;}
.plan-card:hover{box-shadow:0 4px 20px rgba(0,0,0,.07);transform:translateY(-10px);cursor:unset;}
.plan-card.highlight{border-color:#4F39F6;box-shadow:0 0 0 1px var(--accent);position:relative;}
.plan-card h2{font-size:18px;font-weight:700;margin-top:4px;color:var(--text);margin-bottom:2px;}
.plan-card .price{font-size:24px;font-weight:600;color:var(--accent);margin-bottom:0px;}
.plan-card .sub{font-size:12px;color:var(--text-muted);margin-bottom:0px;}
.plan-card .features{margin-top:14px;font-size:13px;color:var(--text-muted);line-height:1.8}
.plan-card .features div{display:flex;align-items:center;gap:6px}

/* STEP 2: DOC */
.step-doc{min-height:100vh;padding:40px 16px;}
.document{max-width:800px;margin:0 auto;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 1px 8px rgba(0,0,0,.04)}
.doc-header{padding:32px 40px;border-bottom:1px solid var(--border)}
.doc-header h1{font-family:'Poppins',sans-serif;font-size:22px;font-weight:700}
.doc-header p{font-size:13px;color:var(--text-muted);margin-top:6px}
.doc-prepared{padding:24px 40px;border-bottom:1px solid var(--border);display:flex;grid-template-columns:1fr 1fr;gap:16px}
.doc-section{padding:32px 40px;border-bottom:1px solid var(--border)}
.doc-section h2{font-size:17px;font-weight:600;margin-bottom:16px}
.metrics-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
@media(max-width:600px){.metrics-grid{grid-template-columns:repeat(2,1fr)}}
.metric-label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}
.metric-value{font-size:24px;font-weight:600;margin-top:4px}
.doc-table{width:100%;border-collapse:collapse;font-size:13px}
.doc-table th,.doc-table td{padding:12px;border:1px solid #d1d5db;text-align:left}
.doc-table th{background:var(--bg-muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.3px}
.doc-table .bold{font-weight:600}
.terms-block{margin-bottom:20px}.terms-block:last-child{margin-bottom:0}
.terms-block .term-title{font-weight:600;margin-bottom:8px;font-size:14px}
.terms-block ul{padding-left:20px;font-size:13px;color:#374151;line-height:1.9}
.doc-cta{padding:24px 40px;border-top:1px solid var(--border);display:flex;gap:12px}

/* STEP 3: SIGNUP */
.step-signup{min-height:100vh;padding:48px 24px;background:#f5f6f8}
.signup-container{max-width:1080px;margin:0 auto}
.signup-header{text-align:center;margin-bottom:12px}
.signup-header h1{font-family:'Poppins',sans-serif;font-size:28px;font-weight:700}
.signup-header p{font-size:14px;color:var(--text-muted);margin-top:6px}
.signup-layout{display:grid;grid-template-columns:1fr 380px;gap:28px;align-items:start}
@media(max-width:900px){.signup-layout{grid-template-columns:1fr}}
.signup-form{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:0 1px 6px rgba(0,0,0,.04)}
.form-section{padding:28px 32px;border-bottom:1px solid var(--border-light)}
.form-section:last-child{border-bottom:none}
.form-section-title{font-size:15px;font-weight:700;margin-bottom:18px;display:flex;align-items:center;gap:10px}
.form-section-num{width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:600px){.form-row{grid-template-columns:1fr}}
.signup-sidebar{position:sticky;top:24px}
.sidebar-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-bottom:14px;box-shadow:0 1px 6px rgba(0,0,0,.04)}
.sidebar-card-header{padding:16px 24px;border-bottom:1px solid var(--border-light);font-size:14px;font-weight:700;color:var(--text)}
.sidebar-card-body{padding:20px 24px}
.summary-row{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;font-size:13px}
.summary-row .s-label{color:var(--text-muted)}.summary-row .s-value{font-weight:500}
.summary-row.total{border-top:1.5px solid #ccd0d8;margin-top:8px;padding-top:12px}
.summary-row.total .s-label{font-weight:600;color:var(--text)}.summary-row.total .s-value{font-size:18px;font-weight:700}
.wallet-pill{display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:var(--radius-sm);margin-bottom:10px;font-size:13px}
.wallet-pill:last-child{margin-bottom:0}
.wallet-pill .wp-icon{font-size:18px;flex-shrink:0}.wallet-pill .wp-label{color:var(--text-muted);flex:1}.wallet-pill .wp-value{font-weight:700;font-size:15px}
.wallet-green{background:var(--green-bg);border:1px solid var(--green-border)}
.wallet-blue{background:var(--blue-bg);border:1px solid var(--blue-border)}
.wallet-amber{background:var(--amber-bg);border:1px solid var(--amber-border)}
.terms-box{background:var(--bg-muted);border-radius:var(--radius-sm);padding:14px 16px;font-size:12px;color:var(--text-muted);line-height:1.7;margin-top:16px}
.terms-box p{margin-bottom:6px}.terms-box p:last-child{margin-bottom:0}

/* STEP 4: E-SIGN APP */
.step-esign-app{min-height:100vh;display:flex;flex-direction:column;background:#f0f1f3}
.esign-toolbar{display:flex;align-items:center;padding:12px 24px;background:#fff;border-bottom:1px solid var(--border);flex-shrink:0;z-index:10}
.esign-toolbar-left{display:flex;align-items:center;gap:12px}
.esign-toolbar-left svg{color:var(--text-muted);flex-shrink:0}
.esign-toolbar-title{font-size:14px;font-weight:600}
.esign-toolbar-meta{font-size:11px;color:var(--text-muted);margin-top:1px}
.esign-toolbar-right{display:flex;align-items:center;gap:12px;margin-left:auto;}
.esign-toolbar-status{font-size:12px;font-weight:600;display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;background:var(--amber-bg);color:var(--amber);border:1px solid var(--amber-border)}
.esign-toolbar-status.signed{background:var(--green-bg);color:var(--green);border-color:var(--green-border)}
.status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.status-dot.status-pending{background:var(--amber);animation:pulse 2s infinite}
.status-dot.status-done{background:var(--green);animation:none}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.esign-app-layout{display:grid;grid-template-columns:1fr 400px;flex:1;min-height:0}
@media(max-width:1000px){.esign-app-layout{grid-template-columns:1fr}}
.esign-viewer{display:flex;flex-direction:column;min-height:0}
.esign-viewer-header{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:#e8e9ed;border-bottom:1px solid #d5d7dc;flex-shrink:0}
.esign-iframe-wrap{flex:1;overflow:auto;padding:24px;display:flex;justify-content:center;background:#e0e1e5}
.esign-iframe{width:816px;min-height:1056px;border:none;background:#fff;box-shadow:0 2px 20px rgba(0,0,0,.12);transform-origin:top center;border-radius:2px}
.esign-sign-panel{background:#fff;border-left:1px solid var(--border);display:flex;flex-direction:column;overflow-y:auto}
.sign-panel-section{padding:20px 24px;border-bottom:1px solid var(--border-light)}
.sign-panel-badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--accent);background:var(--accent-light);border:1px solid var(--blue-border);padding:4px 10px;border-radius:4px;margin-bottom:12px}
.sign-panel-title{font-family:'Poppins',sans-serif;font-size:20px;font-weight:700;margin-bottom:6px}
.sign-panel-desc{font-size:13px;color:var(--text-muted);line-height:1.5}
.sign-panel-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);margin-bottom:10px}
.signer-card{display:flex;align-items:center;gap:12px}
.signer-avatar{width:40px;height:40px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0}
.signer-name{font-size:14px;font-weight:600}.signer-email{font-size:12px;color:var(--text-muted)}
.sig-pad-app{border:2px dashed #d1d5db;border-radius:var(--radius-sm);min-height:100px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;position:relative;background:#fafafa}
.sig-pad-app:hover{border-color:var(--accent);background:var(--accent-light)}
.sig-pad-app.signed{border-color:var(--green);border-style:solid;background:var(--green-bg)}
.sig-placeholder-app{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--text-dim);font-size:13px}
.sig-typed-app{font-size:32px;color:var(--text);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:8px}
.sig-style-serif{font-family:'Poppins',sans-serif}.sig-style-script{font-family:'Brush Script MT','Segoe Script',cursive;font-style:italic}.sig-style-print{font-family:'Poppins',sans-serif;font-weight:700;letter-spacing:1px}
.sig-style-tabs{display:flex;align-items:center;gap:6px;margin-top:10px}
.sig-tab{padding:4px 12px;border-radius:4px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid var(--border);background:#fff;color:var(--text-muted);font-family:inherit}
.sig-tab:hover{border-color:#bbb}.sig-tab.active{border-color:var(--accent);color:var(--accent);background:var(--accent-light)}
.sign-date-box{font-size:14px;font-weight:500;padding:10px 14px;background:var(--bg-muted);border-radius:var(--radius-sm)}
.esign-checkbox-app{display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.5}
.esign-checkbox-app input{margin-top:2px;accent-color:var(--accent);width:16px;height:16px;flex-shrink:0}
.sign-panel-cta{padding:20px 24px;margin-top:auto;border-top:1px solid var(--border-light)}
.sign-panel-legal{font-size:11px;color:var(--text-dim);text-align:center;margin-top:10px;line-height:1.5}
.sig-preview-strip{display:flex;gap:8px;margin-top:14px;padding:12px;background:var(--bg-muted);border-radius:var(--radius-sm)}
.sig-preview-option{flex:1;text-align:center;padding:12px 8px;border-radius:6px;cursor:pointer;border:2px solid transparent;background:#fff}
.sig-preview-option:hover{border-color:#ddd}.sig-preview-option.selected{border-color:var(--accent)}
.sig-preview-option .sp-label{font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.3px;margin-top:4px}

/* STEP 5: PAYMENT */
.step-payment{min-height:100vh;padding:64px 24px;display:flex;align-items:flex-start;justify-content:center;background:#f5f6f8}
.payment-card{max-width:520px;width:100%;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:0 1px 8px rgba(0,0,0,.05);margin:auto;}
.payment-card-header{padding:28px 32px;border-bottom:1px solid var(--border);text-align:center}
.payment-card-header h1{font-family:'Poppins',sans-serif;font-size:22px;font-weight:700}
.payment-card-header p{font-size:13px;color:var(--text-muted);margin-top:6px}
.payment-card-body{padding:28px 32px}
.pay-row{display:flex;justify-content:space-between;padding:8px 0;font-size:14px}
.pay-row .label{color:var(--text-muted)}
.pay-row.total{border-top:1.5px solid #ccd0d8;margin-top:10px;padding-top:14px}
.pay-row.total .label{font-weight:700;font-size:15px}.pay-row.total .value{font-weight:700;font-size:20px}
.payment-card-footer{padding:24px 32px;border-top:1px solid var(--border-light)}
.secure-badge{display:flex;align-items:center;justify-content:center;gap:6px;font-size:12px;color:var(--text-muted);margin-top:12px}
.success-banner{background:var(--green-bg);border:1px solid var(--green-border);border-radius:var(--radius-sm);padding:14px 18px;display:flex;align-items:center;gap:10px;margin-bottom:20px;font-size:13px;color:var(--green);font-weight:500}

/* PRINT */
@media print{body{background:#fff}.step-doc{background:#fff;padding:0}.document{box-shadow:none;border:none}.doc-cta{display:none!important}.input{border:none;padding:0}.doc-table th{background:#fff}}
.step{display:none}.step.active{display:block}
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:999;align-items:center;justify-content:center}
.modal-overlay.open{display:flex}
.modal-box{background:#fff;border-radius:var(--radius);padding:32px;max-width:440px;width:90%;box-shadow:0 20px 60px rgba(0,0,0,.15)}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:fadeUp .35s ease-out forwards}
/*claude style ends*/

.plan-card .badge {
    border: 1px solid #EBEBEB;
    border-radius: 25px;
    background-color: #4F39F6;
    color: #fff;
    font-weight: 400;
    font-size: 16px;
    position: absolute;
    top: -16px;
    left: 19%;
    padding: 4px 35px;
}
.plan-subtitle {
    font-size: 14px;
    color: #677F9B;
}
.price_patch {
    background-color: #EAF8F2;
    padding:6px 20px;
    border-radius:10px;
}
.price_patch .price{
    color:#009966;
}
.price_patch .sub{
    color:#71A694;
}
.plan-card .features ::marker {
    color: #009966;
}
.discount_percentage, .support_hrs {
    color: #009966;
}
.btn.btn-primary.btn-full {
    background-color: #fff;
    color: #007CDC;
    border-color: #007CDC;
    margin-bottom:15px;
}
.payment_link{
    color:#000 !important;
    font-size:16px !important;
    padding:6px 0px !important;
    text-decoration:underline !important;
}
.payment_link .fa-wallet{
    margin-right:5px;
}
.payment_link .fa-arrow-right{
    margin-left:5px;
}
#payment_sec {
    background-color: #f5f6f8;
}
.head2{
    font-weight:600;
}
.capability_tools{
    font-size:16px !important;
    color:#000 !important;
    margin-top:40px !important;
}
.case_card_point1,
.case_card_point2 {
    flex: 1 1 0;
    min-width: 0;
    padding: 32px 26px;
}
.choose_custom_plan {
    color: #007CDC !important;
}
.custom_plan_head{
    font-size:32px;
    font-weight:bold;
}
#pack_selection, #custom_plan {
    background-color: #F7F7F7;
}
.counting_cf{
    padding-bottom:130px;
}
#signSubmitBtn, #finalPayBtn {
    background-color: #059669;
    color: #fff !important;
}
.info-banner {
    background-color: #EAF8F2;
    padding: 5px 10px;
    margin-bottom: 10px;
    font-size: 14px;
}
.generate-btn:hover {
    background-color: #007CDC !important;
    color: #fff !important;
}
.case_card_point2 {
    background-color: #F7F7F7;
}
.bonus-usage-note {
    color: oklch(50.8% 0.118 165.612) !important;
    font-size:12px;
}