/* Ogárek – tipy na ubytování (homepage) */
@font-face { font-family: 'DM Sans'; font-weight: 100 1000; font-display: swap; src: url(../fonts/dm-sans-latin-ext-wght-normal.woff2) format('woff2'); unicode-range: U+0100-024F, U+1E00-1EFF, U+2C60-2C7F; }
@font-face { font-family: 'DM Sans'; font-weight: 100 1000; font-display: swap; src: url(../fonts/dm-sans-latin-wght-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+2013-2014, U+2018-201E; }
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 200 800; font-display: swap; src: url(../fonts/bricolage-grotesque-latin-ext-wght-normal.woff2) format('woff2'); unicode-range: U+0100-024F, U+1E00-1EFF, U+2C60-2C7F; }
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 200 800; font-display: swap; src: url(../fonts/bricolage-grotesque-latin-wght-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+2013-2014, U+2018-201E; }

body .ogarek-tipy { --og-green: #1E5B43; --og-green-dark: #123A2A; --og-green-soft: #E6F0EA; --og-text: #1B1F1D; --og-text-2: #3A433E; box-sizing: border-box; width: 100%; margin: 0; padding: 0; font-family: 'DM Sans', system-ui, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.5; color: var(--og-text); }
body .ogarek-tipy *, body .ogarek-tipy *::before, body .ogarek-tipy *::after { box-sizing: border-box; }
body .ogarek-tipy :is(ul, li, h3, a, img) { margin: 0; padding: 0; font-family: inherit; letter-spacing: normal; text-transform: none; }
body .ogarek-tipy ul { list-style: none; }
body .ogarek-tipy li::before, body .ogarek-tipy li::after { content: none; }
body .ogarek-tipy img { display: block; width: 100%; max-width: none; height: auto; border: 0; border-radius: 0; box-shadow: none; }
body .ogarek-tipy .og-icon { flex: none; display: inline-block; vertical-align: middle; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

body .ogarek-tipy .ogarek-tipy__list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 24px; }
body .ogarek-tipy .ogarek-tipy__item { display: flex; min-width: 0; }
body .ogarek-tipy .ogarek-tipy__card { display: flex; flex-direction: column; width: 100%; overflow: hidden; border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(23,42,74,.08), 0 6px 18px rgba(23,42,74,.08); text-decoration: none; transition: box-shadow .15s ease; }
body .ogarek-tipy a.ogarek-tipy__card:is(:link, :visited, :hover, :focus) { color: var(--og-text); text-decoration: none; }
body .ogarek-tipy a.ogarek-tipy__card:is(:hover, :focus) { box-shadow: 0 2px 4px rgba(23,42,74,.12), 0 10px 26px rgba(23,42,74,.14); }
body .ogarek-tipy a:focus-visible { outline: 3px solid var(--og-green); outline-offset: 2px; }
body .ogarek-tipy .ogarek-tipy__foto { position: relative; display: block; }
body .ogarek-tipy .ogarek-tipy__img { aspect-ratio: 3 / 2; object-fit: cover; }
body .ogarek-tipy .ogarek-tipy__badge { position: absolute; top: 8px; left: 8px; display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px 4px 7px; border-radius: 999px; background: #fff; font-size: 11px; font-weight: 700; line-height: 1.4; color: var(--og-green); }
body .ogarek-tipy .ogarek-tipy__body { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 16px; }
body .ogarek-tipy .ogarek-tipy__typ { align-self: flex-start; padding: 2px 9px; border-radius: 999px; background: var(--og-green-soft); font-size: 12px; font-weight: 700; line-height: 1.5; color: var(--og-green); }
body .ogarek-tipy .ogarek-tipy__name { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 19px; font-weight: 700; line-height: 1.2; color: var(--og-text); }
body .ogarek-tipy .ogarek-tipy__loc { display: flex; align-items: flex-start; gap: 5px; font-size: 14px; line-height: 1.35; color: var(--og-text-2); }

body .ogarek-tipy a.ogarek-tipy__all { display: flex; align-items: center; justify-content: center; gap: 8px; width: fit-content; min-height: 48px; margin: 36px auto 0; padding: 0 24px; border-radius: 12px; background: var(--og-green); font-size: 16px; font-weight: 700; text-decoration: none; }
body .ogarek-tipy a.ogarek-tipy__all:is(:link, :visited) { color: #fff; }
body .ogarek-tipy a.ogarek-tipy__all:is(:hover, :focus) { background: var(--og-green-dark); color: #fff; text-decoration: none; }

@media (max-width: 1023px) {
	body .ogarek-tipy .ogarek-tipy__list { display: flex; gap: 14px; padding: 4px 2px 16px; overflow-x: auto; scroll-snap-type: x mandatory; }
	body .ogarek-tipy .ogarek-tipy__item { flex: 0 0 240px; scroll-snap-align: start; }
	body .ogarek-tipy .ogarek-tipy__img { height: 160px; aspect-ratio: auto; object-fit: cover; }
	body .ogarek-tipy .ogarek-tipy__body { padding: 12px 14px 14px; }
	body .ogarek-tipy .ogarek-tipy__name { font-size: 18px; }
	body .ogarek-tipy a.ogarek-tipy__all { width: 100%; margin-top: 12px; }
}
