/* Current Now Journey image-led hero treatment for Mediterranean journeys. */

.med-cinematic-hero__identifier,
.nj-tour--med-image-led .nj-cinematic-hero__identifier {
  position:absolute;
  top:112px;
  right:clamp(18px,2.2vw,34px);
  z-index:5;
  display:flex;
  align-items:center;
  gap:18px;
  color:#fff;
  pointer-events:none;
}

.med-cinematic-hero__identifier-label,
.nj-tour--med-image-led .nj-cinematic-hero__identifier-label {
  color:#e5b653;
  font-family:"DM Sans",Arial,sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.22em;
  line-height:1;
  text-transform:uppercase;
  writing-mode:vertical-rl;
}

.med-cinematic-hero__identifier-title,
.nj-tour--med-image-led .nj-cinematic-hero__identifier-title {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.med-cinematic-hero__cue,
.nj-tour--med-image-led .nj-cinematic-hero__cue {
  display:grid;
  width:58px;
  height:58px;
  margin-top:265px;
  border:1px solid rgba(255,255,255,.86);
  border-radius:50%;
  place-items:center;
  color:#fff;
  font-family:Arial,sans-serif;
  font-size:30px;
  font-weight:300;
  line-height:1;
}

html body .nj-tour.nj-tour--med-image-led .nj-hero {
  position:relative;
  min-height:810px !important;
  height:min(95vh,960px) !important;
  overflow:hidden;
  background-color:#143f49 !important;
  background-image:var(--med-hero-image) !important;
  background-position:var(--med-hero-position,center center) !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
}

html body .nj-tour.nj-tour--med-image-led .nj-hero::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(90deg,rgba(3,24,31,.68) 0%,rgba(3,24,31,.32) 34%,rgba(3,24,31,.06) 66%,transparent 100%),
    linear-gradient(0deg,rgba(3,24,31,.52) 0%,transparent 50%,rgba(3,24,31,.16) 100%) !important;
  pointer-events:none;
}

html body .nj-tour.nj-tour--med-image-led .nj-hero__content {
  position:relative;
  z-index:2;
  display:flex;
  width:100%;
  min-height:100%;
  align-items:flex-end;
  padding:0 0 clamp(44px,5.5vh,66px) !important;
}

html body .nj-tour.nj-tour--med-image-led .nj-hero__inner {
  display:block !important;
  width:100%;
  max-width:740px !important;
}

html body .nj-tour.nj-tour--med-image-led .nj-hero h1 {
  max-width:730px !important;
  margin:0 0 10px !important;
  font-size:clamp(52px,5vw,74px) !important;
  letter-spacing:-.045em !important;
  line-height:.98 !important;
}

html body .nj-tour.nj-tour--med-image-led .nj-hero__subhead {
  max-width:670px !important;
  margin:0 0 12px !important;
  font-size:clamp(18px,1.42vw,22px) !important;
  line-height:1.45 !important;
}

html body .nj-tour.nj-tour--med-image-led .nj-hero__route,
html body .nj-tour.nj-tour--med-image-led .nj-hero__route-line {
  max-width:680px;
  margin:0 0 8px !important;
  color:rgba(255,255,255,.84);
  font-size:13px;
  font-weight:700;
  letter-spacing:.04em;
}

html body .nj-tour.nj-tour--med-image-led .nj-hero .nj-trust,
html body .nj-tour.nj-tour--med-image-led .nj-hero-facts,
html body .nj-tour.nj-tour--med-image-led .nj-hero__tripadvisor-proof {
  display:none !important;
}

html body .nj-tour.nj-tour--med-image-led .nj-hero__actions,
html body .nj-tour.nj-tour--med-image-led .nj-hero .nj-quick-bubbles,
html body .nj-tour.nj-tour--med-image-led .nj-hero .nj-actions {
  margin-top:18px;
}

.nj-tour--med-adriatic { --med-hero-image:url('/tours/mediterranean/Croatia/images/dubrovnik-601941-pb-1600.webp'); --med-hero-mobile-image:url('/tours/mediterranean/Croatia/images/dubrovnik-601941-pb-960.webp'); --med-hero-position:50% 48%; --med-hero-mobile-position:50% top; }
.nj-tour--med-treasures { --med-hero-image:url('/tours/mediterranean/9-days-treasures-of-mediterranean/images/north-sardinia-coast.jpg'); --med-hero-mobile-image:url('/tours/mediterranean/9-days-treasures-of-mediterranean/images/north-sardinia-coast-mobile.jpg'); --med-hero-position:50% 48%; --med-hero-mobile-position:50% top; }
.nj-tour--med-greece-italy { --med-hero-image:url('/tours/mediterranean/greece-italy/images/ss_1259946742-2560-santorini-greece.jpg'); --med-hero-position:62% 48%; --med-hero-mobile-position:64% top; }
.nj-tour--med-greeceol { --med-hero-image:url('/tours/mediterranean/GreeceOL/images/hero/greece-santorini-hero-v2.webp'); --med-hero-position:58% 48%; --med-hero-mobile-position:62% top; }
.nj-tour--med-croatia { --med-hero-image:url('/tours/mediterranean/Croatia/images/dubrovnik-601941-pb-1600.webp'); --med-hero-mobile-image:url('/tours/mediterranean/Croatia/images/dubrovnik-601941-pb-960.webp'); --med-hero-position:50% 48%; --med-hero-mobile-position:50% top; }
.nj-tour--med-secret-greece { --med-hero-image:url('/images/corfu-hero_1600.jpg'); --med-hero-position:50% 50%; --med-hero-mobile-position:52% top; }

