/* An editorial extension of the institutional GOH identity. */
.tone-shop {--topic:#3c7057; --topic-tint:#e9efe9;}
.tone-gym {--topic:#52614a; --topic-tint:#eef0e6;}
.tone-care {--topic:#43576c; --topic-tint:#eaf0f4;}
.tone-resto {--topic:#a5362d; --topic-tint:#f7eae3;}
.tone-tax {--topic:#75691a; --topic-tint:#f5f1d9;}
.tone-goh {--topic:#3b2f2f; --topic-tint:#f0ede5;}
.blog-intro {padding-top:58px; padding-bottom:42px;}
.blog-intro-top {display:flex; justify-content:space-between; gap:24px; align-items:center; margin-bottom:30px;}
.blog-intro-top .eyebrow {font-size:9px; color:#3c7057;}
.blog-intro-top > span {font-size:10px; color:var(--muted);}
.blog-intro-grid {display:grid; grid-template-columns:1.2fr 1fr; gap:90px; align-items:end;}
.blog-intro h1 {font-size:clamp(40px,4.7vw,66px); font-weight:600; letter-spacing:-.045em; line-height:1.06;}
.blog-intro h1 span {color:#667660;}
.blog-intro-grid > div > p {font-size:13px; color:var(--muted); line-height:1.9; max-width:430px;}
.blog-intro-grid .text-link {font-size:11px; margin-top:9px;}
.blog-feature {display:grid; grid-template-columns:1.05fr 1fr; overflow:hidden; border:1px solid #dce3d8; border-radius:14px; background:#f4f7f1;}
.blog-feature-art {position:relative; display:block; overflow:hidden; background:#dfe9df; min-height:355px; padding:26px 30px 0;}
.feature-brand {display:flex; align-items:center; justify-content:space-between; gap:25px; margin-bottom:24px;}
.feature-brand img {width:94px; height:94px; object-fit:contain;}
.feature-brand span {font:600 27px/1.1 var(--font-heading); letter-spacing:-.025em; color:#405642;}
.feature-screen {width:100%; border:5px solid #354b3a; border-radius:8px; box-shadow:0 10px 20px #1f372512; margin-bottom:-46%;}
.blog-feature-copy {padding:38px; display:flex; flex-direction:column; justify-content:center;}
.blog-feature-copy > .eyebrow {font-size:9px; color:#52694e; margin-bottom:19px;}
.blog-feature h2 {font-size:clamp(28px,3vw,40px); font-weight:600; letter-spacing:-.025em; line-height:1.17;}
.blog-feature h2 a:hover {text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px;}
.blog-feature-copy > p:not(.eyebrow) {font-size:12px; line-height:1.85; color:#64705e; margin-top:20px;}
.blog-feature-bottom {display:flex; align-items:center; justify-content:space-between; gap:18px; padding-top:20px; margin-top:20px; border-top:1px solid #d9e0d4;}
.blog-feature-bottom .text-link {font-size:12px;}
.blog-feature-bottom > span {font-size:10px; color:#64705e; white-space:nowrap;}
.blog-library {padding-top:66px; padding-bottom:60px;}
.blog-library-heading {display:flex; justify-content:space-between; align-items:end; gap:30px;}
.blog-library-heading .eyebrow {font-size:9px; color:var(--muted); margin-bottom:12px;}
.blog-library h2,.blog-related > h2 {font-size:34px; font-weight:600; letter-spacing:-.03em;}
.blog-search {display:flex; border:1px solid var(--line); border-radius:5px; min-width:280px; height:47px; background:#fff;}
.blog-search input {border:0; border-radius:5px; background:none; color:var(--ink); min-width:0; width:100%; padding:12px; font-size:14px;}
.blog-search button {border:0; border-radius:5px; background:none; color:var(--ink); width:46px; flex-shrink:0;}
.blog-search button:hover {background:var(--warm-card);}
.blog-search .icon {width:18px;}
.blog-filters {display:flex; gap:7px; flex-wrap:wrap; margin:28px 0 30px;}
.blog-filters a {display:inline-flex; align-items:center; padding:10px 14px; min-height:42px; border:1px solid var(--line); border-radius:4px; font-size:10px; color:#625d55;}
.blog-filters a:hover {background:#f6f5ef;}
.blog-filters a[aria-current] {background:var(--ink); color:#fff; border-color:var(--ink);}
.blog-grid {display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px;}
.blog-card {border:1px solid var(--line); border-radius:10px; overflow:hidden; display:flex; flex-direction:column; background:#fff;}
.blog-card-visual {height:154px; padding:20px 25px; background:var(--topic-tint); display:flex; align-items:center; justify-content:space-between; gap:20px;}
.blog-card-visual img {width:125px; height:114px; object-fit:contain;}
.blog-card-visual > span {width:35px; height:35px; border:1px solid color-mix(in srgb,var(--topic) 25%,transparent); border-radius:50%; display:grid; place-items:center; color:var(--topic);}
.blog-card-visual .icon {width:18px; transition:transform .2s;}
.blog-card-visual:hover .icon {transform:translateX(3px);}
.blog-card-body {padding:23px; display:flex; flex-direction:column; flex:1;}
.blog-meta {display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:8px; color:var(--muted); margin-bottom:15px;}
.blog-meta span:first-child {color:var(--topic); font-weight:700; text-transform:uppercase; letter-spacing:.05em;}
.blog-meta span:last-child {white-space:nowrap;}
.blog-card h3 {font-size:25px; font-weight:600; line-height:1.2; letter-spacing:-.02em;}
.blog-card h3 a:hover {color:var(--topic); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px;}
.blog-card-description {font-size:11px; line-height:1.85; color:var(--muted); margin:15px 0 24px;}
.blog-card-foot {display:flex; justify-content:space-between; gap:12px; border-top:1px solid var(--line); padding-top:16px; margin-top:auto; font-size:8px; color:var(--muted);}
.blog-card-foot > span {font-weight:700; color:var(--topic); white-space:nowrap;}
.blog-results {font-size:12px; color:var(--muted); margin:-8px 0 25px;}
.blog-results a {text-decoration:underline; text-underline-offset:4px; margin-left:8px;}
.blog-topic-intro .breadcrumbs {margin-bottom:28px;}
.blog-topic-intro h1 {color:var(--topic);}
.blog-topic-intro .blog-topic-name {font-size:10px; color:var(--topic); margin-bottom:18px;}
.blog-topic-intro .blog-intro-grid > div > p + p {margin-top:14px;}
.blog-page-notice {font-size:15px; color:var(--muted); margin-top:22px;}
.blog-start-guide {display:flex; align-items:center; justify-content:space-between; gap:25px; border:1px solid var(--line); border-left:3px solid #667660; padding:21px 24px; margin-bottom:26px; border-radius:5px; background:#f6f7f1;}
.blog-start-guide small {display:block; font-size:9px; letter-spacing:.08em; color:var(--muted); margin-bottom:9px;}
.blog-start-guide strong {font:500 24px/1.3 var(--font-heading);}
.blog-start-guide > .icon {flex-shrink:0;}
.blog-start-guide:hover strong {text-decoration:underline; text-underline-offset:4px;}
.blog-pagination {display:flex; justify-content:center; flex-wrap:wrap; gap:8px; margin-top:36px;}
.blog-pagination a {display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; padding:10px 14px; border:1px solid var(--line); border-radius:5px; font-size:12px;}
.blog-pagination a:hover {background:var(--warm-card);}
.blog-pagination a[aria-current] {background:var(--ink); color:#fff; border-color:var(--ink);}
.blog-topic-link {margin-top:25px; font-size:13px;}
.article-content ol {padding-left:25px; margin:20px 0;}
.blog-pagination a:focus-visible,.blog-start-guide:focus-visible,.blog-topic-link:focus-visible {outline:2px solid currentColor; outline-offset:5px;}
.blog-empty {padding:50px 25px; border:1px dashed var(--line); border-radius:9px; text-align:center;}
.blog-empty h3 {font-size:27px; font-weight:600;}
.blog-empty p {font-size:13px; color:var(--muted); margin:15px 0;}
.blog-empty .text-link {font-size:12px;}
.blog-not-found {margin:65px auto;}
.blog-not-found h1 {font-size:42px; margin-top:20px;}
.blog-not-found .button {margin-top:18px;}
.blog-author-strip {display:flex; align-items:center; gap:25px; border-top:1px solid var(--line); padding-top:32px; padding-bottom:58px;}
.blog-author-strip > img {width:82px; height:96px; object-fit:cover; object-position:top; background:#e8ecdf; border-radius:7px; flex-shrink:0;}
.blog-author-strip .eyebrow {font-size:8px; color:var(--muted); margin-bottom:9px;}
.blog-author-strip h2 {font-size:27px; font-weight:600; margin-bottom:8px;}
.blog-author-strip p:not(.eyebrow) {font-size:11px; line-height:1.8; color:var(--muted); max-width:570px;}
.blog-author-strip > .text-link {margin-left:auto; font-size:11px; flex-shrink:0;}
.article-header {padding-top:31px; padding-bottom:42px; border-bottom:1px solid var(--line);}
.breadcrumbs {display:flex; flex-wrap:wrap; gap:11px; font-size:10px; color:var(--muted); margin-bottom:38px;}
.breadcrumbs a:hover {text-decoration:underline;}
.article-title-grid {display:grid; grid-template-columns:minmax(0,1fr) 180px; gap:55px; align-items:center;}
.article-title-grid .eyebrow {color:var(--topic); font-size:10px; margin-bottom:19px; text-transform:uppercase;}
.article-header h1 {font-size:clamp(35px,4.2vw,58px); font-weight:600; letter-spacing:-.035em; line-height:1.1; max-width:970px;}
.article-byline {display:flex; flex-wrap:wrap; gap:10px 20px; margin-top:24px; color:var(--muted); font-size:10px;}
.article-byline a {font-weight:650; color:var(--ink); text-decoration:underline; text-underline-offset:4px;}
.article-updated {font-size:10px; color:var(--muted); margin-top:8px;}
.article-logo {background:var(--topic-tint); padding:25px; border-radius:12px; aspect-ratio:1; display:grid; place-items:center;}
.article-logo img {width:100%; height:130px; object-fit:contain;}
.article-layout {display:grid; grid-template-columns:235px minmax(0,1fr); gap:75px; padding-top:45px; padding-bottom:65px;}
.article-aside {position:sticky; top:120px; align-self:start; max-height:calc(100dvh - 150px); overflow-y:auto; padding:0 8px 10px 0;}
.article-toc > p {font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; margin-bottom:19px;}
.article-toc ol {list-style:none; counter-reset:toc;}
.article-toc li {counter-increment:toc; display:flex; gap:11px; font-size:11px; line-height:1.7; padding:10px 0; border-bottom:1px solid var(--line);}
.article-toc li::before {content:counter(toc,decimal-leading-zero); font-size:9px; color:#8b877f; padding-top:2px;}
.article-toc a:hover {color:var(--topic); text-decoration:underline; text-underline-offset:4px;}
.article-back {display:inline-flex; font-size:10px; color:var(--muted); margin-top:24px; min-height:44px; align-items:center;}
.article-content {max-width:800px; min-width:0; font-size:17px; line-height:1.95; color:#5b5751;}
.article-answer {background:var(--topic-tint); padding:28px 30px; border-left:3px solid var(--topic); border-radius:0 8px 8px 0; margin-bottom:35px; color:var(--ink);}
.article-answer .eyebrow {font-size:9px; color:var(--topic); margin-bottom:14px;}
.article-answer > p:last-child {font-weight:550; font-size:17px;}
.article-content section {margin-top:39px;}
.article-content h2 {font-size:31px; font-weight:600; line-height:1.2; letter-spacing:-.025em; color:var(--ink); margin-bottom:19px;}
.article-content section p + p {margin-top:18px;}
.article-content ul {padding-left:22px; margin:20px 0;}
.article-content li {margin:7px 0; padding-left:3px;}
.article-content li::marker {color:var(--topic);}
.article-content strong {color:var(--ink); font-weight:650;}
.article-faq details {border-top:1px solid var(--line);}
.article-faq details:last-child {border-bottom:1px solid var(--line);}
.article-faq summary {list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:22px; padding:20px 0; color:var(--ink); font:500 21px/1.3 var(--font-heading);}
.article-faq summary::-webkit-details-marker {display:none;}
.article-faq summary .icon {width:17px;}
.article-faq details[open] summary .icon {transform:rotate(45deg);}
.article-faq details p {padding:0 0 23px; font-size:16px;}
.article-sources {border-top:1px solid var(--line); padding-top:28px;}
.article-content .article-sources h2 {font-size:23px; margin-bottom:13px;}
.article-sources p,.article-sources li {font-size:12px;}
.article-sources a {text-decoration:underline; text-underline-offset:4px;}
.article-product {display:flex; align-items:center; gap:26px; background:var(--topic-tint); padding:27px; border-radius:10px; margin-top:34px;}
.article-product > img {width:95px; height:95px; object-fit:contain; flex-shrink:0;}
.article-product .eyebrow {font-size:8px; color:var(--topic); margin-bottom:9px;}
.article-content .article-product h2 {font-size:28px; margin-bottom:9px;}
.article-product p:not(.eyebrow) {font-size:12px;}
.article-product .text-link {font-size:11px; margin-top:6px; margin-right:17px;}
.article-author {display:flex; gap:21px; border-top:1px solid var(--line); padding-top:30px; margin-top:36px; align-items:start;}
.article-author > img {width:75px; height:90px; border-radius:6px; object-fit:cover; object-position:top; background:#e8ecdf; flex-shrink:0;}
.article-author .eyebrow {font-size:8px; color:var(--muted); margin-bottom:8px;}
.article-content .article-author h2 {font-size:24px; margin-bottom:10px;}
.article-author p:not(.eyebrow) {font-size:12px;}
.article-author .text-link {font-size:11px; margin-top:8px;}
.blog-related {padding-bottom:65px;}
.blog-related > .eyebrow {font-size:9px; color:var(--muted); margin-bottom:12px;}
.blog-related > h2 {margin-bottom:28px;}
.blog-related .blog-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
@media(max-width:900px) {.blog-related .blog-grid {grid-template-columns:repeat(2,minmax(0,1fr));} .blog-start-guide strong {font-size:22px;}}
@media(max-width:1100px) {.blog-intro-grid {gap:40px;} .blog-feature-copy {padding:28px;} .blog-card-body {padding:20px;} .blog-card h3 {font-size:23px;} .blog-meta {flex-wrap:wrap; gap:4px;} .article-layout {grid-template-columns:195px minmax(0,1fr); gap:40px;} .article-title-grid {gap:30px; grid-template-columns:minmax(0,1fr) 155px;} .article-logo {padding:20px;} .article-logo img {height:110px;} .blog-author-strip > .text-link {max-width:135px;}}
@media(max-width:900px) {.blog-grid {grid-template-columns:repeat(2,minmax(0,1fr));} .blog-feature-art {padding:24px 22px 0;} .feature-brand span {font-size:22px;} .feature-brand img {width:80px; height:80px;} .blog-feature h2 {font-size:29px;} .blog-library-heading {align-items:start; flex-direction:column; gap:20px;} .blog-search {min-width:310px;} .article-layout {grid-template-columns:170px minmax(0,1fr); gap:28px;} .article-content {font-size:16px;} .article-content h2 {font-size:28px;} .article-title-grid {grid-template-columns:minmax(0,1fr) 130px;} .article-logo img {height:90px;} .blog-author-strip {flex-wrap:wrap;} .blog-author-strip > div {flex:1;} .blog-author-strip > .text-link {margin-left:107px; max-width:none;}}
@media(max-width:760px) {.blog-intro {padding-top:35px; padding-bottom:30px;} .blog-intro-top {margin-bottom:24px;} .blog-intro-top > span {display:none;} .blog-intro-top .eyebrow {font-size:8px;} .blog-intro-grid {grid-template-columns:1fr; gap:23px;} .blog-intro h1 {font-size:45px;} .blog-feature {grid-template-columns:1fr;} .blog-feature-art {min-height:0; height:230px; padding:20px 24px 0;} .feature-brand {margin-bottom:17px;} .feature-brand img {width:75px; height:75px;} .feature-brand span {font-size:25px;} .feature-screen {margin-bottom:0;} .blog-feature-copy {padding:27px 25px;} .blog-feature h2 {font-size:30px;} .blog-library {padding-top:43px; padding-bottom:40px;} .blog-library h2,.blog-related > h2 {font-size:29px;} .blog-search {min-width:0; width:100%;} .blog-search input {font-size:16px;} .blog-library-heading {gap:20px;} .blog-library-heading form {align-self:stretch;} .blog-filters {gap:6px; margin-top:20px;} .blog-filters a {padding:9px 11px; font-size:9px;} .blog-author-strip {gap:18px; padding-bottom:38px;} .blog-author-strip h2 {font-size:24px;} .blog-author-strip > img {width:65px; height:85px;} .blog-author-strip > .text-link {margin-left:83px;} .article-header {padding-top:23px; padding-bottom:30px;} .breadcrumbs {font-size:9px; margin-bottom:25px;} .article-title-grid {grid-template-columns:1fr; gap:22px;} .article-header h1 {font-size:38px;} .article-title-grid .eyebrow {font-size:9px; margin-bottom:14px;} .article-logo {display:none;} .article-byline {font-size:9px; gap:10px 14px;} .article-byline a {flex-basis:100%;} .article-layout {grid-template-columns:1fr; gap:26px; padding-top:28px; padding-bottom:45px;} .article-aside {position:static; max-height:none; padding:0; border-bottom:1px solid var(--line);} .article-toc > p {margin-bottom:8px;} .article-toc ol {display:grid; grid-template-columns:1fr 1fr; gap:0 20px;} .article-toc li {font-size:10px; gap:8px; align-items:start; border:0;} .article-back {display:none;} .article-content {font-size:16px; line-height:1.9;} .article-answer {padding:23px 21px; margin-bottom:28px;} .article-answer > p:last-child {font-size:16px;} .article-answer .eyebrow {font-size:8px;} .article-content h2 {font-size:28px;} .article-content section {margin-top:31px;} .article-faq summary {font-size:20px;} .article-product {padding:23px 20px; gap:17px; align-items:start;} .article-product > img {width:62px; height:70px;} .article-content .article-product h2 {font-size:25px;} .article-author {gap:16px;} .article-author > img {width:60px; height:80px;} .article-content .article-author h2 {font-size:23px;} .blog-related {padding-bottom:40px;}}
@media(max-width:540px) {.blog-grid,.blog-related .blog-grid {grid-template-columns:1fr; gap:20px;} .blog-card-visual {height:143px;} .blog-card h3 {font-size:27px;} .blog-card-body {padding:23px;} .blog-meta {flex-wrap:nowrap;} .blog-card-description {font-size:12px;} .blog-card-foot {font-size:9px;} .blog-intro h1 {font-size:42px;} .article-header h1 {font-size:35px;} .article-toc ol {grid-template-columns:1fr;} .article-toc li {padding:6px 0; font-size:11px;} .article-aside {padding-bottom:17px;} .article-product {flex-wrap:wrap;} .article-product > img {width:72px; height:72px;} .article-author {align-items:start;} .article-author > img {width:52px; height:70px;}}
@media(max-width:360px) {.blog-intro h1 {font-size:36px;} .blog-feature-copy {padding:23px 20px;} .blog-feature h2 {font-size:28px;} .blog-feature-bottom {gap:10px;} .blog-feature-bottom > span {font-size:8px;} .article-header h1 {font-size:32px;} .blog-card-foot {font-size:8px;}}
@media print {.article-aside,.article-product,.blog-related,.blog-search,.blog-filters {display:none;} .article-layout {display:block;} .article-content {max-width:none;} .article-faq details > p {display:block;} .article-header h1 {font-size:30px;} .article-logo {display:none;}}
