/* Shared listing for /oteller, /turlar, /transferler and /kesfet.
   Every colour comes from a token below (themselves set from site.css), so a palette change moves the whole page.
   Grid: 4 x 302 + 3 x 24 = 1280 (the .shell width); 3 columns below 1180px, 2 below 860px, 1 below 560px. */
.cl-page{--cl-hero:var(--green);--cl-ink:var(--green);--cl-accent:var(--terra);--cl-ground:var(--sage-50);--cl-card:var(--white);--cl-chip:var(--sage);--cl-star:#f2b544;padding-bottom:0}

/* Hero: the top result's photograph under a scrim in the brand colour. */
.cl-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--cl-hero);color:var(--white);padding:34px 0 108px}
.cl-hero-photo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.cl-hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,color-mix(in srgb,var(--cl-hero) 94%,transparent) 0%,color-mix(in srgb,var(--cl-hero) 82%,transparent) 42%,color-mix(in srgb,var(--cl-hero) 35%,transparent) 100%)}
.cl-hero-plain .cl-hero-shade{background:none}
.cl-hero-inner{position:relative}
.cl-crumbs{margin-bottom:26px;color:color-mix(in srgb,var(--white) 82%,transparent)}
.cl-crumbs a:hover{color:var(--white);text-decoration:underline}
.cl-hero h1{max-width:16ch;font-family:var(--serif);font-size:clamp(40px,4.4vw,60px);line-height:1.02;letter-spacing:-.025em;color:var(--white)}
.cl-hero-lead{max-width:52ch;margin-top:14px;font-size:17px;line-height:1.55;color:color-mix(in srgb,var(--white) 90%,transparent)}
.cl-hero-stats{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:22px;font-size:14px;color:color-mix(in srgb,var(--white) 88%,transparent)}
.cl-hero-stats span{display:inline-flex;align-items:baseline;gap:6px}
.cl-hero-stats strong{font-size:22px;font-weight:700;color:var(--white);font-variant-numeric:tabular-nums}
.cl-hero-stats svg.lucide{width:17px;height:17px;align-self:center}
.cl-tabs{display:flex;gap:8px;margin-top:30px;overflow-x:auto;scrollbar-width:none}
.cl-tabs::-webkit-scrollbar{display:none}
.cl-tabs a{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 16px;border-radius:999px;background:color-mix(in srgb,var(--white) 12%,transparent);border:1px solid color-mix(in srgb,var(--white) 26%,transparent);color:var(--white);font-size:14px;font-weight:600;white-space:nowrap;transition:background .2s,color .2s}
.cl-tabs a:hover{background:color-mix(in srgb,var(--white) 22%,transparent)}
.cl-tabs a span{font-size:13px;font-weight:500;opacity:.85;font-variant-numeric:tabular-nums}
.cl-tabs svg.lucide{width:17px;height:17px}
.cl-tabs a[aria-current]{background:var(--white);border-color:var(--white);color:var(--cl-ink)}

