/* Responsive foundations — mobile-first. Verbindliche Breakpoints: 390 / 768 / 1440.
   Spezifikations- und Vorschaubreiten: Mobile 390px, Tablet 768px, Desktop 1440px.
   Layout-Schwellen (min-width): 768px = Tablet, 1024px = Desktop-Layout (Regel 7). */
:root{
--bp-mobile:390px; /* @kind other */
--bp-tablet:768px; /* @kind other */
--bp-desktop:1440px; /* @kind other */
--bp-desktop-entry:1024px; /* @kind other */

--container-max:1200px; /* @kind spacing */
--gutter-mobile:20px; /* @kind spacing */
--gutter-tablet:32px; /* @kind spacing */
--gutter-desktop:48px; /* @kind spacing */

/* --gutter-lg is the page gutter every layout component uses; it resolves per breakpoint */
--gutter-lg:var(--gutter-mobile);
--gutter:16px;

--grid-cols:4; /* @kind other */
--cards-cols:1; /* @kind other */

/* vertical rhythm shrinks on small screens */
--section-py:64px;
--section-py-lg:80px;
--section-py-sm:48px;

/* body copy stays 17–18px across all breakpoints */
--fs-body:1.0625rem;
--fs-lead:1.125rem;
}

@media (min-width:768px){:root{
--gutter-lg:var(--gutter-tablet);
--gutter:24px;
--grid-cols:8; /* @kind other */
--cards-cols:2; /* @kind other */
--section-py:80px;
--section-py-lg:104px;
--section-py-sm:56px;
--fs-body:1.125rem;
--fs-lead:1.1875rem;
}}

@media (min-width:1024px){:root{
--gutter-lg:var(--gutter-desktop);
--gutter:32px;
--grid-cols:12; /* @kind other */
--cards-cols:3; /* @kind other */
--section-py:96px;
--section-py-lg:128px;
--section-py-sm:64px;
}}

/* ---------- grid ---------- */
.pk-grid{display:grid;grid-template-columns:repeat(var(--grid-cols),minmax(0,1fr));gap:var(--gutter)}

/* service / content cards: 1 → 2 → 3 */
.pk-cards{display:grid;gap:var(--space-5);grid-template-columns:1fr}
@media (min-width:768px){.pk-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.pk-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* text columns / step lists: 1 → 2 → 3 */
.pk-cols-3{display:grid;gap:var(--space-6);grid-template-columns:1fr}
@media (min-width:768px){.pk-cols-3{gap:var(--space-7);grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.pk-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* two-part band: stacked below 1024, side by side from 1024 */
.pk-split{display:grid;gap:var(--space-6);grid-template-columns:1fr}
@media (min-width:1024px){.pk-split{gap:var(--space-9);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}}
@media (min-width:1024px){.pk-split--text-lead{grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr)}}
@media (min-width:1024px){.pk-split--media-lead{grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr)}}
@media (min-width:1024px){.pk-split--top{align-items:start}}
/* media above text on mobile, regardless of source order */
.pk-split__media{order:-1}
@media (min-width:1024px){.pk-split__media{order:0}}

/* ---------- hero ---------- */
.pk-hero{display:grid;gap:var(--space-6);grid-template-columns:1fr}
@media (min-width:1024px){.pk-hero{gap:var(--space-9);grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr);align-items:center}}
.pk-hero--single{grid-template-columns:1fr}
.pk-hero__media{order:-1}
@media (min-width:1024px){.pk-hero__media{order:0}}
.pk-hero__actions{display:flex;flex-direction:column;gap:var(--space-4);margin-top:var(--space-2)}
.pk-hero__actions>a,.pk-hero__actions>button{width:100%}
@media (min-width:768px){
.pk-hero__actions{flex-direction:row;flex-wrap:wrap;align-items:center}
.pk-hero__actions>a,.pk-hero__actions>button{width:auto}
}

/* ---------- header / navigation ---------- */
.pk-header__bar{max-width:var(--container-max);margin-inline:auto;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-5)}
@media (min-width:768px){.pk-header__bar{min-height:88px;gap:var(--space-7)}}
.pk-nav-desktop{display:none}
@media (min-width:768px){.pk-nav-desktop{display:flex;align-items:center;gap:var(--space-5)}}
@media (min-width:1024px){.pk-nav-desktop{gap:var(--space-6)}}
.pk-header__mobile{display:flex;align-items:center;gap:var(--space-3)}
@media (min-width:768px){.pk-header__mobile{display:none}}
.pk-burger{min-width:44px;min-height:44px;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:transparent;border:0;padding:0;cursor:pointer}
.pk-burger span{display:block;width:22px;height:1px;background:var(--text-heading)}
.pk-nav-overlay{position:fixed;inset:0;z-index:60;background:var(--surface-page);display:flex;flex-direction:column;padding:var(--gutter-lg);gap:var(--space-6);overflow-y:auto}
@media (min-width:768px){.pk-nav-overlay{display:none}}
.pk-nav-overlay__links{display:flex;flex-direction:column;gap:var(--space-2)}
.pk-nav-overlay__links a{min-height:44px;display:flex;align-items:center;font-family:var(--font-display);font-size:1.75rem;font-weight:var(--fw-display-light);letter-spacing:var(--ls-display);text-decoration:none}

/* ---------- CTA banner ---------- */
.pk-cta{display:flex;flex-direction:column;gap:var(--space-5);padding:var(--space-7) var(--space-6);border-radius:var(--radius-card)}
.pk-cta>a,.pk-cta>button{width:100%}
@media (min-width:768px){
.pk-cta{padding:var(--space-8) var(--space-7)}
.pk-cta>a,.pk-cta>button{width:auto;align-self:flex-start}
}
@media (min-width:1024px){
.pk-cta{flex-direction:row;align-items:center;justify-content:space-between;gap:var(--space-7);padding:var(--space-9) var(--space-8)}
}

/* ---------- fee table: real table from 768, stacked cards below ---------- */
.pk-fee-table{display:none}
@media (min-width:768px){.pk-fee-table{display:table;width:100%;border-collapse:collapse}}
.pk-fee-cards{display:grid;gap:var(--space-4)}
@media (min-width:768px){.pk-fee-cards{display:none}}

/* ---------- forms ---------- */
.pk-form-grid{display:grid;gap:var(--space-5);grid-template-columns:1fr}
@media (min-width:768px){.pk-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pk-form-actions{display:flex;flex-direction:column;align-items:stretch;gap:var(--space-4)}
.pk-form-actions>a,.pk-form-actions>button{width:100%}
@media (min-width:768px){
.pk-form-actions{flex-direction:row;align-items:center;flex-wrap:wrap;gap:var(--space-5)}
.pk-form-actions>a,.pk-form-actions>button{width:auto}
}
input,select,textarea{max-width:100%}

/* ---------- footer: 1 → 2 → 4 ---------- */
.pk-footer-cols{display:grid;gap:var(--space-6);grid-template-columns:1fr}
@media (min-width:768px){.pk-footer-cols{gap:var(--space-7);grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.pk-footer-cols{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- touch targets ---------- */
a[href],button,summary,label,input[type="checkbox"],input[type="radio"]{touch-action:manipulation}
