/* Sivukohtaiset tyylit Gdanskin käyttämän V5-kehyksen päälle. */
.hotellitarjoukset { background: #f4f6f9; color: #243247; --brand: #285f85; --tint: #edf3f8; }
.hotellitarjoukset * { box-sizing: border-box; }
.hotellitarjoukset .deals-page { max-width: 1200px; padding: 0 3% 20px; }
.hotellitarjoukset .deals-page :is(h1,h2,h3,p,ul,nav,aside,section) { margin-left: 0; margin-right: 0; }
.hotellitarjoukset .deals-intro { max-width: 790px; padding-top: 35px; }
.hotellitarjoukset .eyebrow { font-size: 12px; font-weight: bold; letter-spacing: .08em; text-transform: uppercase; color: #4a607c; }
.hotellitarjoukset h1 { font-size: clamp(32px,5vw,46px); margin-top: 10px; }
.hotellitarjoukset .lead { font-size: 19px; line-height: 1.6; }
.hotellitarjoukset .draft-notice { background: #fff4d9; padding: 10px 14px; font-size: 13px; line-height: 1.6; border-radius: 4px; }
.hotellitarjoukset .provider-nav { margin-top: 35px; }
.hotellitarjoukset .section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.hotellitarjoukset .section-heading h2 { font-size: 21px; margin: 0; }
.hotellitarjoukset .section-heading > span { color: #56657a; font-size: 12px; }
.hotellitarjoukset .provider-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
.hotellitarjoukset .booking { --brand: #003b95; --tint: #edf3fd; }
.hotellitarjoukset .hotels { --brand: #b42331; --tint: #fcf0f1; }
.hotellitarjoukset .scandic { --brand: #ab2038; --tint: #fcf0f3; }
.hotellitarjoukset .sokos { --brand: #303a48; --tint: #edf0f4; }
.hotellitarjoukset .omena { --brand: #a52a2f; --tint: #fcf0f0; }
.hotellitarjoukset .holidayclub { --brand: #006f7b; --tint: #eaf6f7; }
.hotellitarjoukset .strawberry { --brand: #91364e; --tint: #fbf0f4; }
.hotellitarjoukset .santas { --brand: #875031; --tint: #f9f2ec; }
.hotellitarjoukset .lapland { --brand: #4e5141; --tint: #f2f3ed; }
.hotellitarjoukset .ihg { --brand: #854125; --tint: #fcf0e9; }
.hotellitarjoukset .radisson { --brand: #245889; --tint: #edf4fb; }
.hotellitarjoukset .hilton { --brand: #184874; --tint: #edf3f9; }
.hotellitarjoukset .forenom { --brand: #555f18; --tint: #f5f7e8; }
.hotellitarjoukset .update-note { font-size: 13px; color: #4b6078; line-height: 1.6; }
.hotellitarjoukset .provider-more { margin-top: 18px; }
.hotellitarjoukset .provider-more summary { cursor: pointer; color: #234a77; font-size: 14px; font-weight: bold; padding: 8px 0; }
.hotellitarjoukset .provider-more .provider-grid { margin-top: 12px; }
.hotellitarjoukset .deal-post[data-status="upcoming"] .status { background: #fff1cc; color: #765300; }

.hotellitarjoukset .weekly-picks small { display: block; color: #5d687a; margin-top: 5px; font-size: 11px; }
.hotellitarjoukset .offer-terms code { font-size: 13px; background: #edf1f6; padding: 2px 5px; border-radius: 4px; overflow-wrap: anywhere; }
.hotellitarjoukset .offer-terms dd, .hotellitarjoukset .post-footer a { overflow-wrap: anywhere; }
.hotellitarjoukset .brand-mark { display: inline-grid; flex-shrink: 0; place-items: center; width: 42px; height: 42px; background: var(--brand); color: white; border-radius: 10px; font: bold 24px Arial,sans-serif; }
.hotellitarjoukset .provider-card { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; min-width: 0; padding: 20px; background: #fff; border: 1px solid #dce3ec; border-radius: 10px; color: #243247; text-decoration: none; }
.hotellitarjoukset a.provider-card { cursor: pointer; box-shadow: 0 2px 8px #1834550a; }
.hotellitarjoukset a.provider-card strong { color: var(--brand); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.hotellitarjoukset a.provider-card small { display: flex; align-items: center; justify-content: space-between; gap: 8px; align-self: stretch; margin-top: auto; padding: 9px 10px; background: var(--tint); border: 1px solid color-mix(in srgb, var(--brand) 18%, #e3e9f1); border-radius: 7px; color: var(--brand); }
.hotellitarjoukset .card-go { width: 28px; height: 28px; padding: 5px; flex-shrink: 0; border-radius: 50%; color: #fff; background: var(--brand); }
.hotellitarjoukset a.provider-card:hover, .hotellitarjoukset a.provider-card:focus-visible { border-color: #a8b5c4; background: var(--tint); box-shadow: 0 5px 14px #18345514; }
.hotellitarjoukset a.provider-card:hover strong { text-decoration-thickness: 2px; }
.hotellitarjoukset a.provider-card:active { transform: translateY(1px); box-shadow: none; }
.hotellitarjoukset .provider-card strong { font-size: 18px; }
.hotellitarjoukset .provider-card > span:not(.brand-mark) { font-size: 13px; }
.hotellitarjoukset .provider-card small { font-size: 11px; color: #586579; }
.hotellitarjoukset .provider-card.provider-pending { background: #f9fafc; }
.hotellitarjoukset a:focus-visible, .hotellitarjoukset summary:focus-visible { outline: 3px solid #185dad; outline-offset: 5px; }
.hotellitarjoukset [id] { scroll-margin-top: 85px; }
.hotellitarjoukset .deals-layout { display: grid; grid-template-columns: minmax(0,1fr) 300px; align-items: start; gap: 28px; margin-top: 38px; }
.hotellitarjoukset .deal-feed, .hotellitarjoukset .deals-sidebar { margin-top: 0; min-width: 0; }
/* V5 antaa section-elementeille 30 px ylämarginaalin. Näiden palstojen
   välit määritetään grid-gapilla, eivätkä ne saa riippua HTML-tagista. */
.hotellitarjoukset .deal-feed, .hotellitarjoukset .deals-sidebar { display: grid; gap: 20px; align-content: start; }
.hotellitarjoukset .deal-header { margin: 0; }
.hotellitarjoukset .deal-header .section-heading { margin-bottom: 0; }
.hotellitarjoukset .deal-post { padding: 24px; margin: 0; min-width: 0; border: 1px solid #dce3ec; border-radius: 12px; background: #fff; box-shadow: 0 3px 12px #18345505; }
.hotellitarjoukset .deal-post:target { border-color: #a8b5c4; background: var(--tint); }
.hotellitarjoukset .post-header { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; box-shadow: none; }
.hotellitarjoukset .post-header > div { flex: 1; min-width: 160px; }
.hotellitarjoukset .post-header strong { font-size: 14px; }
.hotellitarjoukset .post-meta { margin-top: 4px; font-size: 11px; line-height: 1.6; color: #5d687a; }
.hotellitarjoukset .status { padding: 5px 8px; background: #edf1f6; border-radius: 5px; font-size: 11px; color: #46556b; }
.hotellitarjoukset .deal-post h3 { margin-top: 22px; font-size: 23px; line-height: 1.3; color: #183a64; }
.hotellitarjoukset .deal-post p { font-size: 15px; line-height: 1.7; }
.hotellitarjoukset .offer-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; background: var(--tint); padding: 18px; border-radius: 8px; margin-top: 20px; }
.hotellitarjoukset .offer-label { font-size: 23px; font-weight: bold; color: var(--brand); }
.hotellitarjoukset .offer-summary p { margin: 0; font-size: 13px; }
.hotellitarjoukset .offer-summary small { font-size: 11px; color: #56657a; }
.hotellitarjoukset .offer-terms { margin: 20px 0 0; padding-top: 4px; border-top: 1px solid #e8edf3; font-size: 13px; line-height: 1.6; }
.hotellitarjoukset .offer-terms > div { display: grid; grid-template-columns: 75px minmax(0,1fr); gap: 10px; margin-top: 9px; }
.hotellitarjoukset .offer-terms dt { font-weight: bold; }
.hotellitarjoukset .offer-terms dd { margin: 0; }
.hotellitarjoukset .post-footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; border-top: 1px solid #e8edf3; padding-top: 15px; margin-top: 20px; font-size: 11px; color: #5d687a; }
.hotellitarjoukset .post-footer a { font-size: 12px; font-weight: bold; color: #205fae; }
.hotellitarjoukset .sidebar-panel { background: white; border: 1px solid #dce3ec; border-radius: 10px; padding: 22px; margin: 0; min-width: 0; }
.hotellitarjoukset .sidebar-panel h2 { font-size: 19px; margin-top: 0; }
.hotellitarjoukset .sidebar-panel .eyebrow { margin-top: 0; margin-bottom: 10px; font-size: 10px; }
.hotellitarjoukset .sidebar-panel p { font-size: 13px; line-height: 1.7; }
.hotellitarjoukset .muted { color: #5d687a; }
.hotellitarjoukset .weekly-picks { list-style: none; padding: 0; margin: 15px 0 0; }
.hotellitarjoukset .weekly-picks li { border-top: 1px solid #e8edf3; }
.hotellitarjoukset .weekly-picks a { display: block; padding: 14px 0; text-decoration: none; color: #243247; font-size: 13px; }
.hotellitarjoukset .weekly-picks span { display: block; color: #2764a9; margin-top: 5px; font-size: 12px; }
.hotellitarjoukset #sivun-osat > a { display: block; padding-top: 15px; font-size: 13px; }
.hotellitarjoukset .deal-archive summary { padding: 18px 0; cursor: pointer; font-weight: bold; color: #234a77; }
.hotellitarjoukset .deal-archive summary span { display: block; margin-top: 6px; font-size: 12px; font-weight: normal; color: #5d687a; }
.hotellitarjoukset .expired { background: #f9fafc; }
.hotellitarjoukset #about-page p { font-size: 12px; line-height: 1.6; }
.hotellitarjoukset .skip-link { position: fixed; top: -100px; left: 15px; z-index: 5; background: white; padding: 12px; }
.hotellitarjoukset .skip-link:focus { top: 10px; }
@media (max-width: 900px) {
	.hotellitarjoukset .deals-layout { grid-template-columns: minmax(0,1fr) 250px; gap: 18px; }
	.hotellitarjoukset .provider-card { padding: 15px; }
	.hotellitarjoukset .provider-card strong { font-size: 16px; }
}
@media (max-width: 720px) {
	.hotellitarjoukset .provider-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.hotellitarjoukset .deals-layout { grid-template-columns: minmax(0,1fr); }
	.hotellitarjoukset .deals-intro { padding-top: 20px; }
	.hotellitarjoukset .section-heading { flex-wrap: wrap; gap: 6px; }
	.hotellitarjoukset .deal-post { padding: 18px; }
	.hotellitarjoukset .deal-post h3 { font-size: 21px; }
	.hotellitarjoukset .lead { font-size: 17px; }
	.hotellitarjoukset .provider-card small { line-height: 1.6; }
}
@media (prefers-reduced-motion: no-preference) {
	html:has(body.hotellitarjoukset) { scroll-behavior: smooth; }
	.hotellitarjoukset a.provider-card { transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
	.hotellitarjoukset a.provider-card:hover { transform: translateY(-3px); }
}