/* ETG Calculator Blog page (page 787). Every rule is scoped to #etgb. */
#etgb{--navy:#0B2A4E; --navy-2:#0E3563; --blue:#1E6FEB; --blue-dark:#1553B5; --blue-wash:#EAF2FF; --blue-line:#CFE2FF; --ink:#16233A; --muted:#5B6B82; --line:#E3E7ED; --bg:#FFFFFF; --bg-alt:#F5F7FA;}
#etgb *,#etgb *::before,#etgb *::after{box-sizing:border-box}
#etgb{margin:0; background:var(--bg); color:var(--ink); font-family:"Inter", -apple-system, BlinkMacSystemFont, sans-serif; font-size:16px; -webkit-font-smoothing:antialiased; line-height:1.5}
#etgb h1,#etgb h2,#etgb h3{margin:0; letter-spacing:-.02em; color:var(--ink); font-family:inherit; line-height:1.25}
#etgb p{margin:0}
#etgb a{color:var(--blue)}
#etgb button{margin:0; line-height:inherit; text-transform:none; letter-spacing:normal; box-shadow:none}
#etgb section{margin:0}
#etgb .wrap{max-width:1280px; margin:0 auto; padding:0 clamp(24px,3.2vw,40px)}
#etgb .bhero{background:var(--bg-alt); padding:44px 0 36px}
#etgb .bhero .bhero-title{font-size:32px; font-weight:800}
#etgb .bhero p{margin-top:12px; font-size:15.5px; color:var(--muted); max-width:72ch}
#etgb .filters{position:sticky; top:0; z-index:10; background:#fff; border-bottom:1px solid var(--line); padding:16px 0}
#etgb .filter-row{display:flex; flex-wrap:wrap; gap:8px}
#etgb .filter-btn{appearance:none; border:1.5px solid var(--line); background:#fff; color:var(--ink); font:inherit; font-size:13.5px; font-weight:600; padding:8px 14px; border-radius:100px; cursor:pointer; transition:background-color .15s ease, border-color .15s ease, color .15s ease}
#etgb .filter-btn:hover{border-color:var(--blue-line); background:#fff; color:var(--ink)}
#etgb .filter-btn.active,#etgb .filter-btn.active:hover{background:var(--blue); border-color:var(--blue); color:#fff}
#etgb .filter-count{opacity:.75; font-weight:500}
#etgb .featured{padding:36px 0 8px}
#etgb .featured-head{display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:18px}
#etgb .featured-eyebrow{display:flex; align-items:center; gap:8px; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--blue-dark)}
#etgb .featured-eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--blue)}
#etgb .featured h2{font-size:24px; font-weight:800; margin-top:4px}
#etgb .carousel-arrows{display:flex; gap:8px; flex:none}
#etgb .carousel-arrow{width:38px; height:38px; padding:0; border-radius:50%; border:1.5px solid var(--line); background:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:border-color .15s ease, background-color .15s ease}
#etgb .carousel-arrow:hover{border-color:var(--blue); background:var(--blue-wash)}
#etgb .carousel-arrow svg{width:16px; height:16px; color:var(--ink)}
#etgb .featured-scroll{display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:8px; scrollbar-width:none}
#etgb .featured-scroll::-webkit-scrollbar{display:none}
#etgb .featured-card{flex:0 0 320px; scroll-snap-align:start; border:1px solid var(--line); border-radius:16px; overflow:hidden; text-decoration:none; color:inherit; transition:transform .18s ease, box-shadow .18s ease}
#etgb .featured-card:hover{transform:translateY(-3px); box-shadow:0 22px 42px -24px rgba(11,42,78,.3); color:inherit}
#etgb .featured-card .thumb{height:170px}
#etgb .featured-card .post-body{padding:16px 18px 20px}
#etgb .featured-card .post-title{font-size:16.5px}
#etgb .grid-wrap{padding:36px 0 60px}
#etgb .grid-title{font-size:20px; font-weight:800; margin-bottom:18px}
#etgb .post-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
@media (max-width:900px){
#etgb .post-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:620px){
#etgb .post-grid{grid-template-columns:1fr}
}
#etgb .post-card{border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#fff; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; display:flex; flex-direction:column; text-decoration:none; color:inherit}
#etgb .post-card[hidden]{display:none}
#etgb .post-card:hover{transform:translateY(-3px); box-shadow:0 20px 38px -24px rgba(11,42,78,.28); border-color:var(--blue-line); color:inherit}
#etgb .thumb{height:194px; position:relative; padding:16px 18px; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden}
#etgb .scene-tag{align-self:flex-start; font:700 10.5px/1 "Inter",sans-serif; letter-spacing:.06em; text-transform:uppercase; background:rgba(255,255,255,.85); padding:6px 10px; border-radius:100px; position:relative; z-index:2}
#etgb .scene-caption{font-size:12.5px; font-weight:500; position:relative; z-index:2}
#etgb .scene-body{position:absolute; inset:0; z-index:1; display:flex; align-items:center; justify-content:center; padding:0 18px}
#etgb .scene-badge{display:flex; align-items:center; gap:12px; background:#fff; border-radius:12px; padding:12px 16px; box-shadow:0 10px 22px -14px rgba(11,42,78,.25); max-width:82%}
#etgb .badge-dot{width:10px; height:10px; border-radius:50%; flex:none; animation:dotPulse 1.8s ease-in-out infinite}
@keyframes dotPulse{0%,100%{opacity:1; transform:scale(1)}50%{opacity:.4; transform:scale(.8)}}
#etgb .scene-badge b{display:block; font-size:14px}
#etgb .scene-badge span{display:block; font-size:11.5px; color:#8792A3; margin-top:2px}
#etgb .badge-ic{width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; flex:none}
#etgb .scene-badge .badge-ic{margin-top:0}
#etgb .badge-ic svg{width:17px; height:17px; color:#fff}
#etgb .scene-lines{width:100%; max-width:230px; display:grid; gap:11px}
#etgb .line-row{display:flex; align-items:center; gap:10px}
#etgb .line-row .mark{flex:none; width:9px; height:9px}
#etgb .line-row .bar{height:9px; border-radius:100px; animation:barGrow 1s cubic-bezier(.22,1,.36,1) both}
@keyframes barGrow{0%{width:0 !important}}
#etgb .scene-chart{text-align:left}
#etgb .scene-chart b{font-size:22px; font-weight:800; display:block}
#etgb .scene-chart > span{font-size:11.5px; color:#8792A3}
#etgb .chart-svg{width:150px; height:44px; margin-top:8px; display:block}
#etgb .chart-line{fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:220; stroke-dashoffset:220; animation:chartDraw 2.6s ease-in-out infinite}
@keyframes chartDraw{0%{stroke-dashoffset:220}45%{stroke-dashoffset:0}90%{stroke-dashoffset:0}100%{stroke-dashoffset:-220}}
@media (prefers-reduced-motion:reduce){
#etgb .badge-dot,#etgb .line-row .bar,#etgb .chart-line{animation:none !important}
}
#etgb .post-body{padding:16px 18px 18px; display:flex; flex-direction:column; gap:8px; flex:1}
#etgb .post-title{font-size:15px; font-weight:700; line-height:1.35}
#etgb .post-excerpt{font-size:13px; color:var(--muted); line-height:1.5; flex:1}
#etgb .post-link{margin-top:4px; font-size:13px; font-weight:600; color:var(--blue); text-decoration:none; display:inline-flex; align-items:center; gap:5px}
#etgb .post-link svg{width:11px;height:11px; transition:transform .15s ease}
#etgb .post-card:hover .post-link svg,#etgb .featured-card:hover .post-link svg{transform:translateX(3px)}
#etgb .empty-state{display:none; text-align:center; padding:60px 0; color:var(--muted); font-size:14.5px}
/* theme wrappers on the Blog page only; the theme header and footer are not touched */
.page-id-787 .entry-header{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.page-id-787 #content>.ast-container{max-width:none!important;width:100%!important;padding:0!important;margin:0!important;display:block!important}
.page-id-787 #primary{width:100%!important;margin:0!important;padding:0!important}
.page-id-787 .ast-article-single,.page-id-787 .entry-content{margin:0!important;padding:0!important}
.page-id-787 .site-main{margin:0!important;padding:0!important}
.page-id-787 .entry-content>#etgb{max-width:none!important;width:100%!important;margin:0!important}
