:root {
      --white: #ffffff;
      --off-white: #f7f7f7;
      --grey-light: #f3f4f6;
      --grey-border: #e5e7eb;
      --grey-text: #6b7280;
      --body-text: #4b5563;
      --heading: #111827;
      --navy: #0a1628;
      --teal: #2d8a1e;
      --teal-dark: #226b17;
      --teal-light: #eef7eb;
      --orange: #f06414;
      --orange-light: #fef0e8;
      --f: 'DM Sans', sans-serif;
      --shadow-sm: 0 2px 8px rgba(13,31,60,0.07);
      --shadow-md: 0 4px 20px rgba(13,31,60,0.10);
    }
    *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body { font-family:var(--f); background:var(--white); color:var(--body-text); overflow-x:hidden; line-height:1.65; -webkit-font-smoothing:antialiased; }

    /* NAV */
    nav { position:fixed; top:0; left:0; right:0; z-index:200; display:flex; align-items:center; justify-content:space-between; padding:0 64px; height:72px; background:rgba(255,255,255,0.96); backdrop-filter:blur(20px); border-bottom:1px solid var(--grey-border); box-shadow:var(--shadow-sm); }
    .nav-logo { font-weight:800; font-size:1.2rem; color:var(--heading); text-decoration:none; letter-spacing:-0.01em; }
    .nav-logo span { color:var(--teal); }
    .nav-links { display:flex; gap:32px; list-style:none; align-items:center; }
    .nav-links a { font-size:0.83rem; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; color:var(--grey-text); text-decoration:none; transition:color .2s; }
    .nav-links a:hover { color:var(--teal); }
    .nav-cta { position:relative; background:var(--orange) !important; color:var(--white) !important; font-weight:700 !important; padding:12px 28px; border-radius:50px; box-shadow:0 2px 12px rgba(240,100,20,0.3) !important; transition:background .2s,transform .2s !important; }
    .nav-cta::after { content:''; position:absolute; inset:0; border-radius:50px; box-shadow:0 0 0 0 rgba(240,100,20,0.5); animation:btnPulse 2.5s infinite; pointer-events:none; }
    .nav-cta:hover { background:#d6560e !important; transform:translateY(-1px) !important; }
    @keyframes btnPulse { 0%{box-shadow:0 0 0 0 rgba(240,100,20,0.6)} 70%{box-shadow:0 0 0 16px rgba(240,100,20,0)} 100%{box-shadow:0 0 0 0 rgba(240,100,20,0)} }

    /* HERO */
    .blog-hero { padding-top:72px; background:linear-gradient(135deg, #0a1628 0%, #122035 60%, #1a2f1a 100%); position:relative; overflow:hidden; min-height:520px; display:flex; align-items:center; }
    .blog-hero::before { content:''; position:absolute; top:-20%; right:-10%; width:55vw; height:55vw; background:radial-gradient(circle, rgba(45,138,30,0.18) 0%, rgba(240,100,20,0.06) 50%, transparent 70%); filter:blur(80px); pointer-events:none; }
    .blog-hero::after { content:''; position:absolute; bottom:-10%; left:-5%; width:40vw; height:40vw; background:radial-gradient(circle, rgba(240,100,20,0.10) 0%, transparent 70%); filter:blur(60px); pointer-events:none; }
    .hero-inner { max-width:900px; margin:0 auto; padding:80px 60px; position:relative; z-index:2; }
    .blog-category { display:inline-flex; align-items:center; gap:8px; background:rgba(45,138,30,0.2); border:1px solid rgba(45,138,30,0.4); padding:6px 16px; border-radius:20px; font-size:0.72rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:#7ed86a; margin-bottom:24px; }
    .blog-hero h1 { font-size:clamp(2.2rem,4.5vw,3.8rem); font-weight:800; line-height:1.1; letter-spacing:-0.03em; color:#fff; margin-bottom:20px; }
    .blog-hero h1 em { font-style:normal; color:#7ed86a; }
    .blog-meta { display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:28px; padding-top:28px; border-top:1px solid rgba(255,255,255,0.12); }
    .blog-meta-item { font-size:0.82rem; color:rgba(255,255,255,0.55); display:flex; align-items:center; gap:6px; }
    .blog-meta-item strong { color:rgba(255,255,255,0.85); }
    .reading-badge { background:rgba(240,100,20,0.25); border:1px solid rgba(240,100,20,0.4); color:#f9a06b; padding:4px 12px; border-radius:20px; font-size:0.72rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; }

    /* ARTICLE */
    .article-wrap { max-width:800px; margin:0 auto; padding:64px 40px 80px; }
    .lead-text { font-size:1.18rem; line-height:1.85; color:#374151; font-weight:500; margin-bottom:40px; padding:28px 32px; background:linear-gradient(135deg,var(--teal-light),#fff8f3); border-left:4px solid var(--teal); border-radius:0 12px 12px 0; }
    h2.section-h { font-size:1.65rem; font-weight:800; color:var(--heading); letter-spacing:-0.02em; margin:48px 0 18px; line-height:1.2; }
    h3.sub-h { font-size:1.15rem; font-weight:700; color:var(--heading); margin:32px 0 12px; }
    p { font-size:0.97rem; line-height:1.82; color:var(--body-text); margin-bottom:18px; }
    .highlight-box { background:var(--off-white); border:1.5px solid var(--grey-border); border-left:4px solid var(--orange); border-radius:0 12px 12px 0; padding:24px 28px; margin:32px 0; }
    .highlight-box p { margin-bottom:0; font-size:0.95rem; }
    .stat-callout { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:40px 0; }
    .stat-callout-item { background:var(--navy); border-radius:14px; padding:28px 20px; text-align:center; position:relative; overflow:hidden; }
    .stat-callout-item::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--orange),rgba(240,100,20,0.3)); }
    .stat-callout-item:nth-child(even)::before { background:linear-gradient(90deg,var(--teal),rgba(45,138,30,0.3)); }
    .stat-callout-item .snum { font-size:2.2rem; font-weight:800; color:#fff; line-height:1; letter-spacing:-0.04em; margin-bottom:8px; }
    .stat-callout-item .slbl { font-size:0.72rem; color:rgba(255,255,255,0.55); text-transform:uppercase; letter-spacing:0.1em; font-weight:600; line-height:1.5; }
    .paa-block { background:linear-gradient(135deg, #f0f9ec, #fff8f3); border:1.5px solid rgba(45,138,30,0.25); border-radius:16px; padding:36px; margin:48px 0; }
    .paa-block h3 { font-size:1rem; font-weight:800; color:var(--teal); text-transform:uppercase; letter-spacing:0.1em; margin-bottom:20px; display:flex; align-items:center; gap:8px; }
    .paa-item { border-bottom:1px solid rgba(45,138,30,0.15); padding:14px 0; cursor:pointer; }
    .paa-item:last-child { border-bottom:none; }
    .paa-q { font-weight:700; font-size:0.95rem; color:var(--heading); display:flex; justify-content:space-between; align-items:center; }
    .paa-q::after { content:'＋'; color:var(--teal); font-size:1.1rem; flex-shrink:0; transition:transform .3s; }
    .paa-item.open .paa-q::after { transform:rotate(45deg); }
    .paa-a { font-size:0.88rem; color:var(--body-text); line-height:1.75; padding:12px 0 4px; display:none; }
    .paa-item.open .paa-a { display:block; }
    .checklist { list-style:none; margin:20px 0 28px; }
    .checklist li { display:flex; align-items:flex-start; gap:12px; font-size:0.92rem; color:var(--body-text); margin-bottom:12px; padding:10px 14px; border-radius:8px; border:1px solid transparent; transition:border-color .2s,background .2s; }
    .checklist li:hover { background:var(--teal-light); border-color:rgba(45,138,30,0.2); }
    .checklist li::before { content:'✓'; width:22px; height:22px; border-radius:50%; background:var(--teal); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:0.7rem; font-weight:800; flex-shrink:0; margin-top:1px; }
    .pull-quote { border-left:5px solid var(--orange); padding:20px 28px; margin:36px 0; background:var(--orange-light); border-radius:0 12px 12px 0; }
    .pull-quote p { font-size:1.1rem; font-weight:700; font-style:italic; color:var(--heading); margin-bottom:0; line-height:1.65; }
    .tag-row { display:flex; flex-wrap:wrap; gap:8px; margin:40px 0 0; }
    .tag { background:var(--teal-light); border:1px solid rgba(45,138,30,0.25); color:var(--teal-dark); font-size:0.72rem; font-weight:700; letter-spacing:0.06em; padding:5px 13px; border-radius:20px; text-transform:uppercase; }
    .cta-banner { background:linear-gradient(135deg,#0a1628,#1a2f1a); border-radius:20px; padding:48px 44px; margin:56px 0 0; text-align:center; position:relative; overflow:hidden; }
    .cta-banner::before { content:''; position:absolute; top:-40%; right:-15%; width:50%; height:200%; background:radial-gradient(circle,rgba(45,138,30,0.2),transparent 70%); pointer-events:none; }
    .cta-banner h3 { font-size:1.8rem; font-weight:800; color:#fff; margin-bottom:12px; letter-spacing:-0.02em; }
    .cta-banner p { color:rgba(255,255,255,0.65); font-size:0.95rem; margin-bottom:28px; max-width:480px; margin-left:auto; margin-right:auto; }
    .btn-primary { display:inline-flex; align-items:center; gap:9px; background:var(--orange); color:#fff; font-weight:700; font-size:0.92rem; padding:16px 36px; border-radius:50px; text-decoration:none; transition:transform .2s,box-shadow .2s; box-shadow:0 3px 18px rgba(240,100,20,0.4); }
    .btn-primary:hover { transform:translateY(-2px); box-shadow:0 6px 28px rgba(240,100,20,0.5); }
    .btn-secondary { display:inline-flex; align-items:center; gap:9px; background:transparent; color:var(--teal); font-weight:700; font-size:0.92rem; padding:14px 34px; border-radius:50px; border:2px solid var(--teal); text-decoration:none; transition:background .2s,transform .2s; margin-left:12px; }
    .btn-secondary:hover { background:var(--teal-light); transform:translateY(-1px); }
    .related-posts { margin:64px 0 0; padding:48px 0; border-top:1px solid var(--grey-border); }
    .related-posts h3 { font-size:1.2rem; font-weight:800; color:var(--heading); margin-bottom:24px; }
    .related-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
    .rel-card { background:var(--off-white); border:1.5px solid var(--grey-border); border-radius:14px; padding:28px; transition:transform .25s,box-shadow .25s,border-color .25s; text-decoration:none; display:block; }
    .rel-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:rgba(45,138,30,0.35); }
    .rel-cat { font-size:0.69rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--teal); margin-bottom:8px; }
    .rel-title { font-size:0.97rem; font-weight:700; color:var(--heading); line-height:1.4; }
    .divider { width:60px; height:4px; background:linear-gradient(90deg,var(--teal),rgba(45,138,30,0.3)); border-radius:2px; margin:0 0 28px; }
    @keyframes riseUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
    .animate-in { animation:riseUp .7s ease both; }
    .animate-in-2 { animation:riseUp .7s .15s ease both; }
    .animate-in-3 { animation:riseUp .7s .3s ease both; }
    .cost-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin:32px 0; }
    .cost-card { background:var(--off-white); border:1.5px solid var(--grey-border); border-radius:14px; padding:28px; display:flex; flex-direction:column; gap:10px; transition:transform .25s,box-shadow .25s,border-color .25s; }
    .cost-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:rgba(45,138,30,0.35); }
    .cc-icon { font-size:1.8rem; line-height:1; }
    .cc-title { font-size:0.97rem; font-weight:700; color:var(--heading); }
    .cc-desc { font-size:0.84rem; color:var(--body-text); line-height:1.65; }
    .impact-strip { display:grid; grid-template-columns:repeat(3,1fr); gap:0; background:var(--navy); border-radius:14px; overflow:hidden; margin:32px 0; }
    .impact-item { padding:32px 28px; text-align:center; border-right:1px solid rgba(255,255,255,0.1); }
    .impact-item:last-child { border-right:none; }
    .impact-num { font-size:2.2rem; font-weight:800; color:#00c9b1; line-height:1; margin-bottom:10px; }
    .impact-lbl { font-size:0.83rem; color:rgba(255,255,255,0.72); line-height:1.55; }
    @media(max-width:960px) { nav{padding:0 20px;} .nav-links{display:none;} .hero-inner{padding:60px 24px;} .article-wrap{padding:40px 22px 60px;} .stat-callout{grid-template-columns:1fr 1fr;} .related-grid{grid-template-columns:1fr;} .cost-grid{grid-template-columns:1fr 1fr;} .impact-strip{grid-template-columns:1fr;} .impact-item{border-right:none;border-bottom:1px solid rgba(255,255,255,0.1);} .impact-item:last-child{border-bottom:none;} }
    @media(max-width:600px) { .cost-grid{grid-template-columns:1fr;} }
    @media(max-width:600px) { .stat-callout{grid-template-columns:1fr;} }