/* ======================================================================
   Morocco Planet skin (v1.5.0) - loads after tours.css.
   Restyles the homepage rails ([tour_rows], [tour_grid layout="carousel"]), the tour cards and the Tours page:
   white + zellij pattern, full-bleed photos, pill tabs, Bricolage Grotesque + Figtree.
   The single tour page is not touched. Delete this file and its enqueue lines in tour-listings.php to go back to the old look.
   ====================================================================== */
.tl-rails,.tl-archive,.tl-grid,.tl-tile{
	--mp-ink:#1c1512;--mp-text:#4d3f36;--mp-muted:#5a4a3f;--mp-brand:#d94600;--mp-brand-d:#b83b00;--mp-gold:#e8a33d;--mp-sand:#f1e4d3;--mp-bg:#ffffff;--mp-ring:rgba(28,21,18,.08);
	--mp-head:'Bricolage Grotesque',system-ui,sans-serif;--mp-body:'Figtree',system-ui,sans-serif;
	--mp-sky:linear-gradient(180deg,#2a1248,#b8465c 55%,#f7b267);
	--mp-zellij:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23d94600' stroke-opacity='.10' stroke-width='1.2'%3E%3Crect x='14' y='14' width='36' height='36'/%3E%3Crect x='14' y='14' width='36' height='36' transform='rotate(45 32 32)'/%3E%3Ccircle cx='32' cy='32' r='6'/%3E%3C/g%3E%3C/svg%3E");
	--tl-star:#e8a33d;
}

/* ---------- Full-bleed white background (homepage rails + Tours page) ---------- */
.tl-rails,.tl-archive{position:relative;isolation:isolate;font-family:var(--mp-body);color:var(--mp-text)}
.tl-rails{padding-top:96px;padding-bottom:96px}
.tl-archive{padding:40px 0 96px}
.tl-rails::before,.tl-rails::after,.tl-archive::before,.tl-archive::after{content:"";position:absolute;z-index:-2;top:0;bottom:0;left:50%;width:100vw;margin-left:-50vw;pointer-events:none}
.tl-rails::before,.tl-archive::before{background:var(--mp-bg)}
.tl-rails::after,.tl-archive::after{z-index:-1;background:var(--mp-zellij);-webkit-mask-image:linear-gradient(100deg,#000 0%,transparent 50%);mask-image:linear-gradient(100deg,#000 0%,transparent 50%)}
body:has(.tl-rails),body:has(.tl-archive){overflow-x:clip}
.tl-rails{gap:64px}

/* ---------- Heading ---------- */
.tl-rails-head{text-align:left;max-width:none;margin:0 0 -28px}
.tl-rails-head h2,.tl-archive-head h1{font-family:var(--mp-head);font-weight:800;line-height:1.02;letter-spacing:-.04em;color:var(--mp-ink);text-wrap:balance}
.tl-rails-head h2{font-size:clamp(2.1rem,4.2vw,3.6rem);max-width:22ch;margin:0 0 18px}
.tl-rails-head p{font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.65;color:var(--mp-muted);max-width:52ch;margin:0}
.tl-eyebrow{display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 12px;margin-bottom:22px;background:#fff;border-radius:999px;box-shadow:0 0 0 1px var(--mp-ring),0 6px 18px -8px rgba(28,21,18,.25);
	font-weight:700;font-size:14px;letter-spacing:.02em;text-transform:none;color:var(--mp-ink)}
.tl-eyebrow .tl-icon{display:none}
.tl-eyebrow::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--mp-brand);box-shadow:0 0 0 5px rgba(217,70,0,.18)}
.tl-rails .tl-h2{font-family:var(--mp-head);font-weight:800;font-size:clamp(1.6rem,2.6vw,2.2rem);letter-spacing:-.03em;color:var(--mp-ink)}
.tl-rails .tl-h2 .tl-icon{color:var(--mp-brand)}
.tl-rails .tl-h2::after{background:var(--mp-ring)}

/* ---------- Tabs: the nav pill ---------- */
.tl-tabs{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:2px;width:fit-content;max-width:100%;margin:0 0 -8px;padding:6px;
	background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:16px;box-shadow:0 0 0 1px var(--mp-ring)}
.tl-tabs-sep{display:none}
.tl-tab{margin:0;padding:9px 16px;border-radius:11px;font-family:var(--mp-body);font-weight:600;font-size:15.5px;color:var(--mp-ink);transition:background .2s,color .2s,box-shadow .2s}
.tl-tab:hover{background:var(--mp-sand)}
.tl-tab.is-active{background:var(--mp-brand);color:#fff;box-shadow:0 8px 18px -8px rgba(217,70,0,.6)}
.tl-tab:focus-visible,.tl-rail-btn:focus-visible,.tl-rail-all:focus-visible,.tl-chips a:focus-visible{outline:3px solid var(--mp-ink);outline-offset:3px}

/* ---------- Tour card: full-bleed photo, whole card clickable ---------- */
.tl-tile{padding:0;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--mp-ring),0 18px 36px -24px rgba(40,18,6,.4);transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.tl-tile:hover{transform:translateY(-4px);box-shadow:0 0 0 1px rgba(217,70,0,.35),0 28px 44px -24px rgba(40,18,6,.5)}
.tl-tile-media{border-radius:0;background:var(--mp-sky)}
.tl-tile-media::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(15,8,4,.32) 0%,rgba(15,8,4,0) 38%)}
a.tl-tile-img{display:block;aspect-ratio:4/3.5;background:transparent;text-decoration:none}
.tl-tile-cat,.tl-tile-badge{position:absolute;top:14px;z-index:3;pointer-events:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
	padding:6px 14px;border-radius:999px;font-family:var(--mp-body);font-style:normal;font-size:11.5px;font-weight:700;letter-spacing:.08em;line-height:1.3;text-transform:uppercase;box-shadow:0 6px 16px -8px rgba(28,21,18,.4)}