@media (max-width:767px) {
  html:has(.nj-tour--med-greeceol),
  body:has(.nj-tour--med-greeceol) {
    overflow-x:clip;
  }

  html body .nj-tour.nj-tour--med-image-led .nj-hero {
    --med-hero-intro:clamp(545px,calc(100svh - 72px),690px);
    --med-hero-stage:calc(var(--med-hero-intro) + 465px);
    display:block !important;
    min-height:var(--med-hero-stage) !important;
    height:auto !important;
    padding-top:var(--med-hero-intro) !important;
    background:#052d37 !important;
  }

  html body .nj-tour.nj-tour--med-image-led .nj-hero::before {
    content:"";
    position:absolute;
    inset:0 0 auto;
    z-index:0;
    display:block;
    height:var(--med-hero-stage);
    background-color:#143f49;
    background-image:var(--med-hero-mobile-image,var(--med-hero-image)) !important;
    background-position:var(--med-hero-mobile-position,center top) !important;
    background-repeat:no-repeat !important;
    background-size:auto var(--med-hero-intro) !important;
  }

  html body .nj-tour.nj-tour--med-image-led .nj-hero::after {
    inset:0 0 auto;
    height:var(--med-hero-stage);
    background:linear-gradient(180deg,rgba(3,24,31,.04) 0%,rgba(3,24,31,.06) 56%,rgba(5,45,55,.94) var(--med-hero-intro),#052d37 calc(var(--med-hero-intro) + 100px)) !important;
  }

  .med-cinematic-hero__identifier,
  .nj-tour--med-image-led .nj-cinematic-hero__identifier {
    top:calc(var(--med-hero-intro) - 106px);
    right:20px;
    left:20px;
    z-index:4;
    min-height:62px;
    justify-content:flex-start;
    gap:12px;
    border-top:1px solid rgba(255,255,255,.52);
    border-bottom:1px solid rgba(255,255,255,.28);
  }

  .med-cinematic-hero__identifier-label,
  .nj-tour--med-image-led .nj-cinematic-hero__identifier-label {
    font-size:10px;
    letter-spacing:.16em;
    writing-mode:horizontal-tb;
  }

  .med-cinematic-hero__identifier-title,
  .nj-tour--med-image-led .nj-cinematic-hero__identifier-title {
    position:static;
    width:auto;
    height:auto;
    padding:0;
    margin:0;
    overflow:visible;
    clip:auto;
    color:#fff;
    font-family:"Playfair Display",Georgia,serif;
    font-size:18px;
    font-weight:600;
    letter-spacing:-.01em;
    line-height:1.05;
    white-space:normal;
  }

  .med-cinematic-hero__cue,
  .nj-tour--med-image-led .nj-cinematic-hero__cue {
    width:42px;
    height:42px;
    margin:0 0 0 auto;
    flex:0 0 42px;
    font-size:22px;
  }

  html body .nj-tour.nj-tour--med-image-led .nj-hero__content {
    display:block;
    min-height:0;
    padding:30px 0 36px !important;
  }

  html body .nj-tour.nj-tour--med-image-led .nj-hero__inner {
    max-width:none !important;
  }

  html body .nj-tour.nj-tour--med-image-led .nj-hero .nj-eyebrow,
  html body .nj-tour.nj-tour--med-image-led .nj-hero h1 {
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px !important;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
  }

  html body .nj-tour.nj-tour--med-image-led .nj-hero__subhead {
    max-width:none !important;
    margin:0 0 14px !important;
    color:#fff;
    font-family:"Playfair Display",Georgia,serif;
    font-size:clamp(25px,7vw,31px) !important;
    font-weight:500;
    line-height:1.15 !important;
  }

  html body .nj-tour.nj-tour--med-image-led .nj-cinematic-hero__statement {
    margin:0 0 11px;
    color:rgba(255,255,255,.84);
    font-size:15px;
    line-height:1.5;
  }

  html body .nj-tour.nj-tour--med-image-led .nj-hero__route,
  html body .nj-tour.nj-tour--med-image-led .nj-hero__route-line {
    margin:0 0 10px !important;
    color:rgba(255,255,255,.82);
    font-size:12px;
    letter-spacing:.08em;
    line-height:1.55;
    text-transform:uppercase;
  }

  html body .nj-tour.nj-tour--med-image-led .nj-hero .nj-actions,
  html body .nj-tour.nj-tour--med-image-led .nj-hero .nj-quick-bubbles {
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin-top:20px;
  }

  html body .nj-tour.nj-tour--med-image-led .nj-hero .nj-button {
    min-height:48px;
    justify-content:center;
  }
}

@media (min-width:768px) and (max-width:1100px) {
  .med-cinematic-hero__identifier,
  .nj-tour--med-image-led .nj-cinematic-hero__identifier { right:18px; }
  html body .nj-tour.nj-tour--med-image-led .nj-hero__inner { max-width:650px !important; }
}