:root{--blue:#38AEE4;--dark:#1f2021;--grey:#F7F7F7;--pad:clamp(24px,4vw,64px);--max:1400px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--dark);font-family:Quicksand,sans-serif;background:#fff;-webkit-font-smoothing:antialiased}h1,h2,h3,h4{font-family:Quicksand,sans-serif}a{color:inherit}.pko-header{height:76px;background:#fff;position:relative;z-index:50}.pko-header-inner{height:100%;max-width:var(--max);padding:0 var(--pad);margin:auto;display:flex;align-items:center;justify-content:space-between}.pko-logo img{width:155px;display:block}.pko-nav,.pko-nav ul{display:flex;align-items:center;gap:28px}.pko-nav ul{list-style:none;margin:0;padding:0}.pko-nav a{text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}.pko-button,.wp-element-button{display:inline-block;border:1px solid var(--blue)!important;border-radius:999px!important;padding:13px 27px!important;background:transparent!important;color:var(--blue)!important;text-decoration:none!important;font:600 13px/1 Quicksand,sans-serif!important;letter-spacing:.12em;text-transform:uppercase;transition:.25s}.pko-button:hover,.wp-element-button:hover{background:var(--blue)!important;color:#fff!important}.pko-button.white{border-color:#fff!important;color:#fff!important}.pko-button.white:hover{background:#fff!important;color:var(--blue)!important}.pko-menu-toggle{display:none;border:0;background:none;letter-spacing:.12em}.pko-hero{height:350vh}.pko-hero-sticky{height:100vh;position:sticky;top:0;overflow:hidden;background:#111}.pko-frames,.pko-frame{position:absolute;inset:0;width:100%;height:100%}.pko-frame{object-fit:cover;opacity:0}.pko-frame:first-child{opacity:1}.pko-hero-gradient{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.75),rgba(0,0,0,.4) 40%,transparent 75%)}.pko-hero-inner{position:absolute;inset:0;display:flex;align-items:center}.pko-hero-copy{width:min(620px,88%);margin-left:max(var(--pad),calc((100vw - var(--max))/2 + var(--pad)));color:#fff}.pko-hero-copy h1{line-height:1;margin:0 0 24px}.pko-hero-copy p{max-width:500px;color:#ffffffd1;font-size:18px;margin:0 0 34px}.pko-scroll{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);color:#fff;font-size:13px;letter-spacing:.15em;text-transform:uppercase;text-align:center;opacity:.65}.pko-scroll span{display:block;width:1px;height:30px;background:#fff;margin:8px auto}.pko-section{padding:clamp(84px,10vw,150px) var(--pad)!important}.pko-section>*{max-width:var(--max);margin-left:auto;margin-right:auto}.pko-eyebrow{font-size:14px!important;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);margin-bottom:28px!important}.pko-eyebrow.light{color:#ffffffcc}.pko-section h2{line-height:1.02}.pko-intro .pko-lead{max-width:650px;margin-left:0;font-size:18px;color:#666}.pko-work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 32px;margin-top:54px}.pko-work-card h3{margin:15px 0 4px}.pko-work-card h3 a{text-decoration:none}.pko-work-card p{margin:0;color:#8a8a8a;font-size:13px;letter-spacing:.1em;text-transform:uppercase}.pko-work-image{display:block;position:relative;aspect-ratio:4/3;overflow:hidden;background:#e9e9e9}.pko-work-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.pko-work-image:hover img{transform:scale(1.025)}.pko-placeholder{display:block;width:100%;height:100%;background:#e8e8e8}.pko-view{position:absolute;inset:0;margin:auto;width:max-content;height:max-content;border:1px solid #fff;border-radius:999px;padding:13px 24px;color:#fff;text-transform:uppercase;letter-spacing:.12em;font-size:13px;opacity:0;transition:.25s}.pko-work-image:hover .pko-view{opacity:1}.pko-services h2{color:#fff}.pko-services>p:not(.pko-eyebrow){max-width:430px;margin-left:0;color:#ffffffd1}.pko-service-list{list-style:none;padding:0;margin-top:50px;border-top:1px solid #ffffff38}.pko-service-list li{display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:24px 0;border-bottom:1px solid #ffffff38;font:700 clamp(25px,3vw,48px)/1.1 Quicksand,sans-serif}.pko-service-list small{font:400 14px/1.5 Quicksand,sans-serif;text-align:right}.pko-service-list.dark{border-color:#ddd}.pko-service-list.dark li{border-color:#ddd}.pko-cta{padding:clamp(65px,7vw,105px) var(--pad)!important}.pko-cta>*{max-width:var(--max);margin-left:auto;margin-right:auto}.pko-cta h2{margin-bottom:18px}.pko-cta p{max-width:600px;font-size:18px;color:#ffffffc7;margin-bottom:0}.pko-cta>.pko-button,.pko-cta>.wp-element-button{margin-top:32px!important}.pko-cta .wp-element-button{border-color:#fff!important;color:#fff!important}.pko-cta .wp-element-button:hover{background:#fff!important;color:var(--blue)!important}.pko-page-hero{padding:clamp(80px,9vw,140px) var(--pad)!important;max-width:var(--max)!important}.pko-page-hero h1,.pko-project-head h1{line-height:1}.pko-lead{font-size:20px;max-width:650px;color:#666}.pko-project-head{max-width:var(--max);margin:auto;padding:clamp(90px,10vw,150px) var(--pad) 70px}.pko-project-meta{display:flex;gap:40px;color:#777;text-transform:uppercase;letter-spacing:.1em;font-size:13px}.pko-project-hero{margin:0}.pko-project-hero img{display:block;width:100%;max-height:85vh;object-fit:cover}.pko-project-content{max-width:1100px;margin:auto;padding:clamp(70px,8vw,120px) var(--pad)}.pko-project-content .alignfull{width:100vw;margin-left:calc(50% - 50vw)}.pko-next{max-width:var(--max);margin:auto;padding:50px var(--pad) 100px;font:700 28px Quicksand}.pko-footer{background:#f7f7f7;padding:70px var(--pad) 24px}.pko-footer-inner{max-width:var(--max);margin:auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}.pko-footer nav,.pko-social{display:flex;flex-direction:column;gap:12px}.pko-footer a{text-decoration:none;font-size:13px;letter-spacing:.1em}.pko-footer-bottom{max-width:var(--max);margin:60px auto 0;padding-top:20px;border-top:1px solid #ddd;font-size:12px;color:#999}@media(max-width:900px){.pko-menu-toggle{display:block}.pko-nav{display:none;position:absolute;top:76px;left:0;right:0;background:#fff;padding:30px var(--pad);flex-direction:column;align-items:flex-start}.pko-nav.is-open{display:flex}.pko-nav ul{flex-direction:column;align-items:flex-start}.pko-work-grid{grid-template-columns:repeat(2,1fr)}.pko-service-list li{grid-template-columns:1fr;gap:8px}.pko-service-list small{text-align:left}.pko-footer-inner{grid-template-columns:1fr 1fr}}@media(max-width:600px){.pko-logo img{width:125px}.pko-hero-copy{margin-left:24px}.pko-work-grid{grid-template-columns:1fr}.pko-footer-inner{grid-template-columns:1fr}.pko-project-meta{flex-direction:column;gap:8px}}

/* v1.0.1 — consistent content alignment */
.pko-section,
.pko-cta {
  display: grid !important;
  grid-template-columns: minmax(0, min(100%, var(--max))) !important;
  justify-content: center !important;
}

.pko-section > *,
.pko-cta > * {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Keep readable body copy aligned to the same left edge as its heading. */
.pko-intro > p:not(.pko-eyebrow),
.pko-services > p:not(.pko-eyebrow),
.pko-cta > p,
.pko-page-hero > p,
.pko-project-content > p {
  width: min(100%, 720px) !important;
  max-width: 720px !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Buttons should follow the copy rather than centring themselves. */
.pko-cta > .wp-block-buttons,
.pko-section > .wp-block-buttons {
  justify-content: flex-start !important;
}

/* WordPress constrained-layout defaults can re-centre individual blocks. */
.pko-section > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.pko-cta > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Maintain consistent paragraph rhythm site-wide. */
.pko-section p,
.pko-cta p,
.pko-page-hero p,
.pko-project-content p {
  line-height: 1.65;
}

@media (max-width: 600px) {
  .pko-intro > p:not(.pko-eyebrow),
  .pko-services > p:not(.pko-eyebrow),
  .pko-cta > p,
  .pko-page-hero > p,
  .pko-project-content > p {
    width: 100% !important;
    max-width: 100% !important;
  }
}


/* v1.0.2 — complete Work post layouts */
.pko-project-intro{font-size:clamp(22px,2.2vw,32px);line-height:1.45;max-width:820px!important;margin:0 0 70px!important;color:#333}.pko-project-story{width:100vw!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;padding:clamp(70px,8vw,120px) max(var(--pad),calc((100vw - var(--max))/2 + var(--pad)))!important}.pko-project-story p{max-width:720px!important;margin:0 0 0 33.333%!important;font-size:18px;line-height:1.7;color:#666}.pko-project-content>.wp-block-image.alignfull{margin-top:0;margin-bottom:clamp(20px,3vw,40px)}.pko-project-content>.wp-block-image.alignfull img{width:100%;max-height:75vh;object-fit:cover;display:block}.pko-project-gallery{gap:clamp(16px,2vw,28px);margin-top:0!important;margin-bottom:clamp(70px,8vw,120px)!important}.pko-project-gallery figure{height:100%;margin:0}.pko-project-gallery img{width:100%;height:100%;aspect-ratio:4/5;object-fit:cover;display:block}.pko-project-quote{border:0!important;margin:clamp(80px,9vw,140px) 0!important;padding:0!important}.pko-project-quote p{font:700 clamp(42px,5vw,74px)/1.08 Quicksand,sans-serif!important;max-width:1050px!important;color:var(--dark)!important}.pko-project-meta span:empty{display:none}@media(max-width:900px){.pko-project-story p{margin-left:0!important}}@media(max-width:600px){.pko-project-intro{margin-bottom:48px!important}.pko-project-story{padding:60px 24px!important}.pko-project-gallery{gap:16px}}


/* v1.0.4 — internal pages synced to the Figma Make design */
.pko-inner-main{padding-top:0}
.pko-inner-section{padding:80px var(--pad)}
.pko-inner-container{width:100%;max-width:var(--max);margin:0 auto}
.pko-inner-eyebrow{margin:0 0 24px;font:600 13px/1.2 Quicksand,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--blue)}
.pko-inner-hero{padding:80px var(--pad) 112px;background:#fff}
.pko-inner-hero h1{max-width:1000px;margin:0 0 32px;font-weight:700;line-height:1;letter-spacing:-.035em;color:var(--dark)}
.pko-inner-hero .pko-inner-lead{max-width:560px;margin:0;font:400 20px/1.7 Quicksand,sans-serif;color:#666}
.pko-full-image{width:100%;height:60vh;min-height:320px;overflow:hidden;background:#eee}
.pko-full-image img{width:100%;height:130%;margin-top:-15%;object-fit:cover;display:block}
.pko-about-split{display:grid;grid-template-columns:5fr 7fr;gap:clamp(40px,5vw,80px);align-items:start}
.pko-about-split h2,.pko-about-image-copy h2{margin:0;font-weight:700;line-height:1.08;letter-spacing:-.025em}
.pko-copy-stack{display:flex;flex-direction:column;gap:24px}
.pko-copy-stack p{margin:0;font:400 18px/1.75 Quicksand,sans-serif;color:#666}
.pko-about-image-copy{display:grid;grid-template-columns:7fr 5fr;gap:clamp(40px,5vw,80px);align-items:start}
.pko-about-image-copy.reverse{grid-template-columns:5fr 7fr}
.pko-about-image{aspect-ratio:4/3;background:#f1f1f1;overflow:hidden}
.pko-about-image img{width:100%;height:100%;object-fit:cover;display:block}
.pko-grey-section{background:#f7f7f7}

.pko-work-filter{background:#f7f7f7;border-top:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5}
.pko-work-filter-inner{max-width:var(--max);margin:auto;padding:16px var(--pad);display:flex;gap:24px;overflow:auto}
.pko-work-filter button{appearance:none;border:0;background:none;padding:4px 0;white-space:nowrap;font:600 13px/1 Quicksand,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#aaa;cursor:pointer}
.pko-work-filter button.is-active,.pko-work-filter button:hover{color:var(--blue)}
.pko-work-page-grid{background:#f7f7f7;padding:64px var(--pad) 80px}
.pko-work-page-grid .pko-work-grid{max-width:var(--max);margin:0 auto;gap:40px}
.pko-work-card .pko-work-image:after{content:"";position:absolute;inset:0;background:rgba(31,32,33,.58);opacity:0;transition:.3s}
.pko-work-card .pko-work-image:hover:after{opacity:1}
.pko-work-card .pko-view{z-index:2;border-color:#fff;color:#fff}

.pko-services-hero{padding-bottom:80px}
.pko-services-list-wrap{background:#f7f7f7;padding:32px var(--pad) 64px}
.pko-services-list{max-width:var(--max);margin:0 auto;border-top:1px solid #ddd}
.pko-service-row{display:grid;grid-template-columns:60px minmax(240px,3fr) minmax(320px,4fr) minmax(240px,3fr);gap:28px;align-items:start;padding:56px 0;border-bottom:1px solid #ddd}
.pko-service-num{font:400 13px/1.4 Quicksand,sans-serif;color:#ccc;padding-top:8px}
.pko-service-title h3{margin:0 0 12px;font-weight:700;line-height:1.08;letter-spacing:-.02em}
.pko-service-title p{margin:0;font:600 14px/1.45 Quicksand,sans-serif;color:var(--blue)}
.pko-service-desc{margin:0;font:400 16px/1.75 Quicksand,sans-serif;color:#666}
.pko-service-image{aspect-ratio:4/3;overflow:hidden;background:#f1f1f1}
.pko-service-image img{width:100%;height:100%;object-fit:cover;display:block}
.pko-service-quote{margin:0 calc(-1 * var(--pad));padding:72px max(var(--pad),calc((100vw - var(--max))/2 + var(--pad)));background:var(--blue);color:#fff}
.pko-service-quote-inner{max-width:800px}
.pko-service-quote-mark{font:700 52px/1 Quicksand,sans-serif;color:rgba(255,255,255,.3);margin-bottom:12px}
.pko-service-quote blockquote{margin:0 0 28px;font:700 clamp(28px,3.5vw,48px)/1.15 Quicksand,sans-serif}
.pko-service-quote cite{font:500 14px/1.4 Quicksand,sans-serif;color:rgba(255,255,255,.72);font-style:normal}
.pko-services-bottom{padding:80px var(--pad) 96px;background:#fff}
.pko-services-bottom-inner{max-width:var(--max);margin:auto;display:flex;justify-content:space-between;align-items:end;gap:40px}
.pko-services-bottom h2{margin:0 0 16px;font-weight:700;line-height:1.08}
.pko-services-bottom p{max-width:480px;margin:0;font:400 18px/1.65 Quicksand,sans-serif;color:#666}

.pko-contact-page{padding:80px var(--pad) 112px;background:#fff}
.pko-contact-grid{max-width:var(--max);margin:auto;display:grid;grid-template-columns:5fr 7fr;gap:clamp(64px,7vw,110px)}
.pko-contact-copy h1{margin:0 0 28px;font-weight:700;line-height:1;letter-spacing:-.03em}
.pko-contact-copy>p{max-width:430px;margin:0 0 48px;font:400 18px/1.7 Quicksand,sans-serif;color:#666}
.pko-contact-details{border-top:2px solid var(--blue);padding-top:36px;display:flex;flex-direction:column;gap:30px}
.pko-contact-kicker{margin:0 0 9px!important;font:600 13px/1 Quicksand,sans-serif!important;letter-spacing:.15em;text-transform:uppercase;color:#888!important}
.pko-contact-details a{text-decoration:none;font:500 16px/1.4 Quicksand,sans-serif}
.pko-contact-social{display:flex;flex-direction:column;gap:10px}
.pko-contact-form{display:flex;flex-direction:column;gap:36px}
.pko-contact-row{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.pko-field label{display:block;margin-bottom:10px;font:600 13px/1 Quicksand,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.pko-field input,.pko-field select,.pko-field textarea{width:100%;border:0;border-bottom:2px solid #e5e5e5;background:transparent;padding:13px 0;font:400 16px/1.5 Quicksand,sans-serif;color:var(--dark);outline:none;border-radius:0}
.pko-field input:focus,.pko-field select:focus,.pko-field textarea:focus{border-color:var(--blue)}
.pko-field textarea{resize:vertical;min-height:110px}

.pko-reviews{background:#f7f7f7;padding:64px 0 80px;overflow:hidden}
.pko-reviews-head{max-width:var(--max);margin:0 auto 40px;padding:0 var(--pad)}
.pko-review-track{display:flex;gap:20px;width:max-content;animation:pkoReviewMarquee 50s linear infinite}
.pko-review-card{width:360px;flex:0 0 360px;background:#fff;border-radius:20px;padding:28px}
.pko-review-mark{color:rgba(56,174,228,.35);font:700 42px/1 Quicksand,sans-serif}
.pko-review-card blockquote{margin:10px 0 24px;font:400 16px/1.7 Quicksand,sans-serif;color:#555}
.pko-review-card strong{display:block;font:600 14px/1.4 Quicksand,sans-serif}
.pko-review-card small{font:400 13px/1.4 Quicksand,sans-serif;color:#aaa}
@keyframes pkoReviewMarquee{to{transform:translateX(-50%)}}

/* Exact Figma footer */
.pko-footer{background:#1f2021!important;color:#fff;padding:64px var(--pad) 30px}
.pko-footer-inner{max-width:var(--max);margin:auto;display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:50px}
.pko-footer .pko-logo img{filter:brightness(0) invert(1);width:100px}
.pko-footer p{color:rgba(255,255,255,.4)}
.pko-footer nav,.pko-social{display:flex;flex-direction:column;gap:16px}
.pko-footer a{color:rgba(255,255,255,.7);text-decoration:none;font-size:14px;letter-spacing:0}
.pko-footer a:hover{color:#fff}
.pko-footer-heading{margin:0 0 8px!important;font:500 13px/1 Quicksand,sans-serif!important;letter-spacing:.16em!important;text-transform:uppercase;color:rgba(255,255,255,.3)!important}
.pko-footer-bottom{max-width:var(--max);margin:64px auto 0;padding-top:28px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;gap:20px;font-size:12px;color:rgba(255,255,255,.3)}

/* Stop Gutenberg constrained layout from silently re-centring Figma page children. */
.pko-inner-hero > .pko-inner-container > *,
.pko-inner-section > .pko-inner-container > *{margin-left:0;margin-right:0}

@media(max-width:1000px){
 .pko-about-split,.pko-about-image-copy,.pko-about-image-copy.reverse,.pko-contact-grid{grid-template-columns:1fr}
 .pko-service-row{grid-template-columns:50px 1fr 1fr}.pko-service-desc{grid-column:2/3}.pko-service-image{grid-column:3/4;grid-row:1/3}
 .pko-footer-inner{grid-template-columns:2fr 1fr 1fr}
 .pko-footer-contact{grid-column:2/4}
}
@media(max-width:700px){
 .pko-inner-hero{padding-top:56px;padding-bottom:72px}.pko-inner-section{padding-top:72px;padding-bottom:72px}
 .pko-service-row{grid-template-columns:40px 1fr}.pko-service-title,.pko-service-desc,.pko-service-image{grid-column:2/3}.pko-service-image{grid-row:auto;margin-top:8px}
 .pko-services-bottom-inner{align-items:flex-start;flex-direction:column}.pko-contact-row{grid-template-columns:1fr}
 .pko-footer-inner{grid-template-columns:1fr 1fr}.pko-footer-contact{grid-column:auto}.pko-footer-bottom{flex-direction:column}
 .pko-review-card{width:310px;flex-basis:310px}
}


/* v1.0.7 — requested consistency and page-specific updates only */
body{padding-top:76px}
button,input,select,textarea{font-family:Quicksand,sans-serif}
h1,h2,h3,h4,h5,h6{font-family:Quicksand,sans-serif;font-weight:700}
.pko-header{position:fixed;top:0;left:0;right:0;z-index:1000;transition:transform .28s ease,box-shadow .28s ease;will-change:transform}
.pko-header.is-hidden{transform:translateY(-100%)}
.pko-nav .current-menu-item>a,.pko-nav .current_page_item>a,.pko-nav a[aria-current="page"],.pko-nav a.is-current{color:var(--blue)!important}
.pko-button,.wp-element-button,.pko-contact-form button{padding:13px 27px!important;border-radius:999px!important;font:600 13px/1 Quicksand,sans-serif!important;letter-spacing:.12em!important;text-transform:uppercase!important}
.pko-cta{background:var(--blue)!important;color:#fff!important}
.pko-cta h2,.pko-cta p{color:#fff!important}
.pko-cta .pko-button,.pko-cta .wp-element-button{border-color:#fff!important;color:#fff!important}
.pko-cta .pko-button:hover,.pko-cta .wp-element-button:hover{background:#fff!important;color:var(--blue)!important}
.pko-intro>p:not(.pko-eyebrow){font:400 18px/1.65 Quicksand,sans-serif!important;color:#666!important;max-width:650px!important}
.pko-selected-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:54px}
.pko-selected-head h2{margin-bottom:0}
.pko-selected-head .pko-button{flex:0 0 auto}
.pko-service-list.pko-home-service-list{margin-top:50px}
.pko-home-service-list li{padding:0!important;font:inherit!important}
.pko-home-service-list li>a{display:grid;grid-template-columns:64px minmax(260px,1fr) minmax(280px,1fr);gap:24px;align-items:center;padding:22px 18px;text-decoration:none;transition:background .2s ease}
.pko-home-service-list li>a:hover{background:#62bdea}
.pko-home-service-list .pko-service-num-home{font:500 13px/1 Quicksand,sans-serif;color:rgba(255,255,255,.48);letter-spacing:.08em}
.pko-home-service-list .pko-service-name{font:700 clamp(26px,3vw,48px)/1.08 Quicksand,sans-serif;color:#fff}
.pko-home-service-list small{font:400 14px/1.5 Quicksand,sans-serif;text-align:right;color:rgba(255,255,255,.86)}
.pko-parallax{width:100%;height:65vh;min-height:400px;overflow:hidden;background:#eee}
.pko-parallax img{width:100%;height:130%;margin-top:-15%;object-fit:cover;display:block;will-change:transform}
.pko-about-founder{border-left:2px solid var(--blue);padding-left:20px!important;font-size:14px!important;line-height:1.7!important;color:#9a9a9a!important;font-style:italic}
.pko-about-actions{margin-top:12px}
.pko-reviews:hover .pko-review-track{animation-play-state:paused}
.pko-inner-hero .pko-inner-lead.pko-work-lead{max-width:50%;width:50%}
.pko-service-quote{width:calc(100% + 2 * var(--pko-logo-rail));margin-left:calc(-1 * var(--pko-logo-rail));margin-right:calc(-1 * var(--pko-logo-rail))}
.pko-full-image.pko-parallax{height:60vh;min-height:320px}
.pko-footer{background:#1f2021;color:#fff}
.pko-footer-inner{grid-template-columns:2fr 1fr 1fr}
.pko-footer p,.pko-footer a{color:rgba(255,255,255,.68)}
.pko-footer-heading{color:rgba(255,255,255,.32)!important}
.pko-footer-bottom{border-top-color:rgba(255,255,255,.1);color:rgba(255,255,255,.3)}
.pko-footer .pko-logo img{filter:brightness(0) invert(1)}
@media(max-width:900px){.pko-home-service-list li>a{grid-template-columns:48px 1fr}.pko-home-service-list small{grid-column:2;text-align:left}.pko-inner-hero .pko-inner-lead.pko-work-lead{max-width:100%;width:100%}}
@media(max-width:600px){body{padding-top:76px}.pko-selected-head{align-items:flex-start;flex-direction:column;margin-bottom:42px}.pko-parallax{height:50vh;min-height:320px}}


/* v1.0.8 — targeted refinements only */
/* Header: subtle 20% drop shadow, retain existing reveal-on-scroll behaviour. */
.pko-header{box-shadow:0 8px 22px rgba(0,0,0,.20)}

/* Footer: pages navigation replaces Get in Touch. */
.pko-footer-inner{grid-template-columns:2fr 1fr 1fr!important}
.pko-footer-nav nav{display:flex;flex-direction:column;gap:16px}

/* Buttons: keep every site button content-width, never stretched by constrained blocks. */
.pko-button,.wp-element-button,.pko-contact-form button{width:max-content!important;max-width:100%!important;align-self:flex-start!important}
.pko-cta>.pko-button,.pko-cta .wp-block-button,.pko-cta .wp-block-button__link{width:max-content!important}

/* Fancy a Chat sits directly against the footer. */
.pko-cta{margin-bottom:0!important}
.pko-footer{margin-top:0!important}

/* Homepage Selected Work: exact light-grey field. */
.pko-selected-work{background:#f7f7f7!important}

/* Homepage What We Do: Figma layout and colour. */
.pko-services{background:var(--blue)!important;color:#fff!important;padding-top:clamp(64px,7vw,96px)!important;padding-bottom:clamp(64px,7vw,96px)!important}
.pko-services .pko-eyebrow{display:flex!important;align-items:center;gap:12px;color:rgba(255,255,255,.8)!important;margin-bottom:20px!important}
.pko-services .pko-eyebrow:before{content:"";display:block;width:32px;height:1px;background:rgba(255,255,255,.5)}
.pko-services h2{line-height:1!important;margin:0 0 20px!important;color:#fff!important}
.pko-services>p:not(.pko-eyebrow){width:min(100%,390px)!important;max-width:390px!important;margin:0 0 40px!important;color:rgba(255,255,255,.8)!important;font-size:16px!important;line-height:1.65!important}
.pko-service-list.pko-home-service-list{margin-top:0!important;border-top:1px solid rgba(255,255,255,.2)!important}
.pko-home-service-list li{border-bottom:1px solid rgba(255,255,255,.2)!important}
.pko-home-service-list li>a{grid-template-columns:48px minmax(260px,5fr) minmax(280px,6fr)!important;gap:24px!important;padding:22px 0!important}
.pko-home-service-list li>a:hover{background:#62bdea!important;padding-left:18px!important;padding-right:18px!important}
.pko-home-service-list .pko-service-num-home{font-size:13px!important}
.pko-home-service-list .pko-service-name{font-size:clamp(28px,3.2vw,50px)!important}

/* Homepage parallax image below What We Do. */
.pko-parallax[data-pko-home-parallax]{display:block!important;width:100%!important;height:65vh!important;min-height:400px!important;margin:0!important}

/* Homepage About PKO: exact 5/7 Figma split. */
.pko-home-about{background:#fff!important}
.pko-home-about .wp-block-columns{display:grid!important;grid-template-columns:5fr 7fr!important;gap:clamp(48px,5vw,64px)!important;align-items:start!important;margin:0!important}
.pko-home-about .wp-block-column{margin:0!important}
.pko-home-about .wp-block-column:first-child h2{line-height:1.02!important;margin-bottom:30px!important}
.pko-home-about .wp-block-column:last-child{display:flex!important;flex-direction:column!important;justify-content:center!important;gap:24px!important}
.pko-home-about .wp-block-column:last-child p{margin:0!important;font-size:clamp(16px,1.4vw,18px)!important;line-height:1.7!important;color:#666!important}
.pko-home-about .pko-about-founder{font-size:14px!important;color:#aaa!important;border-left:2px solid var(--blue)!important;padding-left:20px!important;font-style:italic!important}

/* Services page: tighter number/title spacing, centred quote, stacked CTA button. */
.pko-service-row{grid-template-columns:46px minmax(240px,3fr) minmax(320px,4fr) minmax(240px,3fr)!important;column-gap:14px!important}
.pko-service-quote-inner{margin-left:auto!important;margin-right:auto!important;text-align:center!important}
.pko-service-quote cite{display:block!important;text-align:center!important}
.pko-services-bottom-inner{display:block!important}
.pko-services-bottom .pko-button{display:inline-block!important;margin-top:30px!important}

/* About page: all buttons content-width; reviews sit above Fancy a Chat. */
.pko-about-image-copy .pko-button{width:max-content!important}

@media(max-width:1000px){
 .pko-home-about .wp-block-columns{grid-template-columns:1fr!important}
 .pko-service-row{grid-template-columns:42px 1fr 1fr!important;column-gap:12px!important}
}
@media(max-width:700px){
 .pko-home-service-list li>a{grid-template-columns:40px 1fr!important}
 .pko-home-service-list small{grid-column:2!important;text-align:left!important}
 .pko-service-row{grid-template-columns:36px 1fr!important;column-gap:10px!important}
}

/* v1.0.9 — targeted layout/typography refinements only */

/* Use the same content edges as the page sections. */
.pko-header-inner{max-width:calc(var(--max) + (2 * var(--pad)))!important}

/* The fixed header overlays the homepage hero rather than pushing it down. */
.pko-header{position:fixed!important;top:0;left:0;right:0}
.pko-inner-main{padding-top:76px!important}
body.home main{padding-top:0!important}

/* Major page blocks must meet each other with no browser/Gutenberg gap. */
main>*,main>.wp-block-group,.pko-section,.pko-cta,.pko-reviews,.pko-parallax,.pko-full-image{margin-top:0!important;margin-bottom:0!important}

/* Buttons: one consistent content-width rounded rectangle across the site. */
.pko-button,.wp-element-button{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:max-content!important;max-width:100%!important;padding:13px 27px!important;border-radius:999px!important;white-space:nowrap!important}
.wp-block-button{width:auto!important;max-width:100%!important}
.wp-block-buttons{align-items:flex-start!important}

/* Homepage: Pop the Kettle On occupies the left half of the content grid. */
.pko-intro>p,.pko-intro>h2{width:50%!important;max-width:700px!important;margin-left:0!important;margin-right:auto!important}
.pko-intro .pko-lead,.pko-intro>p:not(.pko-eyebrow){font-size:18px!important;line-height:1.65!important;color:#667085!important}

/* Homepage: What We Do exactly follows the blue Figma treatment. */
.pko-services{background:#38AEE4!important;color:#fff!important}
.pko-services .pko-eyebrow{color:rgba(255,255,255,.82)!important}
.pko-services h2{color:#fff!important;margin:0 0 22px!important}
.pko-services>p:not(.pko-eyebrow){color:rgba(255,255,255,.82)!important;max-width:430px!important}
.pko-home-service-list{border-top:1px solid rgba(255,255,255,.24)!important}
.pko-home-service-list li{border-bottom:1px solid rgba(255,255,255,.24)!important}
.pko-home-service-list li>a{display:grid!important;grid-template-columns:72px minmax(280px,1.5fr) minmax(300px,1fr)!important;gap:28px!important;align-items:center!important;padding:30px 0!important;color:#fff!important}
.pko-home-service-list li>a:hover{background:#62BDEA!important;padding-left:18px!important;padding-right:18px!important}
.pko-home-service-list .pko-service-num-home{font-size:13px!important;color:rgba(255,255,255,.5)!important;letter-spacing:.08em!important}
.pko-home-service-list .pko-service-name{font-size:clamp(34px,3.35vw,54px)!important;line-height:1.05!important;color:#fff!important}
.pko-home-service-list small{font-size:14px!important;line-height:1.5!important;color:rgba(255,255,255,.84)!important;text-align:right!important}

/* Homepage parallax must be a real visual block, flush to its neighbours. */
.pko-parallax[data-pko-home-parallax]{height:65vh!important;min-height:400px!important;overflow:hidden!important;background:#eee!important}
.pko-parallax[data-pko-home-parallax] img{display:block!important;width:100%!important;height:130%!important;object-fit:cover!important;margin-top:-15%!important;will-change:transform!important}

/* Homepage About PKO: Figma 5/7 split. */
.pko-home-about .wp-block-columns{display:grid!important;grid-template-columns:5fr 7fr!important;gap:clamp(52px,6vw,90px)!important;align-items:center!important}
.pko-home-about .wp-block-column:first-child{display:flex!important;flex-direction:column!important;align-items:flex-start!important}
.pko-home-about .wp-block-column:last-child{display:flex!important;flex-direction:column!important;justify-content:center!important;gap:24px!important}
.pko-home-about .pko-about-founder{border-left:2px solid var(--blue)!important;padding-left:24px!important;font-size:14px!important;color:#a3a9b4!important;font-style:italic!important}

/* Fancy a Chat meets the footer directly. */
.pko-cta{margin-bottom:0!important}
.pko-cta+.pko-footer{margin-top:0!important}

/* Footer: Social remains central and Navigation occupies the former Get in Touch position. */
.pko-footer-inner{grid-template-columns:2fr 1fr 1.2fr!important}
.pko-footer-nav{justify-self:end!important;min-width:180px}

/* Contact: no email block; social remains aligned with the page grid. */
.pko-contact-details{border-top:2px solid var(--blue)!important}

@media(max-width:900px){
  .pko-intro>p,.pko-intro>h2{width:100%!important;max-width:100%!important}
  .pko-home-service-list li>a{grid-template-columns:52px 1fr!important;gap:16px!important}
  .pko-home-service-list small{grid-column:2!important;text-align:left!important}
  .pko-home-about .wp-block-columns{grid-template-columns:1fr!important}
  .pko-footer-nav{justify-self:start!important}
}

/* v1.0.10 — homepage section layouts matched to supplied references only */

/* Pop the Kettle On */
.pko-home-kettle{
  background:#fff!important;
  padding:clamp(95px,9vw,145px) var(--pad)!important;
}
.pko-home-kettle-inner{
  max-width:var(--max);
  margin:0 auto;
}
.pko-home-kettle .pko-eyebrow{
  margin:0 0 clamp(54px,6vw,82px)!important;
}
.pko-home-kettle h2{
  width:52%;
  max-width:760px;
  margin:0 0 clamp(48px,5vw,70px)!important;
  line-height:1.02!important;
  letter-spacing:-.035em;
}
.pko-home-kettle-copy{
  width:50%;
  max-width:690px;
}
.pko-home-kettle-copy p{
  margin:0 0 28px!important;
  font-size:17px!important;
  line-height:1.65!important;
  color:#667085!important;
}
.pko-home-kettle-copy p:last-child{margin-bottom:0!important}

/* Selected Work */
.pko-home-selected{
  background:#f7f7f7!important;
  padding:clamp(90px,8vw,130px) var(--pad)!important;
}
.pko-home-selected-inner{max-width:var(--max);margin:0 auto}
.pko-home-selected-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:40px;
  align-items:end;
  margin-bottom:clamp(64px,6vw,90px);
}
.pko-home-selected-head .pko-eyebrow{margin:0 0 42px!important}
.pko-home-selected-head h2{
  margin:0!important;
  line-height:1.02!important;
  letter-spacing:-.035em;
}
.pko-home-selected-head .pko-button{margin-bottom:6px}
.pko-home-selected .pko-work-grid{margin-top:0!important}

/* What We Do */
.pko-home-services{
  background:#38AEE4!important;
  color:#fff!important;
  padding:clamp(70px,7vw,100px) var(--pad) 0!important;
}
.pko-home-services-inner{max-width:var(--max);margin:0 auto}
.pko-home-services .pko-eyebrow{
  display:flex;
  align-items:center;
  gap:14px;
  margin:0 0 34px!important;
  color:rgba(255,255,255,.86)!important;
}
.pko-home-services .pko-eyebrow:before{content:none!important;display:none!important;}
.pko-home-services h2{
  margin:0 0 26px!important;
  color:#fff!important;
  line-height:.96!important;
  letter-spacing:-.035em;
}
.pko-home-services-intro{
  width:440px;
  max-width:100%;
  margin:0 0 66px!important;
  color:rgba(255,255,255,.82)!important;
  font-size:17px!important;
  line-height:1.7!important;
}
.pko-home-services-list{
  border-top:1px solid rgba(255,255,255,.25);
}
.pko-home-service-row{
  border-bottom:1px solid rgba(255,255,255,.25);
}
.pko-home-service-row a{
  display:grid;
  grid-template-columns:95px minmax(300px,1.25fr) minmax(360px,1fr);
  align-items:center;
  gap:28px;
  min-height:124px;
  padding:22px 0;
  color:#fff!important;
  text-decoration:none!important;
  transition:background .2s ease,padding .2s ease;
}
.pko-home-service-row a:hover{
  background:#62BDEA;
  padding-left:18px;
  padding-right:18px;
}
.pko-home-service-num{
  color:rgba(255,255,255,.45);
  font-size:13px;
  font-weight:500;
  letter-spacing:.04em;
}
.pko-home-service-title{
  font-weight:700;
  line-height:1.05;
  letter-spacing:-.02em;
}
.pko-home-service-desc{
  color:rgba(255,255,255,.8);
  font-size:14px;
  line-height:1.55;
  text-align:right;
}

/* About PKO */
.pko-home-about-exact{
  background:#fff!important;
  padding:clamp(90px,8vw,130px) var(--pad)!important;
}
.pko-home-about-exact-inner{
  max-width:var(--max);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:clamp(60px,7vw,110px);
  align-items:center;
}
.pko-home-about-exact-left .pko-eyebrow{margin:0 0 48px!important}
.pko-home-about-exact h2{
  margin:0 0 48px!important;
  line-height:1.02!important;
  letter-spacing:-.035em;
}
.pko-home-about-exact-right{
  display:flex;
  flex-direction:column;
  gap:28px;
}
.pko-home-about-exact-right p{
  margin:0!important;
  color:#667085!important;
  font-size:18px!important;
  line-height:1.7!important;
}
.pko-home-about-exact-right .pko-about-founder{
  margin-top:8px!important;
  border-left:3px solid var(--blue)!important;
  padding:4px 0 4px 28px!important;
  color:#a2a9b5!important;
  font-size:15px!important;
  line-height:1.6!important;
  font-style:italic!important;
}

@media(max-width:900px){
  .pko-home-kettle h2,.pko-home-kettle-copy{width:100%;max-width:100%}
  .pko-home-selected-head{grid-template-columns:1fr;align-items:start}
  .pko-home-selected-head .pko-button{margin:0}
  .pko-home-service-row a{grid-template-columns:52px 1fr;gap:14px;min-height:auto;padding:24px 0}
  .pko-home-service-desc{grid-column:2;text-align:left}
  .pko-home-about-exact-inner{grid-template-columns:1fr;gap:52px}
}

/* v1.0.11 — supplied homepage reference layouts. These selectors intentionally
   override earlier iterations without changing other pages. */
body.home .pko-ref-kettle,
body.home .pko-ref-selected,
body.home .pko-ref-services,
body.home .pko-ref-about{width:100%;margin:0!important;border:0!important}

/* POP THE KETTLE ON — reference: left aligned, roughly half-page copy column. */
body.home .pko-ref-kettle{padding:clamp(90px,8vw,130px) var(--pad)!important;background:#fff!important}
body.home .pko-ref-kettle .pko-home-kettle-inner{width:100%!important;max-width:none!important;margin:0!important}
body.home .pko-ref-kettle .pko-eyebrow{margin:0 0 clamp(54px,5vw,76px)!important}
body.home .pko-ref-kettle h2{width:52%!important;max-width:900px!important;margin:0 0 clamp(48px,4vw,64px)!important;line-height:1.02!important;letter-spacing:-.035em!important}
body.home .pko-ref-kettle .pko-home-kettle-copy{width:50%!important;max-width:700px!important}
body.home .pko-ref-kettle .pko-home-kettle-copy p{margin:0 0 28px!important;font-size:18px!important;line-height:1.7!important;color:#667085!important}
body.home .pko-ref-kettle .pko-home-kettle-copy p:last-child{margin-bottom:0!important}

/* SELECTED WORK — reference: grey section, title left and All Work aligned right. */
body.home .pko-ref-selected{padding:clamp(90px,8vw,130px) var(--pad)!important;background:#f7f7f7!important}
body.home .pko-ref-selected .pko-home-selected-inner{width:100%!important;max-width:none!important;margin:0!important}
body.home .pko-ref-selected .pko-home-selected-head{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:48px!important;align-items:end!important;margin:0 0 clamp(64px,6vw,90px)!important}
body.home .pko-ref-selected .pko-eyebrow{margin:0 0 46px!important}
body.home .pko-ref-selected h2{margin:0!important;line-height:1.02!important;letter-spacing:-.035em!important}
body.home .pko-ref-selected .pko-button{align-self:end!important;margin:0 0 5px!important;width:auto!important;min-width:0!important;justify-self:end!important}
body.home .pko-ref-selected .pko-work-grid{margin-top:0!important}

/* WHAT WE DO — reference: full blue panel and true three-column service rows. */
body.home .pko-ref-services{padding:clamp(68px,6vw,92px) var(--pad) 0!important;background:#38AEE4!important;color:#fff!important}
body.home .pko-ref-services .pko-home-services-inner{width:100%!important;max-width:none!important;margin:0!important}
body.home .pko-ref-services .pko-eyebrow{display:flex!important;align-items:center!important;gap:14px!important;margin:0 0 34px!important;color:rgba(255,255,255,.88)!important}
body.home .pko-ref-services .pko-eyebrow:before{content:none!important;display:none!important;}
body.home .pko-ref-services h2{margin:0 0 28px!important;color:#fff!important;line-height:.96!important;letter-spacing:-.04em!important}
body.home .pko-ref-services .pko-home-services-intro{width:460px!important;max-width:100%!important;margin:0 0 68px!important;color:rgba(255,255,255,.82)!important;font-size:17px!important;line-height:1.65!important}
body.home .pko-ref-services .pko-home-services-list{border-top:1px solid rgba(255,255,255,.25)!important}
body.home .pko-ref-services .pko-home-service-row{border-bottom:1px solid rgba(255,255,255,.25)!important}
body.home .pko-ref-services .pko-home-service-row a{display:grid!important;grid-template-columns:82px minmax(360px,1.1fr) minmax(360px,1fr)!important;gap:28px!important;align-items:center!important;width:100%!important;min-height:126px!important;padding:22px 0!important;color:#fff!important;text-decoration:none!important;transition:background .2s ease,padding .2s ease!important}
body.home .pko-ref-services .pko-home-service-row a:hover{background:#62BDEA!important;padding-left:18px!important;padding-right:18px!important}
body.home .pko-ref-services .pko-home-service-num{display:block!important;color:rgba(255,255,255,.5)!important;font-size:13px!important;font-weight:500!important;line-height:1!important;text-decoration:none!important}
body.home .pko-ref-services .pko-home-service-title{display:block!important;color:#fff!important;font-weight:700!important;line-height:1.05!important;letter-spacing:-.02em!important;text-decoration:none!important}
body.home .pko-ref-services .pko-home-service-desc{display:block!important;color:rgba(255,255,255,.82)!important;font-size:14px!important;line-height:1.55!important;text-align:right!important;text-decoration:none!important}

/* PARALLAX — actual image block between What We Do and About. */
body.home .pko-home-parallax-real{width:100%!important;height:64vh!important;min-height:420px!important;margin:0!important;overflow:hidden!important;background:#eee!important}
body.home .pko-home-parallax-real img{display:block!important;width:100%!important;height:130%!important;object-fit:cover!important;margin-top:-15%!important;will-change:transform!important}

/* ABOUT PKO — reference: strong 5/7 split with founder callout. */
body.home .pko-ref-about{padding:clamp(90px,8vw,130px) var(--pad)!important;background:#fff!important}
body.home .pko-ref-about .pko-home-about-exact-inner{width:100%!important;max-width:none!important;margin:0!important;display:grid!important;grid-template-columns:minmax(0,5fr) minmax(0,7fr)!important;gap:clamp(60px,7vw,110px)!important;align-items:center!important}
body.home .pko-ref-about .pko-home-about-exact-left{display:flex!important;flex-direction:column!important;align-items:flex-start!important}
body.home .pko-ref-about .pko-eyebrow{margin:0 0 48px!important}
body.home .pko-ref-about h2{margin:0 0 48px!important;line-height:1.02!important;letter-spacing:-.035em!important}
body.home .pko-ref-about .pko-button{width:auto!important;min-width:0!important}
body.home .pko-ref-about .pko-home-about-exact-right{display:flex!important;flex-direction:column!important;gap:28px!important}
body.home .pko-ref-about .pko-home-about-exact-right p{margin:0!important;color:#667085!important;font-size:18px!important;line-height:1.7!important}
body.home .pko-ref-about .pko-home-about-exact-right .pko-about-founder{margin-top:8px!important;border-left:3px solid #38AEE4!important;padding:4px 0 4px 28px!important;color:#a2a9b5!important;font-size:15px!important;line-height:1.6!important;font-style:italic!important}

@media(max-width:900px){
 body.home .pko-ref-kettle h2,body.home .pko-ref-kettle .pko-home-kettle-copy{width:100%!important;max-width:100%!important}
 body.home .pko-ref-selected .pko-home-selected-head{grid-template-columns:1fr!important;align-items:start!important}
 body.home .pko-ref-selected .pko-button{justify-self:start!important;margin:0!important}
 body.home .pko-ref-services .pko-home-service-row a{grid-template-columns:52px 1fr!important;gap:14px!important;min-height:auto!important;padding:26px 0!important}
 body.home .pko-ref-services .pko-home-service-desc{grid-column:2!important;text-align:left!important}
 body.home .pko-ref-about .pko-home-about-exact-inner{grid-template-columns:1fr!important;gap:52px!important}
}

/* v1.0.13 — hero sequence only: no crossfade, no homepage gap below fixed header. */
body.home{padding-top:0!important}
body.home .pko-hero{margin-top:0!important;padding-top:0!important}
body.home .pko-hero-sticky{top:0!important}
.pko-frame{transition:none!important;animation:none!important;opacity:0;visibility:hidden}
.pko-frame:first-child{opacity:1;visibility:visible}

/* v1.0.16 heading semantics: preserve existing layouts while using correct hierarchy. */
.pko-home-service-title{margin:0!important;}
.pko-work-card h2,.pko-work-card h3{margin:15px 0 4px;}
.pko-work-card h2 a,.pko-work-card h3 a{text-decoration:none;}


/* v1.0.18 — requested heading scale + homepage content alignment. */

/* Match homepage content edges to the header logo and Start a Chat button. */
@media(min-width:901px){
  body.home .pko-ref-kettle,
  body.home .pko-ref-selected,
  body.home .pko-ref-services,
  body.home .pko-ref-about{padding-left:0!important;padding-right:0!important;}

  body.home .pko-ref-kettle .pko-home-kettle-inner,
  body.home .pko-ref-selected .pko-home-selected-inner,
  body.home .pko-ref-services .pko-home-services-inner,
  body.home .pko-ref-about .pko-home-about-exact-inner{
    width:100%!important;
    max-width:var(--max)!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:var(--pad)!important;
    padding-right:var(--pad)!important;
  }
}


/* v1.0.20 — typography cleanup: heading sizes are controlled only by pko_assets()/PKO Site Settings.
   Supporting text retains its existing contextual sizes; public typeface is Quicksand throughout. */

/* v1.0.23 — work card titles now use H4. */
.pko-work-card h4{margin:15px 0 4px;}
.pko-work-card h4 a{text-decoration:none;}


/* v1.0.25 — readable text on PKO blue backgrounds. */
.has-pko-blue-background-color h1,
.has-pko-blue-background-color h2,
.has-pko-blue-background-color h3,
.has-pko-blue-background-color h4,
.has-pko-blue-background-color h5,
.has-pko-blue-background-color h6,
.has-pko-blue-background-color p,
.has-pko-blue-background-color small,
.has-pko-blue-background-color li,
.has-pko-blue-background-color .pko-eyebrow,
.pko-services h1,.pko-services h2,.pko-services h3,.pko-services h4,.pko-services h5,.pko-services h6,.pko-services p,.pko-services small,.pko-services li,.pko-services .pko-eyebrow,
.pko-cta h1,.pko-cta h2,.pko-cta h3,.pko-cta h4,.pko-cta h5,.pko-cta h6,.pko-cta p,.pko-cta small,.pko-cta li,.pko-cta .pko-eyebrow,
.pko-service-quote h1,.pko-service-quote h2,.pko-service-quote h3,.pko-service-quote h4,.pko-service-quote h5,.pko-service-quote h6,.pko-service-quote p,.pko-service-quote small,.pko-service-quote li,.pko-service-quote .pko-eyebrow{color:#FFFFFF!important;}
.has-pko-blue-background-color a:not(.wp-element-button):not(.pko-button),
.pko-services a:not(.wp-element-button):not(.pko-button),
.pko-cta a:not(.wp-element-button):not(.pko-button),
.pko-service-quote a:not(.wp-element-button):not(.pko-button){color:#FFFFFF!important;}

/* v1.0.26 — all headings/text inside the homepage What We Do blue panel stay white,
   including headings carrying an explicit section colour class. */
html body .pko-home-services h1,
html body .pko-home-services h2,
html body .pko-home-services h3,
html body .pko-home-services h4,
html body .pko-home-services h5,
html body .pko-home-services h6,
html body .pko-home-services p,
html body .pko-home-services small,
html body .pko-home-services li,
html body .pko-home-services .pko-eyebrow,
html body .pko-ref-services h1,
html body .pko-ref-services h2,
html body .pko-ref-services h3,
html body .pko-ref-services h4,
html body .pko-ref-services h5,
html body .pko-ref-services h6,
html body .pko-ref-services p,
html body .pko-ref-services small,
html body .pko-ref-services li,
html body .pko-ref-services .pko-eyebrow {color:#FFFFFF!important;}

/* v1.0.31 — definitive Fancy a Chat contrast rule. */
html body section.pko-cta,
html body section.pko-cta h1,
html body section.pko-cta h2,
html body section.pko-cta h3,
html body section.pko-cta h4,
html body section.pko-cta h5,
html body section.pko-cta h6,
html body section.pko-cta p,
html body section.pko-cta small,
html body section.pko-cta li {
  color: #FFFFFF !important;
}
html body section.pko-cta { background: #38AEE4 !important; }

/* v1.0.34 — homepage hero always uses white display copy over imagery. */
html body.home .pko-hero .pko-hero-copy,
html body.home .pko-hero .pko-hero-copy h1,
html body.home .pko-hero .pko-hero-copy h2,
html body.home .pko-hero .pko-hero-copy h3,
html body.home .pko-hero .pko-hero-copy h4,
html body.home .pko-hero .pko-hero-copy h5,
html body.home .pko-hero .pko-hero-copy h6,
html body.home .pko-hero .pko-hero-copy p { color:#FFFFFF!important; }

/* v1.0.35 — mobile-only viewport, navigation and type refinements. Desktop unchanged. */
@media (max-width: 700px) {
  html, body { width:100%; max-width:100%; overflow-x:clip; }

  /* Keep the scroll-scrub hero sticky on mobile. overflow:hidden on html/body breaks position:sticky in mobile Safari/Chrome. */
  body.home .pko-hero { height:350vh !important; overflow:visible !important; }
  body.home .pko-hero-sticky { position:sticky !important; top:0 !important; height:100svh !important; min-height:100vh; overflow:hidden !important; }
  body.home .pko-frames, body.home .pko-frame { width:100% !important; max-width:none !important; height:100% !important; }
  img, video, canvas, svg { max-width:100%; }
  .pko-header, .pko-header-inner, main, .site-main { max-width:100%; }

  /* Mobile heading scale only */
  h1 { font-size:66px !important; }
  h2 { font-size:50px !important; }
  h3 { font-size:28px !important; }
  h4 { font-size:24px !important; }
  h5 { font-size:20px !important; }
  h6 { font-size:18px !important; }

  /* Replace MENU label with a true hamburger icon. */
  .pko-menu-toggle {
    display:block;
    width:44px;
    height:44px;
    padding:0;
    position:relative;
    overflow:hidden;
    text-indent:-9999px;
    cursor:pointer;
  }
  .pko-menu-toggle::before,
  .pko-menu-toggle::after,
  .pko-menu-toggle span {
    content:"";
    position:absolute;
    left:10px;
    width:24px;
    height:2px;
    background:var(--dark);
    border-radius:2px;
    transition:transform .22s ease, top .22s ease, opacity .22s ease;
  }
  .pko-menu-toggle::before { top:14px; }
  .pko-menu-toggle span { top:21px; }
  .pko-menu-toggle::after { top:28px; }
  .pko-menu-toggle[aria-expanded="true"]::before { top:21px; transform:rotate(45deg); }
  .pko-menu-toggle[aria-expanded="true"] span { opacity:0; }
  .pko-menu-toggle[aria-expanded="true"]::after { top:21px; transform:rotate(-45deg); }

  .pko-nav { max-width:100vw; overflow-x:hidden; }
  .pko-project-content .alignfull,
  .pko-project-story,
  .pko-service-quote { max-width:100vw; }
}

/* v1.0.39 — mobile hero spacing and type correction only. Desktop unchanged. */
@media (max-width:700px){
  /* Keep the hero image beneath the fixed header, but keep the copy safely below it. */
  body.home .pko-hero-inner{
    top:76px!important;
    bottom:0!important;
    height:auto!important;
    align-items:center!important;
  }
  body.home .pko-hero-copy{
    margin-top:0!important;
    padding-top:12px!important;
    padding-bottom:32px!important;
  }

  /* Reduced mobile heading scale. These intentionally override global saved desktop sizes. */
  html body h1,
  html body [class][class] h1{font-size:52px!important;}
  html body h2,
  html body [class][class] h2{font-size:42px!important;}

  body.home .pko-hero-copy h1{
    font-size:52px!important;
    line-height:.98!important;
  }
}

/* v1.0.40 — flicker-free hero sequence compositor. */
.pko-frames{background:#111;transform:translateZ(0)}
.pko-frame{
  transition:none!important;
  animation:none!important;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transform:translateZ(0);
  will-change:opacity;
}


/* v1.0.41 — automatic PKO-blue accent on the final two words of H1/H2/H3. */
.pko-last-words{color:#38AEE4!important;}
/* Keep headings fully white wherever the design uses a dark/image or PKO-blue background. */
.has-pko-blue-background-color .pko-last-words,
[style*="background-color:#38AEE4"] .pko-last-words,
[style*="background-color: #38AEE4"] .pko-last-words,
[style*="background-color:#38aee4"] .pko-last-words,
[style*="background-color: #38aee4"] .pko-last-words{color:#FFFFFF!important;}

/* v1.0.45 — definitive Work project template layout. Kept here because site.css is the enqueued stylesheet. */
body.single-pko_work{padding-top:0!important}
body.single-pko_work .pko-header{margin-bottom:0!important}
body.single-pko_work .pko-case-study{margin:0!important;padding:0!important;background:#fff;color:var(--dark);overflow:hidden}

/* Full-width hero directly beneath the fixed menu. */
body.single-pko_work .pko-case-hero{display:block;margin:0!important;padding:0!important;width:100%!important;max-width:none!important;height:clamp(460px,46vw,780px)!important;background:#e9e9e9!important;overflow:hidden}
body.single-pko_work .pko-case-hero img{display:block;width:100%!important;height:100%!important;margin:0!important;object-fit:cover!important}
body.single-pko_work .pko-hero-placeholder{display:block;width:100%!important;height:100%!important;min-height:100%!important;background:#e9e9e9!important}

/* Exact same horizontal content rails as the site header. */
body.single-pko_work .pko-case-wrap{
  width:100%!important;
  max-width:calc(var(--max) + (2 * var(--pad)))!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:var(--pad)!important;
  padding-right:var(--pad)!important;
}

/* Intro/details. */
body.single-pko_work .pko-case-meta-section{padding:clamp(78px,7vw,112px) 0!important;background:#fff!important}
body.single-pko_work .pko-case-meta-grid{display:grid!important;grid-template-columns:minmax(0,2.15fr) minmax(240px,.85fr)!important;gap:clamp(64px,8vw,140px)!important;align-items:start!important}
body.single-pko_work .pko-case-category,body.single-pko_work .pko-case-next-label{margin:0 0 24px!important;color:var(--blue)!important;font-size:13px!important;font-weight:600!important;letter-spacing:.14em!important;text-transform:uppercase!important}
body.single-pko_work .pko-case-intro h1{max-width:900px!important;margin:0 0 30px!important;line-height:1.02!important;color:var(--dark)!important}
body.single-pko_work .pko-case-lead{max-width:760px!important;color:#687184!important;font-size:clamp(18px,1.3vw,22px)!important;line-height:1.65!important}
body.single-pko_work .pko-case-lead p{margin:0!important}
body.single-pko_work .pko-case-details{padding-top:24px!important;display:flex!important;flex-direction:column!important;gap:32px!important}
body.single-pko_work .pko-case-details span{display:block!important;margin-bottom:8px!important;color:#aeb6c6!important;font-size:13px!important;letter-spacing:.14em!important;text-transform:uppercase!important}
body.single-pko_work .pko-case-details p{margin:0 0 5px!important;font-size:15px!important;line-height:1.55!important;color:#32343a!important}
body.single-pko_work .pko-case-details .pko-case-service-link{color:inherit;text-decoration:none;text-underline-offset:3px}
body.single-pko_work .pko-case-details .pko-case-service-link:hover,body.single-pko_work .pko-case-details .pko-case-service-link:focus-visible{color:#168bbd;text-decoration:underline}

/* About-the-work copy band. */
body.single-pko_work .pko-case-story-section{padding:clamp(64px,6vw,92px) 0!important;background:#f6f6f6!important}
body.single-pko_work .pko-case-story-copy{font-size:clamp(18px,1.25vw,22px)!important;line-height:1.75!important;color:#687184!important}
body.single-pko_work .pko-case-story-copy p{margin:0!important;max-width:960px!important}

/* Image grid — same rails as all other project content. */
body.single-pko_work .pko-case-gallery-section{padding:clamp(44px,4vw,68px) 0 clamp(72px,7vw,110px)!important;background:#fff!important}
body.single-pko_work .pko-case-gallery{
  width:100%!important;
  max-width:calc(var(--max) + (2 * var(--pad)))!important;
  margin:0 auto!important;
  padding-left:var(--pad)!important;
  padding-right:var(--pad)!important;
  display:grid!important;
  gap:clamp(18px,2vw,28px)!important;
}
body.single-pko_work .pko-case-gallery figure{margin:0!important;min-width:0!important;background:#e9e9e9!important;overflow:hidden!important}
body.single-pko_work .pko-case-gallery img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important}
body.single-pko_work .pko-image-placeholder{display:block!important;background:#e9e9e9!important;min-height:360px!important}
body.single-pko_work .pko-gallery-two-column{grid-template-columns:repeat(2,minmax(0,1fr))!important}
body.single-pko_work .pko-gallery-two-column figure{aspect-ratio:4/5!important}
body.single-pko_work .pko-gallery-three-column{grid-template-columns:repeat(3,minmax(0,1fr))!important}
body.single-pko_work .pko-gallery-three-column figure{aspect-ratio:4/5!important}
body.single-pko_work .pko-gallery-feature-left,body.single-pko_work .pko-gallery-feature-right{grid-template-columns:repeat(12,minmax(0,1fr))!important;grid-auto-rows:minmax(240px,28vw)!important}
body.single-pko_work .pko-gallery-feature-left figure,body.single-pko_work .pko-gallery-feature-right figure{grid-column:span 6!important;aspect-ratio:4/3!important}
body.single-pko_work .pko-gallery-feature-left .pko-gallery-item-1{grid-column:span 7!important;grid-row:span 2!important;aspect-ratio:auto!important}
body.single-pko_work .pko-gallery-feature-left .pko-gallery-item-2,body.single-pko_work .pko-gallery-feature-left .pko-gallery-item-3{grid-column:span 5!important;aspect-ratio:auto!important}
body.single-pko_work .pko-gallery-feature-right .pko-gallery-item-1{grid-column:6 / span 7!important;grid-row:span 2!important;aspect-ratio:auto!important}
body.single-pko_work .pko-gallery-feature-right .pko-gallery-item-2,body.single-pko_work .pko-gallery-feature-right .pko-gallery-item-3{grid-column:1 / span 5!important;aspect-ratio:auto!important}
body.single-pko_work .pko-gallery-feature-right .pko-gallery-item-2{grid-row:1!important}
body.single-pko_work .pko-gallery-feature-right .pko-gallery-item-3{grid-row:2!important}
body.single-pko_work .pko-gallery-editorial{grid-template-columns:repeat(12,minmax(0,1fr))!important}
body.single-pko_work .pko-gallery-editorial figure{grid-column:span 6!important;aspect-ratio:4/5!important}
body.single-pko_work .pko-gallery-editorial .pko-gallery-item-1,body.single-pko_work .pko-gallery-editorial .pko-gallery-item-4,body.single-pko_work .pko-gallery-editorial .pko-gallery-item-7,body.single-pko_work .pko-gallery-editorial .pko-gallery-item-10{grid-column:1/-1!important;aspect-ratio:16/8.5!important}

/* Optional editor content, next project and CTA. */
body.single-pko_work .pko-case-additional-section{padding:clamp(72px,7vw,110px) 0!important;background:#fff!important}
body.single-pko_work .pko-case-additional-content{font-size:18px!important;line-height:1.75!important;color:#687184!important}
body.single-pko_work .pko-case-additional-content>*:first-child{margin-top:0!important}
body.single-pko_work .pko-case-additional-content>*:last-child{margin-bottom:0!important}
body.single-pko_work .pko-case-additional-content .alignwide{width:100%!important;max-width:100%!important}
body.single-pko_work .pko-case-additional-content .alignfull{width:100vw!important;max-width:100vw!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important}
body.single-pko_work .pko-case-next{padding:clamp(64px,6vw,88px) 0!important;background:#f6f6f6!important}
body.single-pko_work .pko-case-next-inner{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:48px!important}
body.single-pko_work .pko-case-next-label{color:#aeb6c6!important;margin-bottom:24px!important}
body.single-pko_work .pko-case-next h2{margin:0!important;line-height:1.04!important;color:var(--dark)!important}
body.single-pko_work .pko-case-next h2 a{text-decoration:none!important;color:inherit!important}
body.single-pko_work .pko-case-next h2 a:hover{color:var(--blue)!important}
body.single-pko_work .pko-case-next .pko-button{flex:0 0 auto!important}
body.single-pko_work .pko-case-next + .pko-cta{margin-top:0!important}

@media(max-width:900px){
  body.single-pko_work .pko-case-meta-grid{grid-template-columns:1fr!important;gap:44px!important}
  body.single-pko_work .pko-case-details{padding-top:0!important;display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:24px!important}
  body.single-pko_work .pko-gallery-three-column{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.single-pko_work .pko-gallery-feature-left,body.single-pko_work .pko-gallery-feature-right{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-rows:auto!important}
  body.single-pko_work .pko-gallery-feature-left figure,body.single-pko_work .pko-gallery-feature-right figure,body.single-pko_work .pko-gallery-feature-left .pko-gallery-item-1,body.single-pko_work .pko-gallery-feature-left .pko-gallery-item-2,body.single-pko_work .pko-gallery-feature-left .pko-gallery-item-3,body.single-pko_work .pko-gallery-feature-right .pko-gallery-item-1,body.single-pko_work .pko-gallery-feature-right .pko-gallery-item-2,body.single-pko_work .pko-gallery-feature-right .pko-gallery-item-3{grid-column:auto!important;grid-row:auto!important;aspect-ratio:4/5!important}
}
@media(max-width:700px){
  body.single-pko_work{padding-top:0!important}
  body.single-pko_work .pko-case-hero{height:64vw!important;min-height:300px!important;max-height:500px!important}
  body.single-pko_work .pko-case-meta-section{padding:54px 0 60px!important}
  body.single-pko_work .pko-case-intro h1{margin-bottom:24px!important}
  body.single-pko_work .pko-case-lead{font-size:18px!important;line-height:1.65!important}
  body.single-pko_work .pko-case-details{grid-template-columns:1fr 1fr!important;gap:24px!important}
  body.single-pko_work .pko-case-story-section{padding:50px 0!important}
  body.single-pko_work .pko-case-story-copy{font-size:18px!important}
  body.single-pko_work .pko-case-gallery-section{padding:22px 0 44px!important}
  body.single-pko_work .pko-case-gallery{gap:14px!important}
  body.single-pko_work .pko-gallery-two-column,body.single-pko_work .pko-gallery-three-column,body.single-pko_work .pko-gallery-feature-left,body.single-pko_work .pko-gallery-feature-right,body.single-pko_work .pko-gallery-editorial{grid-template-columns:1fr!important}
  body.single-pko_work .pko-case-gallery figure,body.single-pko_work .pko-gallery-editorial figure,body.single-pko_work .pko-gallery-editorial .pko-gallery-item-1,body.single-pko_work .pko-gallery-editorial .pko-gallery-item-4,body.single-pko_work .pko-gallery-editorial .pko-gallery-item-7,body.single-pko_work .pko-gallery-editorial .pko-gallery-item-10{grid-column:auto!important;aspect-ratio:auto!important}
  body.single-pko_work .pko-case-gallery img{height:auto!important;object-fit:contain!important}
  body.single-pko_work .pko-image-placeholder{min-height:260px!important}
  body.single-pko_work .pko-case-additional-section{padding:58px 0!important}
  body.single-pko_work .pko-case-next{padding:56px 0!important}
  body.single-pko_work .pko-case-next-inner{align-items:flex-start!important;flex-direction:column!important;gap:32px!important}
}

/* v1.0.47 — Work hero sits immediately below fixed header and always shows the full image. */
body.single-pko_work{padding-top:76px!important}
body.single-pko_work .pko-case-hero{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  background:#e9e9e9!important;
}
body.single-pko_work .pko-case-hero img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  object-fit:contain!important;
  object-position:center center!important;
}
body.single-pko_work .pko-case-hero .pko-hero-placeholder{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:16/9!important;
  background:#e9e9e9!important;
}
@media(max-width:700px){
  body.single-pko_work{padding-top:76px!important}
  body.single-pko_work .pko-case-hero{height:auto!important;min-height:0!important;max-height:none!important}
}

/* v1.0.49 — optional square project gallery */
body.single-pko_work .pko-gallery-square-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
body.single-pko_work .pko-gallery-square-grid figure{aspect-ratio:1/1!important}
body.single-pko_work .pko-gallery-square-grid img{width:100%!important;height:100%!important;object-fit:cover!important}
@media(max-width:600px){body.single-pko_work .pko-gallery-square-grid{grid-template-columns:1fr!important}}

/* v1.0.50 — editable Work intro button + Text 2 typography */
body.single-pko_work .pko-case-intro-button{margin-top:28px!important}
body.single-pko_work .pko-case-story-copy .pko-story-text,
body.single-pko_work .pko-case-story-copy .pko-story-text p{color:var(--pko-story-color,#687184)!important}
body.single-pko_work .pko-case-story-copy h1.pko-story-text,
body.single-pko_work .pko-case-story-copy h2.pko-story-text,
body.single-pko_work .pko-case-story-copy h3.pko-story-text,
body.single-pko_work .pko-case-story-copy h4.pko-story-text,
body.single-pko_work .pko-case-story-copy h5.pko-story-text,
body.single-pko_work .pko-case-story-copy h6.pko-story-text{margin:0!important;max-width:1100px!important;color:var(--pko-story-color,#687184)!important}


/* v1.0.51 — Work project: separate statement/header copy and body copy. */
body.single-pko_work .pko-case-story-copy{display:block!important}
body.single-pko_work .pko-story-heading{margin-bottom:clamp(28px,3vw,48px)!important}
body.single-pko_work .pko-story-body-copy{max-width:920px;color:#687184;font-size:18px;line-height:1.75}
body.single-pko_work .pko-story-body-copy p{margin:0 0 1.25em;color:inherit!important}
body.single-pko_work .pko-story-body-copy p:last-child{margin-bottom:0}
@media(max-width:700px){body.single-pko_work .pko-story-body-copy{font-size:16px;line-height:1.7}}

/* v1.0.53 Work intro/body-copy controls */
body.single-pko_work .pko-case-lead,
body.single-pko_work .pko-case-lead p{color:var(--pko-intro-color,#687184)!important;}
body.single-pko_work .pko-case-lead-heading{color:var(--pko-intro-color,#687184)!important;margin:0!important;max-width:900px!important;}
body.single-pko_work .pko-case-lead-heading + .pko-case-intro-button,
body.single-pko_work .pko-case-lead + .pko-case-intro-button{margin-top:28px!important;}
body.single-pko_work .pko-case-intro-button:first-child{margin-top:0!important;}

/* v1.0.54 — Work page copy hierarchy */
body.single-pko_work .pko-case-body-copy{
  margin-top:32px!important;
  max-width:920px!important;
  color:#687184!important;
  font-size:18px!important;
  line-height:1.75!important;
}
body.single-pko_work .pko-case-body-copy p{margin:0 0 1.25em!important;color:inherit!important;font-size:inherit!important;line-height:inherit!important}
body.single-pko_work .pko-case-body-copy p:last-child{margin-bottom:0!important}
body.single-pko_work .pko-case-intro-button + .pko-case-body-copy{margin-top:32px!important}
body.single-pko_work .pko-case-lead + .pko-case-body-copy,
body.single-pko_work .pko-case-lead-heading + .pko-case-body-copy{margin-top:32px!important}
body.single-pko_work .pko-case-highlight-section{background:#f6f6f6!important}
body.single-pko_work .pko-case-highlight-copy,
body.single-pko_work .pko-case-highlight-copy p{
  color:var(--pko-highlight-color,#687184)!important;
  font-size:18px!important;
  line-height:1.75!important;
}
body.single-pko_work .pko-case-highlight-copy p{margin:0 0 1.25em!important}
body.single-pko_work .pko-case-highlight-copy p:last-child{margin-bottom:0!important}
body.single-pko_work .pko-case-highlight-heading{
  color:var(--pko-highlight-color,#687184)!important;
  margin:0!important;
  max-width:1100px!important;
}
@media(max-width:700px){
  body.single-pko_work .pko-case-body-copy,
  body.single-pko_work .pko-case-highlight-copy,
  body.single-pko_work .pko-case-highlight-copy p{font-size:16px!important;line-height:1.7!important}
}


/* v1.0.56 — Work body copy full width; accent only H1/H2 */
body.single-pko_work .pko-case-body-copy{max-width:none!important;width:100%!important;}
/* H3-H6 never use the automatic last-two-words accent. */
h3 .pko-last-words,h4 .pko-last-words,h5 .pko-last-words,h6 .pko-last-words{color:inherit!important;}

/* v1.0.58 — Shorter Work project hero with centred image crop. */
body.single-pko_work .pko-case-hero{
  height:clamp(360px,48vw,800px)!important;
  min-height:0!important;
  max-height:800px!important;
  overflow:hidden!important;
  background:#e9e9e9!important;
}
body.single-pko_work .pko-case-hero img{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center center!important;
}
body.single-pko_work .pko-case-hero .pko-hero-placeholder{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  aspect-ratio:auto!important;
}
@media(max-width:700px){
  body.single-pko_work .pko-case-hero{
    height:clamp(280px,58vw,420px)!important;
    max-height:420px!important;
  }
}

/* v1.0.60 — per-image Work gallery block sizes */
body.single-pko_work .pko-gallery-square-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:start!important}
body.single-pko_work .pko-gallery-square-grid figure.pko-block-square{grid-column:span 1!important;aspect-ratio:1/1!important}
body.single-pko_work .pko-gallery-square-grid figure.pko-block-wide{grid-column:1/-1!important;aspect-ratio:2/1!important}
body.single-pko_work .pko-gallery-square-grid figure.pko-block-square img,body.single-pko_work .pko-gallery-square-grid figure.pko-block-wide img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important}
@media(max-width:600px){body.single-pko_work .pko-gallery-square-grid{grid-template-columns:1fr!important}body.single-pko_work .pko-gallery-square-grid figure.pko-block-square,body.single-pko_work .pko-gallery-square-grid figure.pko-block-wide{grid-column:1!important}body.single-pko_work .pko-gallery-square-grid figure.pko-block-wide{aspect-ratio:2/1!important}}

/* v1.0.61 — subtle hover zoom for Work page content images (hero excluded) */
body.single-pko_work .pko-case-gallery-item,
body.single-pko_work .pko-case-additional-content figure,
body.single-pko_work .pko-case-additional-content .wp-block-image{
  overflow:hidden!important;
}
body.single-pko_work .pko-case-gallery-item img,
body.single-pko_work .pko-case-additional-content figure img,
body.single-pko_work .pko-case-additional-content .wp-block-image img{
  transition:transform .45s ease!important;
  transform:scale(1);
  transform-origin:center center;
}
@media (hover:hover) and (pointer:fine){
  body.single-pko_work .pko-case-gallery-item:hover img,
  body.single-pko_work .pko-case-additional-content figure:hover img,
  body.single-pko_work .pko-case-additional-content .wp-block-image:hover img{
    transform:scale(1.04);
  }
}

/* v1.0.63 — Work project gallery blocks can contain images or videos. */
body.single-pko_work .pko-case-gallery video{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;background:#0d0d0e!important}
@media(max-width:600px){body.single-pko_work .pko-case-gallery video{width:100%!important;height:auto!important;object-fit:contain!important}}


/* v1.0.65 — individual Work project H1/H2 are always solid PKO dark.
   This override lives in the enqueued stylesheet so it reliably beats the global last-two-word accent. */
body.single-pko_work h1,
body.single-pko_work h2,
body.single-pko_work h1 *,
body.single-pko_work h2 *,
body.single-pko_work h1 .pko-last-words,
body.single-pko_work h2 .pko-last-words{
  color:#0D0D0E!important;
}

/* v1.0.66 — Work gallery video embeds fill the same media blocks as images. */
body.single-pko_work .pko-case-gallery-item{overflow:hidden}
body.single-pko_work .pko-case-gallery .pko-project-video{display:block;width:100%;height:100%;object-fit:cover;object-position:center;background:#0d0d0e}
body.single-pko_work .pko-case-gallery .pko-project-video::-webkit-media-controls{display:none!important}

/* v1.0.69 — remove phantom vertical space in Work galleries.
   Modern gallery items use per-block sizing, so reset any legacy feature/editorial
   row spanning that can reserve empty grid rows when only a few items are present. */
body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-square),
body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-wide){
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  grid-auto-rows:auto!important;
  align-items:start!important;
}
body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-square) > .pko-case-gallery-item,
body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-wide) > .pko-case-gallery-item{
  grid-row:auto!important;
  min-height:0!important;
}
body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-square) > .pko-case-gallery-item.pko-block-square,
body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-wide) > .pko-case-gallery-item.pko-block-square{
  grid-column:span 1!important;
  aspect-ratio:1/1!important;
}
body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-square) > .pko-case-gallery-item.pko-block-wide,
body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-wide) > .pko-case-gallery-item.pko-block-wide{
  grid-column:1/-1!important;
  aspect-ratio:2/1!important;
}
@media(max-width:600px){
  body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-square),
  body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-wide){grid-template-columns:1fr!important}
  body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-square) > .pko-case-gallery-item,
  body.single-pko_work .pko-case-gallery:has(> .pko-case-gallery-item.pko-block-wide) > .pko-case-gallery-item{grid-column:1!important}
}


/* v1.0.70 — Work gallery media must fill its own block; remove phantom blank space. */
body.single-pko_work .pko-case-gallery{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  grid-auto-flow:row!important;
  grid-auto-rows:auto!important;
  align-items:start!important;
}
body.single-pko_work .pko-case-gallery > .pko-case-gallery-item{
  position:relative!important;
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  grid-row:auto!important;
  overflow:hidden!important;
}
body.single-pko_work .pko-case-gallery > .pko-case-gallery-item.pko-block-square{
  grid-column:span 1!important;
  aspect-ratio:1/1!important;
}
body.single-pko_work .pko-case-gallery > .pko-case-gallery-item.pko-block-wide{
  grid-column:1/-1!important;
  aspect-ratio:2/1!important;
}
body.single-pko_work .pko-case-gallery > .pko-case-gallery-item > img,
body.single-pko_work .pko-case-gallery > .pko-case-gallery-item > video{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center center!important;
  margin:0!important;
}
@media(max-width:600px){
  body.single-pko_work .pko-case-gallery{grid-template-columns:1fr!important}
  body.single-pko_work .pko-case-gallery > .pko-case-gallery-item.pko-block-square,
  body.single-pko_work .pko-case-gallery > .pko-case-gallery-item.pko-block-wide{grid-column:1!important}
  body.single-pko_work .pko-case-gallery > .pko-case-gallery-item.pko-block-square{aspect-ratio:1/1!important}
  body.single-pko_work .pko-case-gallery > .pko-case-gallery-item.pko-block-wide{aspect-ratio:2/1!important}
}

/* v1.0.71 — do not let empty optional editor content create a large gap before Next Project. */
body.single-pko_work .pko-case-additional-section:empty{display:none!important;padding:0!important;margin:0!important}

/* v1.0.73 — homepage parallax: keep the image filling the viewport with no exposed background. */
body.home .pko-parallax[data-pko-home-parallax],
body.home .pko-home-parallax-real{
  position:relative!important;
  overflow:hidden!important;
  background:transparent!important;
}
body.home .pko-parallax[data-pko-home-parallax] img,
body.home .pko-home-parallax-real img{
  position:absolute!important;
  left:0!important;
  top:-70px!important;
  width:100%!important;
  height:calc(100% + 140px)!important;
  margin:0!important;
  object-fit:cover!important;
  object-position:center center!important;
  display:block!important;
  max-width:none!important;
  will-change:transform!important;
}
@media(max-width:600px){
  body.home .pko-parallax[data-pko-home-parallax] img,
  body.home .pko-home-parallax-real img{
    top:-45px!important;
    height:calc(100% + 90px)!important;
  }
}


/* v1.0.74 — homepage parallax uses the image itself as the block background.
   This prevents the parallax container colour from ever becoming visible while scrolling. */
body.home .pko-parallax[data-pko-home-parallax],
body.home .pko-home-parallax-real{
  position:relative!important;
  overflow:hidden!important;
  background-color:transparent!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  background-position:50% 50%!important;
}
body.home .pko-parallax[data-pko-home-parallax] > img,
body.home .pko-home-parallax-real > img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  opacity:0!important;
  pointer-events:none!important;
}


/* v1.0.75 — robust homepage parallax.
   Keep the actual image larger than the viewport and move only within the overscan area.
   This prevents any container/background strip from becoming visible. */
body.home .pko-parallax[data-pko-home-parallax],
body.home .pko-home-parallax-real{
  position:relative!important;
  overflow:hidden!important;
  background:none!important;
}
body.home .pko-parallax[data-pko-home-parallax] > img,
body.home .pko-home-parallax-real > img{
  display:block!important;
  position:absolute!important;
  left:0!important;
  top:50%!important;
  inset:auto!important;
  width:100%!important;
  height:calc(100% + 160px)!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  opacity:1!important;
  object-fit:cover!important;
  object-position:center center!important;
  transform:translate3d(0, calc(-50% + var(--pko-parallax-y, 0px)), 0)!important;
  will-change:transform!important;
  pointer-events:none!important;
}
@media(max-width:600px){
  body.home .pko-parallax[data-pko-home-parallax] > img,
  body.home .pko-home-parallax-real > img{
    height:calc(100% + 100px)!important;
  }
}


/* v1.0.76 — About page parallax: the image itself always fills the block.
   Use absolute positioning so parallax movement cannot expose the container. */
body.page-about .pko-full-image.pko-parallax,
body.page-id-0 .pko-full-image.pko-parallax {
  position: relative !important;
  height: 60vh !important;
  min-height: 320px !important;
  overflow: hidden !important;
  background: transparent !important;
}
body.page-about .pko-full-image.pko-parallax > img,
body.page-id-0 .pko-full-image.pko-parallax > img {
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  width: 100% !important;
  height: 132% !important;
  max-width: none !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  transform: translate3d(0, calc(-50% + var(--pko-about-parallax-y, 0px)), 0) !important;
  will-change: transform !important;
}
@media (max-width: 600px) {
  body.page-about .pko-full-image.pko-parallax,
  body.page-id-0 .pko-full-image.pko-parallax {
    height: 50vh !important;
    min-height: 320px !important;
  }
  body.page-about .pko-full-image.pko-parallax > img,
  body.page-id-0 .pko-full-image.pko-parallax > img {
    height: 124% !important;
  }
}

/* v1.0.77 — managed internal page editor additions. */
.pko-work-seo-intro{max-width:560px;margin:22px 0 0;font:400 16px/1.7 Quicksand,sans-serif;color:#687184}
@media(max-width:900px){.pko-work-seo-intro{max-width:100%}}

/* v1.0.85 — contact form anti-spam + confirmation layout. */
.pko-contact-form .pko-honeypot{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important}

/* Successful submission: remove the entire left contact column and centre confirmation. */
body.pko-contact-sent .pko-contact-page,
.pko-contact-page.is-sent{padding-top:80px!important;padding-bottom:112px!important}
body.pko-contact-sent .pko-contact-grid,
.pko-contact-page.is-sent .pko-contact-grid{display:block!important;grid-template-columns:1fr!important;width:100%!important;max-width:var(--max)!important;margin:0 auto!important}
body.pko-contact-sent .pko-contact-copy,
.pko-contact-page.is-sent .pko-contact-copy{display:none!important;visibility:hidden!important}
body.pko-contact-sent .pko-contact-grid>.pko-contact-confirmation-wrap,
.pko-contact-page.is-sent .pko-contact-grid>.pko-contact-confirmation-wrap{display:block!important;width:100%!important;max-width:none!important;margin:0!important}
body.pko-contact-sent .pko-contact-success,
.pko-contact-page.is-sent .pko-contact-success{min-height:430px!important;width:100%!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;margin:0 auto!important;padding:40px var(--pad)!important;box-sizing:border-box!important}
body.pko-contact-sent .pko-contact-success h2,
.pko-contact-page.is-sent .pko-contact-success h2{margin:0 0 30px!important;max-width:1000px!important;font-weight:700!important;line-height:1.05!important;letter-spacing:-.03em!important;text-align:center!important}
body.pko-contact-sent .pko-contact-success p,
.pko-contact-page.is-sent .pko-contact-success p{margin:0 0 34px!important;max-width:760px!important;font:400 16px/1.7 Quicksand,sans-serif!important;color:#555!important;text-align:center!important}
body.pko-contact-sent .pko-contact-home-button,
.pko-contact-page.is-sent .pko-contact-home-button{align-self:center!important;text-decoration:none!important}

/* v1.0.91 — remove decorative line before homepage What We Do eyebrow. */
body.home .pko-services .pko-eyebrow:before,
body.home .pko-home-services .pko-eyebrow:before,
body.home .pko-ref-services .pko-eyebrow:before{content:none!important;display:none!important;width:0!important;flex:0 0 0!important;}


/* v1.0.92 — Services page: rebalance horizontal spacing between title, description and image. */
@media (min-width:1001px){
  .pko-services-list .pko-service-row{
    grid-template-columns:46px minmax(240px,3fr) minmax(320px,4fr) minmax(240px,3fr)!important;
    column-gap:48px!important;
  }
}
@media (min-width:701px) and (max-width:1000px){
  .pko-services-list .pko-service-row{column-gap:32px!important;}
}


/* v1.0.93 — internal-page parallax: preserve the source image ratio, keep the
   image covering the block during movement, and remove placeholder/background
   bleed. The previous About-only selectors did not match WordPress body classes,
   so the parallax transform never applied reliably. */
.pko-full-image.pko-parallax{
  position:relative!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  overflow:hidden!important;
  background:transparent!important;
}
.pko-full-image.pko-parallax > img{
  display:block!important;
  position:absolute!important;
  left:0!important;
  top:50%!important;
  inset:auto!important;
  width:100%!important;
  height:calc(100% + 96px)!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  opacity:1!important;
  object-fit:cover!important;
  object-position:center center!important;
  transform:translate3d(0, calc(-50% + var(--pko-about-parallax-y, 0px)), 0)!important;
  will-change:transform!important;
  pointer-events:none!important;
}
@media(max-width:600px){
  .pko-full-image.pko-parallax > img{height:calc(100% + 64px)!important}
}


/* v1.0.94 — fix internal-page parallax sizing.
   Keep the image in normal document flow so the wrapper can never retain a
   larger phantom/aspect-ratio height. A very small scale provides safe
   overscan for the parallax movement without the heavy crop from earlier versions. */
.pko-full-image.pko-parallax{
  position:relative!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  overflow:hidden!important;
  background:transparent!important;
  line-height:0!important;
}
.pko-full-image.pko-parallax > img{
  position:relative!important;
  inset:auto!important;
  top:auto!important;
  left:auto!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-width:100%!important;
  max-height:none!important;
  margin:0!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:translate3d(0,var(--pko-about-parallax-y,0px),0) scale(1.06)!important;
  transform-origin:center center!important;
  will-change:transform!important;
}
@media(max-width:600px){
  .pko-full-image.pko-parallax > img{
    transform:translate3d(0,var(--pko-about-parallax-y,0px),0) scale(1.08)!important;
  }
}


/* v1.0.95 — internal-page parallax rebuilt.
   Use a deliberately shallower viewport and an absolutely positioned oversize
   image. This makes the movement visible, keeps the block compact, and prevents
   the transformed image from changing document flow or creating white gaps. */
.pko-full-image.pko-parallax{
  position:relative!important;
  display:block!important;
  width:100%!important;
  height:clamp(300px,34vw,520px)!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  overflow:hidden!important;
  background:transparent!important;
  line-height:0!important;
}
.pko-full-image.pko-parallax > img{
  position:absolute!important;
  left:0!important;
  top:50%!important;
  inset:auto!important;
  width:100%!important;
  height:calc(100% + 110px)!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center center!important;
  transform:translate3d(0,-50%,0)!important;
  will-change:transform!important;
  pointer-events:none!important;
}
@media(max-width:600px){
  .pko-full-image.pko-parallax{height:clamp(250px,55vw,360px)!important;}
  .pko-full-image.pko-parallax > img{height:calc(100% + 80px)!important;}
}


/* v1.0.96 — About/internal-page parallax: fixed 700px viewport, guaranteed
   overscan, visible scroll movement, and no spacer/background bleed. */
.pko-full-image.pko-parallax{
  position:relative!important;
  display:block!important;
  width:100%!important;
  height:700px!important;
  min-height:700px!important;
  max-height:700px!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  background:transparent!important;
  line-height:0!important;
}
.pko-full-image.pko-parallax > img{
  position:absolute!important;
  left:0!important;
  top:-90px!important;
  inset:auto!important;
  display:block!important;
  width:100%!important;
  height:880px!important;
  min-height:880px!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  object-fit:cover!important;
  object-position:center center!important;
  transform:translate3d(0,var(--pko-about-parallax-y,0px),0)!important;
  will-change:transform!important;
  pointer-events:none!important;
}
/* Keep neighbouring sections flush to the parallax holder. */
.pko-full-image.pko-parallax + .pko-inner-section,
.pko-inner-hero + .pko-full-image.pko-parallax{
  margin-top:0!important;
  margin-bottom:0!important;
}
@media(max-width:900px){
  .pko-full-image.pko-parallax{
    height:520px!important;
    min-height:520px!important;
    max-height:520px!important;
  }
  .pko-full-image.pko-parallax > img{
    top:-70px!important;
    height:660px!important;
    min-height:660px!important;
  }
}
@media(max-width:600px){
  .pko-full-image.pko-parallax{
    height:420px!important;
    min-height:420px!important;
    max-height:420px!important;
  }
  .pko-full-image.pko-parallax > img{
    top:-60px!important;
    height:540px!important;
    min-height:540px!important;
  }
}

/* v1.0.100 — Blog */
.pko-home-blog{background:#fff;padding:clamp(88px,9vw,140px) var(--pad)!important;margin:0!important}
.pko-home-blog-inner,.pko-blog-archive-inner{max-width:var(--max);margin:0 auto}
.pko-home-blog-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:48px;align-items:end;margin-bottom:clamp(54px,5vw,76px)}
.pko-home-blog-head .pko-eyebrow{margin:0 0 28px!important}
.pko-home-blog-head h2{margin:0;line-height:1.02}
.pko-home-blog-head .pko-button{margin-bottom:5px}
.pko-blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(26px,2.5vw,40px)}
.pko-blog-card{min-width:0}
.pko-blog-card-media{display:block;aspect-ratio:4/3;overflow:hidden;background:#f2f2f2;text-decoration:none}
.pko-blog-card-media img,.pko-blog-card-placeholder{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.pko-blog-card-media:hover img{transform:scale(1.025)}
.pko-blog-card-placeholder{background:#f1f1f1}
.pko-blog-card-copy{padding-top:22px}
.pko-blog-card-date{margin:0 0 11px!important;color:#999!important;font-size:12px!important;letter-spacing:.12em;text-transform:uppercase}
.pko-blog-card h3,.pko-blog-card h2{margin:0 0 12px!important;font-size:clamp(24px,2vw,32px)!important;line-height:1.12!important}
.pko-blog-card h3 a,.pko-blog-card h2 a{text-decoration:none}
.pko-blog-card-copy>p:last-child{margin:0;color:#747474;font-size:16px;line-height:1.7}
.pko-blog-hero{margin:0!important}
.pko-blog-archive{padding:0 var(--pad) clamp(100px,10vw,150px);margin:0!important}
.pko-blog-grid-archive{row-gap:clamp(60px,6vw,90px)}
.pko-blog-pagination{margin-top:70px}
.pko-blog-pagination ul{list-style:none;display:flex;gap:10px;padding:0;margin:0}
.pko-blog-pagination a,.pko-blog-pagination span{display:grid;place-items:center;min-width:42px;height:42px;border:1px solid #ddd;border-radius:999px;text-decoration:none;font-size:13px}
.pko-blog-pagination .current{background:var(--blue);border-color:var(--blue);color:#fff}
.pko-blog-empty{font-size:18px;color:#777}
.pko-single-blog{max-width:940px;margin:0 auto;padding:clamp(80px,9vw,140px) var(--pad)}
.pko-single-blog-head{margin-bottom:50px}
.pko-single-blog-head .pko-inner-eyebrow{margin-bottom:22px}
.pko-single-blog-head h1{margin:0 0 24px;line-height:1.02}
.pko-single-blog-meta{color:#999;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.pko-single-blog-featured{width:100vw;margin-left:calc(50% - 50vw);margin-bottom:clamp(60px,7vw,100px)}
.pko-single-blog-featured img{display:block;width:100%;max-height:80vh;object-fit:cover}
.pko-single-blog-content{font-size:18px;line-height:1.8;color:#555}
.pko-single-blog-content>*{max-width:760px;margin-left:auto;margin-right:auto}
.pko-single-blog-content .alignwide{max-width:1100px}
.pko-single-blog-content .alignfull{max-width:none;width:100vw;margin-left:calc(50% - 50vw)}
@media(max-width:900px){.pko-blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pko-home-blog-head{grid-template-columns:1fr;gap:24px;align-items:start}.pko-home-blog-head .pko-button{width:max-content;margin:0}}
@media(max-width:620px){.pko-blog-grid{grid-template-columns:1fr}.pko-home-blog{padding:72px 24px!important}.pko-blog-archive{padding-left:24px;padding-right:24px}.pko-blog-card-copy{padding-top:18px}}


/* v1.0.101 — Single blog posts mirror the Work-page image-first layout. */
body.single-post{padding-top:0!important}
body.single-post .pko-header{margin-bottom:0!important}
body.single-post .pko-blog-single-main,
body.single-post .pko-single-blog{margin:0!important;padding:0!important;max-width:none!important;width:100%!important;background:#fff!important}
body.single-post .pko-single-blog-featured{display:block;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;background:#e9e9e9!important;overflow:visible!important}
body.single-post .pko-single-blog-featured img{display:block!important;width:100%!important;height:auto!important;max-width:none!important;max-height:none!important;margin:0!important;object-fit:contain!important;object-position:center center!important}
body.single-post .pko-single-blog-inner{
  width:100%!important;
  max-width:calc(var(--max) + (2 * var(--pad)))!important;
  margin:0 auto!important;
  padding:clamp(72px,7vw,110px) var(--pad) clamp(88px,8vw,128px)!important;
}
body.single-post .pko-single-blog-title{margin:0 0 clamp(44px,4vw,64px)!important;line-height:1.02!important;max-width:none!important}
body.single-post .pko-single-blog-content{width:100%!important;max-width:none!important;margin:0!important;color:#555!important;font-size:18px!important;line-height:1.8!important}
body.single-post .pko-single-blog-content>*{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important}
body.single-post .pko-single-blog-content>*:first-child{margin-top:0!important}
body.single-post .pko-single-blog-content h2{margin-top:clamp(64px,6vw,96px)!important;margin-bottom:32px!important;line-height:1.08!important}
body.single-post .pko-single-blog-content .alignwide{width:100%!important;max-width:100%!important}
body.single-post .pko-single-blog-content .alignfull{width:100vw!important;max-width:100vw!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important}
@media(max-width:700px){
  body.single-post .pko-blog-single-main{padding-top:76px!important}
  body.single-post .pko-single-blog-inner{padding-top:54px!important;padding-bottom:72px!important}
  body.single-post .pko-single-blog-title{margin-bottom:36px!important}
  body.single-post .pko-single-blog-content{font-size:16px!important;line-height:1.7!important}
  body.single-post .pko-single-blog-content h2{margin-top:72px!important;margin-bottom:28px!important;line-height:1.08!important}
}

/* v1.0.104 — Blog archive card headings match the homepage blog card scale. */
.pko-blog-archive .pko-blog-grid-archive .pko-blog-card h2,
.pko-blog-archive .pko-blog-grid-archive .pko-blog-card h2 a,
.pko-blog-archive .pko-blog-grid-archive .pko-blog-card h2 .pko-last-words{
  font-size:clamp(24px,2vw,32px)!important;
  line-height:1.12!important;
  letter-spacing:normal!important;
}
@media(max-width:700px){
  .pko-blog-archive .pko-blog-grid-archive .pko-blog-card h2,
  .pko-blog-archive .pko-blog-grid-archive .pko-blog-card h2 a,
  .pko-blog-archive .pko-blog-grid-archive .pko-blog-card h2 .pko-last-words{
    font-size:28px!important;
    line-height:1.12!important;
  }
}

/* Global link styling: links should never display an underline. */
a,
a:visited,
a:hover,
a:focus,
a:active{
  text-decoration:none!important;
}

/* v1.0.107 — Keep Work page supporting paragraph aligned with other page intros. */
.pko-inner-hero .pko-inner-container > .pko-work-lead + p,
.pko-inner-hero .pko-inner-container > .pko-work-seo-intro {
  width:560px !important;
  max-width:560px !important;
}
@media(max-width:900px){
  .pko-inner-hero .pko-inner-container > .pko-work-lead + p,
  .pko-inner-hero .pko-inner-container > .pko-work-seo-intro {
    width:100% !important;
    max-width:100% !important;
  }
}

/* v1.0.108 — Align the homepage blog button with the Thinking out loud. title. */
.pko-home-blog-head{display:block!important}
.pko-home-blog-title-row{display:flex;align-items:flex-end;justify-content:space-between;gap:32px}
.pko-home-blog-title-row h2{margin:0;line-height:1.02}
.pko-home-blog-title-row .pko-button{flex:0 0 auto;margin:0 0 6px 0!important}
@media(max-width:900px){.pko-home-blog-title-row{flex-direction:column;align-items:flex-start;gap:20px}.pko-home-blog-title-row .pko-button{margin:0!important}}

/* v1.0.109 — footer alignment and consistent menu rhythm. */
@media (min-width:701px){
  .pko-footer-inner{align-items:start!important}
  .pko-footer-heading{margin:0 0 16px!important;line-height:1!important}
  .pko-footer nav,.pko-footer .pko-social{gap:16px!important}
  .pko-footer nav a,.pko-footer .pko-social>a{display:block;line-height:1.4;margin:0!important}
}

/* v1.0.111 — Work page testimonial heading aligns exactly with the header logo/content rail. */
.pko-work-page-grid + .pko-reviews .pko-reviews-head{
  width:100%!important;
  max-width:calc(var(--max) + (2 * var(--pad)))!important;
  margin:0 auto 40px!important;
  padding-left:var(--pad)!important;
  padding-right:var(--pad)!important;
}

/* v1.0.112 — Homepage blog width alignment.
   Match the blog section content edges to the other homepage blocks/header. */
@media(min-width:901px){
  body.home .pko-home-blog{
    padding-left:0!important;
    padding-right:0!important;
  }
  body.home .pko-home-blog-inner{
    width:100%!important;
    max-width:var(--max)!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:var(--pad)!important;
    padding-right:var(--pad)!important;
  }
}

/* v1.0.113 — one consistent content rail across the site.
   Use the first homepage content block as the alignment reference while leaving the header/menu untouched. */
:root{
  --pko-content-rail:max(var(--pad), calc((100vw - var(--max))/2 + var(--pad)));
}

@media(min-width:901px){
  /* Standard full-width sections: keep the background full bleed, align the content rail. */
  .pko-cta{
    display:block!important;
    padding-left:var(--pko-content-rail)!important;
    padding-right:var(--pko-content-rail)!important;
  }
  .pko-cta > *{
    width:auto!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  .pko-cta > p{
    width:min(100%,720px)!important;
    max-width:720px!important;
  }

  /* Footer uses exactly the same left/right rail as homepage content. */
  .pko-footer{
    padding-left:var(--pko-content-rail)!important;
    padding-right:var(--pko-content-rail)!important;
  }
  .pko-footer-inner,
  .pko-footer-bottom{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  /* Internal-page content follows the same rail too. */
  .pko-inner-hero,
  .pko-inner-section{
    padding-left:var(--pko-content-rail)!important;
    padding-right:var(--pko-content-rail)!important;
  }
  .pko-inner-hero .pko-inner-container,
  .pko-inner-section .pko-inner-container{
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  .pko-work-filter-inner{
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:var(--pko-content-rail)!important;
    padding-right:var(--pko-content-rail)!important;
  }

  /* Review headings align with the same rail. The slider itself can remain full bleed. */
  .pko-reviews-head,
  .pko-work-page-grid + .pko-reviews .pko-reviews-head{
    width:auto!important;
    max-width:none!important;
    margin-left:var(--pko-content-rail)!important;
    margin-right:var(--pko-content-rail)!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  /* Legacy/general content sections also use the same homepage rail. */
  .pko-section{
    padding-left:var(--pko-content-rail)!important;
    padding-right:var(--pko-content-rail)!important;
    display:block!important;
  }
  .pko-section > *{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }
}


/* v1.0.114 — site-wide alignment uses the actual header logo edge.
   Header/menu are intentionally untouched. Full-bleed backgrounds remain full width;
   their content starts and ends on the same rail as the PKO logo. */
:root{
  --pko-logo-rail:max(var(--pad), calc((100vw - var(--max)) / 2));
}

@media(min-width:901px){
  /* Homepage blocks, including the first content block. */
  body.home .pko-ref-kettle,
  body.home .pko-ref-selected,
  body.home .pko-ref-services,
  body.home .pko-ref-about,
  body.home .pko-home-blog{
    padding-left:var(--pko-logo-rail)!important;
    padding-right:var(--pko-logo-rail)!important;
  }
  body.home .pko-ref-kettle .pko-home-kettle-inner,
  body.home .pko-ref-selected .pko-home-selected-inner,
  body.home .pko-ref-services .pko-home-services-inner,
  body.home .pko-ref-about .pko-home-about-exact-inner,
  body.home .pko-home-blog-inner{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  /* General content sections. */
  .pko-section,
  .pko-cta,
  .pko-inner-hero,
  .pko-inner-section,
  .pko-services-list-wrap,
  .pko-services-bottom,
  .pko-contact-page,
  .pko-work-page-grid,
  .pko-blog-archive{
    padding-left:var(--pko-logo-rail)!important;
    padding-right:var(--pko-logo-rail)!important;
  }

  .pko-section > *,
  .pko-cta > *,
  .pko-inner-hero .pko-inner-container,
  .pko-inner-section .pko-inner-container,
  .pko-services-list,
  .pko-services-bottom-inner,
  .pko-contact-grid,
  .pko-work-page-grid .pko-work-grid,
  .pko-blog-archive-inner{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  /* Work filters and review headings align; sliders/images may still bleed by design. */
  .pko-work-filter-inner{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding-left:var(--pko-logo-rail)!important;
    padding-right:var(--pko-logo-rail)!important;
  }
  .pko-reviews-head,
  .pko-work-page-grid + .pko-reviews .pko-reviews-head{
    width:auto!important;
    max-width:none!important;
    margin-left:var(--pko-logo-rail)!important;
    margin-right:var(--pko-logo-rail)!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  /* Footer content shares the same logo rail. */
  .pko-footer{
    padding-left:var(--pko-logo-rail)!important;
    padding-right:var(--pko-logo-rail)!important;
  }
  .pko-footer-inner,
  .pko-footer-bottom{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  /* Standard page/project text containers that are not full-bleed media. */
  .pko-page-hero,
  .pko-project-head,
  .pko-project-content,
  .pko-next{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:var(--pko-logo-rail)!important;
    padding-right:var(--pko-logo-rail)!important;
  }

  /* Blog post body rail. Featured image remains full width. */
  body.single-post .pko-single-blog-inner{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:var(--pko-logo-rail)!important;
    padding-right:var(--pko-logo-rail)!important;
  }
}


/* v1.0.115 — Fancy a Chat: make the top breathing room match the space below the button. */
.pko-cta h1,.pko-cta h2,.pko-cta h3,.pko-cta h4,.pko-cta h5,.pko-cta h6{margin-top:0!important;}


/* v1.0.116 — Footer menu alignment and mobile reflow. */
/* Desktop: Social and Navigation share the exact same heading-to-first-link rhythm. */
@media(min-width:701px){
  .pko-footer .pko-social{gap:16px!important;}
  .pko-footer .pko-social .pko-footer-heading{margin-bottom:0!important;}
  .pko-footer .pko-footer-nav .pko-footer-heading{margin-bottom:16px!important;}
}

.pko-footer-mobile-copy{display:none;}

@media(max-width:700px){
  .pko-footer-inner{
    grid-template-columns:1fr 1fr!important;
    column-gap:48px!important;
    row-gap:42px!important;
  }
  .pko-footer-brand{grid-column:1 / -1!important;width:100%!important;}
  .pko-footer-brand .pko-logo{display:block!important;width:25%!important;max-width:none!important;}
  .pko-footer-brand .pko-logo img{width:100%!important;height:auto!important;}
  .pko-footer-tagline{display:none!important;}
  .pko-footer-mobile-copy{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:28px 0 0!important;
    font-size:16px!important;
    line-height:1.65!important;
    color:rgba(255,255,255,.68)!important;
  }
  .pko-footer .pko-social,
  .pko-footer .pko-footer-nav{
    width:100%!important;
    min-width:0!important;
    justify-self:start!important;
  }
  .pko-footer .pko-social{gap:16px!important;}
  .pko-footer .pko-social .pko-footer-heading{margin-bottom:0!important;}
  .pko-footer .pko-footer-nav .pko-footer-heading{margin-bottom:16px!important;}
  .pko-footer .pko-footer-nav nav{gap:16px!important;}
  .pko-footer .pko-social>a,
  .pko-footer .pko-footer-nav nav>a{
    margin:0!important;
    line-height:1.4!important;
  }
}


/* v1.0.117 — use the same PKO description in the footer on desktop and mobile. */
@media(min-width:701px){
  .pko-footer-tagline{max-width:420px!important;line-height:1.65!important;}
}

/* v1.0.120 — Homepage What We Do: match bottom breathing room to the top spacing. */
.pko-home-services{
  padding-bottom:clamp(70px,7vw,100px)!important;
}

/* v1.0.121 — desktop footer: bring Social closer to Navigation. */
@media(min-width:901px){
  .pko-footer .pko-social{
    justify-self:end!important;
    width:180px!important;
  }
}

/* v1.0.122 — desktop footer: move Social further towards Navigation. */
@media(min-width:901px){
  .pko-footer .pko-social{
    transform:translateX(90px)!important;
  }
}


/* v1.0.123 — desktop footer: keep Navigation fixed and set exactly 100px between Social and Navigation. */
@media(min-width:901px){
  .pko-footer-inner{
    grid-template-columns:2fr auto auto!important;
    column-gap:100px!important;
  }
  .pko-footer .pko-social{
    transform:none!important;
    width:auto!important;
    justify-self:end!important;
  }
  .pko-footer .pko-footer-nav{
    justify-self:end!important;
  }
}

/* v1.0.124 — desktop footer: nudge Navigation 20px to the right. */
@media(min-width:901px){
  .pko-footer .pko-footer-nav{
    transform:translateX(20px)!important;
  }
}

/* v1.0.125 — Homepage media block between What We Do and About PKO supports image or video. */
body.home .pko-home-parallax-real video{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important}
body.home .pko-home-media-video{height:64vh!important;min-height:420px!important}
@media(max-width:700px){body.home .pko-home-parallax-real,body.home .pko-home-media-video{height:50vh!important;min-height:320px!important}}


/* v1.0.126 — Homepage image/video block height. */
@media(min-width:701px){
  body.home .pko-home-parallax-real,
  body.home .pko-home-media-video{
    height:800px!important;
    min-height:800px!important;
  }
}

/* v1.0.130 — dedicated full-screen 404 page. */
body.error404.pko-404-page{
  margin:0!important;
  padding:0!important;
  min-height:100%;
  overflow:hidden;
  background:#58b8ea;
}
body.error404.pko-404-page .pko-header,
body.error404.pko-404-page .pko-footer{display:none!important}
.pko-404{
  position:relative;
  width:100%;
  min-height:100vh;
  min-height:100svh;
  overflow:hidden;
  display:flex;
  align-items:center;
  background:#58b8ea url('images/pko-404-bg.jpg') no-repeat center center / cover;
}
.pko-404-content{
  position:relative;
  z-index:2;
  width:min(760px,44vw);
  margin-left:max(var(--pad),calc((100vw - var(--max))/2 + var(--pad)));
  transform:translateY(-1%);
}
html body.error404 .pko-404-content,
html body.error404 .pko-404-content *,
html body.error404 .pko-404 h1 .pko-last-words,
html body.error404 .pko-404 h4 .pko-last-words{
  color:#fff!important;
}
html body.error404 .pko-404 h1{
  margin:0 0 30px!important;
  font:700 clamp(58px,4.4vw,82px)/.95 Quicksand,sans-serif!important;
  letter-spacing:-.025em;
  text-transform:uppercase;
}
html body.error404 .pko-404 h4{
  margin:0 0 42px!important;
  max-width:650px;
  font:400 clamp(24px,2vw,34px)/1.38 Quicksand,sans-serif!important;
  letter-spacing:-.015em;
}
.pko-404-button{
  display:inline-block;
  width:max-content;
  border:1.5px solid #fff!important;
  border-radius:999px;
  padding:13px 27px;
  color:#fff!important;
  background:transparent;
  text-decoration:none!important;
  font:400 21px/1 Quicksand,sans-serif!important;
  letter-spacing:0;
  text-transform:none;
  transition:background .2s ease,color .2s ease;
}
.pko-404-button:hover,.pko-404-button:focus{
  background:#fff;
  color:#38AEE4!important;
}
@media(max-width:900px){
  .pko-404{
    align-items:flex-start;
    justify-content:flex-start;
    padding-top:max(48px,6vh);
    background-position:66% bottom;
    background-size:auto 115%;
  }
  .pko-404-content{
    width:min(520px,calc(100% - 56px));
    max-width:none;
    margin:0 28px;
    transform:none;
  }
  html body.error404 .pko-404 h1{
    margin-bottom:22px!important;
    font-size:clamp(46px,10.2vw,72px)!important;
    line-height:.96!important;
  }
  html body.error404 .pko-404 h4{
    margin-bottom:32px!important;
    max-width:500px;
    font-size:clamp(20px,4.8vw,30px)!important;
    line-height:1.35!important;
  }
  .pko-404-button{font-size:18px!important;padding:12px 24px}
  .pko-404-desktop-break{display:none}
}
@media(max-width:560px){
  .pko-404{
    padding-top:max(44px,5vh);
    background-position:67% bottom;
    background-size:auto 118%;
  }
  .pko-404-content{
    width:calc(100% - 48px);
    margin:0 24px;
  }
  html body.error404 .pko-404 h1{
    margin-bottom:18px!important;
    font-size:clamp(44px,11.2vw,60px)!important;
  }
  html body.error404 .pko-404 h4{
    margin-bottom:28px!important;
    font-size:clamp(18px,5.4vw,26px)!important;
  }
}


/* v1.0.131 — 404 mobile composition + final artwork cleanup. */
body.error404.pko-404-page,
body.error404.pko-404-page .pko-404{
  background-color:#55bcf7!important;
}
html body.error404 .pko-404-content,
html body.error404 .pko-404-content h1,
html body.error404 .pko-404-content h4,
html body.error404 .pko-404-content a,
html body.error404 .pko-404-content .pko-last-words{
  color:#fff!important;
}
@media (max-width:900px){
  body.error404.pko-404-page{overflow:hidden!important;}
  .pko-404{
    min-height:100vh!important;
    min-height:100svh!important;
    padding:0!important;
    align-items:flex-start!important;
    background-image:url('images/pko-404-bg-mobile.jpg')!important;
    background-repeat:no-repeat!important;
    background-size:cover!important;
    background-position:center center!important;
  }
  .pko-404-content{
    width:calc(100% - 64px)!important;
    max-width:560px!important;
    margin:0!important;
    padding:7vh 32px 0!important;
    transform:none!important;
  }
  html body.error404 .pko-404 h1{
    margin:0 0 22px!important;
    font-size:clamp(44px,10.5vw,64px)!important;
    line-height:.96!important;
  }
  html body.error404 .pko-404 h4{
    margin:0 0 30px!important;
    max-width:520px!important;
    font-size:clamp(20px,4.8vw,28px)!important;
    line-height:1.32!important;
    font-weight:400!important;
  }
  .pko-404-button{
    font-size:18px!important;
    padding:13px 25px!important;
  }
}
@media (max-width:560px){
  .pko-404-content{
    width:calc(100% - 48px)!important;
    padding:6.5vh 24px 0!important;
  }
  html body.error404 .pko-404 h1{
    font-size:clamp(42px,11vw,58px)!important;
    margin-bottom:18px!important;
  }
  html body.error404 .pko-404 h4{
    font-size:clamp(18px,5.2vw,25px)!important;
    margin-bottom:28px!important;
  }
}

/* v1.0.132 — final 404 cleanup: remove desktop artifact and tighten mobile composition. */
.pko-404{
  background:#58b8ea url('images/pko-404-bg-clean-final.png') no-repeat center center / cover!important;
}
@media (max-width:900px){
  body.error404.pko-404-page,
  body.error404.pko-404-page .pko-404{
    background-color:#58b8ea!important;
  }
  .pko-404{
    background:#58b8ea url('images/pko-404-bg-mobile-final.png') no-repeat center top / cover!important;
    min-height:100vh!important;
    min-height:100svh!important;
    padding:0!important;
    align-items:flex-start!important;
  }
  .pko-404-content{
    width:min(360px,calc(100% - 48px))!important;
    max-width:none!important;
    margin:0!important;
    padding:48px 24px 0!important;
    transform:none!important;
  }
  html body.error404 .pko-404 h1{
    max-width:10.6ch!important;
    margin:0 0 26px!important;
    font-size:clamp(40px,11vw,58px)!important;
    line-height:.98!important;
  }
  html body.error404 .pko-404 h4{
    max-width:13.5ch!important;
    margin:0 0 34px!important;
    font-size:clamp(18px,5.1vw,24px)!important;
    line-height:1.32!important;
    font-weight:400!important;
  }
  .pko-404-button{
    padding:16px 48px!important;
    font-size:18px!important;
  }
}
@media (max-width:560px){
  .pko-404{
    background-position:center top!important;
    background-size:cover!important;
  }
  .pko-404-content{
    width:min(330px,calc(100% - 48px))!important;
    padding:42px 24px 0!important;
  }
  html body.error404 .pko-404 h1{
    max-width:9.7ch!important;
    font-size:clamp(38px,10.7vw,56px)!important;
    margin-bottom:24px!important;
  }
  html body.error404 .pko-404 h4{
    max-width:12.8ch!important;
    font-size:clamp(17px,4.9vw,23px)!important;
    margin-bottom:32px!important;
  }
}

/* v1.0.133 — rebuild 404 to match approved mockups, using separate artwork layers for desktop and mobile. */
body.error404.pko-404-page{
  margin:0;
  overflow:hidden;
  background:#58b8ea!important;
}
body.error404.pko-404-page .pko-header,
body.error404.pko-404-page .pko-footer,
body.error404.pko-404-page .site-header,
body.error404.pko-404-page .site-footer{display:none!important;}

body.error404.pko-404-page .pko-404{
  position:relative;
  isolation:isolate;
  width:100%;
  min-height:100vh;
  min-height:100svh;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:#58b8ea!important;
  background-image:none!important;
}
body.error404.pko-404-page .pko-404::after{
  content:"";
  position:absolute;
  top:50%;
  right:0;
  width:min(63vw,1180px);
  aspect-ratio:1220 / 980;
  transform:translate(2.5vw,-50%);
  background:url('images/pko-404-art-desktop-v133.png') no-repeat center center / contain;
  pointer-events:none;
  z-index:1;
}
body.error404.pko-404-page .pko-404-content{
  position:relative;
  z-index:2;
  width:min(560px,35vw);
  margin-left:max(var(--pad),calc((100vw - var(--max))/2 + var(--pad)));
  transform:translateY(1.2vh);
}
body.error404.pko-404-page .pko-404 h1,
body.error404.pko-404-page .pko-404 h4,
body.error404.pko-404-page .pko-404 .pko-404-button{color:#fff!important;}
body.error404.pko-404-page .pko-404 h1{
  margin:0 0 34px!important;
  max-width:7.2ch;
  font:700 clamp(68px,5.2vw,92px)/.92 Quicksand,sans-serif!important;
  letter-spacing:-.03em;
  text-transform:uppercase;
}
body.error404.pko-404-page .pko-404 h4{
  margin:0 0 42px!important;
  max-width:12.5ch;
  font:400 clamp(25px,2.05vw,34px)/1.36 Quicksand,sans-serif!important;
  letter-spacing:-.01em;
}
body.error404.pko-404-page .pko-404 .pko-404-button{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  max-width:100%!important;
  padding:14px 30px!important;
  border-width:1.5px!important;
  font:400 18px/1 Quicksand,sans-serif!important;
  letter-spacing:0!important;
  text-transform:none!important;
  white-space:nowrap!important;
}
body.error404.pko-404-page .pko-404 .pko-404-button:hover,
body.error404.pko-404-page .pko-404 .pko-404-button:focus{
  background:#fff!important;
  color:var(--blue)!important;
}

@media (max-width:1200px){
  body.error404.pko-404-page .pko-404::after{
    width:min(60vw,920px);
    transform:translate(5vw,-46%);
  }
  body.error404.pko-404-page .pko-404-content{
    width:min(540px,40vw);
  }
}

@media (max-width:900px){
  body.error404.pko-404-page{overflow:auto;background:#58b8ea!important;}
  body.error404.pko-404-page .pko-404{
    align-items:flex-start;
    padding:0;
    background:#58b8ea!important;
    background-image:none!important;
  }
  body.error404.pko-404-page .pko-404::after{
    top:auto;
    bottom:0;
    right:0;
    width:100%;
    height:52%;
    aspect-ratio:auto;
    transform:none;
    background:url('images/pko-404-art-mobile-v133.png') no-repeat center bottom / cover;
  }
  body.error404.pko-404-page .pko-404-content{
    width:min(600px,calc(100% - 48px));
    margin:0;
    padding:58px 24px 0;
    transform:none;
  }
  body.error404.pko-404-page .pko-404 h1{
    margin:0 0 32px!important;
    max-width:7ch;
    font-size:clamp(58px,12.5vw,88px)!important;
    line-height:.96!important;
  }
  body.error404.pko-404-page .pko-404 h4{
    margin:0 0 34px!important;
    max-width:12.2ch;
    font-size:clamp(22px,5vw,31px)!important;
    line-height:1.34!important;
  }
  body.error404.pko-404-page .pko-404 .pko-404-button{
    padding:16px 34px!important;
    font-size:19px!important;
  }
}

@media (max-width:560px){
  body.error404.pko-404-page .pko-404{min-height:100vh;min-height:100svh;}
  body.error404.pko-404-page .pko-404::after{
    width:100%;
    height:48%;
    background-position:center bottom;
    background-size:cover;
  }
  body.error404.pko-404-page .pko-404-content{
    width:calc(100% - 48px);
    padding:56px 24px 0;
  }
  body.error404.pko-404-page .pko-404 h1{
    margin-bottom:30px!important;
    max-width:6.95ch;
    font-size:clamp(44px,11.7vw,60px)!important;
    line-height:.97!important;
  }
  body.error404.pko-404-page .pko-404 h4{
    margin-bottom:32px!important;
    max-width:12.2ch;
    font-size:clamp(18px,5.45vw,24px)!important;
    line-height:1.34!important;
  }
  body.error404.pko-404-page .pko-404 .pko-404-button{
    padding:16px 34px!important;
    font-size:18px!important;
  }
}

/* Blog post mobile title size only. */
@media(max-width:700px){
  html body.single-post h1.pko-single-blog-title{
    font-size:44px!important;
  }
}

/* Link colour and a gentle three-pixel hover nudge. Keep white links on blue
   panels and button contrast supplied by their existing component rules. */
body a,
body a:visited{
  color:#14b1e7;
  position:relative;
  left:0;
  transition:left .28s cubic-bezier(.22,1,.36,1),color .2s ease,background-color .2s ease,border-color .2s ease,padding .2s ease!important;
}
body a:hover{left:3px}
body a:has(img):hover{left:0}
body .pko-footer a,
body .pko-footer a:visited,
body.single-pko_work .pko-case-details .pko-case-service-link,
body.single-pko_work .pko-case-next h2 a{
  color:#14b1e7!important;
}
/* These rows already move 18 pixels through padding on hover. Let the new
   three-pixel nudge be their only sideways movement. */
body.home .pko-ref-services .pko-home-service-row a:hover{
  padding-left:0!important;
  padding-right:0!important;
}
@media(prefers-reduced-motion:reduce){
  body a{transition:none!important}
}