.tl-tile-cat{left:14px;right:auto;transform:none;max-width:calc(100% - 28px);background:#fff;color:var(--mp-ink);-webkit-backdrop-filter:none;backdrop-filter:none}
.tl-tile-badge{left:auto;right:14px;bottom:auto;transform:none;max-width:45%;background:var(--mp-brand);color:#fff}
.tl-tile-media:has(.tl-tile-badge) .tl-tile-cat{max-width:calc(55% - 14px)}
.tl-heart{top:auto;bottom:14px;right:14px;width:40px;height:40px;border-radius:12px;background:#fff;color:var(--mp-ink);filter:none;box-shadow:0 8px 18px -8px rgba(28,21,18,.5);z-index:4;transition:transform .2s,background .2s,color .2s}
.tl-heart:hover{transform:translateY(-2px);background:var(--mp-brand);color:#fff}
.tl-heart.is-on{background:var(--mp-brand);color:#fff}
.tl-tile-body{position:static;margin-top:0;padding:20px 20px 18px;background:transparent;border-radius:0}
.tl-tile-top{margin-bottom:10px;font-family:var(--mp-body);font-size:14px;font-weight:600;color:var(--mp-muted)}
.tl-tile-top .tl-icon{color:var(--mp-brand)}
.tl-tile h3{margin:0 0 10px;font-family:var(--mp-head);font-weight:800;font-size:1.35rem;line-height:1.14;letter-spacing:-.02em;color:var(--mp-ink)}
.tl-tile h3 a:hover{color:var(--mp-brand)}
.tl-tile-sub{margin:0 0 16px;padding:0;min-height:0;font-family:var(--mp-body);font-style:normal;font-size:.98rem;line-height:1.55;color:var(--mp-muted)}
.tl-tile-price{min-height:0;margin-bottom:12px;font-size:15px;color:var(--mp-muted)}
.tl-tile-price strong{margin-left:4px;font-family:var(--mp-head);font-weight:800;font-size:1.25rem;letter-spacing:-.02em;color:var(--mp-brand)}
.tl-tile-price s{color:#8a7a6e}
.tl-tile-sep{background:rgba(28,21,18,.18)}
.tl-tile-rate{margin-top:auto;font-size:14px;font-weight:600;color:var(--mp-muted)}
.tl-tile-rate .tl-stars-bg{color:rgba(28,21,18,.15)}
.tl-tile-mark{right:14px;bottom:14px;width:40px;height:40px;border-radius:12px;background:var(--mp-sand);color:var(--mp-ink);box-shadow:none;transition:background .2s,color .2s}
.tl-tile:hover .tl-tile-mark{background:var(--mp-brand);color:#fff}

/* ---------- Rail controls ---------- */
.tl-rail{--tl-btn-top:130px}
.tl-rail-btn{width:52px;height:52px;border-radius:16px;background:rgba(255,255,255,.9);color:var(--mp-ink);box-shadow:0 0 0 1px var(--mp-ring),0 10px 24px -10px rgba(28,21,18,.4)}
.tl-rail-btn:hover{background:var(--mp-brand);color:#fff;transform:translateY(-2px);box-shadow:0 12px 24px -8px rgba(217,70,0,.55)}
.tl-rail-all{padding:10px 18px;border-radius:999px;background:var(--mp-sand);color:var(--mp-ink);font-weight:700;font-size:15px;transition:background .2s,color .2s}
.tl-rail-all:hover{background:var(--mp-brand);color:#fff;text-decoration:none}
.tl-dots{gap:8px}
.tl-dots button{width:32px;height:3px;padding:10px 0;margin:-10px 0;box-sizing:content-box;border-radius:0;background:rgba(28,21,18,.16);background-clip:content-box}
.tl-dots button.is-active{background:var(--mp-brand);background-clip:content-box}

/* ---------- Tours page ---------- */
.tl-archive-head h1{font-size:clamp(2.5rem,6vw,4.6rem);margin:22px 0 18px}
.tl-archive-intro{font-size:clamp(1.05rem,1.4vw,1.2rem);color:var(--mp-muted)}
.tl-chips a,.tl-archive .page-numbers{border:0;background:rgba(255,255,255,.8);box-shadow:0 0 0 1px var(--mp-ring);color:var(--mp-muted)}
.tl-chips a:hover,.tl-archive .page-numbers:hover:not(.current){box-shadow:0 0 0 1px var(--mp-ink);color:var(--mp-ink)}
.tl-chips a.is-active,.tl-archive .page-numbers.current{background:var(--mp-brand);box-shadow:0 8px 18px -8px rgba(217,70,0,.6);color:#fff}
.tl-empty{color:var(--mp-muted)}

/* ---------- Responsive ---------- */
@media (max-width:820px){.tl-rails{padding-top:72px;padding-bottom:72px}}
@media (max-width:560px){
	.tl-rails{padding-top:56px;padding-bottom:56px;gap:36px}
	.tl-archive{padding:24px 0 64px}
	.tl-tabs{width:auto;border-radius:16px;margin-left:0;margin-right:0;padding:6px;justify-content:flex-start}
	.tl-tile h3{font-size:1.3rem}
}
@media (prefers-reduced-motion:reduce){.tl-tile,.tl-tab,.tl-heart,.tl-rail-btn,.tl-tile-mark{transition:none!important}}