/* --- Apple Style Inspired --- */

  

    .jumbotron h1,.jumbotron h2,.jumbotron h3,.jumbotron h4,.jumbotron h5,.jumbotron h6
    
    {
        font-weight: 600; /* Bolder headings */
        color: #1d1d1f; /* Apple's typical dark grey for text */
        margin-top: 30px;
        margin-bottom: 15px;
    }

    .jumbotron h1 {
        font-size: 38px; /* Prominent H1 */
        text-align: center;
        margin-bottom: 10px;
    }
    .jumbotron >.h1.headline { /* For sub-headlines */
        font-size: 24px;
        color: #6e6e73; /* Softer grey for sub-headlines */
        font-weight: 400;
        margin-top: 0;
        margin-bottom: 40px;
    }
    h1.watermarkText { /* More subtle headline */
        font-size: 22px;
        color: #86868b;
        font-weight: normal;
        /* margin-top: -20px; Position it under the main H1 */
        margin-bottom: 30px;
        text-align: center;
    }


    .jumbotron h2 {
        font-size: 28px;
        margin-top: 40px;
        margin-bottom: 20px;
    }
    h2.section-title { /* If you have specific section titles */
         border-bottom: 1px solid #e0e0e0;
         padding-bottom: 10px;
         margin-bottom: 25px;
    }

    .jumbotron h3 {
        font-size: 22px;
    }
    h3.panel-title {
         font-size: 20px;
         font-weight: 500;
    }


    a {
        color: #007aff; /* Apple's standard blue link color */
        text-decoration: none;
    }
    a:hover, a:focus {
        color: #0056b3;
        text-decoration: underline;
    }


    .border {
        height: 2px;
        width: 80px;
        background-color: #007aff;
        margin: 20px auto 40px; /* Center the border */
        border-radius: 1px;
    }

    .spacing {
        height: 50px; /* Consistent spacing */
    }
    @media (min-width: 768px) {
        .spacing {
            height: 70px;
        }
    }


    /* Navigation (Conceptual - not in original HTML but good for structure) */
    .navbar-brand {
        font-weight: 600;
        color: #1d1d1f !important;
    }

    /* Jumbotron / Hero Area */
    .jumbotron {
        background-color: #fff; /* White background for hero */
        padding-top: 60px;
        padding-bottom: 60px;
        margin-bottom: 0;
        border-bottom: 1px solid #e0e0e0;
        text-align: center;
    }
    .jumbotron h1 {
        font-size: 48px;
        color: #1d1d1f;
        font-weight: 700;
    }
    .jumbotron .headline {
        font-size: 28px;
        color: #6e6e73;
        margin-bottom: 30px;
    }


    /* Sections */
    .section {
        padding: 40px 0;
        background-color: #fff; /* White background for content sections */
        margin-bottom: 20px; /* Space between sections */
        border-radius: 8px; /* Softly rounded corners for sections */
        box-shadow: 0 4px 12px rgba(0,0,0,0.05); /* Subtle shadow */
    }
    .section.transparent { /* if a section truly needs to be transparent over a bg */
         background-color: transparent;
         box-shadow: none;
    }

    .container .section { /* Sections inside a container get horizontal padding */
        padding-left: 30px;
        padding-right: 30px;
    }


    /* Feature Items (for core function modules) */
    .feature-item {
        text-align: center; /* Center align feature items */
        margin-bottom: 30px;
        padding: 20px;
    }
    .feature-item img.featureCard { /* Applied to images in feature items */
        width: 100%;
        max-width: 550px; /* Limit max width */
        height: auto;
        margin: 0 auto 20px auto; /* Center image */
        border-radius: 8px; /* Rounded corners for images */
        border: 1px solid #eee;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    }

    .feature-item h2 { /* Changed from h4 for more prominence */
        font-size: 22px;
        margin-top: 0;
        margin-bottom: 10px;
        color: #1d1d1f;
    }
    .feature-item p, .feature-item ul {
        color: #6e6e73;
        font-size: 15px;
        text-align: left; /* Align text left within the centered block */
    }
    .feature-list { /* For ULs in feature items */
        list-style: none;
        padding-left: 0;
    }
    .feature-list li {
        padding-left: 25px;
        position: relative;
        margin-bottom: 8px;
        list-style-type: none !important;
    }
    .feature-list li:before {
        content: "\e013"; /* Bootstrap checkmark */
        font-family: 'Glyphicons Halflings';
        position: absolute;
        left: 0;
        top: 2px;
        color: #007aff;
        
    }

    /* Paragraphs within sections */
    .section p, .fontSize18.section p { /*fontSize18 class is a bit specific, might override */
        text-indent: 0em; /* Apple style usually doesn't indent paragraphs */
        padding-left: 0em; /* Remove specific padding */
        font-size: 17px; /* Slightly larger for main content */
        line-height: 1.7;
        color: #333;
    }
    .fontSize18.section {
         text-indent: 0; /* Overriding the inline style */
    }


    /* Buttons */
    .btn.btn-info.btn-lg, .text-center .button { /* Style the custom .button class as well */
        background-color: #007aff;
        border-color: #007aff;
        color: #fff;
        font-size: 18px; /* Apple button text size */
        padding: 12px 30px;
        border-radius: 8px; /* Rounded buttons */
        transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
        white-space: normal; /* Allow button text to wrap if needed */
        line-height: 1.5; /* Adjust line height for button */
        display: inline-block; /* Ensure it behaves like a block for margin/padding */
        text-decoration: none; /* Remove underline from anchor styled as button */
    }
    .btn.btn-info.btn-lg:hover,
    .btn.btn-info.btn-lg:focus,
    .text-center .button:hover,
    .text-center .button:focus {
        background-color: #005ec4;
        border-color: #0056b3;
        color: #fff;
        text-decoration: none;
    }
    /* Removing old button gradient */
    .text-center .button {
        background: #007aff; /* Solid color */
    }


    /* Images */
    .img-rounded {
        border-radius: 8px; /* Consistent rounded corners */
    }
    .img-responsive {
        display: block;
        max-width: 100%;
        height: auto;
        margin-left: auto;
        margin-right: auto; /* Center responsive images */
    }
    .img-thumbnail {
        border: 1px solid #ddd; /* Softer border for thumbnails */
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

    /* Specific elements from old CSS */
    .placeholder-image {
        width: 100%;
        height: auto;
        margin-bottom: 15px;
        border-radius: 5px;
        display: none;
    }
    /* .sectionBlock2 styles are quite specific, integrate if needed or remove if redundant */
    .sectionScheme { /* Simplify or remove transparency effects for cleaner look */
        border-top: 1px solid #eee;
        background-color: #fff; /* Solid background */
        position: relative;
        padding: 20px 0;
        margin-bottom: 10px;
        border-radius: 8px;
    }
    .sectionul > li { /* For the video link list */
        font-size: 18px;
        color: #007aff;
        padding: 10px 0;
        list-style: none;
    }
    .sectionul > p {
      font-size:16px;
    }

    .middleContainer .text-center img {
        margin-top: 20px;
        margin-bottom: 20px;
        border-radius: 8px;
        box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    }

    /* Footer (Conceptual) */
    footer {
        background-color: #f0f0f5; /* Light grey footer */
        color: #6e6e73;
        padding: 40px 0;
        text-align: center;
        margin-top: 50px;
        font-size: 14px;
        border-top: 1px solid #e0e0e0;
    }
    footer strong {
        color: #1d1d1f;
    }
    footer a {
        color: #007aff;
    }
    footer a:hover {
        color: #0056b3;
    }

    /* Removing original style for .section p text-indent as Apple style usually doesn't use it */
    /* Original was:
    .section p{
        text-indent: 2em;
        padding-left: 2em;
    }
    */

     /* Ensure images inside feature items are properly styled */
    .col-md-6 > img.featureCard,
    .col-md-6 > .img-responsive.img-thumbnail.featureCard {
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 20px;
        height:467px;
        max-width: 100%; /* Ensure it doesn't overflow its column */
    }

    .col-md-6 >ul >li {
        list-style:none;
    }

 

    /* Style for video links area */
    .video-links-section {
        text-align: center;
        padding: 20px;
    }
    .video-links-section p {
        margin-bottom: 10px;
    }
    .video-links-section p a {
        font-size: 18px;
        display: block; /* Make links block for better spacing */
        margin-bottom: 10px;
    }
    .video-links-section .btn-cta { /* Special button for CTA in this section */
        margin-top: 20px;
    }

    /* Ensure images in sections are centered and have some breathing room */
    .text-center > .img-responsive {
        margin-top: 20px;
        margin-bottom: 30px;
    }

    .showcontent{
        display: grid;
        grid-template-columns: 1fr 1fr ;
        grid-template-rows: 1fr 1fr 1fr  ;
        grid-gap: 10px;
        grid-column-gap: 45px;
    }

    .slogan-container {
        text-align: center;
        max-width: 800px;
        margin: 0 auto;
        padding: 20px;
    }
    
    .slogan-title {
        font-size: 36px;
        font-weight: bold;
        color: #1d1d1f;
        margin-bottom: 30px;
    }
    
    .slogan-item {
        font-size: 24px;
        color: #333;
        margin-bottom: 20px;
        line-height: 1.5;
    }
    
    .slogan-highlight {
        color: #E91E63;
        font-weight: 600;
    }

    .maincontentblod{
        font-weight: bold;

    }
    section p {
        margin-bottom: 15px;
        color: #555; /* Slightly lighter text for paragraphs */
    }

    section p {
    font-size: 17px;
    color: #333; 
    line-height: 1.7; 
        margin-bottom: 20px; 
    }
    section p {
        text-indent: 2em; 
    }

    
    .section h3, .sectionTitle{
        color: #1d1d1f;
    }

    .jumbotron >h1 {
        line-height: 1;
        margin-bottom: 10px;
    }

    .container >a {
            padding: 4px 32px;
    }

    .list-group{
        list-style: none;
        margin-left: 0px;
    }

    @media (min-width: 992px) {
     .col-md-4 {  /* 设定了最大当前行的百分比宽度 ，若需要调整则在父节点添加padding：0px 100px;调整页面比例。 */
        width: 32%;
     }
    }

    .section ul {
        margin-left: 0px ;
    }

    .panel-body >ul >li{
        list-style: none ;
    }

    .card-body{
        padding: 0px 15px;
        padding-bottom: 10px;
      }
    
    .card{
        margin-bottom: 20px;
    }

    .font-weight-bold{   
       font-weight: bold ;
    }
/* 统计卡片 */
    .stat-card {  
    border-radius: 12px;
    padding: 25px;
    text-align: center;
    }
    .stat-number {
        font-size: 36px;
        font-weight: bold;
        color: #007aff;
        margin-bottom: 5px;
    }
    .stat-label {
        font-size: 16px;
        color: #6e6e73;
    }
/* 悬停卡片 */
    .card-hover { transition: transform 0.3s ease; }
    .card-hover:hover { transform: translateY(-3px); }

    .col-sm-6 p{
        line-height: 1.7;
    }