@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;700&display=swap');

/* ==========================================================================
   Wohnen beim Holzschnitzer – Startseite Redesign
   Prefix: .hs-  |  Palette: Gold #c5ac7d, Creme #e4d8c2, Braun #4b4334
   ========================================================================== */

.hs-page {
    --hs-gold: #c5ac7d;
    --hs-gold-dark: #a98f5f;
    --hs-cream: #e4d8c2;
    --hs-cream-light: #f7f2e9;
    --hs-brown: #4b4334;
    --hs-brown-deep: #3a342a;
    --hs-text: #4a463f;
    --hs-hairline: rgba(75, 67, 52, 0.12);
    color: var(--hs-text);
    font-size: 17px;
    line-height: 1.8;
}
.hs-page * { box-sizing: border-box; }
.hs-page img { max-width: 100%; }

.hs-kicker {
    font-size: 0.78em; font-weight: 600; letter-spacing: 4px;
    text-transform: uppercase; color: var(--hs-gold-dark);
    margin: 0 0 16px; display: block;
}
.hs-h1 {
    font-family: 'Dancing Script', cursive; font-weight: 700;
    color: var(--hs-brown); font-size: 3.4em; line-height: 1.08; margin: 0 0 6px;
}
.hs-subtitle {
    font-size: 0.82em; letter-spacing: 3px; text-transform: uppercase;
    font-weight: 600; color: var(--hs-gold-dark); margin: 0 0 26px; display: block;
}
.hs-title {
    font-family: 'Dancing Script', cursive; font-weight: 700;
    color: var(--hs-brown); font-size: 2.7em; line-height: 1.1; margin: 0 0 10px;
}

.hs-intro { max-width: 760px; margin: 0 auto; padding: 24px 0 0; text-align: center; }
.hs-intro p { color: var(--hs-text); margin: 0 0 18px; }
.hs-rule { width: 54px; height: 3px; background: var(--hs-gold); margin: 22px auto; border: 0; }
.hs-signature {
    font-family: 'Dancing Script', cursive; font-size: 2.3em;
    color: var(--hs-brown); margin: 26px 0 2px; line-height: 1.2;
}
.hs-signature-sub {
    font-size: 0.78em; letter-spacing: 3px; text-transform: uppercase;
    color: var(--hs-gold-dark); margin: 0;
}

.hs-features {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 18px; max-width: 1040px; margin: 0 auto; padding: 6px 0 0;
}
.hs-feature {
    background-color: var(--hs-cream-light); border: 1px solid var(--hs-hairline);
    border-radius: 18px; padding: 26px 26px 24px;
}
.hs-feature-title { font-size: 1.02em; font-weight: 700; color: var(--hs-brown); margin: 0 0 6px; }
.hs-feature-text { font-size: 0.96em; color: var(--hs-text); margin: 0; line-height: 1.7; }

.hs-star { display: flex; justify-content: center; align-items: center; padding: 58px 0; }
.hs-star svg { width: 34px; height: 34px; fill: var(--hs-gold); display: block; }
@keyframes hs-scroll-spin { from { transform: rotate(-110deg); } to { transform: rotate(110deg); } }
@supports (animation-timeline: view()) {
    .hs-star svg { animation: hs-scroll-spin linear both; animation-timeline: view(); animation-range: entry 0% exit 100%; }
}

