:root {
    --gb-ink: #13251f;
    --gb-muted: #5e6f68;
    --gb-line: #dce6e1;
    --gb-soft: #f2f7f4;
    --gb-green: #0c7a4c;
    --gb-green-dark: #075e3a;
    --gb-blue: #315e78;
    --gb-paper: #fbfcfa;
}

.gb-page { background: var(--gb-paper); color: var(--gb-ink); }
.gb-page a { color: inherit; }
.gb-breadcrumb { display:flex; align-items:center; gap:9px; margin-bottom:34px; color:#60716a; font-size:.78rem; }
.gb-breadcrumb a { text-decoration:none; }
.gb-breadcrumb a:hover { color:var(--gb-green); }
.gb-kicker,.gb-eyebrow { color:var(--gb-green); font-size:.72rem; font-weight:800; letter-spacing:.16em; }

.gb-hero { position:relative; overflow:hidden; padding:52px 0 62px; background:linear-gradient(145deg,#edf5f0 0%,#fbfcfa 58%,#e7eff3 100%); }
.gb-hero:before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 8% 10%,rgba(12,122,76,.09),transparent 34%),linear-gradient(90deg,rgba(255,255,255,.45) 1px,transparent 1px); background-size:auto,64px 64px; }
.gb-hero .container { position:relative; }
.gb-hero-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(420px,.92fr); gap:56px; align-items:center; }
.gb-hero-copy h1 { margin:15px 0 20px; max-width:720px; font-size:clamp(2.35rem,4.5vw,4.75rem); line-height:1.08; letter-spacing:-.05em; font-weight:850; }
.gb-hero-copy>p { max-width:690px; color:#40544b; font-size:1.04rem; line-height:1.85; }
.gb-hero-meta { display:flex; flex-wrap:wrap; gap:10px; margin-top:27px; }
.gb-hero-meta span { display:inline-flex; gap:7px; align-items:center; padding:8px 12px; border:1px solid rgba(12,122,76,.18); border-radius:999px; background:rgba(255,255,255,.72); color:#315046; font-size:.77rem; font-weight:700; }
.gb-hero-media { position:relative; margin:0; }
.gb-hero-media img { display:block; width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:22px; box-shadow:0 24px 55px rgba(22,48,38,.18); }
.gb-hero-media figcaption { position:absolute; right:14px; bottom:14px; max-width:80%; padding:8px 11px; border-radius:9px; background:rgba(13,32,25,.8); color:#eef7f2; backdrop-filter:blur(8px); font-size:.7rem; }

.gb-principles { padding:28px 0; background:#fff; border-bottom:1px solid var(--gb-line); }
.gb-principle-grid { display:grid; grid-template-columns:repeat(3,1fr); }
.gb-principle-grid article { display:flex; gap:16px; padding:12px 26px; border-right:1px solid var(--gb-line); }
.gb-principle-grid article:first-child { padding-left:0; }
.gb-principle-grid article:last-child { border-right:0; padding-right:0; }
.gb-principle-grid article>span { color:var(--gb-green); font-weight:850; font-size:.76rem; }
.gb-principle-grid strong { display:block; margin-bottom:4px; font-size:.9rem; }
.gb-principle-grid p { margin:0; color:var(--gb-muted); font-size:.78rem; line-height:1.6; }

.gb-feed { padding:76px 0 88px; }
.gb-section-head { display:flex; justify-content:space-between; gap:24px; align-items:flex-end; margin-bottom:28px; }
.gb-section-head h2 { margin:7px 0 8px; font-size:clamp(1.65rem,2.8vw,2.45rem); letter-spacing:-.035em; font-weight:830; }
.gb-section-head p { margin:0; color:var(--gb-muted); }
.gb-count { min-width:86px; display:flex; flex-direction:column; align-items:flex-end; }
.gb-count strong { font-size:2.5rem; line-height:1; color:var(--gb-green); }
.gb-count span { margin-top:5px; color:var(--gb-muted); font-size:.72rem; }
.gb-filters { display:flex; gap:8px; overflow:auto; padding-bottom:14px; margin-bottom:22px; scrollbar-width:thin; }
.gb-filters a { display:flex; gap:7px; align-items:center; flex:0 0 auto; padding:9px 14px; border:1px solid var(--gb-line); border-radius:999px; background:#fff; text-decoration:none; color:#4b5c55; font-size:.8rem; font-weight:700; }
.gb-filters a:hover,.gb-filters a.active { border-color:var(--gb-green); background:var(--gb-green); color:#fff; }
.gb-filters small { opacity:.7; }
.gb-card-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.gb-card { display:flex; flex-direction:column; min-height:100%; padding:28px; border:1px solid var(--gb-line); border-radius:18px; background:#fff; box-shadow:0 8px 30px rgba(37,63,53,.05); }
.gb-card-featured { grid-column:1/-1; padding:34px; background:linear-gradient(135deg,#0e3d2c 0%,#145b42 100%); color:#fff; border:0; }
.gb-card-meta { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.gb-sector,.gb-status { display:inline-flex; align-items:center; padding:5px 9px; border-radius:999px; font-size:.68rem; font-weight:800; }
.gb-sector { color:var(--gb-green-dark); background:#e7f4ed; }
.gb-status { color:var(--gb-blue); background:#e8f1f6; }
.gb-card-featured .gb-sector,.gb-card-featured .gb-status { background:rgba(255,255,255,.13); color:#fff; }
.gb-card-meta time,.gb-detail-meta time { margin-left:auto; color:#718078; font-size:.72rem; }
.gb-card-featured .gb-card-meta time { color:#c9ded5; }
.gb-card h3 { margin:0 0 12px; font-size:1.32rem; line-height:1.42; letter-spacing:-.025em; font-weight:820; }
.gb-card-featured h3 { font-size:clamp(1.55rem,2.5vw,2.15rem); max-width:850px; }
.gb-card h3 a { text-decoration:none; }
.gb-card h3 a:hover { color:var(--gb-green); }
.gb-card-featured h3 a:hover { color:#b6efd2; }
.gb-card-summary { margin:0; color:var(--gb-muted); line-height:1.75; font-size:.9rem; }
.gb-card-featured .gb-card-summary { color:#d8e7e0; max-width:920px; font-size:.96rem; }
.gb-why { margin:19px 0 0; padding:15px 17px; border-left:3px solid #49a77c; background:var(--gb-soft); }
.gb-why strong { display:block; margin-bottom:5px; color:var(--gb-green-dark); font-size:.76rem; }
.gb-why p { margin:0; color:#4c5f56; font-size:.82rem; line-height:1.65; }
.gb-card-featured .gb-why { background:rgba(255,255,255,.08); }
.gb-card-featured .gb-why strong { color:#aee8c9; }
.gb-card-featured .gb-why p { color:#d8e7e0; }
.gb-point-list { display:grid; gap:7px; margin:18px 0 0; padding:0; list-style:none; }
.gb-point-list li { position:relative; padding-left:17px; color:#53645c; font-size:.8rem; line-height:1.55; }
.gb-point-list li:before { content:""; position:absolute; top:.62em; left:0; width:5px; height:5px; border-radius:50%; background:var(--gb-green); }
.gb-card-featured .gb-point-list li { color:#d3e3dc; }
.gb-card-featured .gb-point-list li:before { background:#8dd9b2; }
.gb-card-foot { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:auto; padding-top:22px; }
.gb-card-foot>span { color:#728178; font-size:.75rem; }
.gb-card-foot>a { color:var(--gb-green); font-size:.78rem; font-weight:800; text-decoration:none; }
.gb-card-featured .gb-card-foot>span { color:#c3d6cd; }
.gb-card-featured .gb-card-foot>a { color:#b7efd2; }
.gb-empty { text-align:center; padding:64px 24px; border:1px dashed #b8c9c0; border-radius:18px; background:#fff; }
.gb-empty i { color:var(--gb-green); font-size:2rem; }
.gb-empty h3 { margin:13px 0 8px; }
.gb-empty p { color:var(--gb-muted); }
.gb-empty a { color:var(--gb-green); font-weight:800; }

.gb-method { padding:76px 0; background:#eaf2ed; }
.gb-method-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:68px; align-items:start; }
.gb-method h2 { margin:8px 0 14px; font-size:2rem; letter-spacing:-.035em; }
.gb-method-grid>div>p { color:#51625a; line-height:1.75; }
.gb-method ol { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin:0; padding:0; list-style:none; }
.gb-method li { display:flex; gap:13px; padding:18px; border:1px solid rgba(12,122,76,.15); border-radius:14px; background:rgba(255,255,255,.78); }
.gb-method li>span { display:grid; place-items:center; flex:0 0 30px; height:30px; border-radius:50%; background:var(--gb-green); color:#fff; font-size:.72rem; font-weight:800; }
.gb-method li strong { font-size:.85rem; }
.gb-method li p { margin:5px 0 0; color:#596b62; font-size:.76rem; line-height:1.6; }
.gb-disclaimer { display:flex; gap:12px; margin-top:34px; padding:16px 18px; border:1px solid #c8d9d0; border-radius:12px; background:#fff; color:#52635b; }
.gb-disclaimer i { flex:0 0 auto; color:var(--gb-green); }
.gb-disclaimer p { margin:0; font-size:.78rem; line-height:1.7; }

.gb-reading-width { max-width:980px; }
.gb-detail-hero { padding:48px 0 42px; background:linear-gradient(160deg,#edf5f0,#f9fbfa); border-bottom:1px solid var(--gb-line); }
.gb-detail-meta { display:flex; align-items:center; gap:9px; margin-bottom:20px; }
.gb-detail-hero h1 { max-width:850px; margin:0; font-size:clamp(2rem,4vw,3.7rem); line-height:1.16; letter-spacing:-.045em; font-weight:850; }
.gb-detail-lead { max-width:840px; margin:22px 0 0; color:#4c5f56; font-size:1.04rem; line-height:1.85; }
.gb-source-strip { display:grid; grid-template-columns:1fr 1.2fr auto; gap:18px; align-items:center; margin-top:30px; padding:17px 18px; border:1px solid var(--gb-line); border-radius:13px; background:#fff; }
.gb-source-strip div { display:flex; flex-direction:column; gap:3px; }
.gb-source-strip span { color:#7a8982; font-size:.67rem; }
.gb-source-strip strong { color:#243a31; font-size:.8rem; }
.gb-source-strip>a { display:inline-flex; gap:7px; align-items:center; padding:10px 13px; border-radius:9px; background:var(--gb-green); color:#fff; text-decoration:none; font-size:.76rem; font-weight:800; }
.gb-detail-body { padding:58px 0 82px; }
.gb-article { max-width:820px; margin:0 auto; }
.gb-article-section { display:grid; grid-template-columns:48px 1fr; gap:18px; padding:34px 0; border-bottom:1px solid var(--gb-line); }
.gb-section-number { display:grid; place-items:center; width:40px; height:40px; border-radius:50%; background:#e6f2ec; color:var(--gb-green); font-size:.72rem; font-weight:850; }
.gb-article-section h2 { margin:2px 0 15px; font-size:1.45rem; letter-spacing:-.025em; font-weight:820; }
.gb-article-section p { margin:0; color:#4c5e55; line-height:1.88; }
.gb-highlight { margin-top:8px; }
.gb-audience-box { display:flex; gap:16px; margin:24px 0 4px 66px; padding:20px; border-radius:14px; background:#edf5f1; }
.gb-audience-box i { color:var(--gb-green); font-size:1.25rem; }
.gb-audience-box strong { font-size:.8rem; }
.gb-audience-box p { margin:5px 0 0; color:#51645a; font-size:.85rem; line-height:1.7; }
.gb-detail-list { display:grid; gap:12px; margin:0; padding:0; list-style:none; }
.gb-detail-list li { position:relative; padding:12px 14px 12px 37px; border-radius:10px; background:#f4f7f5; color:#344a40; line-height:1.65; }
.gb-detail-list li:before { content:"✓"; position:absolute; top:12px; left:14px; color:var(--gb-green); font-weight:900; }
.gb-check-grid { display:flex; flex-wrap:wrap; gap:9px; }
.gb-check-grid span { display:inline-flex; align-items:center; gap:7px; padding:9px 11px; border:1px solid var(--gb-line); border-radius:9px; color:#42574d; font-size:.8rem; }
.gb-check-grid i { color:var(--gb-green); }
.gb-action-list { display:grid; gap:12px; margin:0; padding:0; list-style:none; }
.gb-action-list li { display:flex; gap:13px; align-items:flex-start; }
.gb-action-list li>span { display:grid; place-items:center; flex:0 0 29px; height:29px; border-radius:8px; background:var(--gb-ink); color:#fff; font-size:.7rem; font-weight:800; }
.gb-action-list p { margin:2px 0 0; }
.gb-analysis-note { margin:35px 0; padding:24px; border-radius:15px; background:#173d31; color:#fff; }
.gb-analysis-note span { color:#9ee2bd; font-size:.7rem; font-weight:850; letter-spacing:.1em; }
.gb-analysis-note p { margin:10px 0 0; color:#e0ebe6; line-height:1.8; }
.gb-official-source { display:flex; justify-content:space-between; gap:24px; align-items:center; margin:35px 0 0; padding:24px; border:1px solid #9fc4b2; border-radius:15px; background:#f1f8f4; }
.gb-official-source span { color:var(--gb-green); font-size:.65rem; font-weight:850; letter-spacing:.12em; }
.gb-official-source h2 { margin:5px 0 8px; font-size:1.1rem; }
.gb-official-source p { margin:0 0 5px; color:#3f544a; line-height:1.55; }
.gb-official-source small { color:#788780; }
.gb-official-source>a { flex:0 0 auto; padding:10px 13px; border-radius:9px; background:var(--gb-green); color:#fff; text-decoration:none; font-size:.76rem; font-weight:800; }
.gb-article-footer { display:flex; justify-content:space-between; gap:16px; align-items:center; margin-top:24px; color:#77867f; font-size:.72rem; }
.gb-article-footer a { color:var(--gb-green); text-decoration:none; font-weight:800; }
.gb-related { max-width:820px; margin:68px auto 0; }
.gb-related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.gb-related-grid a { display:flex; flex-direction:column; gap:8px; min-height:150px; padding:18px; border:1px solid var(--gb-line); border-radius:13px; background:#fff; text-decoration:none; }
.gb-related-grid a:hover { border-color:#8abda5; transform:translateY(-2px); }
.gb-related-grid span { color:var(--gb-green); font-size:.68rem; font-weight:800; }
.gb-related-grid strong { line-height:1.5; }
.gb-related-grid small { margin-top:auto; color:#7b8982; }

@media (max-width:991.98px) {
    .gb-hero-grid { grid-template-columns:1fr; gap:34px; }
    .gb-hero-media { max-width:760px; }
    .gb-method-grid { grid-template-columns:1fr; gap:30px; }
}

@media (max-width:767.98px) {
    .gb-hero { padding:35px 0 42px; }
    .gb-breadcrumb { margin-bottom:24px; }
    .gb-hero-copy h1 { font-size:2.35rem; }
    .gb-hero-grid { gap:28px; }
    .gb-principle-grid { grid-template-columns:1fr; }
    .gb-principle-grid article,.gb-principle-grid article:first-child,.gb-principle-grid article:last-child { padding:14px 0; border-right:0; border-bottom:1px solid var(--gb-line); }
    .gb-principle-grid article:last-child { border-bottom:0; }
    .gb-feed,.gb-method { padding:54px 0; }
    .gb-card-grid { grid-template-columns:1fr; }
    .gb-card-featured { grid-column:auto; padding:25px; }
    .gb-card { padding:23px; }
    .gb-section-head { align-items:flex-start; }
    .gb-count { display:none; }
    .gb-method ol { grid-template-columns:1fr; }
    .gb-detail-hero { padding:34px 0; }
    .gb-source-strip { grid-template-columns:1fr; }
    .gb-source-strip>a { justify-content:center; }
    .gb-article-section { grid-template-columns:1fr; gap:10px; }
    .gb-audience-box { margin-left:0; }
    .gb-official-source { align-items:flex-start; flex-direction:column; }
    .gb-official-source>a { width:100%; justify-content:center; text-align:center; }
    .gb-related-grid { grid-template-columns:1fr; }
}
