/* ===== Hero ===== */
        .hero{
            background:linear-gradient(180deg,#ffffff,#f8fafc);
            background:var(--bg-hero);
            border-radius:14px;
            margin-bottom:2px;
            padding:1px 8px;
        }
        .hero h1{
            font-size:30px;
            margin:0 0 0px;
            margin-top:0;
        }
         .hero p{
            color:#475569;
            font-size:13px;
            margin:0;
        }
        .hero p,
        .calc-card p{
            color:var(--text-muted);
        }
        /*@keyframes heroIn{
            from{ opacity:0; transform: translateY(30px); }
            to{ opacity:1; transform:none; }
        }*/


        /* ===== Popular Calculators Meta ===== */
        .popular-calc-meta{
            color:#475569;
            font-size:12px;
            margin:-10px 0 0px;
            white-space: nowrap;
        }


        /* ===== View All Calculators ===== */
        .view-all-calculators{
            color:#be123c;            /* same family as header accent */
            font-weight:700;
            text-decoration:none;
        }
        .view-all-calculators:hover{
            text-decoration:underline;
        }


        /* ===== Calculator GRID ===== */
        .calc-grid{
            display:grid;
            gap:12px;
            grid-template-columns:repeat(3, 1fr);
            margin-bottom:8px;
            margin-top:12px;      
        }
        @media (max-width: 900px){
            .calc-grid{
                grid-template-columns:repeat(2, 1fr);
            }
        }
        @media (max-width: 520px){
            .calc-grid{
                grid-template-columns:1fr;
            }
            .popular-calc-meta{
                line-height:1.4;
                white-space:normal;
            }
        }


        /* ===== Calculator Cards ===== */
        .calc-card{
            background:#ffffff;
            background:var(--bg-card);
            border-radius:12px;
            box-shadow:
            0 4px 12px rgba(0,0,0,.06),
            0 2px 4px rgba(0,0,0,.04);
            box-shadow:var(--shadow-card);
            padding:12px 14px;
            position:relative;
            transition: transform .2s cubic-bezier(.4,0,.2,1), box-shadow .2s ease;
        }
        @keyframes cardIn{
            from{ opacity:0; }
            to{ opacity:1; }
        }
        .calc-card:hover{
            box-shadow:
            0 12px 28px rgba(37,99,235,.15),
            0 4px 8px rgba(0,0,0,.06);         
            transform:translateY(-4px);
        }
        .calc-card h3{
            display:inline-block;
            font-size:16px;
            line-height:1.2;
            margin:0 0 4px;
            position:relative;
        }
        .calc-card p{
            color:#475569;
            font-size:12.5px;
            line-height:1.35;
            margin:0;
        }
        .calc-card a{
            /*background:#2563eb;*/ /*Original*/
            /*background:#06b6d4; /*final-1*/
            background:#fb7185; /*final-2*/
            background: linear-gradient(135deg, #fb7185, #be123c);
            border-radius:8px;
            color:#fff;
            display:inline-block;
            font-size:13px;
            font-weight:700;
            margin-top:8px;
            padding:6px 12px;
            text-decoration:none;
            transition:transform .15s ease, box-shadow .15s ease;
        }
        .calc-card a:hover{
            /*background:#1d4ed8;*/ /*Original*/
            /*background:#0C0D0D;*/
            /*background:#0e7490; /*final-1*/
            background:#be123c; /*final-2*/
            box-shadow:0 6px 14px rgba(37,99,235,.25);
            transform:translateY(-1px);
        }
        .calc-card-explore-all{
            padding:0;
            position:relative;
            text-align:center;
        }
        .calc-card-explore-all .explore-all-btn{
            background:linear-gradient(135deg, #374151, #1f2937);
            border:1px solid rgba(255,255,255,.14);
            border-radius:999px;
            box-shadow:0 10px 22px rgba(31,41,55,.18);
            color:#ffffff;
            display:inline-flex;
            font-size:14px;
            justify-content:center;
            left:50%;
            margin:0 !important;
            padding:10px 18px;
            position:absolute;
            top:50%;
            transform:translate(-50%, -50%);
        }
        .calc-card-explore-all .explore-all-btn:hover{
            background:linear-gradient(135deg, #4b5563, #374151);
            box-shadow:0 12px 24px rgba(31,41,55,.22);
            color:#ffffff;
            transform:translate(-50%, calc(-50% - 1px));
        }
        /* Disabled card styling (visible but non-interactive) */
        .calc-card.disabled{
            opacity:0.6;
            filter:grayscale(.15);
        }
        .calc-card.disabled .badge{ opacity:0.6; }
        .calc-card.disabled a{
            background:linear-gradient(135deg,#e5e7eb,#d1d5db);
            color:#6b7280;
            box-shadow:none;
            pointer-events:none;
            cursor:not-allowed;
        }
        .calc-card.disabled:hover{ transform:none; box-shadow:var(--shadow-card); }
        /* Stagger */
        /*.calc-card:nth-child(1){ animation-delay:.04s }
        .calc-card:nth-child(2){ animation-delay:.08s }
        .calc-card:nth-child(3){ animation-delay:.12s }
        .calc-card:nth-child(4){ animation-delay:.16s }
        .calc-card:nth-child(5){ animation-delay:.20s }
        .calc-card:nth-child(6){ animation-delay:.24s }*/
        /* Keyboard Use */
        .calc-card:focus-within{
        outline:2px solid rgba(251,113,133,.5);
        outline-offset:3px;
        }
        /* Underline Use */
        .calc-card h3::after{
            background:#fb7185;
            bottom:-2px;
            content:"";
            height:2px;
            position:absolute;
            left:0;
            transition:width .3s cubic-bezier(.4,0,.2,1);
            width:0;
        }
        .calc-card:hover h3::after{
            width:100%;
        }
        

        /* ===== Calc Item ===== */
        .calc-item{
            display:none;       /* Default: cards do NOT exist in layout */
            visibility:hidden;
         }
        .home-page .calc-grid .calc-item:nth-child(-n+9){
            display:block;
            visibility:visible;
        }
        /* Cards prepared for first paint (space reserved, invisible) */
        .calc-item.preload{
            display:block;
            visibility:hidden;
        }
        /* Cards actually visible */
        .calc-item.visible{
            animation: cardIn .35s ease-out both;
            visibility:visible;
        }

        .home-page [data-ad="ad-top-banner"]{
            margin:10px auto 12px;
            max-width:970px;
            min-height:90px;
            width:100%;
        }

        .home-page [data-ad="ad-top-big-banner"]{
            margin:16px auto 20px;
            max-width:970px;
            min-height:250px;
            width:100%;
        }


        /* ===== Load More Wrap ===== */
        .load-more-wrap{
            display:flex;
            justify-content:center;
            margin:14px 0 10px;
            visibility:hidden;
         }


        /* ===== Home Page ABOUT SEO  ===== */
        .home-about-seo{
            background:#ffffff;
            border-radius:10px;
            box-shadow:0 6px 16px rgba(0,0,0,.06);
            padding:32px 22px 22px;   /* 🔑 TOP padding instead of margin */
            margin:0 auto 14px;
            margin-top: 20px; 
            max-width:970px;
        }
        .home-about-seo h2{
            font-size:20px;
            font-weight:700;
        }
        .home-about-seo p{
            color:#475569;
            font-size:14.5px;
            hyphens: auto;              /* 🔑 prevents big gaps */
            line-height:1.7;
            text-align: justify;        /* 🔑 fixes uneven right side */
            text-justify: inter-word;   
        }
        .home-about-seo p:last-child{
            margin-bottom:0;
        }