.trip-banner{isolation:isolate;aspect-ratio:27/16;border:1px solid var(--line);background:var(--night);border-radius:12px;margin-top:clamp(30px,3.4vw,46px);scroll-margin-top:110px;position:relative;overflow:hidden;box-shadow:0 30px 58px -42px #0e1f33b8}.trip-banner:after{content:"";z-index:-1;pointer-events:none;background:linear-gradient(90deg,#071f3714,#071f371f 52%,#071f3775),linear-gradient(#0000 55%,#071f372e);position:absolute;inset:0}.trip-banner-art{z-index:-2;object-fit:cover;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.trip-banner-art img{object-fit:cover;width:100%;height:100%}.trip-banner-map-ui{inset-block:0;z-index:1;width:64%;position:absolute;left:0}.trip-banner-map-label{z-index:3;color:#fff;background:#071f37ad;border:1px solid #ffffff61;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:700;position:absolute;inset-block-start:clamp(22px,3vw,38px);inset-inline-end:clamp(22px,3vw,38px);box-shadow:0 12px 28px -20px #071f37e6}.trip-banner-route{z-index:1;pointer-events:none;filter:drop-shadow(0 3px 5px #071f3759);width:100%;height:100%;position:absolute;inset:0;overflow:visible}.trip-banner-route path{fill:none;stroke:var(--terracotta);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.trip-banner-route-mobile{display:none}.trip-banner-stops{z-index:2;position:absolute;inset:0}.trip-banner-stop{color:#fff;width:max-content;min-width:92px;min-height:92px;font:inherit;cursor:pointer;background:0 0;border:0;justify-items:center;gap:7px;padding:0;display:grid;position:absolute;transform:translate(-50%,-50%)}.trip-banner-stop-media{aspect-ratio:1;background:var(--night);border:3px solid #ffffffe6;border-radius:50%;width:clamp(64px,6vw,82px);transition:border-color .22s,box-shadow .22s,transform .22s;position:relative;overflow:hidden;box-shadow:0 13px 28px -14px #071f37eb}.trip-banner-stop-media img{object-fit:cover;width:100%;height:100%}.trip-banner-stop-name{color:#fff;white-space:nowrap;background:#071f37d1;border:1px solid #ffffff3d;border-radius:999px;padding:5px 10px;font-size:13px;font-weight:750;line-height:1}.trip-banner-stop:hover .trip-banner-stop-media,.trip-banner-stop[aria-pressed=true] .trip-banner-stop-media{border-color:var(--terracotta-soft);box-shadow:0 0 0 4px var(--terracotta), 0 16px 32px -14px #071f37f2;transform:scale(1.08)}.trip-banner-stop[aria-pressed=true] .trip-banner-stop-name{background:var(--terracotta)}.trip-banner-stop:focus-visible{outline:none}.trip-banner-stop:focus-visible .trip-banner-stop-media{outline:3px solid var(--paper);outline-offset:5px}.trip-banner-panel{z-index:2;width:min(39%,460px);box-shadow:0 28px 54px -30px #071f37c7, var(--glass-edge);-webkit-backdrop-filter:blur(14px)saturate(1.18);backdrop-filter:blur(14px)saturate(1.18);background:#faf5eceb;border:1px solid #ffffffb3;border-radius:10px;flex-direction:column;padding:clamp(22px,2.5vw,34px);display:flex;position:absolute;inset-block:clamp(18px,2.4vw,30px);inset-inline-start:clamp(18px,2.4vw,30px)}.trip-banner-panel .eyebrow{margin-bottom:10px}.trip-banner-panel h3{color:var(--ink);letter-spacing:-.025em;text-wrap:balance;margin:0;font-size:clamp(29px,3vw,42px);line-height:1.12}.trip-banner-description{color:var(--ink);margin:12px 0 0;font-size:clamp(14px,1.35vw,17px);line-height:1.55}.trip-banner-city{background:var(--night);border-radius:8px;min-height:clamp(145px,16vw,205px);margin:clamp(15px,2vw,22px) 0 18px;position:relative;overflow:hidden;box-shadow:0 18px 34px -24px #071f37cc}.trip-banner-city:after{content:"";pointer-events:none;background:linear-gradient(#0000,#071f37e6);position:absolute;inset:35% 0 0}.trip-banner-city-image{object-fit:cover;width:100%;height:100%;animation:.38s both trip-banner-city-in}.trip-banner-city figcaption{z-index:1;color:#fff;gap:1px;display:grid;position:absolute;inset-block-end:14px;inset-inline:16px}.trip-banner-city figcaption span{color:var(--terracotta-soft);font-size:13px;font-weight:700}.trip-banner-city figcaption strong{font-size:20px;line-height:1.2}.trip-banner-city figcaption small{color:#ffffffd1;font-size:13px;line-height:1.45}.trip-banner-panel .button{align-self:flex-start;max-width:100%}.trip-banner-note{color:var(--muted);margin:12px 0 0;font-size:13px;line-height:1.45}@media (max-width:1080px){.trip-banner-panel{width:43%;padding:20px}.trip-banner-panel h3{font-size:clamp(27px,3.2vw,34px)}.trip-banner-city{min-height:130px;margin-block:12px}.trip-banner-note{display:none}}@media (max-width:860px){.trip-banner{aspect-ratio:auto;background:var(--paper);grid-template-columns:minmax(0,1fr);grid-template-areas:"intro""map""city""cta""note";max-width:480px;margin-inline:auto;display:grid}.trip-banner:after{display:none}.trip-banner-art{z-index:0;border-block:1px solid var(--line);grid-area:map;overflow:hidden}.trip-banner-panel{display:contents}.trip-banner-intro{grid-area:intro;min-width:0;padding:22px 20px 18px}.trip-banner-panel .eyebrow{margin-bottom:8px}.trip-banner-panel h3{font-size:clamp(28px,7.5vw,34px)}.trip-banner-description{margin-top:10px;font-size:15px}.trip-banner-city{border:1px solid var(--line);background:var(--paper);min-height:100px;box-shadow:none;grid-area:city;grid-template-columns:88px minmax(0,1fr);margin:14px 16px 0;display:grid}.trip-banner-city:after{display:none}.trip-banner-city-image{grid-area:1/1;min-height:100%}.trip-banner-city figcaption{color:var(--ink);align-content:center;gap:3px;padding:10px 12px;position:static}.trip-banner-city figcaption span{color:var(--terracotta)}.trip-banner-city figcaption small{color:var(--muted)}.trip-banner-panel .button{grid-area:cta;width:calc(100% - 32px);margin:14px 16px 0}.trip-banner-note{text-align:center;grid-area:note;margin:10px 20px 18px;display:block}.trip-banner-map-ui{aspect-ratio:1;grid-area:map;width:100%;min-width:0;height:auto;min-height:320px;position:relative;inset:auto}.trip-banner-map-label{padding:6px 10px;inset-block-start:8px;inset-inline-end:12px}.trip-banner-route-desktop{display:none}.trip-banner-route-mobile{display:block}.trip-banner-route path{stroke:var(--paper);stroke-width:2.5px;stroke-dasharray:5 7}.trip-banner-stop{gap:5px;min-width:76px;min-height:82px}.trip-banner-stop-media{width:58px}.trip-banner-stop--marrakech{top:55%!important;left:73%!important}.trip-banner-stop--fes{top:27%!important;left:73%!important}.trip-banner-stop--todra{top:83%!important;left:73%!important}.trip-banner-stop--essaouira{top:83%!important;left:28%!important}.trip-banner-stop--chefchaouen{top:27%!important;left:28%!important}.trip-banner-stop--casablanca{top:55%!important;left:28%!important}}
