.public-site .experiences-page { padding-top: 30px; padding-bottom: 55px; }
.public-site .experiences-page__heading { margin-bottom: 26px; }
.public-site .experiences-page__heading .page-header { margin: 0 0 8px; padding: 0; border: 0; color: var(--public-ink); font-family: "Segoe UI", Inter, Arial, sans-serif; font-size: clamp(30px, 4vw, 42px); font-weight: 680; }
.public-site .experiences-page__heading > p { max-width: 760px; margin: 0 0 16px; color: var(--public-muted); font-size: 16px; line-height: 1.7; }
.public-site .experiences-page__heading .breadcrumb { margin: 0; padding: 10px 14px; border: 1px solid var(--public-line); border-radius: 10px; background: var(--public-cream); }
.public-site .experiences-grid { display: grid; grid-template-columns: repeat(var(--experiences-columns), minmax(0, 1fr)); align-items: stretch; gap: 20px; }
.public-site .experience-card { min-width: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--public-line); border-radius: 17px; background: var(--public-white); box-shadow: 0 12px 32px rgba(23, 50, 42, .09); transition: transform .2s ease, box-shadow .2s ease; }
.public-site .experience-card:hover { transform: translateY(-3px); box-shadow: 0 16px 38px rgba(23, 50, 42, .13); }
.public-site .experience-card__media { position: relative; height: var(--experiences-image-height); overflow: hidden; background: var(--public-cream); }
.public-site .experience-card__media > a { display: block; width: 100%; height: 100%; }
.public-site .experience-card__media img { width: 100%; height: 100%; object-fit: var(--experiences-image-fit); transition: transform .35s ease; }
.public-site .experience-card:hover .experience-card__media img { transform: scale(1.035); }
.public-site .experience-card__badge { position: absolute; top: 13px; left: 13px; padding: 6px 10px; border-radius: 999px; color: var(--public-white); background: var(--public-accent); font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.public-site .experience-card__body { flex: 1; display: flex; flex-direction: column; min-width: 0; padding: 20px; }
.public-site .experience-card__category { margin: 0 0 6px; color: var(--public-accent); font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; overflow-wrap: anywhere; }
.public-site .experience-card h2 { margin: 0 0 11px; color: var(--public-ink); font-family: "Segoe UI", Inter, Arial, sans-serif; font-size: 20px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.public-site .experience-card h2 a { color: inherit; }
.public-site .experience-card h2 a:hover, .public-site .experience-card h2 a:focus { color: var(--public-accent); }
.public-site .experience-card__summary { display: -webkit-box; min-width: 0; margin: 0 0 18px; overflow: hidden; color: var(--public-muted); font-size: 14px; line-height: 1.65; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: var(--experiences-summary-lines); }
.public-site .experience-card__button { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding: 10px 14px; border: 1px solid var(--public-forest); border-radius: 10px; color: var(--public-white); background: var(--public-forest); font-size: 13px; font-weight: 750; }
.public-site .experience-card__button:hover, .public-site .experience-card__button:focus { border-color: var(--public-accent); color: var(--public-ink); background: var(--public-accent); }
.public-site .experiences-empty { max-width: 680px; margin: 0 auto; padding: 48px 28px; border: 1px dashed var(--public-line); border-radius: 17px; color: var(--public-muted); background: var(--public-cream); text-align: center; }
.public-site .experiences-empty > i { margin-bottom: 15px; color: var(--public-accent); font-size: 38px; }
.public-site .experiences-empty h2 { margin: 0 0 8px; color: var(--public-ink); font-family: "Segoe UI", Inter, Arial, sans-serif; font-size: 23px; font-weight: 700; }
.public-site .experiences-empty p { margin: 0; line-height: 1.7; }
@media (max-width: 991px) { .public-site .experiences-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .public-site .experiences-page { padding-top: 20px; } .public-site .experiences-grid { grid-template-columns: 1fr; gap: 15px; } .public-site .experience-card__body { padding: 17px; } }