/* The filter panel floats over the hero's lower edge, as the home page search does. */
.cl-panel-wrap{position:relative;z-index:3;margin-top:-62px}
.cl-filter{display:flex;align-items:stretch;gap:10px;padding:14px;border-radius:16px;background:var(--white);box-shadow:0 18px 44px color-mix(in srgb,var(--cl-ink) 16%,transparent)}
.cl-field{display:flex;align-items:center;gap:12px;min-width:0;min-height:62px;padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:var(--white);transition:border-color .2s}
.cl-field:focus-within{border-color:var(--cl-ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--cl-ink) 16%,transparent)}
.cl-field>svg.lucide{width:20px;height:20px;flex:none;color:var(--cl-accent)}
.cl-field>span{display:block;flex:1;min-width:0}
.cl-field strong{display:block;margin-bottom:2px;font-size:12px;font-weight:700;color:var(--cl-ink)}
.cl-field input[type=search],.cl-field select{display:block;width:100%;height:24px;padding:0;border:0;background:transparent;color:var(--cl-ink);font-size:14px;outline:0}
.cl-field input[type=search]::placeholder{color:var(--muted)}
.cl-field-search{flex:1.4 1 240px}
.cl-filter-more{display:flex;align-items:stretch;gap:10px;flex:3 1 auto;min-width:0}
.cl-filter-more .cl-field{flex:1 1 150px}
.cl-field .select2-container{width:100%!important}
.cl-field .select2-container--default .select2-selection--single{height:24px;min-height:24px;border:0;background:transparent;box-shadow:none;outline:0}
.cl-field .select2-container--default .select2-selection--single .select2-selection__rendered{padding:0 18px 0 0;font-size:14px;line-height:24px;color:var(--cl-ink)}
.cl-field .select2-container--default .select2-selection--single .select2-selection__arrow{width:16px;right:0}
.cl-page .btn{box-shadow:none}
.cl-filter-submit{flex:none;min-height:62px;padding:0 26px;border-radius:10px;font-size:15px;gap:10px;background:var(--cl-accent);border-color:var(--cl-accent)}
.cl-filter-submit:hover{background:color-mix(in srgb,var(--cl-accent) 85%,black);border-color:color-mix(in srgb,var(--cl-accent) 85%,black);box-shadow:none}
.cl-filter-submit svg.lucide{width:18px;height:18px}
.cl-filter-toggle{display:none;flex:none;align-items:center;gap:8px;padding:0 16px;border:1px solid var(--line);border-radius:10px;background:var(--white);font-size:14px;font-weight:600;color:var(--cl-ink)}
.cl-filter-toggle svg.lucide{width:18px;height:18px;color:var(--cl-accent)}
.cl-filter-toggle span{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--cl-accent);color:var(--white);font-size:12px;font-variant-numeric:tabular-nums}

.cl-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px}
.cl-chips a{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-radius:999px;background:var(--cl-ink);color:var(--white);font-size:13px;font-weight:600;transition:opacity .2s}
.cl-chips a:hover{opacity:.88}
.cl-chips svg.lucide{width:14px;height:14px}
.cl-chips a.cl-chips-clear{background:none;padding:0 4px;color:var(--cl-ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}

.cl-section-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 24px;margin-bottom:20px}
.cl-section-head h2{font-family:var(--serif);font-size:clamp(26px,2.4vw,32px);line-height:1.1;letter-spacing:-.015em;color:var(--cl-ink)}
.cl-section-head p{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--muted)}
.cl-section-head p svg.lucide{width:17px;height:17px}

/* Popular cities: tall photo tiles, the city's best option as its picture. */
.cl-cities{margin-top:56px}
.cl-city-row{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:14px}
.cl-city{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;border-radius:14px;background:var(--cl-chip);color:var(--white)}
.cl-city img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.cl-city::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 28%,color-mix(in srgb,black 55%,transparent) 62%,color-mix(in srgb,black 82%,transparent) 100%)}
.cl-city span{position:absolute;left:14px;right:14px;bottom:14px;z-index:1;display:grid;gap:2px}
.cl-city strong{font-family:var(--serif);font-size:21px;font-weight:400;line-height:1.1}
.cl-city small{font-size:12px;color:color-mix(in srgb,var(--white) 88%,transparent)}
.cl-city:hover img{transform:scale(1.06)}

