/* Clarity 21: one clear path through search, real offers, destinations and help. */
.wrap{width:min(1240px,calc(100% - 48px))}
.search-hero{padding-top:22px;padding-bottom:9px}
.hero-title{margin-bottom:12px}
.hero-title h1{max-width:760px}
.direct-search-label{margin-bottom:7px;color:#55554d;font-size:13px;font-weight:700}
.products{gap:7px;margin-bottom:10px}
.products button{min-height:42px;padding:9px 14px}
.search-bar{box-shadow:0 5px 18px #674b1618}
.explore-nav{display:none}
.theme-section{padding-top:8px}
.quick-filters{border-color:#e9dfd2;background:#fffdf9}
.quick-filters summary{min-height:44px}
.quick-filters summary>span:first-child{font-size:13px}
.offers-section .section-heading{margin:16px 0 10px}
.offer-tools{gap:8px}
.offer-sort{font-size:12px}
.offer-grid{gap:14px}
.offer-card{box-shadow:0 1px 3px #2b26100b}
.offer-card h3{line-height:1.35}
.offer-detail{font-size:12px;line-height:1.5}
.offer-bottom{align-items:center}
.offer-bottom strong{font-variant-numeric:tabular-nums}
.destinations-section{padding-top:8px}
.destinations-section .section-heading{margin-bottom:9px}
.destinations-section>.fine{max-width:700px;margin-bottom:13px}
.compact-tools{margin-top:16px;margin-bottom:16px}
.faq-section{padding:34px 0}
#booking-frame{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;border-radius:12px;background:#fff}
.results-section>#frame-status{margin:7px 0 10px}
@media(max-width:900px){
  .wrap{width:calc(100% - 36px)}
  .header-row{gap:10px}
  .logo{width:clamp(170px,28vw,230px)}
  .header-row nav{gap:14px}
}
@media(max-width:760px){
  .wrap{width:calc(100% - 28px)}
  .search-hero{padding:10px 0 4px}
  .hero-title{margin-bottom:7px}
  .hero-title .eyebrow{margin-bottom:4px}
  .hero-title h1{font-size:clamp(25px,7vw,30px);line-height:1.1}
  .direct-search-label{margin-bottom:6px;font-size:12px}
  .products{gap:6px;margin-bottom:7px}
  .products button{min-height:42px;padding:7px 8px;font-size:12px}
  .search-bar{gap:5px;padding:6px}
  .destination-field{min-height:54px;padding:8px 10px}
  .search-field{min-height:54px;padding:8px}
  .search-field small,.destination-field>span{font-size:10px}
  .search-field strong{font-size:12px;line-height:1.25}
  .search-submit{min-height:48px}
  .explore-nav{display:flex;margin:5px 0 5px;gap:6px}
  .explore-nav a{min-height:40px;padding:7px 10px;font-size:11px}
  .theme-section{padding-top:3px}
  .quick-filters{width:100%}
  .quick-filters summary{min-height:42px;padding:0 11px}
  .quick-filters summary small{font-size:10px}
  .offers-section .section-heading{margin:10px 0 7px;align-items:center}
  .offers-section .section-heading h2{font-size:22px}
  .offer-tools{width:100%;justify-content:space-between;gap:6px}
  .offer-grid{gap:8px}
  .offer-card>a{display:grid;grid-template-columns:minmax(92px,32%) minmax(0,1fr);align-items:stretch}
  .offer-photo{width:100%;height:100%;min-height:176px;max-height:none;aspect-ratio:auto;object-fit:cover}
  .offer-body{padding:11px}
  .offer-card h3{min-height:0;margin-bottom:5px;font-size:16px;line-height:1.28}
  .offer-place{margin-bottom:4px;font-size:11px}
  .offer-detail{font-size:12px;line-height:1.4}
  .offer-bottom{margin-top:7px;padding-top:6px;gap:6px}
  .offer-bottom strong{font-size:20px}
  .offer-bottom small{font-size:10px}
  .offer-bottom>.offer-card-cta{min-height:34px;padding:6px 8px;font-size:10px}
  .destinations-section{padding-top:4px}
  .destinations-section .section-heading{margin:11px 0 6px}
  .destinations-section .section-heading h2{font-size:22px}
  .destinations-section>.fine{font-size:12px;line-height:1.45;margin-bottom:9px}
  .destination-grid{gap:8px}
  .compact-tools{margin-top:11px;margin-bottom:11px}
  .faq-section{padding:22px 0}
  .faq-wrap{gap:15px}
  .faq-intro h2{font-size:23px}
}
@media(max-width:360px){
  .wrap{width:calc(100% - 22px)}
  .logo{width:clamp(142px,43vw,156px)}
  .header-row{gap:5px}
  .products button{font-size:11px;padding:6px}
  .offer-card>a{grid-template-columns:78px minmax(0,1fr)}
  .offer-photo{min-height:184px}
  .offer-body{padding:8px}
  .offer-card h3{font-size:15px}
  .offer-detail{font-size:11.5px}
  .offer-bottom strong{font-size:18px}
  .destination-card strong{font-size:15px}
  .destination-card small{font-size:11px}
}

/* Clarity 24: keep the first screen purposeful and section jumps easy to scan. */
.header-shortcuts{white-space:nowrap}
@media(max-width:760px){
  .explore-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;width:100%}
  .explore-nav a{justify-content:center;min-width:0;padding:7px 4px;text-align:center;white-space:nowrap}
  .theme-section{margin-top:0}
  .offers-section .section-heading{gap:7px}
  .offer-tools{min-width:0}
  .offer-sort{min-width:0}
  .offer-sort select{min-width:0}
  .destination-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .compact-tools>summary{min-height:48px}
  .faq-search input{min-height:46px}
}
@media(max-width:350px){
  .explore-nav{gap:4px}
  .explore-nav a{font-size:10px;padding-inline:2px}
}

/* Clarity 31: keep the mobile chat button clear of filters and offer controls. */
@media(min-width:1101px){.offer-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}}
@media(max-width:760px){
  /* Reserve a compact, collision-free spot for the chat button above offers. */
  .offers-section .section-heading{margin-top:38px}
  .explore-nav a{border:0;border-radius:8px;background:transparent;color:var(--muted);text-decoration:underline;text-underline-offset:3px;font-size:12px;font-weight:600}
  .explore-nav a:hover{background:#fff8ee;color:var(--burnt)}
}

/* Keep the human contact fallback in the document flow if the IONOS chat is unreachable. */
.chat-entry{display:flex;align-items:center;justify-content:flex-end;gap:12px;width:min(1240px,calc(100% - 48px));margin:10px auto;padding:8px 0;position:static}
.chat-entry>span{display:block;color:var(--muted);font-size:13px;line-height:1.4}
.chat-entry .chat-launch{position:static;right:auto;bottom:auto;flex:none;min-height:44px;margin:0;padding:10px 14px;background:#fff;color:#914000;box-shadow:none}
@media(max-width:760px){.chat-entry{width:calc(100% - 28px);justify-content:space-between;margin:5px auto 2px;padding:3px 0;gap:8px}.chat-entry>span{display:block;font-size:12px}.chat-entry .chat-launch{position:static;min-height:42px;padding:9px 11px}}

/* Clarity 32: offer cards become easier to scan on phones without hiding key facts. */
@media(max-width:760px){
  .offer-card>a{grid-template-columns:minmax(82px,28%) minmax(0,1fr)}
  .offer-photo{min-height:158px;max-height:none}
  .offer-body{padding:9px 10px}
  .offer-place{margin-bottom:2px;font-size:10px}
  .offer-card h3{margin-bottom:4px;font-size:15px;line-height:1.22}
  .offer-detail{margin-bottom:0;font-size:11px;line-height:1.3}
  .offer-bottom{margin-top:5px;padding-top:5px;gap:5px}
  .offer-bottom strong{font-size:18px}
  .offer-bottom small{font-size:9.5px;line-height:1.25}
  .offer-bottom>.offer-card-cta{min-height:32px;padding:6px 8px;font-size:10px}
}
@media(max-width:360px){
  .offer-card>a{grid-template-columns:70px minmax(0,1fr)}
  .offer-photo{min-height:150px}
  .offer-body{padding:8px}
  .offer-card h3{font-size:14px}
  .offer-detail{font-size:10.5px;line-height:1.25}
  .offer-bottom strong{font-size:17px}
  .offer-bottom>.offer-card-cta{padding-inline:6px;font-size:9.5px}
}

/* Clarity 33: keep the primary search action on one line on very narrow phones. */
@media(max-width:360px){#search-form .search-submit{font-size:11px;padding-inline:4px;white-space:nowrap;letter-spacing:-.2px}}

/* Clarity 37: keep a clear mobile slot beside the filter toggle for the Max chat launcher. */
@media(max-width:760px){.quick-filters:not([open]) summary{width:min(220px,calc(100vw - 160px));gap:6px;padding-inline:8px;white-space:nowrap}}

/* Clarity 38: leave a measured gap between the filter control and Max on narrow screens. */
@media(max-width:760px){.quick-filters:not([open]) summary{width:min(208px,calc(100vw - 184px))}}
@media(max-width:350px){.quick-filters:not([open]) summary small{display:none}}

/* Clarity 39: a calmer mobile search with one clear action and fewer repeated links. */
@media(max-width:760px){
  #search-form{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:6px;padding:7px}
  #search-form .destination-field{grid-column:1/-1;min-height:54px;border-right:0;border-bottom:1px solid var(--line);padding:8px 10px}
  #search-form #airports-open,#search-form #dates-open{min-height:58px;border-right:0;border-bottom:1px solid var(--line);padding:8px 9px}
  #search-form #people-open{grid-column:1/-1;min-height:48px;border:0;border-bottom:1px solid var(--line);padding:7px 10px}
  #search-form .search-submit{grid-column:1/-1;min-height:48px;margin:0}
  .search-tools{min-height:27px;margin-top:2px}
  #search-caption{display:none}
  .explore-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:4px 0 6px}
  .explore-nav a:first-child{display:none}
  .explore-nav a{justify-content:center}
}

/* Clarity 40: remove repeated desktop navigation and tighten the path from choice to search. */
@media(min-width:761px){
  .search-hero .explore-nav{display:none}
  .search-hero{padding-bottom:20px}
  .theme-section{padding-top:13px}
}
@media(max-width:760px){
  .direct-search-label{margin:4px 0 6px;font-size:12px}
  .products{gap:6px}
  .products button{flex:1 1 calc(50% - 3px);min-width:0}
  .search-hero .explore-nav{margin-top:3px;margin-bottom:4px}
  .theme-section{padding-top:5px}
  .offers-section .section-heading{align-items:flex-start}
  .offer-tools{flex-wrap:wrap}
}

/* Clarity 44: make the two ways to begin explicit and reclaim a little mobile height. */
@media(max-width:760px){
  .service-strip{padding-block:5px}
  .header-row{min-height:60px}
  .search-hero{padding-top:7px}
  .hero-title{margin-bottom:4px}
  .direct-search-label{margin:0 0 5px;font-size:12px}
  .planner-start{margin-bottom:5px}

}
/* Clarity 45: at normal phone widths, keep the passenger choice beside the search action. */
@media(min-width:381px) and (max-width:760px){
  #search-form #people-open{grid-column:1;min-height:48px;border:0;padding:7px 9px}
  #search-form .search-submit{grid-column:2;min-height:48px;padding-inline:8px;font-size:12px;white-space:nowrap}
}
/* Fit the real IBE content into the normal page scroll and fill the quick-filter row. */
#booking-frame{overscroll-behavior:auto;max-height:none}
#quick-filters .themes button{flex:1 1 auto;white-space:nowrap;min-height:44px}
@media(max-width:760px){#quick-filters .themes button{flex:1 1 calc(50% - 4px);min-width:0;white-space:normal}}

/* Choose every traveller directly in the planner step, without a second dialog. */
#planner .plan-party fieldset{min-width:0;margin:12px 0;padding:12px;border:1px solid var(--line,#e3ded5);border-radius:12px}
#planner .plan-party legend{font-size:13px;font-weight:700;padding-inline:5px}
#planner .plan-party label{margin:0;min-width:0}
#planner .plan-party select{min-height:44px;width:100%}
#planner .plan-party-counts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#planner .plan-child-ages:not(:empty){display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:10px;margin-top:12px}
#planner .plan-child-ages label{font-size:12px}
#planner #plan-party-summary{margin:8px 0 0}

html:has(#planner[open]){overflow:hidden;scrollbar-gutter:stable}

/* One visible, clearly named entry into the guided planner. */
.search-hero .planner-start{background:linear-gradient(135deg,#c65200,#a43e00);color:#fff;border:2px solid #ffc078;font-size:18px;font-weight:700;line-height:1.25;min-height:64px;min-width:250px;max-width:100%;padding:17px 28px;box-shadow:0 0 0 4px #fff3decc,0 7px 18px #7d350038}
.search-hero .planner-start:hover{background:#963900;color:#fff;border-color:#ffd4a0}
@media(max-width:760px){.search-hero .planner-start{font-size:17px;min-height:58px;min-width:min(235px,100%);padding:14px 24px;margin:5px 0 13px}}
/* Sunny: compact result heading */
#reiseergebnisse #results-title{font-size:18px;line-height:1.35;font-weight:650;color:#a84600;background:#fff5e8;border-left:3px solid #ed8a25;padding:8px 12px;border-radius:0 8px 8px 0;margin:0;outline:none;box-shadow:none}
@media(max-width:600px){#reiseergebnisse #results-title{font-size:16px;padding:7px 10px}}
/* Compact airport selection: three columns on desktop, readable touch rows on mobile. */
@media(min-width:760px){#planner:has(#plan-all-airports){width:min(920px,calc(100% - 32px));padding:22px}#planner .airport-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 16px;max-height:none;overflow:visible}#planner .airport-list .checkbox{min-height:30px;margin:0;padding:4px 0;font-size:12px;line-height:1.25}#planner:has(#plan-all-airports) #plan-meter{margin-bottom:8px}#planner:has(#plan-all-airports) p{margin-bottom:8px}}
#planner .airport-list .checkbox input{flex:0 0 18px;width:18px;height:18px;margin:0}
@media(max-width:759px){#planner .airport-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 10px;max-height:none;overflow:visible}#planner .airport-list .checkbox{min-height:44px;margin:0;padding:5px 0;font-size:12px;line-height:1.3}}
@media(max-width:359px){#planner .airport-list{grid-template-columns:1fr}}

.budget-slider output{display:block;color:var(--burnt);font-size:25px;font-weight:700;margin:18px 0 8px}.budget-slider input[type=range]{width:100%;height:44px;padding:0;border:0;accent-color:var(--burnt);cursor:pointer}.budget-scale{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:14px}
#planner .plan-amenities{gap:0 16px}#planner .plan-amenities .checkbox{margin:0;padding:4px 0;min-height:32px;line-height:1.3}#planner .plan-amenities .checkbox input{margin:0;flex:0 0 18px;width:18px;height:18px}@media(pointer:coarse){#planner .plan-amenities .checkbox{min-height:44px}}@media(max-width:480px){#planner .plan-amenities{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 10px}#planner .plan-amenities .checkbox{font-size:12px;min-height:44px}}@media(max-width:359px){#planner .plan-amenities{grid-template-columns:1fr}}
/* Branded, compact result area around the provider-owned booking view. */
#reiseergebnisse{margin-top:24px;padding:0 18px 18px;border:1px solid #eddcc9;border-top:4px solid #e8710c;border-radius:18px;background:#fff;box-shadow:0 8px 28px #7745100d;scroll-margin-top:88px}
#reiseergebnisse>.section-heading{margin:0 -18px 14px;padding:16px 18px;background:linear-gradient(110deg,#fff2dd,#fffaf4 65%,#fff);border-bottom:1px solid #f0e3d4;border-radius:14px 14px 0 0;gap:12px}
#reiseergebnisse #results-title{background:transparent;border:0;padding:0;color:#8f3e08;font-size:19px;line-height:1.3;box-shadow:none;max-width:65%}
#reiseergebnisse>.section-heading>div{display:flex;gap:8px;flex-wrap:wrap}
#reiseergebnisse .text-button{border:1px solid #e7c5a3;border-radius:22px;padding:9px 14px;background:#fff;min-height:40px;color:#923c00}
#reiseergebnisse .text-button:hover{background:#fff0dc;border-color:#d87524}
#reiseergebnisse #booking-frame{border:0;border-radius:12px;background:#fff;display:block;width:100%}#reiseergebnisse #booking-frame[hidden]{display:none}
#reiseergebnisse #frame-status:empty{display:none}
@media(max-width:600px){#reiseergebnisse{width:calc(100% - 16px);padding:0 4px 8px;margin-top:16px;border-radius:12px}#reiseergebnisse>.section-heading{margin:0 -4px 8px;padding:12px;align-items:flex-start;flex-direction:column}#reiseergebnisse #results-title{font-size:17px;max-width:100%}#reiseergebnisse .text-button{min-height:44px;padding:8px 12px}#reiseergebnisse #booking-frame{border-radius:6px}}

.rating-slider{margin:16px 0}.rating-slider>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:8px}.rating-slider label{margin:0}.rating-slider output{background:#fff0df;color:#a94400;padding:5px 9px;border-radius:8px;font-weight:700}.rating-slider input[type=range]{width:100%;height:44px;accent-color:#b64b00;cursor:pointer}

/* Compact, warm headline with room for rotating phrases. */
.hero-title h1{font-size:clamp(26px,2.5vw,34px);line-height:1.2;color:#984500;font-weight:700;min-height:1.2em;max-width:760px;margin-bottom:0}@media(max-width:760px){.hero-title h1{font-size:22px;line-height:1.2;min-height:2.4em}}