/* Article styles — shared across all /ressources/[slug] pages */

    /* ═══ READING PROGRESS ═══ */
    .reading-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--blue);z-index:9999;transition:width 0.15s linear;}

    /* ═══ HERO IMAGE ═══ */
    .art-hero{position:relative;min-height:440px;overflow:hidden;display:flex;align-items:flex-end;}
    .art-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
    .art-hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,25,35,0.15) 0%,rgba(15,25,35,0.82) 100%);}
    .art-hero-content{position:relative;z-index:2;color:#fff;padding:0 0 56px;max-width:720px;}
    .art-hero-content .art-breadcrumb{display:flex;gap:6px;align-items:center;font-size:13px;margin-bottom:20px;list-style:none;padding:0;}
    .art-hero-content .art-breadcrumb a{color:rgba(255,255,255,0.7);text-decoration:none;}
    .art-hero-content .art-breadcrumb a:hover{color:#fff;}
    .art-hero-content .art-breadcrumb span{color:rgba(255,255,255,0.4);}
    .art-hero-content .art-badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;background:rgba(6,143,255,0.25);color:#fff;padding:5px 14px;border-radius:40px;margin-bottom:16px;backdrop-filter:blur(4px);}
    .art-hero-content .art-badge::before{content:'';width:7px;height:7px;border-radius:50%;background:#068FFF;}
    .art-hero-content h1{font-size:clamp(28px,4.5vw,48px);font-weight:800;line-height:1.12;letter-spacing:-0.02em;margin-bottom:16px;}
    .art-hero-content .art-subtitle{font-size:clamp(15px,1.8vw,18px);color:rgba(255,255,255,0.8);line-height:1.6;margin-bottom:20px;max-width:600px;}
    .art-hero-content .art-meta{display:flex;gap:16px;align-items:center;font-size:13px;color:rgba(255,255,255,0.6);}
    .art-hero-content .art-meta svg{opacity:0.5;}

    /* ═══ SHARE BAR ═══ */
    .share-bar{display:flex;gap:8px;margin-top:20px;}
    .share-btn{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.12);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,0.15);color:#fff;transition:all 0.2s;cursor:pointer;text-decoration:none;}
    .share-btn:hover{background:rgba(255,255,255,0.22);}

    /* ═══ LAYOUT: SIDEBAR + CONTENT ═══ */
    .art-layout{display:grid;grid-template-columns:1fr 220px;gap:48px;padding-top:56px;padding-bottom:80px;align-items:start;}
    .art-main{min-width:0;}
    .art-sidebar{position:sticky;top:100px;align-self:start;}
    .art-sidebar-nav{background:#fff;border-radius:14px;padding:20px 24px;border:1px solid rgba(0,0,0,0.06);box-shadow:4px 4px 12px rgba(0,0,0,0.04),-3px -3px 10px rgba(255,255,255,0.8);}
    .art-sidebar-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-muted);margin-bottom:12px;}
    .art-sidebar-link{display:block;font-size:13px;color:var(--text-muted);text-decoration:none;padding:6px 0 6px 12px;border-left:2px solid transparent;transition:all 0.2s;line-height:1.4;}
    .art-sidebar-link:hover{color:var(--text);}
    .art-sidebar-link.active{border-left-color:var(--blue);color:var(--blue);font-weight:600;}
    @media(max-width:960px){
      .art-layout{grid-template-columns:1fr;gap:0;}
      .art-sidebar{display:none;}
    }

    /* ═══ ARTICLE CONTENT ═══ */
    .art-main h2{font-size:clamp(22px,3vw,30px);font-weight:800;color:var(--text);margin:56px 0 16px;line-height:1.2;scroll-margin-top:100px;}
    .art-main h2:first-child{margin-top:0;}
    .art-main h3{font-size:clamp(17px,2vw,20px);font-weight:700;color:var(--text);margin:32px 0 12px;line-height:1.3;}
    .art-main p{font-size:16px;color:#444;line-height:1.8;margin-bottom:20px;}
    .art-main ul,.art-main ol{margin:0 0 20px;padding-left:24px;}
    .art-main li{font-size:15px;color:#444;line-height:1.7;margin-bottom:8px;}
    .art-main strong{color:var(--text);}

    /* ═══ GEO ANSWER BLOCK ═══ */
    .geo-answer{background:var(--bg);border-radius:14px;box-shadow:5px 5px 14px rgba(0,0,0,0.05),-5px -5px 14px rgba(255,255,255,0.8);padding:28px 32px;border:none;border-left:4px solid var(--blue);margin:0 0 28px;}
    .geo-answer-label{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--blue);margin-bottom:14px;}
    .geo-answer-label::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--blue);}
    .geo-answer p{font-size:16px;color:var(--text);line-height:1.75;font-weight:500;margin-bottom:0;}
    .geo-answer strong{color:var(--blue);}

    /* ═══ CALLOUT BOXES ═══ */
    .callout{padding:20px 24px;border-radius:12px;border-left:4px solid;margin:28px 0;}
    .callout-header{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
    .callout-label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;}
    .callout p{font-size:14px;line-height:1.7;color:#555;margin:0;}
    .callout-tip{border-color:var(--blue);background:rgba(6,143,255,0.04);}
    .callout-tip .callout-label,.callout-tip svg{color:var(--blue);}
    .callout-important{border-color:var(--pink);background:rgba(255,145,228,0.04);}
    .callout-important .callout-label,.callout-important svg{color:var(--pink);}
    .callout-stat{border-color:var(--indigo);background:rgba(99,102,241,0.04);}
    .callout-stat .callout-label,.callout-stat svg{color:var(--indigo);}
    .callout-retenir{border-color:#10B981;background:rgba(16,185,129,0.04);}
    .callout-retenir .callout-label,.callout-retenir svg{color:#10B981;}

    /* ═══ PULL QUOTE ═══ */
    .pull-quote{font-size:22px;font-weight:700;line-height:1.4;color:var(--text);border-left:4px solid var(--blue);padding:12px 0 12px 24px;margin:40px 0;font-style:italic;}

    /* ═══ FIGURES / IMAGES ═══ */
    .art-figure{margin:36px 0;}
    .art-img-full{width:100%;border-radius:14px;box-shadow:0 4px 20px rgba(0,0,0,0.08);}
    .art-img-caption{font-size:13px;color:var(--text-muted);text-align:center;margin-top:10px;}

    /* ═══ MYTH CARD ═══ */
    .myth-card{background:#fff;border-radius:14px;box-shadow:5px 5px 14px rgba(0,0,0,0.05),-5px -5px 14px rgba(255,255,255,0.8);padding:28px 32px;margin-bottom:20px;transition:all 0.3s ease;}
    .myth-card:hover{box-shadow:inset 3px 3px 7px rgba(0,0,0,0.04),inset -3px -3px 7px rgba(255,255,255,0.7);}
    .myth-label{display:inline-block;padding:3px 12px;border-radius:6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;margin-bottom:10px;}
    .myth-label.myth{background:rgba(255,107,43,0.08);color:var(--amber);}
    .myth-label.reality{background:rgba(0,208,132,0.08);color:var(--green);}
    .myth-card h3{font-size:16px;font-weight:700;margin-bottom:8px;margin-top:0;}
    .myth-card p{font-size:14px;color:#555;line-height:1.7;margin-bottom:0;}

    /* ═══ USE CASE CARD ═══ */
    .usecase-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:28px 0;}
    .usecase-card{background:#fff;border-radius:14px;box-shadow:5px 5px 14px rgba(0,0,0,0.05),-5px -5px 14px rgba(255,255,255,0.8);padding:24px 28px;transition:all 0.3s ease;border-top:3px solid var(--blue);}
    .usecase-card:nth-child(even){border-top-color:var(--pink);}
    .usecase-card:hover{box-shadow:inset 3px 3px 7px rgba(0,0,0,0.04),inset -3px -3px 7px rgba(255,255,255,0.7);transform:translateY(-3px);}
    .usecase-card h3{font-size:15px;font-weight:700;margin:0 0 8px;}
    .usecase-card p{font-size:13px;color:#555;line-height:1.6;margin:0;}
    @media(max-width:640px){.usecase-grid{grid-template-columns:1fr;}}

    /* ═══ PRICING TABLE ═══ */
    .pricing-compare{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border-radius:14px;box-shadow:5px 5px 14px rgba(0,0,0,0.05),-5px -5px 14px rgba(255,255,255,0.8);overflow:hidden;margin:28px 0;}
    .pricing-compare th{background:var(--bg);padding:16px 20px;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--text);text-align:left;border-bottom:1px solid rgba(0,0,0,0.06);}
    .pricing-compare td{padding:14px 20px;font-size:14px;color:#555;border-bottom:1px solid rgba(0,0,0,0.06);}
    .pricing-compare tr:last-child td{border-bottom:none;}
    .pricing-compare .highlight-cell{color:var(--blue);font-weight:700;}

    /* ═══ DECISION TREE ═══ */
    .decision-tree{display:flex;flex-direction:column;gap:16px;margin:28px 0;}
    .decision-node{background:#fff;border-radius:14px;box-shadow:5px 5px 14px rgba(0,0,0,0.05),-5px -5px 14px rgba(255,255,255,0.8);padding:24px 28px;display:flex;align-items:flex-start;gap:16px;transition:all 0.3s ease;}
    .decision-node:hover{box-shadow:inset 3px 3px 7px rgba(0,0,0,0.04),inset -3px -3px 7px rgba(255,255,255,0.7);}
    .decision-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;flex-shrink:0;box-shadow:inset 2px 2px 5px rgba(0,0,0,0.06),inset -2px -2px 5px rgba(255,255,255,0.5);}
    .decision-icon.yes{background:rgba(0,208,132,0.12);color:var(--green);}
    .decision-icon.no{background:rgba(255,107,43,0.08);color:var(--amber);}
    .decision-icon.q{background:rgba(6,143,255,0.08);color:var(--blue);}
    .decision-node h3{font-size:15px;font-weight:700;margin:0 0 4px;}
    .decision-node p{font-size:13px;color:#555;line-height:1.6;margin:0;}

    /* ═══ CRITERIA LIST ═══ */
    .criteria-list{list-style:none;display:flex;flex-direction:column;gap:14px;padding:0;margin:28px 0;}
    .criteria-list li{display:flex;gap:16px;align-items:flex-start;background:#fff;border-radius:12px;box-shadow:5px 5px 14px rgba(0,0,0,0.05),-5px -5px 14px rgba(255,255,255,0.8);padding:20px 24px;transition:all 0.2s ease;}
    .criteria-list li:hover{box-shadow:inset 3px 3px 7px rgba(0,0,0,0.04),inset -3px -3px 7px rgba(255,255,255,0.7);transform:translateX(4px);}
    .criteria-num{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;flex-shrink:0;background:rgba(6,143,255,0.08);color:var(--blue);}
    .criteria-list li strong{display:block;font-weight:700;font-size:15px;margin-bottom:4px;color:var(--text);}
    .criteria-list li span{font-size:14px;color:#555;line-height:1.6;}

    /* ═══ TIMELINE STEPS ═══ */
    .setup-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:28px 0;}
    .setup-step{background:#fff;border-radius:14px;box-shadow:5px 5px 14px rgba(0,0,0,0.05),-5px -5px 14px rgba(255,255,255,0.8);padding:28px 20px;text-align:center;transition:all 0.3s ease;}
    .setup-step:hover{box-shadow:inset 3px 3px 7px rgba(0,0,0,0.04),inset -3px -3px 7px rgba(255,255,255,0.7);transform:translateY(-4px);}
    .setup-step-num{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;margin:0 auto 14px;box-shadow:inset 2px 2px 5px rgba(0,0,0,0.06),inset -2px -2px 5px rgba(255,255,255,0.5);background:var(--blue);color:#fff;}
    .setup-step h3{font-size:14px;font-weight:700;margin:0 0 6px;}
    .setup-step p{font-size:12px;color:#555;line-height:1.5;margin:0;}
    .setup-step .setup-time{display:inline-block;margin-top:10px;padding:3px 10px;border-radius:6px;font-size:11px;font-weight:700;background:rgba(6,143,255,0.08);color:var(--blue);}
    @media(max-width:700px){.setup-steps{grid-template-columns:1fr 1fr;}}
    @media(max-width:420px){.setup-steps{grid-template-columns:1fr;}}

    /* ═══ INTERNAL LINK ═══ */
    .internal-link{display:inline-flex;align-items:center;gap:6px;color:var(--blue);font-weight:600;font-size:14px;text-decoration:none;border-bottom:1px dashed rgba(6,143,255,0.3);transition:border-color 0.2s;}
    .internal-link:hover{border-bottom-color:var(--blue);}
    .internal-link svg{flex-shrink:0;}

    /* ═══ STAT CARDS ═══ */
    .stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:28px 0;}
    .stat-card{text-align:center;padding:24px 16px;background:#fff;border-radius:14px;border:1px solid rgba(0,0,0,0.06);box-shadow:4px 4px 12px rgba(0,0,0,0.04),-3px -3px 10px rgba(255,255,255,0.8);}
    .stat-num{font-size:28px;font-weight:900;}
    .stat-num.blue{color:var(--blue);}
    .stat-num.pink{color:var(--pink);}
    .stat-num.indigo{color:var(--indigo);}
    .stat-label{font-size:13px;color:var(--text-muted);margin-top:4px;}
    @media(max-width:600px){.stat-grid{grid-template-columns:1fr;}}

    /* ═══ MID-ARTICLE CTA ═══ */
    .art-cta-mid{background:linear-gradient(145deg,#0D0F1A,#1a1d2e);border-radius:16px;padding:36px 32px;text-align:center;margin:48px 0;}
    .art-cta-mid h3{color:#fff;font-size:20px;font-weight:700;margin-bottom:8px;}
    .art-cta-mid p{color:rgba(255,255,255,0.6);font-size:15px;margin-bottom:20px;}
    .art-cta-mid .cta-btn{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;padding:12px 28px;border-radius:10px;font-size:15px;font-weight:600;text-decoration:none;transition:all 0.2s;}
    .art-cta-mid .cta-btn:hover{background:#0580e6;transform:translateY(-1px);}

    /* ═══ FINAL CTA BAND ═══ */
    .art-cta-band{background:linear-gradient(145deg,#0D0F1A,#1a1d2e);padding:64px 0;text-align:center;}
    .art-cta-band h2{color:#fff;font-size:clamp(24px,3.5vw,36px);font-weight:800;margin-bottom:8px;}
    .art-cta-band p{color:rgba(255,255,255,0.6);font-size:16px;margin-bottom:24px;max-width:500px;margin-left:auto;margin-right:auto;}
    .art-cta-band .btn-primary{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;padding:14px 32px;border-radius:12px;font-size:16px;font-weight:600;text-decoration:none;transition:all 0.2s;}
    .art-cta-band .btn-primary:hover{background:#0580e6;transform:translateY(-2px);}

    /* ═══ RECOMMENDED ARTICLES ═══ */
    .art-recommended{padding:60px 0 80px;background:var(--bg);}
    .art-recommended h2{font-size:24px;font-weight:800;color:var(--text);margin-bottom:8px;}
    .art-recommended .art-rec-sub{font-size:15px;color:var(--text-muted);margin-bottom:32px;}
    .art-rec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
    .art-rec-card{text-decoration:none;background:#fff;border-radius:14px;border:1px solid rgba(0,0,0,0.06);overflow:hidden;transition:all 0.3s ease;display:flex;flex-direction:column;}
    .art-rec-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(0,0,0,0.08);}
    .art-rec-card img{width:100%;height:160px;object-fit:cover;}
    .art-rec-card-body{padding:20px;}
    .art-rec-badge{font-size:11px;font-weight:700;color:var(--indigo);background:rgba(99,102,241,0.08);padding:3px 10px;border-radius:6px;display:inline-block;}
    .art-rec-card h4{font-size:15px;font-weight:700;color:var(--text);margin-top:10px;line-height:1.35;}
    .art-rec-card .art-rec-time{font-size:13px;color:var(--text-muted);margin-top:6px;}
    @media(max-width:768px){.art-rec-grid{grid-template-columns:1fr;}}

    /* ═══ REVEAL ANIMATION ═══ */
    .reveal{opacity:0;transform:translateY(20px);transition:opacity 0.6s ease,transform 0.6s ease;}
    .reveal.visible{opacity:1;transform:none;}
  
    /* ═══ COMP-TABLE (added for new articles) ═══ */
    .comp-table-wrap{overflow-x:auto;margin:32px 0;border-radius:14px;box-shadow:5px 5px 14px rgba(0,0,0,0.05),-5px -5px 14px rgba(255,255,255,0.8);}
    .comp-table{width:100%;border-collapse:collapse;background:#fff;font-size:14px;}
    .comp-table thead th{background:#1A1A2E;color:#fff;padding:16px 20px;text-align:left;font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:0.05em;}
    .comp-table thead th:first-child{border-radius:14px 0 0 0;}
    .comp-table thead th:last-child{border-radius:0 14px 0 0;}
    .comp-table tbody td{padding:14px 20px;border-bottom:1px solid rgba(0,0,0,0.06);color:#555;vertical-align:top;line-height:1.5;}
    .comp-table tbody tr:hover{background:rgba(6,143,255,0.03);}
    .comp-table .label-col{font-weight:700;color:#1A1A1A;min-width:140px;}
    .comp-table .highlight-cell{color:#EF4444;font-weight:700;}

    /* ═══ RECOMMENDED SECTION SPACING ═══ */
    .art-recommended{margin-top:48px;padding-top:64px;border-top:1px solid rgba(0,0,0,0.06);}