.hs-aktivpass-wrap { position: relative; padding-top: 130px; margin: 10px 0; }
.hs-aktivpass-peek { position: absolute; top: 0; left: 4%; width: 168px; z-index: 2; transform: rotate(-5deg); }
.hs-aktivpass-peek img {
    display: block; width: 100%; height: auto; border-radius: 14px;
    border: 4px solid #fffdf9; box-shadow: 0 16px 40px rgba(58, 52, 42, 0.35);
}
@keyframes hs-peek { from { transform: rotate(-5deg) translateY(90px); } to { transform: rotate(-5deg) translateY(0); } }
@supports (animation-timeline: view()) {
    .hs-aktivpass-peek { animation: hs-peek ease-out both; animation-timeline: view(); animation-range: entry 0% entry 60%; }
}
.hs-aktivpass {
    position: relative; overflow: hidden;
    background: linear-gradient(160deg, var(--hs-brown) 0%, var(--hs-brown-deep) 100%);
    border-radius: 28px; padding: 85px 55px 55px;
}
.hs-aktivpass-glow {
    position: absolute; top: -220px; left: 50%; width: 720px; height: 480px; margin-left: -360px;
    background: radial-gradient(closest-side, rgba(197, 172, 125, 0.35), rgba(197, 172, 125, 0)); pointer-events: none;
}
.hs-aktivpass-head { position: relative; max-width: 760px; margin: 0 auto 45px; text-align: center; }
.hs-badge {
    display: inline-block; background-color: var(--hs-gold); color: var(--hs-brown-deep);
    font-size: 0.75em; font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
    padding: 8px 22px; border-radius: 30px; margin-bottom: 22px;
}
.hs-aktivpass-title {
    font-family: 'Dancing Script', cursive; font-weight: normal; color: #ffffff;
    font-size: 3em; margin: 0 0 18px; line-height: 1.15;
}
.hs-aktivpass-lead { color: var(--hs-cream); font-size: 1.12em; font-weight: 400; line-height: 1.7; margin: 0; }
.hs-cards {
    position: relative; display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 18px;
}
.hs-card {
    background-color: #fffdf9; border: 1px solid rgba(197, 172, 125, 0.25); border-radius: 18px;
    padding: 26px 24px 20px; display: flex; flex-direction: column; align-items: flex-start;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.hs-card:hover { border-color: var(--hs-gold); box-shadow: 0 14px 30px rgba(0, 0, 0, 0.25); }
.hs-card-num {
    font-size: 0.72em; font-weight: 700; letter-spacing: 3px; color: var(--hs-gold-dark);
    border-bottom: 1px solid var(--hs-cream); padding-bottom: 10px; margin-bottom: 15px; width: 100%;
}
.hs-card-title { font-size: 1.04em; font-weight: 700; color: var(--hs-brown); margin: 0 0 8px; line-height: 1.35; }
.hs-card-text { font-size: 0.96em; color: var(--hs-text); margin: 0 0 16px; flex-grow: 1; line-height: 1.6; }
.hs-card-link {
    color: var(--hs-gold-dark); font-size: 0.76em; font-weight: 700; letter-spacing: 2px;
    text-transform: uppercase; text-decoration: none; transition: color 0.25s ease;
}
.hs-card-link:hover { color: var(--hs-brown); }
.hs-card-link .fa { margin-left: 6px; }
.hs-aktivpass-note { position: relative; text-align: center; color: var(--hs-cream); font-size: 0.88em; margin: 34px 0 0; opacity: 0.85; }

.hs-section-head { text-align: center; max-width: 720px; margin: 0 auto 34px; }

.hs-season {
    position: relative; overflow: hidden; border-radius: 24px;
    background: linear-gradient(160deg, var(--hs-brown) 0%, var(--hs-brown-deep) 100%);
    color: #fff; text-align: center; padding: 62px 40px; margin: 18px 0;
}
.hs-season-kicker { font-size: 0.74em; letter-spacing: 4px; text-transform: uppercase; color: var(--hs-gold); font-weight: 700; display: block; margin-bottom: 14px; }
.hs-season-title { font-family: 'Dancing Script', cursive; font-size: 2.6em; font-weight: 700; color: #ffffff; margin: 0 0 10px; line-height: 1.1; }
.hs-season-text { color: var(--hs-cream); font-size: 1.05em; margin: 0 0 26px; }
.hs-btn {
    display: inline-block; background-color: var(--hs-gold); color: var(--hs-brown-deep);
    font-size: 0.76em; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
    text-decoration: none; padding: 13px 30px; border-radius: 30px; transition: background-color 0.25s ease;
}
.hs-btn:hover { background-color: #d8c194; color: var(--hs-brown-deep); }

@media (max-width: 767px) {
    .hs-page { font-size: 16px; }
    .hs-h1 { font-size: 2.6em; }
    .hs-title { font-size: 2.1em; }
    .hs-aktivpass { padding: 70px 22px 40px; }
    .hs-aktivpass-title { font-size: 2.2em; }
    .hs-aktivpass-peek { width: 120px; left: 20px; }
    .hs-aktivpass-wrap { padding-top: 95px; }
    .hs-season { padding: 46px 24px; }
    .hs-season-title { font-size: 2.1em; }
}

.room-details ul {
text-align: left;
color: black;
font-size: smaller;
}