/* style/blog-choosing-nn88-platform.css */\n\n/* Custom Colors */\n:root {\n    --page-bg-color: #08160F;\n    --card-bg-color: #11271B;\n    --text-main-color: #F2FFF6;\n    --text-secondary-color: #A7D9B8;\n    --border-color: #2E7A4E;\n    --button-gradient: linear-gradient(180deg, #2AD16F 0%, #13994A 100%);\n    --glow-color: #57E38D;\n    --gold-color: #F2C14E;\n    --divider-color: #1E3A2A;\n    --deep-green-color: #0A4B2C;\n}\n\n/* Base styles for the page content, ensuring contrast with body background which is dark */\n.page-blog-choosing-nn88-platform {\n    background-color: var(--page-bg-color); /* This background is for the main content area sections */\n    color: var(--text-main-color); /* Light text on dark background */\n    font-family: Arial, sans-serif;\n    line-height: 1.6;\n    padding-top: 10px; /* Small top padding, body handles header offset */\n}\n\n.page-blog-choosing-nn88-platform__container {\n    max-width: 1200px;\n    margin: 0 auto;\n    padding: 0 20px;\n    box-sizing: border-box;\n}\n\n/* Hero Section */\n.page-blog-choosing-nn88-platform__hero-section {\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    padding-bottom: 60px; /* Space between image and content */\n    background-color: var(--deep-green-color); /* A slightly different dark background for hero */\n    overflow: hidden;\n}\n\n.page-blog-choosing-nn88-platform__hero-image-wrapper {\n    width: 100%;\n    max-height: 675px; /* Max height for hero image */\n    overflow: hidden;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin-bottom: 40px; /* Space before content */\n}\n\n.page-blog-choosing-nn88-platform__hero-image {\n    width: 100%;\n    height: auto;\n    object-fit: cover;\n    display: block;\n}\n\n.page-blog-choosing-nn88-platform__hero-content {\n    max-width: 900px;\n    padding: 0 20px;\n    z-index: 1;\n    color: var(--text-main-color);\n}\n\n.page-blog-choosing-nn88-platform__main-title {\n    font-size: clamp(2em, 4vw, 3.5em); /* Responsive H1 font size */\n    font-weight: 700;\n    line-height: 1.2;\n    margin-bottom: 20px;\n    color: var(--gold-color); /* Gold color for main title */\n}\n\n.page-blog-choosing-nn88-platform__description {\n    font-size: 1.1em;\n    margin-bottom: 30px;\n    color: var(--text-secondary-color);\n}\n\n/* General Sections */\n.page-blog-choosing-nn88-platform__section {\n    padding: 60px 0;\n    border-bottom: 1px solid var(--divider-color);\n}\n\n.page-blog-choosing-nn88-platform__section:last-of-type {\n    border-bottom: none;\n}\n\n.page-blog-choosing-nn88-platform__section-title {\n    font-size: clamp(1.8em, 3vw, 2.8em);\n    font-weight: 600;\n    text-align: center;\n    margin-bottom: 40px;\n    color: var(--text-main-color);\n    text-shadow: 0 0 8px rgba(87, 227, 141, 0.3); /* Subtle glow effect */\n}\n\n.page-blog-choosing-nn88-platform__text-block {\n    font-size: 1em;\n    margin-bottom: 20px;\n    color: var(--text-secondary-color);\n}\n\n.page-blog-choosing-nn88-platform__image {\n    width: 100%;\n    height: auto;\n    display: block;\n    margin: 40px auto;\n    border-radius: 8px;\n    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);\n    max-width: 800px; /* Ensure images don't stretch too wide in content */\n}\n\n/* Lists */\n.page-blog-choosing-nn88-platform__list,\n.page-blog-choosing-nn88-platform__ordered-list {\n    list-style-type: none;\n    padding-left: 0;\n    margin-bottom: 20px;\n}\n\n.page-blog-choosing-nn88-platform__list-item {\n    background-color: var(--card-bg-color);\n    padding: 15px 20px;\n    margin-bottom: 10px;\n    border-radius: 5px;\n    border-left: 5px solid var(--glow-color);\n    color: var(--text-main-color);\n    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);\n}\n\n.page-blog-choosing-nn88-platform__ordered-list .page-blog-choosing-nn88-platform__list-item {\n    counter-increment: list-counter;\n    position: relative;\n    padding-left: 45px;\n    border-left: none;\n}\n\n.page-blog-choosing-nn88-platform__ordered-list .page-blog-choosing-nn88-platform__list-item::before {\n    content: counter(list-counter);\n    position: absolute;\n    left: 15px;\n    top: 50%;\n    transform: translateY(-50%);\n    background-color: var(--glow-color);\n    color: var(--page-bg-color);\n    width: 25px;\n    height: 25px;\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-weight: bold;\n    font-size: 0.9em;\n}\n\n/* Card Grid */\n.page-blog-choosing-nn88-platform__grid-cards {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n    gap: 30px;\n    margin-top: 40px;\n}\n\n.page-blog-choosing-nn88-platform__card {\n    background-color: var(--card-bg-color); /* Dark card background */\n    padding: 30px;\n    border-radius: 10px;\n    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.4);\n    transition: transform 0.3s ease, box-shadow 0.3s ease;\n    color: var(--text-secondary-color); /* Light text on dark card */\n    border: 1px solid var(--border-color);\n}\n\n.page-blog-choosing-nn88-platform__card:hover {\n    transform: translateY(-5px);\n    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.5);\n}\n\n.page-blog-choosing-nn88-platform__card-title {\n    font-size: 1.4em;\n    font-weight: 600;\n    margin-bottom: 15px;\n    color: var(--text-main-color);\n    border-bottom: 2px solid var(--glow-color);\n    padding-bottom: 10px;\n}\n\n.page-blog-choosing-nn88-platform__card-text {\n    font-size: 0.95em;\n    color: var(--text-secondary-color);\n}\n\n/* Buttons */\n.page-blog-choosing-nn88-platform__btn-primary,\n.page-blog-choosing-nn88-platform__btn-secondary {\n    display: inline-block;\n    padding: 15px 30px;\n    border-radius: 50px;\n    text-decoration: none;\n    font-weight: bold;\n    font-size: 1.1em;\n    transition: all 0.3s ease;\n    text-align: center;\n    cursor: pointer;\n    box-sizing: border-box;\n    white-space: normal; /* Allow text to wrap */\n    word-wrap: break-word; /* Ensure long words break */\n    margin: 20px auto; /* Center buttons */\n}