
.pk-offer{background:#111;color:#f4f4f1;font:400 16px/1.65 "PK Hero Inter",Arial,sans-serif;padding:96px 4.4%;border-top:1px solid #ffffff26}
.pk-offer *{box-sizing:border-box}
.pk-offer-wrap{max-width:1720px;margin:auto}
.pk-offer h2,.pk-offer h3,.pk-offer p{margin:0;font-weight:400}
.pk-offer-head{display:grid;grid-template-columns:1fr 1fr;gap:6vw;margin-bottom:54px;align-items:start}
.pk-offer h2{font-size:clamp(32px,4.8vw,68px);font-weight:500;line-height:1.08;letter-spacing:-.04em;text-wrap:balance}
.pk-offer-head p{max-width:60ch;color:#bbb;font-size:18px}
.pk-offer-list{list-style:none;padding:0;margin:0}
.pk-offer-list>li{display:grid;grid-template-columns:1fr 1fr;gap:6vw;border-top:1px solid #ffffff26;padding:25px 0}
.pk-offer-list h3{font-size:24px;font-weight:500;line-height:1.25;letter-spacing:-.025em}
.pk-offer-list p{max-width:65ch;color:#bbb}
.pk-offer-link{display:inline-flex;min-height:44px;align-items:center;color:inherit;text-decoration:underline;text-underline-offset:6px;margin-top:18px}
.pk-offer a:focus-visible,.pk-webdesign a:focus-visible{outline:2px solid #f4f4f1;outline-offset:6px}
.pk-offer ol{counter-reset:step}
.pk-offer ol>li{counter-increment:step}
.pk-offer ol h3:before{content:counter(step) ". ";font-variant-numeric:tabular-nums}
.pk-offer details{border-top:1px solid #ffffff26;padding:20px 0}
.pk-offer summary{cursor:pointer;font-size:21px;font-weight:500;line-height:1.35;padding:8px 0}
.pk-offer details p{max-width:68ch;margin:15px 0 10px;color:#bbb}
.pk-offer summary:focus-visible{outline:2px solid;outline-offset:5px}
.pk-offer ::selection,.pk-webdesign ::selection{color:#111;background:#f4f4f1}
#pk-hero-02 .pk-hero-intro{font-size:15px;line-height:1.55;max-width:38ch;margin:0 0 22px;color:#c9c9c5}
#pk-hero-02 .small-head{margin-bottom:18px;font-size:clamp(26px,2.65cqw,40px)}
#pk-hero-02 .small-head .pk-hero-tagline-line{white-space:normal}
#pk-hero-02 .hero--noir .lower-left{max-width:390px}
#pk-hero-02 .pk-hero-page-link{margin-left:12px}
#pk-hero-02 .pk-hero-page-link:first-of-type{margin-left:0}
.pk-webdesign{background:#111;color:#f4f4f1;font:400 16px/1.65 "PK Hero Inter",Arial,sans-serif}
.pk-webdesign-header{padding:30px 4.4%;display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid #ffffff26}
.pk-webdesign-header .brand{font:500 18px "PK Hero Mono",monospace;color:inherit;text-decoration:none;white-space:nowrap}
.pk-webdesign-header nav{display:flex;gap:24px;flex-wrap:wrap}
.pk-webdesign-header nav a{color:inherit;min-height:44px;display:inline-flex;align-items:center;text-underline-offset:6px}
.pk-webdesign-hero{padding:90px 4.4% 110px;max-width:1720px;margin:auto}
.pk-webdesign-hero h1{font-weight:500;letter-spacing:-.04em;font-size:clamp(42px,6.4vw,92px);line-height:1.05;margin:0 0 34px;max-width:15ch;text-wrap:balance}
.pk-webdesign-hero p{font-size:20px;max-width:57ch;color:#bbb}
.pk-webdesign-hero .pk-offer-link{font-size:18px}
.pk-webdesign-projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.pk-webdesign-projects article{min-width:0}
.pk-webdesign-projects img{width:100%;height:auto;aspect-ratio:1.35;object-fit:cover;object-position:top;display:block;margin-bottom:22px}
.pk-webdesign-projects h3{font-size:26px;margin-bottom:12px}
.pk-webdesign-projects p{color:#bbb;font-size:16px}
.pk-webdesign-projects .project-status{font-size:13px;color:#a6a6a3;margin-top:16px}
.pk-webdesign-contact h2{max-width:18ch}
.pk-webdesign-contact p{max-width:62ch;color:#bbb;margin-top:22px}
.pk-webdesign-contact a{color:inherit}
.pk-webdesign-contact .pk-offer-link{font-size:22px}
.pk-webdesign-contact .phone{display:block;margin-top:18px;color:#bbb}

@media(max-width:760px){.pk-offer{padding:64px 22px}
.pk-offer-head{grid-template-columns:1fr;gap:24px;margin-bottom:36px}
.pk-offer h2{font-size:clamp(29px,7.3vw,48px)}
.pk-offer-head p{font-size:16px}
.pk-offer-list>li{grid-template-columns:1fr;gap:12px;padding:24px 0}
.pk-offer-list h3{font-size:23px}
.pk-offer summary{font-size:19px}
.pk-webdesign-header{padding:20px 22px;align-items:flex-start}
.pk-webdesign-header nav{gap:10px 18px;justify-content:flex-end}
.pk-webdesign-header nav a{font-size:13px}
.pk-webdesign-hero{padding:65px 22px 70px}
.pk-webdesign-hero h1{font-size:clamp(38px,9vw,66px)}
.pk-webdesign-hero p{font-size:18px}
.pk-webdesign-projects{grid-template-columns:1fr;gap:48px}
.pk-webdesign-projects img{aspect-ratio:1.5}
#pk-hero-02 .hero--noir .lower-left{max-width:100%}
#pk-hero-02 .pk-hero-intro{font-size:14px;max-width:38ch;margin-bottom:17px}
#pk-hero-02 .small-head{font-size:clamp(26px,7cqw,32px)}
#pk-hero-02 .pk-hero-signature{top:-85px;width:min(180px,65%)}
#pk-hero-02 .hero--noir .lower{bottom:90px}
#pk-hero-02 .hero--noir .hero{min-height:850px}
}

