/* Bontrager construction journal. Isolated from project and service layouts. */
.bb-articles-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 84% 18%,#0e7180 0,transparent 35%),linear-gradient(125deg,#032631,#064755);color:#fff}
.bb-articles-hero:after{content:"";position:absolute;inset:auto -5% -280px auto;width:600px;height:600px;border:1px solid #62d5df38;border-radius:50%;box-shadow:0 0 0 70px #62d5df0d,0 0 0 140px #62d5df0a;pointer-events:none}
.bb-articles-hero-inner{position:relative;z-index:1;display:flex;align-items:end;justify-content:space-between;gap:42px;padding:100px 0 94px}
.bb-articles-hero .eyebrow,.bb-article-story-label{color:#51d5df}
.bb-articles-hero h1,.bb-article-story-hero h1{max-width:930px;margin:15px 0 22px;font-family:var(--heading);font-size:clamp(3.5rem,7vw,7rem);font-weight:900;letter-spacing:-.045em;line-height:.88;text-transform:uppercase}
.bb-articles-hero p{max-width:680px;margin:0;color:#d3e8e9;font-size:1.12rem;line-height:1.7}
.bb-articles-hero-link{flex:0 0 auto;display:inline-flex;align-items:center;gap:18px;padding:0 0 9px;border-bottom:2px solid #69d4dc;color:#fff;font-size:.74rem;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.bb-articles-hero-link span{font-size:1.1rem}
.bb-articles-section{padding:74px 0 100px;background:linear-gradient(180deg,#f3f8f8 0,#fff 250px)}
.bb-articles-intro{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:36px}
.bb-articles-intro h2,.bb-article-related h2,.bb-articles-footer-cta h2{margin:12px 0 0;color:#082e3b;font-family:var(--heading);font-size:clamp(2.5rem,4.6vw,4.6rem);line-height:.92;text-transform:uppercase}
.bb-articles-intro>p{max-width:410px;margin:0;color:#5b7177}
.bb-articles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.bb-article-card{min-width:0;overflow:hidden;border:1px solid #dce8e8;border-radius:12px;background:#fff;box-shadow:0 17px 39px #0b3c4612;transition:transform .2s ease,box-shadow .2s ease}
.bb-article-card:hover{transform:translateY(-4px);box-shadow:0 22px 48px #0b3c4620}
.bb-article-card-image{display:block;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(135deg,#e8f4f4,#bed9dc)}
.bb-article-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.bb-article-card:hover .bb-article-card-image img{transform:scale(1.025)}
.bb-article-image-empty{display:grid;height:100%;place-items:center;color:#067689;font-family:var(--heading);font-size:5rem}
.bb-article-card-content{display:flex;flex-direction:column;min-height:285px;padding:25px 27px 28px}
.bb-article-card-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;color:#638087;font-size:.65rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.bb-article-card-meta span{color:#07839a}
.bb-article-card h3{margin:14px 0 11px;color:#0b2d3a;font-family:var(--heading);font-size:clamp(1.55rem,2vw,2.05rem);line-height:1.03;text-transform:uppercase}
.bb-article-card h3 a:hover,.bb-article-read:hover{color:#00899c}
.bb-article-card-content>p{margin:0 0 22px;color:#566d74;font-size:.91rem;line-height:1.62}
.bb-article-read{display:inline-flex;align-items:center;gap:8px;margin-top:auto;color:#076c7b;font-size:.7rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.bb-article-read span{font-size:1.15rem}
.bb-articles-pagination{display:flex;justify-content:center;margin-top:45px}
.bb-articles-pagination .nav-links{display:flex;gap:8px}
.bb-articles-pagination .page-numbers{display:inline-flex;min-width:40px;min-height:40px;align-items:center;justify-content:center;padding:0 10px;border:1px solid #d1e1e2;border-radius:5px;color:#24525d;font-weight:800}
.bb-articles-pagination .current{border-color:#007e91;background:#007e91;color:#fff}
.bb-articles-empty{padding:52px;border:1px solid #dce8e8;border-radius:12px;background:#fff}
.bb-articles-empty h3{margin:0;color:#0a3540;font-family:var(--heading);font-size:2.3rem;text-transform:uppercase}
.bb-articles-footer-cta{background:#eaf3f3}
.bb-articles-footer-cta>.container{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:50px 0}
.bb-articles-footer-cta h2{font-size:clamp(2.2rem,3.8vw,3.7rem)}
.bb-article-story-hero{background:linear-gradient(122deg,#032832,#0a5260);color:#fff}
.bb-article-story-hero>.container{max-width:1120px;padding:41px 0 78px}
.bb-article-breadcrumb{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:62px;color:#b8d6da;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.bb-article-breadcrumb a:hover{color:#fff}
.bb-article-story-label{font-size:.75rem;font-weight:950;letter-spacing:.16em;text-transform:uppercase}
.bb-article-story-hero h1{max-width:950px;font-size:clamp(3.1rem,6vw,6.4rem)}
.bb-article-deck{max-width:780px;margin:0;color:#d6e9eb;font-size:1.16rem;line-height:1.6}
.bb-article-byline{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;color:#c1dcdf;font-size:.72rem;font-weight:800;text-transform:uppercase}
.bb-article-cover{width:min(1120px,calc(100% - 44px));margin:-45px auto 0}
.bb-article-cover img{width:100%;height:clamp(300px,45vw,550px);border:7px solid #fff;border-radius:10px;object-fit:cover;box-shadow:0 20px 48px #0830392b}
.bb-article-cover figcaption{margin:7px 7px 0;color:#697e82;font-size:.7rem}
.bb-article-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:78px;max-width:1120px;padding:70px 0 90px}
.bb-article-main{min-width:0}
.bb-article-content{color:#2e454b;font-size:1.07rem;line-height:1.82}
.bb-article-content>p:first-child{color:#0d3c47;font-size:1.28rem;line-height:1.7}
.bb-article-content h2{margin:42px 0 12px;color:#0a3440;font-family:var(--heading);font-size:clamp(1.7rem,2.7vw,2.4rem);line-height:1.03;text-transform:uppercase}
.bb-article-content p,.bb-article-content ul{margin:0 0 19px}
.bb-article-content ul{padding-left:23px}
.bb-article-content li{margin:8px 0}
.bb-article-content a{color:#087b8c;font-weight:800;text-decoration:underline;text-underline-offset:3px}
.bb-article-endnote{margin-top:40px;padding:20px 24px;border-left:4px solid #0a8b9b;background:#eef6f5}
.bb-article-endnote strong{color:#0b5967;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}
.bb-article-endnote p{margin:7px 0 0;color:#426269;font-size:.82rem}
.bb-article-share{display:grid;gap:17px;margin-top:34px;padding:22px 24px;border:1px solid #cde3e5;border-radius:10px;background:linear-gradient(130deg,#f1f9f9,#fff);box-shadow:0 12px 28px #0834400a}
.bb-article-share-heading{display:grid;gap:3px}
.bb-article-share-heading .eyebrow{color:#087d8c;font-size:.61rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.bb-article-share-heading strong{color:#0a3540;font-family:var(--heading);font-size:1.45rem;line-height:1.05;text-transform:uppercase}
.bb-article-share-actions{display:flex;flex-wrap:wrap;gap:9px}
.bb-article-share-action{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:7px 12px;border:1px solid #cadfe1;border-radius:7px;background:#fff;color:#0b4f5d;font:800 .72rem var(--body);line-height:1.15;text-decoration:none;white-space:nowrap;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}
.bb-article-share-action:hover{transform:translateY(-2px);border-color:#07889a;background:#f3fbfb;color:#074c59}
.bb-article-share-action:focus-visible{outline:3px solid #057e91;outline-offset:2px}
.bb-article-share-action[hidden]{display:none}
.bb-article-share-action svg{width:19px;height:19px;flex:0 0 19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.bb-article-share-glyph{display:grid;flex:0 0 25px;width:25px;height:25px;place-items:center;border-radius:50%;color:#fff;font-size:1rem;font-weight:900;line-height:1;text-transform:none}
.bb-article-share-glyph.is-facebook{background:#1877f2;font-family:Arial,sans-serif;font-size:1.27rem;padding-top:4px}
.bb-article-share-glyph.is-x{background:#16262b;font-family:Arial,sans-serif;font-size:.95rem}
.bb-article-share-glyph.is-pinterest{background:#bd081c;font-family:Georgia,serif;font-size:1.2rem;font-style:italic}
.bb-article-share-glyph.is-linkedin{background:#0a66c2;font-family:Arial,sans-serif;font-size:.65rem}
.bb-article-aside>div{position:sticky;top:26px;padding:26px;border:1px solid #d4e6e6;border-radius:10px;background:#f2f8f8}
.bb-article-aside h2{margin:9px 0;color:#0a3640;font-family:var(--heading);font-size:2rem;line-height:.95;text-transform:uppercase}
.bb-article-aside p{color:#557177;font-size:.88rem}
.bb-article-aside .button{width:100%;min-height:44px;margin-top:10px;padding:8px;font-size:.69rem;text-align:center}
.bb-article-all{display:inline-block;margin-top:20px;color:#087486;font-size:.72rem;font-weight:900;text-transform:uppercase}
.bb-article-related{padding:65px 0 88px;background:#f2f7f7}
.bb-article-related-head{margin-bottom:26px}
.bb-article-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.bb-article-related-grid article{padding:26px;border:1px solid #dbe8e8;border-radius:9px;background:#fff}
.bb-article-related-grid span{color:#0b8292;font-size:.64rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.bb-article-related-grid h3{margin:11px 0;color:#0b3441;font-family:var(--heading);font-size:1.5rem;line-height:1.05;text-transform:uppercase}
.bb-article-related-grid p{color:#64787d;font-size:.8rem}
.bb-article-related-grid article>a{color:#047689;font-size:.67rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase}
@media(max-width:980px){.bb-articles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bb-article-layout{grid-template-columns:minmax(0,1fr) 240px;gap:35px}.bb-article-related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.bb-articles-hero-inner,.bb-articles-intro,.bb-articles-footer-cta>.container{display:block}.bb-articles-hero-inner{padding:67px 0 70px}.bb-articles-hero-link{margin-top:30px}.bb-articles-section{padding:52px 0 72px}.bb-articles-intro>p{margin:15px 0 0}.bb-articles-grid,.bb-article-related-grid{grid-template-columns:1fr}.bb-articles-footer-cta>.container{padding:45px 0}.bb-articles-footer-cta .button{margin-top:24px}.bb-article-story-hero>.container{padding:24px 0 65px}.bb-article-breadcrumb{margin-bottom:46px}.bb-article-cover{width:min(100% - 26px,1120px);margin-top:-32px}.bb-article-cover img{height:270px;border-width:4px}.bb-article-layout{display:block;padding:43px 0 65px}.bb-article-aside{margin-top:35px}.bb-article-aside>div{position:static}.bb-article-related{padding:48px 0 65px}}
@media(max-width:520px){.bb-article-share{padding:19px 16px}.bb-article-share-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.bb-article-share-action{min-width:0;padding:7px 8px}.bb-article-share-action span:last-child{overflow:hidden;text-overflow:ellipsis}}
