:root {
	--pipa-ink: #0b2538;
	--pipa-ink-soft: #486276;
	--pipa-navy: #092e49;
	--pipa-navy-deep: #061f32;
	--pipa-blue: #0b6ca8;
	--pipa-cyan: #27c0cd;
	--pipa-teal: #0d8d8b;
	--pipa-lime: #b8da59;
	--pipa-sand: #f0c56b;
	--pipa-line: #d8e3e9;
	--pipa-paper: #ffffff;
	--pipa-mist: #f2f7f9;
	--pipa-radius: 24px;
	--pipa-shadow: 0 24px 70px rgba(6, 31, 50, .11);
}

.pipa-editorial-site,
.pipa-editorial-site * { box-sizing: border-box; }
.pipa-editorial-site { margin: 0; background: var(--pipa-paper); color: var(--pipa-ink); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 17px; line-height: 1.65; }
.pipa-editorial-site img { max-width: 100%; height: auto; }
.pipa-editorial-site a { color: inherit; }
.pipa-editorial-site button,
.pipa-editorial-site input { font: inherit; }
.pipa-editorial-site h1,
.pipa-editorial-site h2,
.pipa-editorial-site h3,
.pipa-editorial-site p { margin-top: 0; }
.pipa-editorial-site h1,
.pipa-editorial-site h2,
.pipa-editorial-site h3 { color: var(--pipa-ink); font-weight: 760; letter-spacing: -.035em; line-height: 1.08; }
.pipa-wrap { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.pipa-wrap.narrow { width: min(830px, calc(100% - 48px)); }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.pipa-skip-link { position: fixed; z-index: 999999; left: 20px; top: -100px; padding: 12px 18px; border-radius: 10px; background: #fff; color: var(--pipa-navy); font-weight: 800; text-decoration: none; box-shadow: var(--pipa-shadow); }
.pipa-skip-link:focus { top: 18px; }
.pipa-editorial-site :focus-visible { outline: 3px solid var(--pipa-cyan); outline-offset: 4px; }
.pipa-reading-progress { position: fixed; z-index: 1002; top: 0; left: 0; right: 0; height: 4px; background: var(--pipa-cyan); transform: scaleX(0); transform-origin: left center; }

/* Header */
.pipa-site-header { position: sticky; z-index: 1000; top: 0; background: rgba(255,255,255,.96); border-bottom: 1px solid rgba(11,37,56,.1); backdrop-filter: blur(18px); }
.admin-bar .pipa-site-header { top: 32px; }
.pipa-header-inner { width: min(1240px, calc(100% - 42px)); min-height: 86px; margin: 0 auto; display: flex; align-items: center; gap: 28px; }
.pipa-brand { display: inline-flex; align-items: center; gap: 12px; color: var(--pipa-navy); text-decoration: none; flex: 0 0 auto; }
.pipa-brand-mark { position: relative; display: inline-block; width: 48px; height: 40px; }
.pipa-brand-mark i { position: absolute; display: block; width: 42px; height: 17px; border: 5px solid currentColor; border-radius: 99px; }
.pipa-brand-mark i:first-child { left: 0; top: 2px; color: var(--pipa-navy); }
.pipa-brand-mark i:last-child { right: 0; bottom: 2px; color: var(--pipa-cyan); }
.pipa-brand-words { display: flex; flex-direction: column; line-height: 1; }
.pipa-brand-words strong { font-size: 16px; letter-spacing: .025em; }
.pipa-brand-words strong b { color: var(--pipa-cyan); }
.pipa-brand-words small { margin-top: 7px; color: #60788a; font-size: 8px; font-weight: 800; letter-spacing: .16em; }
.pipa-desktop-nav { display: flex; align-items: center; justify-content: center; gap: clamp(18px, 2.2vw, 32px); margin-left: auto; }
.pipa-desktop-nav a { position: relative; color: #28485e; font-size: 14px; font-weight: 720; text-decoration: none; white-space: nowrap; }
.pipa-desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -10px; height: 2px; background: var(--pipa-cyan); transition: right .22s ease; }
.pipa-desktop-nav a:hover::after { right: 0; }
.pipa-header-search { width: 42px; height: 42px; display: grid; place-items: center; color: var(--pipa-navy); border: 1px solid var(--pipa-line); border-radius: 50%; }
.pipa-header-search svg { width: 19px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.pipa-menu-button { display: none; width: 44px; height: 44px; padding: 11px; border: 1px solid var(--pipa-line); border-radius: 12px; background: #fff; cursor: pointer; }
.pipa-menu-button span { display: block; height: 2px; margin: 5px 0; border-radius: 2px; background: var(--pipa-navy); }
.pipa-mobile-menu { position: absolute; top: 100%; left: 18px; right: 18px; padding: 15px; border: 1px solid var(--pipa-line); border-radius: 0 0 20px 20px; background: #fff; box-shadow: 0 24px 55px rgba(6,31,50,.16); }
.pipa-mobile-menu a { display: block; padding: 12px 14px; border-radius: 9px; color: var(--pipa-ink); font-weight: 720; text-decoration: none; }
.pipa-mobile-menu a:hover { background: var(--pipa-mist); }

/* Shared elements */
.pipa-eyebrow { margin-bottom: 18px; color: #7fe4ec; font-size: 12px; font-weight: 850; letter-spacing: .19em; }
.pipa-eyebrow.dark { color: var(--pipa-teal); }
.pipa-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 54px; padding: 14px 22px; border: 2px solid var(--pipa-cyan); border-radius: 14px; background: var(--pipa-cyan); color: var(--pipa-navy-deep); font-size: 15px; font-weight: 820; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.pipa-button:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(39,192,205,.25); }
.pipa-button.secondary { border-color: rgba(255,255,255,.46); background: transparent; color: #fff; }
.pipa-button.secondary:hover { background: rgba(255,255,255,.08); }
.pipa-text-link { display: inline-flex; align-items: center; gap: 10px; color: var(--pipa-blue); font-size: 15px; font-weight: 820; text-decoration: none; }
.pipa-text-link span { transition: transform .2s ease; }
.pipa-text-link:hover span { transform: translateX(4px); }
.pipa-text-link.light { color: #8ce9ef; }
.pipa-section { padding: 102px 0; }
.pipa-section-heading { max-width: 720px; margin-bottom: 46px; }
.pipa-section-heading h2 { margin-bottom: 18px; font-size: clamp(35px, 4vw, 54px); }
.pipa-section-heading > p:last-child { margin-bottom: 0; color: var(--pipa-ink-soft); font-size: 18px; }
.pipa-section-heading.split { max-width: none; display: grid; grid-template-columns: 1.1fr .9fr; align-items: end; gap: 80px; }
.pipa-section-heading.split > p { margin-bottom: 8px; }
.pipa-section-heading.row { max-width: none; display: flex; align-items: end; justify-content: space-between; gap: 30px; }
.pipa-section-heading.row h2 { margin-bottom: 0; }

/* Hero */
.pipa-hero { position: relative; overflow: hidden; padding: 98px 0 94px; background: radial-gradient(circle at 78% 20%, rgba(39,192,205,.17), transparent 28%), linear-gradient(135deg, #061f32 0%, #0a3d5e 70%, #0b5273 100%); color: #fff; }
.pipa-hero::before { content: ""; position: absolute; width: 540px; height: 540px; left: -250px; bottom: -330px; border: 80px solid rgba(255,255,255,.035); border-radius: 50%; }
.pipa-hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 70px; }
.pipa-hero h1 { max-width: 700px; margin-bottom: 25px; color: #fff; font-size: clamp(45px, 5.3vw, 76px); }
.pipa-lead { max-width: 670px; margin-bottom: 34px; color: #d7e8f1; font-size: clamp(18px, 2vw, 21px); }
.pipa-actions { display: flex; flex-wrap: wrap; gap: 13px; }
.pipa-hero-points { display: flex; flex-wrap: wrap; gap: 13px 26px; margin: 32px 0 0; padding: 0; list-style: none; color: #bed3df; font-size: 13px; font-weight: 720; }
.pipa-hero-points li { position: relative; padding-left: 17px; }
.pipa-hero-points li::before { content: ""; position: absolute; left: 0; top: .65em; width: 6px; height: 6px; border-radius: 50%; background: var(--pipa-cyan); }
.pipa-hero-visual { position: relative; height: 520px; overflow: hidden; border: 1px solid rgba(255,255,255,.17); border-radius: 34px; background: linear-gradient(150deg, rgba(255,255,255,.1), rgba(255,255,255,.025)); box-shadow: 0 38px 80px rgba(0,0,0,.2); }
.pipa-blueprint-grid { position: absolute; inset: 0; opacity: .17; background-image: linear-gradient(rgba(255,255,255,.35) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.35) 1px, transparent 1px); background-size: 34px 34px; }
.pipa-system-label { position: absolute; color: #adc5d1; font-size: 9px; font-weight: 850; letter-spacing: .16em; }
.label-source { left: 48px; top: 58px; }
.label-project { right: 48px; top: 58px; }
.pipa-network { position: absolute; height: 36px; border: 9px solid #d7e2e7; border-radius: 99px; background: #143c56; box-shadow: inset 0 0 0 3px rgba(255,255,255,.4), 0 8px 18px rgba(0,0,0,.2); }
.pipa-network i { position: absolute; inset: 5px; overflow: hidden; border-radius: 99px; background: repeating-linear-gradient(90deg, #2bc3d0 0 18px, #8ceaf0 18px 24px, #2bc3d0 24px 42px); animation: pipa-flow 1.8s linear infinite; }
.pipa-network.main-line { left: 95px; right: 86px; top: 221px; }
.pipa-network.branch-one { width: 180px; right: 78px; top: 150px; transform: rotate(-42deg); }
.pipa-network.branch-two { width: 175px; right: 78px; top: 294px; transform: rotate(42deg); }
.pipa-node { position: absolute; z-index: 3; display: grid; place-items: center; border-radius: 50%; box-shadow: 0 18px 35px rgba(0,0,0,.23); }
.pipa-node.source { left: 36px; top: 178px; width: 120px; height: 120px; border: 9px solid #d7e2e7; background: #0b6ca8; }
.pipa-node.source span { position: absolute; width: 34px; height: 45px; border-radius: 50% 50% 58% 58%; background: #7ee3e9; clip-path: polygon(50% 0,100% 55%,90% 84%,72% 100%,28% 100%,10% 84%,0 55%); }
.pipa-node.source b { margin-top: 74px; color: #fff; font-size: 10px; letter-spacing: .14em; }
.pipa-node.hdpe,
.pipa-node.pvc { right: 34px; width: 116px; height: 116px; border: 8px solid #d7e2e7; background: #0b3955; text-align: center; }
.pipa-node.hdpe { top: 84px; }
.pipa-node.pvc { top: 319px; }
.pipa-node.hdpe b,
.pipa-node.pvc b { align-self: end; margin-bottom: 2px; color: #fff; font-size: 14px; }
.pipa-node.hdpe small,
.pipa-node.pvc small { align-self: start; color: #81e3e9; font-size: 8px; font-weight: 850; letter-spacing: .14em; }
.pipa-flow-dot { position: absolute; z-index: 5; width: 12px; height: 12px; border-radius: 50%; background: #b7f8fb; box-shadow: 0 0 0 6px rgba(39,192,205,.18), 0 0 25px #27c0cd; }
.dot-one { top: 233px; left: 39%; animation: pipa-dot-main 3s linear infinite; }
.dot-two { top: 174px; right: 27%; animation: pipa-dot-branch 3s .7s linear infinite alternate; }
.dot-three { top: 321px; right: 26%; animation: pipa-dot-branch 3s 1.2s linear infinite alternate-reverse; }
.pipa-visual-note { position: absolute; z-index: 5; left: 28px; right: 28px; bottom: 24px; display: flex; align-items: center; gap: 14px; padding: 15px 18px; border: 1px solid rgba(255,255,255,.15); border-radius: 16px; background: rgba(4,25,40,.68); backdrop-filter: blur(12px); }
.pipa-visual-note span { width: 32px; height: 32px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--pipa-cyan); color: var(--pipa-navy); font-size: 11px; font-weight: 900; }
.pipa-visual-note p { margin: 0; color: #cfe0e8; font-size: 12px; line-height: 1.45; }
.pipa-visual-note strong { color: #fff; }
@keyframes pipa-flow { to { background-position: 42px 0; } }
@keyframes pipa-dot-main { 0% { left: 27%; opacity: 0; } 15%,85% { opacity: 1; } 100% { left: 68%; opacity: 0; } }
@keyframes pipa-dot-branch { from { transform: translate(-30px,30px); opacity: .2; } to { transform: translate(38px,-32px); opacity: 1; } }
.pipa-topic-strip { border-bottom: 1px solid var(--pipa-line); background: #fff; }
.pipa-topic-strip .pipa-wrap { min-height: 80px; display: flex; align-items: center; justify-content: center; gap: 30px; color: #36566b; font-size: 12px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.pipa-topic-strip i { width: 5px; height: 5px; border-radius: 50%; background: var(--pipa-cyan); }

/* Selector */
.pipa-selector-section { background: var(--pipa-mist); }
.pipa-selector { display: grid; grid-template-columns: 1.08fr .92fr; overflow: hidden; border: 1px solid var(--pipa-line); border-radius: 30px; background: #fff; box-shadow: var(--pipa-shadow); }
.pipa-selector-choices { display: grid; grid-template-columns: 1fr 1fr; padding: 18px; gap: 12px; }
.pipa-selector-choices button { min-height: 150px; padding: 24px; border: 1px solid var(--pipa-line); border-radius: 18px; background: #fff; color: var(--pipa-ink); text-align: left; cursor: pointer; transition: border-color .2s, background .2s, transform .2s; }
.pipa-selector-choices button:hover { transform: translateY(-2px); border-color: #91cad3; }
.pipa-selector-choices button[aria-pressed="true"] { border-color: var(--pipa-cyan); background: #eaf9fa; box-shadow: inset 0 0 0 1px var(--pipa-cyan); }
.pipa-selector-choices span { display: block; margin-bottom: 22px; color: var(--pipa-teal); font-size: 11px; font-weight: 900; letter-spacing: .12em; }
.pipa-selector-choices strong { display: block; margin-bottom: 7px; font-size: 17px; }
.pipa-selector-choices small { color: var(--pipa-ink-soft); font-size: 13px; }
.pipa-selector-result { display: flex; flex-direction: column; justify-content: center; min-height: 350px; padding: clamp(36px, 6vw, 70px); background: linear-gradient(145deg, var(--pipa-navy-deep), #0b4e6c); color: #d7e8f1; }
.pipa-result-kicker { margin-bottom: 24px; color: #77e3ea; font-size: 11px; font-weight: 900; letter-spacing: .17em; }
.pipa-selector-result h3 { margin-bottom: 18px; color: #fff; font-size: clamp(29px, 3vw, 40px); }
.pipa-selector-result > p:not(.pipa-result-kicker) { color: #c6dce5; }

/* Topic cards */
.pipa-topic-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.pipa-topic-card { position: relative; min-height: 310px; display: flex; flex-direction: column; padding: 30px; overflow: hidden; border: 1px solid var(--pipa-line); border-radius: 22px; background: #fff; text-decoration: none; box-shadow: 0 12px 36px rgba(6,31,50,.06); transition: transform .22s, box-shadow .22s; }
.pipa-topic-card::after { content: ""; position: absolute; width: 155px; height: 155px; right: -60px; top: -60px; border: 28px solid rgba(39,192,205,.09); border-radius: 50%; }
.pipa-topic-card:hover { transform: translateY(-6px); box-shadow: var(--pipa-shadow); }
.pipa-topic-card > span { color: var(--pipa-teal); font-size: 11px; font-weight: 900; letter-spacing: .14em; }
.pipa-topic-card h3 { margin: 55px 0 14px; font-size: 25px; }
.pipa-topic-card p { color: var(--pipa-ink-soft); font-size: 14px; }
.pipa-topic-card b { margin-top: auto; color: var(--pipa-blue); font-size: 13px; }
.pipa-topic-card b i { display: inline-block; margin-left: 5px; font-style: normal; }
.pipa-topic-card.pvc::after { border-color: rgba(11,108,168,.09); }
.pipa-topic-card.install::after { border-color: rgba(240,197,107,.16); }
.pipa-topic-card.standard::after { border-color: rgba(13,141,139,.11); }

/* Article cards */
.pipa-latest { background: var(--pipa-mist); }
.pipa-article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.pipa-article-card { overflow: hidden; border: 1px solid var(--pipa-line); border-radius: 22px; background: #fff; box-shadow: 0 14px 40px rgba(6,31,50,.07); transition: transform .22s, box-shadow .22s; }
.pipa-article-card:hover { transform: translateY(-5px); box-shadow: var(--pipa-shadow); }
.pipa-card-visual { position: relative; height: 190px; display: block; overflow: hidden; background: linear-gradient(145deg, #0a3855, #0d6482); }
.pipa-card-visual::before { content: ""; position: absolute; inset: 0; opacity: .13; background-image: linear-gradient(rgba(255,255,255,.4) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.4) 1px, transparent 1px); background-size: 24px 24px; }
.pipa-card-visual > strong { position: absolute; left: 22px; bottom: 18px; color: #fff; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.pipa-visual-pipe { position: absolute; display: block; height: 48px; border: 11px solid #dbe5e9; border-radius: 99px; background: #123d57; box-shadow: inset 0 0 0 3px rgba(255,255,255,.4), 0 13px 22px rgba(0,0,0,.2); }
.pipa-visual-pipe.pipe-one { width: 270px; right: -35px; top: 34px; transform: rotate(-9deg); }
.pipa-visual-pipe.pipe-two { width: 220px; right: 25px; top: 102px; transform: rotate(13deg); }
.pipa-visual-water { position: absolute; width: 120px; height: 120px; right: -35px; bottom: -45px; border: 22px solid rgba(39,192,205,.34); border-radius: 50%; }
.pipa-tone-pipa-pvc-upvc .pipa-card-visual { background: linear-gradient(145deg, #184765, #287aa8); }
.pipa-tone-instalasi-dan-sambungan .pipa-card-visual { background: linear-gradient(145deg, #143f44, #188a88); }
.pipa-tone-standar-dan-spesifikasi .pipa-card-visual { background: linear-gradient(145deg, #4f3e1f, #a2752d); }
.pipa-card-body { padding: 26px; }
.pipa-card-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; color: #6c8291; font-size: 11px; font-weight: 780; letter-spacing: .05em; }
.pipa-card-meta a { color: var(--pipa-teal); text-decoration: none; text-transform: uppercase; }
.pipa-card-body h2 { margin-bottom: 13px; font-size: 23px; }
.pipa-card-body h2 a { text-decoration: none; }
.pipa-card-body p { min-height: 70px; color: var(--pipa-ink-soft); font-size: 14px; }

/* Reference section */
.pipa-industry { background: linear-gradient(135deg, var(--pipa-navy-deep), #0b4b68); color: #d2e4ec; }
.pipa-industry-grid { display: grid; grid-template-columns: 1fr .9fr; align-items: center; gap: 80px; }
.pipa-industry h2 { max-width: 620px; margin-bottom: 20px; color: #fff; font-size: clamp(38px, 4.4vw, 58px); }
.pipa-industry-grid > div:first-child > p:last-child { max-width: 640px; color: #c5dbe5; font-size: 18px; }
.pipa-reference-card { position: relative; padding: 40px; overflow: hidden; border: 1px solid rgba(255,255,255,.2); border-radius: 25px; background: rgba(255,255,255,.09); box-shadow: 0 25px 60px rgba(0,0,0,.16); }
.pipa-reference-card::before { content: ""; position: absolute; width: 190px; height: 190px; right: -80px; top: -70px; border: 35px solid rgba(39,192,205,.18); border-radius: 50%; }
.pipa-reference-card > span { color: #85e5eb; font-size: 10px; font-weight: 900; letter-spacing: .17em; }
.pipa-reference-card h3 { margin: 22px 0 13px; color: #fff; font-size: 40px; letter-spacing: .04em; }
.pipa-reference-card p { color: #d2e3eb; }
.pipa-reference-card > div { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 24px; }
.pipa-reference-card a { color: #93edf1; font-size: 14px; font-weight: 800; text-decoration: none; }

/* Listing */
.pipa-listing-hero,
.pipa-page-header { padding: 80px 0 76px; background: radial-gradient(circle at 80% 10%, rgba(39,192,205,.17), transparent 30%), linear-gradient(135deg, var(--pipa-navy-deep), #0a4665); color: #d3e6ee; }
.pipa-listing-hero h1,
.pipa-page-header h1 { max-width: 900px; margin-bottom: 20px; color: #fff; font-size: clamp(43px, 6vw, 70px); }
.pipa-listing-hero .pipa-wrap > p:last-of-type,
.pipa-page-header .pipa-wrap > p:last-child { max-width: 760px; color: #c8dce5; font-size: 19px; }
.pipa-search-form { max-width: 700px; display: flex; gap: 10px; margin-top: 28px; padding: 8px; border-radius: 15px; background: #fff; }
.pipa-search-form input { min-width: 0; flex: 1; padding: 12px 15px; border: 0; background: transparent; color: var(--pipa-ink); }
.pipa-search-form button { padding: 11px 24px; border: 0; border-radius: 10px; background: var(--pipa-cyan); color: var(--pipa-navy); font-weight: 850; cursor: pointer; }
.pipa-archive-list { min-height: 500px; }
.pipa-pagination { margin-top: 55px; }
.pipa-pagination .nav-links { display: flex; justify-content: center; gap: 8px; }
.pipa-pagination a,
.pipa-pagination span { min-width: 42px; min-height: 42px; display: inline-grid; place-items: center; padding: 8px 13px; border: 1px solid var(--pipa-line); border-radius: 10px; text-decoration: none; }
.pipa-pagination .current { border-color: var(--pipa-navy); background: var(--pipa-navy); color: #fff; }
.pipa-empty { max-width: 720px; padding: 50px; border-radius: 24px; background: var(--pipa-mist); }
.pipa-empty h2 { font-size: 36px; }

/* Article */
.pipa-article-header { padding: 70px 0 68px; background: radial-gradient(circle at 75% 15%, rgba(39,192,205,.16), transparent 32%), linear-gradient(140deg, var(--pipa-navy-deep), #0a4665); color: #d3e5ed; }
.pipa-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-bottom: 34px; color: #acc6d2; font-size: 12px; }
.pipa-breadcrumb a { color: #d1e3eb; text-decoration: none; }
.pipa-article-category { display: inline-block; margin-bottom: 18px; color: #86e8ed; font-size: 11px; font-weight: 900; letter-spacing: .15em; text-decoration: none; text-transform: uppercase; }
.pipa-article-header h1 { max-width: 850px; margin-bottom: 22px; color: #fff; font-size: clamp(42px, 6.3vw, 72px); }
.pipa-article-deck { max-width: 760px; color: #cfe0e8; font-size: 20px; }
.pipa-article-byline { display: flex; align-items: center; gap: 13px; margin-top: 31px; }
.pipa-author-mark { width: 45px; height: 45px; display: grid; place-items: center; border-radius: 50%; background: var(--pipa-cyan); color: var(--pipa-navy); font-size: 11px; font-weight: 900; }
.pipa-article-byline p { margin: 0; line-height: 1.35; }
.pipa-article-byline strong,
.pipa-article-byline small { display: block; }
.pipa-article-byline strong { color: #fff; font-size: 13px; }
.pipa-article-byline small { color: #a9c2ce; font-size: 11px; }
.pipa-article-layout { display: grid; grid-template-columns: minmax(0, 760px) minmax(260px, 340px); align-items: start; justify-content: space-between; gap: 70px; padding-top: 78px; padding-bottom: 100px; }
.pipa-article-content { min-width: 0; color: #29495e; font-size: 18px; line-height: 1.8; }
.pipa-article-content > p:first-child { color: var(--pipa-ink); font-size: 21px; }
.pipa-article-content h2 { margin: 58px 0 18px; font-size: clamp(31px, 4vw, 42px); }
.pipa-article-content h3 { margin: 38px 0 14px; font-size: 26px; }
.pipa-article-content a { color: #075e92; font-weight: 750; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.pipa-article-content ul,
.pipa-article-content ol { padding-left: 24px; }
.pipa-article-content li { margin-bottom: 10px; }
.pipa-article-content blockquote { margin: 35px 0; padding: 26px 30px; border-left: 5px solid var(--pipa-cyan); border-radius: 0 14px 14px 0; background: var(--pipa-mist); color: var(--pipa-ink); }
.pipa-article-content table { width: 100%; margin: 32px 0; border-collapse: separate; border-spacing: 0; overflow: hidden; border: 1px solid var(--pipa-line); border-radius: 14px; font-size: 15px; }
.pipa-article-content th,
.pipa-article-content td { padding: 14px 16px; border-right: 1px solid var(--pipa-line); border-bottom: 1px solid var(--pipa-line); text-align: left; vertical-align: top; }
.pipa-article-content th { background: var(--pipa-navy); color: #fff; }
.pipa-article-content tr:last-child td { border-bottom: 0; }
.pipa-article-content th:last-child,
.pipa-article-content td:last-child { border-right: 0; }
.pipa-editorial-note { margin-top: 58px; padding: 25px 28px; border: 1px solid #bed8dd; border-radius: 16px; background: #effafb; }
.pipa-editorial-note strong { display: block; margin-bottom: 7px; color: var(--pipa-teal); font-size: 12px; letter-spacing: .11em; text-transform: uppercase; }
.pipa-editorial-note p { margin: 0; color: #38586b; font-size: 14px; }
.pipa-article-aside { position: sticky; top: 120px; display: grid; gap: 18px; }
.pipa-aside-card { padding: 28px; border-radius: 20px; background: var(--pipa-navy); color: #d4e5ed; box-shadow: var(--pipa-shadow); }
.pipa-aside-card > span { color: #83e3e9; font-size: 10px; font-weight: 900; letter-spacing: .16em; }
.pipa-aside-card h2 { margin: 18px 0 12px; color: #fff; font-size: 27px; }
.pipa-aside-card p { color: #c5d9e2; font-size: 14px; }
.pipa-aside-card a { display: block; padding: 12px 0; border-top: 1px solid rgba(255,255,255,.14); color: #8ce9ef; font-size: 13px; font-weight: 800; text-decoration: none; }
.pipa-aside-card.simple { border: 1px solid var(--pipa-line); background: #fff; box-shadow: none; }
.pipa-aside-card.simple > span { color: var(--pipa-teal); }
.pipa-aside-card.simple a { border-color: var(--pipa-line); color: var(--pipa-blue); }
.pipa-related { border-top: 1px solid var(--pipa-line); background: var(--pipa-mist); }

/* Pages */
.pipa-page-content { padding-top: 75px; padding-bottom: 105px; color: #29495e; font-size: 18px; }
.pipa-page-content h2 { margin: 55px 0 18px; font-size: 39px; }
.pipa-page-content h3 { margin: 36px 0 14px; font-size: 27px; }
.pipa-page-content a { color: #075e92; font-weight: 760; }
.pipa-page-content .pipa-definition-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-top: 34px; }
.pipa-page-content .pipa-definition-grid > div { padding: 24px; border: 1px solid var(--pipa-line); border-radius: 16px; background: var(--pipa-mist); }
.pipa-page-content .pipa-definition-grid strong { display: block; margin-bottom: 8px; color: var(--pipa-navy); font-size: 18px; }
.pipa-page-content .pipa-definition-grid p { margin: 0; font-size: 15px; }
.pipa-not-found { min-height: 650px; display: grid; place-items: center; padding: 90px 0; background: linear-gradient(140deg, var(--pipa-navy-deep), #0a4665); color: #d2e4ec; }
.pipa-not-found h1 { color: #fff; font-size: clamp(45px, 7vw, 76px); }
.pipa-not-found > div > p:not(.pipa-eyebrow) { font-size: 19px; }

/* Footer */
.pipa-site-footer { padding: 80px 0 25px; background: #061b2b; color: #a9c1cd; }
.pipa-footer-grid { display: grid; grid-template-columns: 1.4fr .85fr .85fr 1fr; gap: 60px; }
.pipa-brand.inverted { color: #fff; }
.pipa-brand.inverted .pipa-brand-mark i:first-child { color: #fff; }
.pipa-brand.inverted .pipa-brand-words small { color: #98b3c0; }
.pipa-footer-about p { max-width: 360px; margin-top: 24px; color: #9db6c2; font-size: 14px; }
.pipa-footer-grid h2 { margin-bottom: 19px; color: #fff; font-size: 14px; letter-spacing: .05em; }
.pipa-footer-grid > div:not(.pipa-footer-about) > a { display: block; margin: 10px 0; color: #a9c1cd; font-size: 13px; text-decoration: none; }
.pipa-footer-grid > div:not(.pipa-footer-about) > a:hover { color: #88e8ed; }
.pipa-footer-grid > div > p { font-size: 13px; }
.pipa-footer-reference { color: #87e5eb !important; font-weight: 800; }
.pipa-footer-bottom { display: flex; justify-content: space-between; gap: 25px; margin-top: 58px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); }
.pipa-footer-bottom p { margin: 0; color: #809aa7; font-size: 11px; }

@media (max-width: 1080px) {
	.pipa-desktop-nav { display: none; }
	.pipa-header-search { margin-left: auto; }
	.pipa-menu-button { display: block; }
	.pipa-hero-grid { gap: 35px; }
	.pipa-topic-grid { grid-template-columns: 1fr 1fr; }
	.pipa-article-grid { grid-template-columns: 1fr 1fr; }
	.pipa-footer-grid { grid-template-columns: 1.3fr 1fr 1fr; }
	.pipa-footer-grid > div:last-child { grid-column: 2 / 4; }
}

@media (max-width: 820px) {
	.admin-bar .pipa-site-header { top: 46px; }
	.pipa-wrap,
	.pipa-wrap.narrow { width: min(100% - 34px, 680px); }
	.pipa-section { padding: 76px 0; }
	.pipa-hero { padding: 70px 0; }
	.pipa-hero-grid,
	.pipa-selector,
	.pipa-section-heading.split,
	.pipa-industry-grid,
	.pipa-article-layout { grid-template-columns: 1fr; }
	.pipa-hero-visual { height: 470px; }
	.pipa-section-heading.split { gap: 20px; }
	.pipa-selector-result { min-height: 300px; }
	.pipa-industry-grid { gap: 40px; }
	.pipa-article-layout { gap: 42px; }
	.pipa-article-aside { position: static; grid-template-columns: 1fr 1fr; }
	.pipa-page-content .pipa-definition-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
	.pipa-header-inner { width: calc(100% - 28px); min-height: 72px; gap: 10px; }
	.pipa-brand-mark { width: 39px; height: 34px; }
	.pipa-brand-mark i { width: 35px; height: 15px; border-width: 4px; }
	.pipa-brand-words strong { font-size: 13px; }
	.pipa-brand-words small { font-size: 6.5px; }
	.pipa-header-search { display: none; }
	.pipa-menu-button { margin-left: auto; }
	.pipa-hero h1 { font-size: 42px; }
	.pipa-actions { display: grid; }
	.pipa-button { width: 100%; }
	.pipa-hero-visual { height: 390px; }
	.pipa-network.main-line { left: 72px; right: 60px; top: 170px; }
	.pipa-network.branch-one { width: 135px; right: 46px; top: 120px; }
	.pipa-network.branch-two { width: 135px; right: 46px; top: 222px; }
	.pipa-node.source { left: 20px; top: 132px; width: 96px; height: 96px; }
	.pipa-node.source b { margin-top: 63px; }
	.pipa-node.hdpe,
	.pipa-node.pvc { right: 18px; width: 92px; height: 92px; border-width: 7px; }
	.pipa-node.hdpe { top: 62px; }
	.pipa-node.pvc { top: 248px; }
	.pipa-visual-note { left: 15px; right: 15px; bottom: 15px; }
	.pipa-topic-strip .pipa-wrap { overflow-x: auto; justify-content: flex-start; gap: 18px; }
	.pipa-selector-choices,
	.pipa-topic-grid,
	.pipa-article-grid,
	.pipa-article-aside,
	.pipa-footer-grid { grid-template-columns: 1fr; }
	.pipa-selector-choices button { min-height: 130px; }
	.pipa-section-heading.row { align-items: flex-start; flex-direction: column; }
	.pipa-reference-card { padding: 30px 24px; }
	.pipa-listing-hero,
	.pipa-page-header,
	.pipa-article-header { padding: 58px 0; }
	.pipa-listing-hero h1,
	.pipa-page-header h1,
	.pipa-article-header h1 { font-size: 40px; }
	.pipa-search-form { display: grid; }
	.pipa-search-form button { min-height: 48px; }
	.pipa-article-content { font-size: 17px; }
	.pipa-article-content table { display: block; overflow-x: auto; }
	.pipa-footer-grid { gap: 35px; }
	.pipa-footer-grid > div:last-child { grid-column: auto; }
	.pipa-footer-bottom { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
	.pipa-editorial-site *,
	.pipa-editorial-site *::before,
	.pipa-editorial-site *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}