.display-foundation{display:grid}.display-foundation-board{display:grid;gap:30px;padding:clamp(28px,3vw,42px);border:1px solid color-mix(in srgb,var(--pz-color-grey-30) 82%,transparent);border-radius:32px;background:radial-gradient(circle at top right,color-mix(in srgb,var(--pz-color-blue-50) 8%,transparent),transparent 30%),linear-gradient(180deg,color-mix(in srgb,var(--pz-color-white) 98%,transparent),color-mix(in srgb,var(--pz-color-grey-20) 90%,var(--pz-color-white)));box-shadow:0 24px 80px color-mix(in srgb,var(--pz-color-black-90) 8%,transparent),inset 0 1px color-mix(in srgb,var(--pz-color-white) 98%,transparent)}.display-foundation-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:20px}.display-foundation-hero-copy,.display-foundation-hero-note,.display-foundation-section,.display-foundation-group-card,.display-foundation-preview-card{border:1px solid color-mix(in srgb,var(--pz-color-grey-30) 70%,transparent);border-radius:28px;background:color-mix(in srgb,var(--pz-color-white) 94%,transparent);box-shadow:0 18px 52px color-mix(in srgb,var(--pz-color-black-90) 6%,transparent),inset 0 1px color-mix(in srgb,var(--pz-color-white) 98%,transparent)}.display-foundation-hero-copy,.display-foundation-hero-note,.display-foundation-section{padding:clamp(22px,2vw,30px)}.display-foundation-hero-copy,.display-foundation-hero-note,.display-foundation-section-heading,.display-foundation-group-head{display:grid;gap:8px}.display-foundation-kicker,.display-foundation-chip{display:inline-flex;align-items:center;justify-content:center;width:fit-content;padding:8px 12px;border-radius:999px;background:color-mix(in srgb,var(--pz-color-blue-10) 92%,var(--pz-color-white));color:var(--pz-color-text-link-hover);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.display-foundation-section{display:grid;gap:18px}.display-foundation-groups,.display-foundation-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.display-foundation-group-card,.display-foundation-preview-card{display:grid;align-content:start;gap:18px;padding:20px}.display-foundation-cell-code code,.display-foundation-code code{color:var(--pz-color-text-primary);font-size:13px;line-height:1.6}.display-foundation-code{margin:0;padding:20px;overflow:auto;border:1px solid color-mix(in srgb,var(--pz-color-grey-30) 70%,transparent);border-radius:22px;background:linear-gradient(180deg,color-mix(in srgb,var(--pz-color-white) 96%,transparent),color-mix(in srgb,var(--pz-color-grey-20) 90%,var(--pz-color-white)))}.display-foundation-table{display:grid;grid-template-columns:minmax(200px,280px) minmax(0,1fr);overflow:hidden;border:1px solid color-mix(in srgb,var(--pz-color-grey-30) 72%,transparent);border-radius:22px;background:var(--pz-color-white)}.display-foundation-bp-table{display:grid;grid-template-columns:minmax(220px,320px) minmax(100px,140px) minmax(0,1fr);overflow:hidden;border:1px solid color-mix(in srgb,var(--pz-color-grey-30) 72%,transparent);border-radius:22px;background:var(--pz-color-white)}.display-foundation-head,.display-foundation-cell{padding:16px 18px}.display-foundation-head{background:color-mix(in srgb,var(--pz-color-grey-20) 88%,transparent);color:var(--pz-color-text-primary);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.display-foundation-cell{display:flex;align-items:center;border-top:1px solid color-mix(in srgb,var(--pz-color-grey-30) 56%,transparent)}.display-foundation-preview-surface{min-height:140px;padding:16px;border:1px dashed color-mix(in srgb,var(--pz-color-blue-50) 30%,transparent);border-radius:22px;background:color-mix(in srgb,var(--pz-color-blue-10) 86%,var(--pz-color-white))}.display-foundation-preview-box{display:grid;gap:4px;padding:12px 16px;border-radius:18px;background:color-mix(in srgb,var(--pz-color-white) 98%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--pz-color-grey-30) 72%,transparent)}.display-foundation-preview-box-tall{min-height:96px}@media (width <= 1200px){.display-foundation-hero,.display-foundation-groups,.display-foundation-preview{grid-template-columns:1fr}}@media (width <= 1024px){.display-foundation-table,.display-foundation-bp-table{grid-template-columns:1fr}.display-foundation-head{display:none}.display-foundation-cell{border-top:none}}@media (width <= 640px){.display-foundation-board,.display-foundation-hero-copy,.display-foundation-hero-note,.display-foundation-section,.display-foundation-group-card,.display-foundation-preview-card{padding:18px;border-radius:22px}}