/* Results sit on a tinted field so the white cards read as objects. */
.cl-results{margin-top:56px;padding:52px 0 96px;background:var(--cl-ground)}
.cl-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.cl-card{position:relative;display:flex;flex-direction:column;min-width:0;overflow:hidden;border-radius:16px;background:var(--cl-card);box-shadow:0 1px 2px color-mix(in srgb,var(--cl-ink) 8%,transparent);transition:transform .25s ease,box-shadow .25s ease}
.cl-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px color-mix(in srgb,var(--cl-ink) 14%,transparent)}
.cl-card-media{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:var(--cl-chip)}
.cl-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.cl-card:hover .cl-card-media img{transform:scale(1.05)}
.cl-card-nophoto{display:grid;place-items:center;height:100%;color:var(--muted)}
.cl-card-nophoto svg.lucide{width:30px;height:30px}
.cl-card-badge{position:absolute;top:12px;left:12px;display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border-radius:999px;background:var(--white);color:var(--cl-ink);font-size:12px;font-weight:700}
.cl-card-badge svg.lucide{width:14px;height:14px;color:var(--cl-accent)}
.cl-card-rating{position:absolute;top:12px;right:12px;display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 10px;border-radius:999px;background:var(--cl-ink);color:var(--white);font-size:13px;font-weight:700}
.cl-card-rating svg.lucide{width:14px;height:14px;color:var(--cl-star);fill:var(--cl-star)}
.cl-card-caption{position:absolute;left:12px;bottom:12px;padding:3px 9px;border-radius:6px;background:color-mix(in srgb,black 55%,transparent);color:var(--white);font-size:12px}
.cl-card-body{display:flex;flex:1;flex-direction:column;padding:16px 18px 18px}
.cl-card-place{display:flex;align-items:center;gap:6px;font-size:13px;line-height:1.4;color:var(--muted)}
.cl-card-place svg.lucide{width:14px;height:14px;flex:none;color:var(--cl-accent)}
.cl-card-title{margin-top:6px;font-family:var(--serif);font-size:21px;line-height:1.2;letter-spacing:-.01em;color:var(--cl-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cl-card-title a::after{content:"";position:absolute;inset:0;z-index:1}
.cl-card-tags{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0;padding:0;list-style:none}
.cl-card-tags li{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border-radius:999px;background:var(--cl-chip);color:var(--cl-ink);font-size:12px;font-weight:600}
.cl-card-tags svg.lucide{width:13px;height:13px}
.cl-card-notice{margin-top:10px;font-size:13px;font-weight:600;color:var(--cl-accent)}
.cl-card-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:16px}
.cl-card-foot p{display:grid;font-size:14px;font-weight:700;color:var(--cl-ink);line-height:1.25}
.cl-card-foot small{font-size:12px;font-weight:500;color:var(--muted)}
.cl-card-go{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 15px;border-radius:999px;background:var(--cl-ink);color:var(--white);font-size:13px;font-weight:700;transition:background .2s}
.cl-card-go svg.lucide{width:15px;height:15px;transition:transform .25s}
.cl-card:hover .cl-card-go{background:var(--cl-accent)}
.cl-card:hover .cl-card-go svg.lucide{transform:translateX(3px)}
.cl-card:focus-within{outline:3px solid var(--focus);outline-offset:3px}
.cl-card-title a:focus-visible{outline:0}

/* A full-width call to action after the first two rows. */
.cl-cta{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 32px;padding:34px 38px;border-radius:18px;background:var(--cl-accent);color:var(--white)}
.cl-cta h3{font-family:var(--serif);font-size:clamp(26px,2.4vw,32px);line-height:1.1;color:var(--white)}
.cl-cta p{max-width:58ch;margin-top:8px;font-size:16px;line-height:1.5;color:color-mix(in srgb,var(--white) 92%,transparent)}
.cl-cta-actions{display:flex;flex-wrap:wrap;gap:10px}
.cl-cta .btn{min-height:48px;padding:0 22px;border-radius:999px;font-size:14px;gap:10px}
.cl-cta-primary{background:var(--white);color:var(--cl-ink);border-color:var(--white)}
.cl-cta-primary:hover{background:color-mix(in srgb,var(--white) 90%,var(--cl-ink))}
.cl-cta-secondary{background:transparent;color:var(--white);border-color:color-mix(in srgb,var(--white) 70%,transparent)}
.cl-cta-secondary:hover{background:color-mix(in srgb,var(--white) 14%,transparent)}
.cl-cta svg.lucide{width:17px;height:17px}

.cl-empty{display:flex;flex-wrap:wrap;align-items:center;gap:20px;padding:32px;border-radius:16px;background:var(--cl-card);color:var(--cl-ink)}
.cl-empty>svg.lucide{width:30px;height:30px;color:var(--cl-accent)}
.cl-empty>div{flex:1 1 260px}
.cl-empty p+p{margin-top:4px;color:var(--muted)}
.cl-empty .btn{min-height:44px;padding:0 20px;font-size:14px}

.cl-foot{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;margin-top:52px}
.cl-range{font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}
.cl-pages{display:flex;align-items:center;gap:6px}
.cl-pages a{display:inline-grid;place-items:center;min-width:44px;height:44px;padding:0 12px;border-radius:999px;background:var(--cl-card);font-size:14px;font-weight:700;color:var(--cl-ink);font-variant-numeric:tabular-nums;transition:background .2s,color .2s}
.cl-pages a:hover{background:var(--cl-chip)}
.cl-pages a[aria-current]{background:var(--cl-ink);color:var(--white)}
.cl-pages svg.lucide{width:17px;height:17px}
.cl-pages-gap{padding:0 4px;color:var(--muted)}
.cl-note{justify-self:end;display:flex;align-items:center;gap:8px;max-width:36ch;font-size:13px;line-height:1.45;color:var(--muted)}
.cl-note svg.lucide{width:16px;height:16px;flex:none}

@media(max-width:1180px){.cl-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.cl-city-row{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:170px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}}
@media(max-width:1024px){
 .cl-filter{flex-wrap:wrap}
 .cl-field-search{flex-basis:100%}
 .cl-filter-more{flex-basis:100%}
 .cl-foot{grid-template-columns:1fr;justify-items:center;text-align:center}
 .cl-note{justify-self:center}
}
@media(max-width:860px){.cl-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.cl-city-row{grid-auto-columns:160px}}
@media(min-width:1181px) and (max-width:1320px){.cl-city strong{font-size:18px}}
@media(max-width:700px){
 .cl-hero{padding:22px 0 84px}
 .cl-crumbs{margin-bottom:16px}
 .cl-hero h1{font-size:38px}
 .cl-hero-lead{font-size:15px}
 .cl-hero-stats{gap:6px 18px;margin-top:16px}
 .cl-hero-stats strong{font-size:19px}
 .cl-tabs{margin-top:20px;margin-right:-16px;padding-right:16px}
 .cl-tabs a{height:40px;padding:0 14px}
 .cl-panel-wrap{margin-top:-48px}
 .cl-filter{flex-wrap:wrap;padding:12px;gap:8px}
 .cl-field{min-height:56px}
 .cl-field-search{flex:1 1 0;flex-basis:0}
 .cl-filter-toggle{display:inline-flex}
 .cl-filter:not([data-open]) .cl-filter-toggle{display:none}
 .cl-filter:not([data-open]) .cl-field-search{flex-basis:100%}
 .cl-filter-more{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;flex-basis:100%}
 .cl-filter-submit,.cl-field-wide{grid-column:1/-1;width:100%}
 .cl-filter-submit{min-height:52px}
 .cl-filter[data-open=false] .cl-filter-more{display:none}
 .cl-cities{margin-top:40px}
 .cl-city-row{grid-auto-columns:140px;margin-right:-16px;padding-right:16px}
 .cl-results{margin-top:40px;padding:36px 0 80px}
 .cl-section-head{margin-bottom:16px}
 .cl-cta{padding:26px 22px}
 .cl-cta .btn{flex:1 1 100%}
}
@media(max-width:560px){.cl-grid{grid-template-columns:1fr;gap:18px}}
@media(prefers-reduced-motion:reduce){.cl-card:hover,.cl-card:hover .cl-card-media img,.cl-city:hover img,.cl-card:hover .cl-card-go svg.lucide{transform:none}}
