:root {
  --cruise-violet: #341b47;
  --cruise-plum: #58205f;
  --cruise-pink: #c948a6;
  --cruise-lilac: #eadbf0;
  --cruise-rose: #f2dce6;
  --cruise-cream: #fff9f4;
  --cruise-ink-soft: #625768;
  --cruise-line: rgba(52, 27, 71, 0.14);
  --cruise-shadow: 0 18px 44px rgba(52, 27, 71, 0.12);
}

html { scroll-behavior: smooth; }
.cruises-page { color: var(--cruise-violet); background: #fff; }
.cruises-page .site-header { position: relative; }
.cruises-page h1,
.cruises-page h2 { font-family: "TAN Harmoni", Georgia, serif; font-weight: 400; }
.cruises-page h1,
.cruises-page h2,
.cruises-page h3,
.cruises-page p { margin-top: 0; }
.cruises-shell { width: min(100% - 56px, 1320px); margin-inline: auto; }

.cruises-hero {
  position: relative;
  min-height: clamp(500px, 40vw, 610px);
  overflow: hidden;
  isolation: isolate;
  background: #f9e9e8;
}
.cruises-hero-media,
.cruises-hero-media img,
.cruises-hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.cruises-hero-media { z-index: 0; }
.cruises-hero-media img { object-fit: cover; object-position: center; filter: saturate(1.08) contrast(1.045) brightness(1.01); }
.cruises-hero-shade {
  z-index: 1;
  background: linear-gradient(90deg, rgba(255,250,247,.97) 0%, rgba(255,246,247,.86) 28%, rgba(255,244,247,.3) 48%, transparent 64%);
}
.cruises-hero-inner { position: relative; z-index: 2; min-height: clamp(500px, 40vw, 610px); display: flex; align-items: center; }
.cruises-hero-copy { width: min(650px, 49vw); padding: 46px 0 55px; }
.cruises-eyebrow {
  margin-bottom: 12px;
  color: var(--cruise-pink);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.cruises-hero-copy > p:not(.cruises-eyebrow) {
  max-width: 590px;
  margin-bottom: 0;
  color: #50464f;
  font-size: clamp(1rem, 1.3vw, 1.16rem);
  line-height: 1.55;
}
.cruises-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 25px; }
.cruises-button {
  min-height: 49px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  padding: 0 24px;
  border: 1px solid transparent;
  border-radius: 10px;
  font-family: "Archivo ExtraCondensed", Impact, sans-serif;
  font-size: .98rem;
  font-weight: 900;
  letter-spacing: .035em;
  text-align: center;
  text-transform: uppercase;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.cruises-button:hover,
.cruises-button:focus-visible { transform: translateY(-2px); }
.cruises-button-primary { color: #fff; background: var(--cruise-violet); box-shadow: 0 11px 25px rgba(52,27,71,.2); }
.cruises-button-primary:hover { background: #542762; }
.cruises-button-secondary { color: var(--cruise-violet); border-color: rgba(52,27,71,.28); background: rgba(255,255,255,.89); }
.cruises-button-outline { min-height: 43px; color: var(--cruise-violet); border-color: rgba(52,27,71,.32); background: rgba(255,255,255,.88); }

/* Reuse the Visa hero button treatment, scoped to these two controls. */
.cruises-hero .cruises-actions { gap: 10px; }
.cruises-hero .cruises-button { min-height: 49px; padding: 0 25px; border-radius: 999px; font-family: "DM Sans", sans-serif; font-size: .88rem; font-weight: 700; letter-spacing: .04em; cursor: pointer; transition: transform 180ms ease, background 180ms ease, box-shadow 180ms ease; }
.cruises-hero .cruises-button-primary { color: #fff; background: #341b47; box-shadow: 0 10px 24px rgba(52,27,71,.19); }
.cruises-hero .cruises-button-secondary { color: #341b47; border-color: rgba(52,27,71,.24); background: rgba(255,255,255,.86); }
.cruises-hero .cruises-button-primary:hover { background: #552966; }
.cruises-hero .cruises-button-secondary:hover { background: #f7e9f0; }
.cruises-hero .cruises-button:focus-visible { outline: 3px solid rgba(201,72,166,.34); outline-offset: 3px; }
@media (max-width: 700px) {
  .cruises-hero .cruises-button { width: 100%; min-height: 48px; padding: 0 18px; }
}

.cruises-section { padding: 54px 0; }
.cruises-heading { max-width: 880px; margin: 0 auto 26px; text-align: center; }
.cruises-heading h2,
.experience-copy h2,
.financing-copy h2,
.quote-form h2,
.closing-copy h2 {
  margin-bottom: 10px;
  font-size: clamp(2.25rem, 3.7vw, 4rem);
  line-height: .96;
  letter-spacing: -.025em;
}
.cruises-heading p { margin-bottom: 0; color: var(--cruise-ink-soft); font-size: 1.02rem; line-height: 1.55; }

.cruise-lines {
  background:
    radial-gradient(circle at 8% 15%, rgba(201,72,166,.1), transparent 22%),
    radial-gradient(circle at 93% 76%, rgba(111,36,120,.1), transparent 20%),
    linear-gradient(130deg,transparent 68%,rgba(234,219,240,.32)),
    #fffaf7;
}
.cruise-lines-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.cruise-line-card {
  min-height: 300px;
  display: grid;
  grid-template-columns: .88fr 1.12fr;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid var(--cruise-line);
  border-radius: 20px;
  background: #fff;
  box-shadow: var(--cruise-shadow);
}
.cruise-line-card > img { width: 100%; height: 100%; min-height: 300px; object-fit: cover; object-position: 56% center; filter: saturate(1.06) contrast(1.025); }
.costa-card > img { object-position: 53% center; }
.cruise-line-copy { z-index: 1; display: flex; flex-direction: column; justify-content: center; padding: 25px 8px 25px 25px; }
.cruise-line-copy > p:not(.cruise-line-name) { margin-bottom: 23px; color: var(--cruise-ink-soft); font-size: .96rem; line-height: 1.48; }
.cruise-line-name { margin-bottom: 16px; width: 156px; height: 62px; }
/* Keep the supplied PNGs intact. The viewport removes only surplus canvas
   whitespace, with safe space around the complete, undistorted marks. */
.cruise-line-logo { --logo-size: 62px; position: relative; display: block; width: 100%; height: var(--logo-size); overflow: hidden; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.cruise-line-logo img { position: absolute; max-width: none; height: auto; filter: none; }
.msc-logo img { width: calc(var(--logo-size) * 3.126718); left: calc(var(--logo-size) * -.366412); top: calc(var(--logo-size) * -.470229); }
.costa-logo img { width: calc(var(--logo-size) * 4.023529); left: calc(var(--logo-size) * -1.270588); top: calc(var(--logo-size) * -.474510); }
.cruise-line-copy .cruises-button { align-self: flex-start; }

.destinations-section { position: relative; overflow: hidden; isolation: isolate; background: #efdcef; }
.destinations-bg { position: absolute; z-index: -2; inset: 0; background: linear-gradient(rgba(255,247,252,.14),rgba(240,215,238,.2)), url("assets/CRUISES-TROPICAL-BG.jpeg") center/cover no-repeat; }
.destinations-section::after { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg,rgba(255,255,255,.2),rgba(255,241,248,.08)); }
.light-heading h2 { color: var(--cruise-violet); }
.light-heading p { color: rgba(52,27,71,.8); }
.destinations-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px; }
.destination-card {
  position: relative;
  aspect-ratio: 1.9 / 1;
  overflow: hidden;
  border: 3px solid rgba(255,255,255,.9);
  border-radius: 18px;
  background: #ddd;
  box-shadow: 0 14px 30px rgba(52,27,71,.18);
}
.destination-card::after { content: ""; position: absolute; inset: 58% 0 0; background: linear-gradient(transparent,rgba(22,10,30,.5)); }
.destination-card img { width: 100%; height: 100%; object-fit: cover; filter: saturate(1.06) brightness(1.04); transition: transform .4s ease; }
.destination-card:hover img { transform: scale(1.035); }
.destination-card h3 {
  position: absolute;
  z-index: 1;
  left: 17px;
  bottom: 13px;
  margin: 0;
  color: #fff;
  font-family: "TAN Harmoni", Georgia, serif;
  font-size: clamp(1.2rem, 2vw, 1.85rem);
  font-weight: 400;
  text-shadow: 0 2px 8px rgba(0,0,0,.45);
}
.destinations-action { display: flex; justify-content: center; margin-top: 22px; }

.experience-section { padding-block: 0; background: #fff; }
.experience-layout { display: grid; grid-template-columns: 1.03fr .97fr; align-items: stretch; max-width: 1536px; margin-inline: auto; }
.experience-photo { min-height: 500px; overflow: hidden; }
.experience-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 34% center; filter: saturate(1.03) contrast(1.015); }
.experience-copy { display: flex; flex-direction: column; justify-content: center; padding: 48px clamp(32px,5vw,78px); background: linear-gradient(135deg,#fff,#fff7fb); }
.experience-copy h2 { margin-bottom: 25px; }
.benefits-grid { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 12px; }
.benefit-card {
  grid-column: span 2;
  min-height: 125px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 14px 10px;
  border: 1px solid var(--cruise-line);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(52,27,71,.07);
  text-align: center;
}
.benefit-card:nth-child(4) { grid-column: 2 / span 2; margin-left: 0; }
.benefit-card:nth-child(5) { grid-column: 4 / span 2; margin-left: 0; }
.benefit-icon { width: 34px; height: 34px; display: block; margin-bottom: 8px; fill: none; stroke: var(--cruise-plum); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.benefit-card h3 { margin: 0; font-family: "Archivo ExtraCondensed", Impact, sans-serif; font-size: 1rem; font-weight: 900; line-height: 1.04; }
.benefits-note { margin: 18px 0 0; color: var(--cruise-ink-soft); font-size: .76rem; text-align: center; }

.financing-section {
  position: relative;
  overflow: hidden;
  padding: 34px 0;
  background:
    radial-gradient(circle at 4% 90%,rgba(255,255,255,.14),transparent 25%),
    radial-gradient(circle at 82% 0,rgba(218,150,211,.22),transparent 30%),
    linear-gradient(135deg,#54215f,#341b47 62%,#6d2a72);
}
.financing-card {
  min-height: 190px;
  display: grid;
  grid-template-columns: minmax(0,1.05fr) minmax(240px,350px) minmax(220px,.65fr);
  gap: 22px;
  align-items: center;
  padding: 28px 32px;
  border: 1px solid rgba(255,255,255,.46);
  border-radius: 21px;
  background:
    radial-gradient(circle at 75% 105%,rgba(219,166,221,.38),transparent 33%),
    linear-gradient(100deg,rgba(255,255,255,.98),rgba(255,242,249,.95));
  box-shadow: 0 18px 45px rgba(16,5,23,.28);
}
.financing-asset { width: min(100%,350px); max-height: 185px; justify-self: center; object-fit: contain; filter: drop-shadow(0 16px 22px rgba(52,27,71,.18)); }
.financing-copy h2 { margin-bottom: 8px; font-size: clamp(2rem,3vw,3.2rem); }
.financing-copy > p { margin-bottom: 14px; color: var(--cruise-ink-soft); line-height: 1.5; }
.payment-highlight { display: inline-flex; align-items: center; padding: 8px 13px; border: 1px solid rgba(52,27,71,.15); border-radius: 8px; color: var(--cruise-plum); background: rgba(236,216,239,.72); font-size: .77rem; font-weight: 800; letter-spacing: .05em; }
.financing-button { color: #fff; background: var(--cruise-violet); white-space: nowrap; }

.quote-section {
  padding: 55px 0;
  background:
    radial-gradient(circle at 10% 15%,rgba(239,192,217,.32),transparent 28%),
    linear-gradient(180deg,#fff9f5,#fff);
}
.quote-layout { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; }
.quote-photo { min-height: 590px; overflow: hidden; border-radius: 26px 0 0 26px; box-shadow: var(--cruise-shadow); }
.quote-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 52% center; }
.quote-form {
  z-index: 1;
  align-self: center;
  margin-left: -14px;
  padding: clamp(28px,4vw,48px);
  border: 1px solid var(--cruise-line);
  border-radius: 24px;
  background: rgba(255,255,255,.97);
  box-shadow: 0 20px 48px rgba(52,27,71,.14);
}
.quote-form header { margin-bottom: 22px; text-align: center; }
.quote-form h2 { margin-bottom: 0; font-size: clamp(2.25rem,3.5vw,3.8rem); }
.quote-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.quote-field { display: grid; gap: 7px; }
.quote-field-wide { grid-column: 1 / -1; }
.quote-field > span { font-family: "Archivo ExtraCondensed", Impact, sans-serif; font-size: .9rem; font-weight: 900; letter-spacing: .045em; }
.quote-field input,
.quote-field select {
  width: 100%;
  min-height: 49px;
  padding: 11px 13px;
  border: 1px solid rgba(52,27,71,.18);
  border-radius: 9px;
  color: #504651;
  background: #fff;
  font: inherit;
  outline: none;
}
.quote-field input:focus,
.quote-field select:focus { border-color: var(--cruise-pink); box-shadow: 0 0 0 4px rgba(201,72,166,.11); }
.quote-consent { display: flex; gap: 10px; align-items: flex-start; margin: 18px 0; color: var(--cruise-ink-soft); font-size: .81rem; line-height: 1.4; }
.quote-consent input { width: 17px; height: 17px; flex: 0 0 auto; margin-top: 1px; accent-color: var(--cruise-violet); }
.quote-submit { width: 100%; border: 0; color: #fff; background: var(--cruise-violet); cursor: pointer; }

.closing-section { padding: 0 0 44px; background: #fff; }
.closing-card { position: relative; min-height: 365px; overflow: hidden; isolation: isolate; border-radius: 26px; box-shadow: var(--cruise-shadow); }
.closing-card > img,
.closing-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.closing-card > img { z-index: 0; object-fit: cover; object-position: center; }
.closing-shade { z-index: 1; background: linear-gradient(90deg,transparent 43%,rgba(255,249,248,.58) 57%,rgba(255,249,248,.98) 72%); }
.closing-copy { position: relative; z-index: 2; width: 47%; margin-left: auto; padding: 55px clamp(28px,4vw,58px); }
.closing-copy h2 { margin-bottom: 7px; font-size: clamp(2.25rem,3.6vw,4rem); }
.closing-copy > p { margin-bottom: 22px; color: var(--cruise-pink); font-family: "Birthstone Bounce", cursive; font-size: clamp(2rem,3.3vw,3.2rem); line-height: .85; }

@media (max-width: 1100px) {
  .cruise-line-card { grid-template-columns: .9fr 1.1fr; }
  .cruise-line-card > img { grid-column: 2; grid-row: 1; min-height: 290px; max-height: none; }
  .cruise-line-copy { grid-column: 1; grid-row: 1; padding: 22px 7px 22px 22px; }
  .experience-layout { grid-template-columns: .9fr 1.1fr; }
  .benefits-grid { grid-template-columns: repeat(6,minmax(0,1fr)); }
  .benefit-card { grid-column: span 3; }
  .benefit-card:nth-child(4) { grid-column: 1 / span 3; }
  .benefit-card:nth-child(5) { grid-column: 4 / span 3; }
}

@media (max-width: 920px) {
  .cruises-page .main-nav > a[aria-current="page"] { color: var(--cruise-pink); }
  .cruises-hero { min-height: 600px; }
  .cruises-hero-inner { min-height: 600px; align-items: flex-start; }
  .cruises-hero-media { inset: 0; height: 100%; }
  .cruises-hero-media img { object-fit: cover; object-position: 64% center; }
  .cruises-hero-shade { background: linear-gradient(180deg,rgba(255,249,247,.96) 0%,rgba(255,247,248,.87) 39%,rgba(255,247,248,.36) 59%,rgba(255,247,248,.02) 79%); }
  .cruises-hero-copy { width: min(100%, 640px); padding-top: 31px; }
  .cruise-lines-grid { gap: 14px; }
  .destinations-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .experience-layout { width: min(100% - 32px,680px); grid-template-columns: minmax(0,1fr); }
  .experience-photo { min-height: 0; border-radius: 18px; }
  .experience-photo img { display: block; width: 100%; height: auto; object-fit: contain; object-position: center; filter: none; }
  .experience-copy { min-width: 0; justify-content: flex-start; padding: 20px 0 24px; }
  .experience-copy h2 { margin-bottom: 16px; font-size: clamp(1.7rem,5.6vw,2.6rem); text-align: center; }
  .benefits-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
  .benefit-card,
  .benefit-card:nth-child(4),
  .benefit-card:nth-child(5) { grid-column: auto; margin-left: 0; min-height: 112px; padding: 14px 10px; border-radius: 14px; }
  .benefit-icon { width: 32px; height: 32px; flex-shrink: 0; margin-bottom: 8px; }
  .benefit-card h3 { min-height: 2.2em; font-size: .95rem; line-height: 1.1; }
  .benefit-card:last-child { grid-column: 1 / -1; flex-direction: row; gap: 12px; min-height: 76px; }
  .benefit-card:last-child .benefit-icon { margin-bottom: 0; }
  .benefits-note { margin: 14px 0 0; padding-inline: 6px; font-size: .8rem; line-height: 1.45; }
  .financing-card { grid-template-columns: minmax(0,1fr) minmax(190px,250px); text-align: left; }
  .financing-asset { grid-column: 2; grid-row: 1; }
  .payment-highlight { justify-content: center; }
  .financing-button { grid-column: 1 / -1; justify-self: center; }
  .quote-layout { grid-template-columns: .94fr 1.06fr; }
  .quote-photo { min-height: 620px; }
  .quote-photo img { object-position: 58% center; }
  .quote-form { margin-left: -8px; padding: 30px 24px; }
}

@media (max-width: 700px) {
  .cruises-shell { width: min(100% - 30px, 680px); }
  .cruises-section { padding: 34px 0; }
  .cruises-heading { margin-bottom: 18px; }
  .cruises-heading h2,
  .quote-form h2 { font-size: clamp(2rem,9vw,2.75rem); }
  .cruises-heading p { font-size: .94rem; }

  .cruises-hero { min-height: 590px; }
  .cruises-hero-inner { min-height: 590px; }
  .cruises-hero-media { inset: 0; height: 100%; }
  .cruises-hero-media img { object-fit: cover; object-position: 65% center; }
  .cruises-hero-shade { background: linear-gradient(180deg,rgba(255,248,246,.94) 0%,rgba(255,247,247,.84) 36%,rgba(255,247,247,.34) 55%,rgba(255,247,247,.02) 76%); }
  .cruises-hero-copy { padding: 27px 0 0; }
  .cruises-eyebrow { margin-bottom: 8px; font-size: .69rem; }



  .cruises-hero-copy > p:not(.cruises-eyebrow) { font-size: .95rem; line-height: 1.45; }
  .cruises-actions { display: grid; gap: 8px; margin-top: 16px; }
  .cruises-button { width: 100%; min-height: 47px; padding: 9px 15px; }

  .cruise-lines { padding-top: 31px; background: radial-gradient(circle at 95% 20%,rgba(201,72,166,.1),transparent 28%),linear-gradient(150deg,#fffaf7,#f9edf6); }
  .cruise-lines-grid { grid-template-columns: 1fr; gap: 12px; }
  .cruise-line-card { min-height: 0; grid-template-columns: .94fr 1.3fr; border-radius: 17px; }
  .cruise-line-card > img { grid-column: 2; grid-row: 1; min-height: 236px; max-height: 236px; object-position: 55% center; }
  .cruise-line-copy { grid-column: 1; grid-row: 1; padding: 16px 5px 16px 15px; }
  .cruise-line-name { width: 125px; height: 51px; margin-bottom: 11px; }
  .cruise-line-logo { --logo-size: 51px; }
  .cruise-line-copy > p:not(.cruise-line-name) { margin-bottom: 13px; font-size: .82rem; line-height: 1.35; }
  .cruise-line-copy .cruises-button { width: auto; min-height: 40px; padding: 7px 10px; font-size: .8rem; }

  .destinations-section { padding-top: 31px; padding-bottom: 33px; }
  .destinations-grid { gap: 8px; }
  .destination-card { aspect-ratio: 1.12 / 1; border-width: 2px; border-radius: 14px; }
  .destination-card h3 { left: 10px; bottom: 9px; font-size: clamp(.98rem,4.4vw,1.3rem); }
  .destinations-action { margin-top: 16px; }

  .benefit-card h3 { font-size: .9rem; }

  .financing-section { padding: 23px 0; }
  .financing-card { min-height: 0; grid-template-columns: 1fr; gap: 12px; padding: 22px 18px; border-radius: 18px; text-align: center; }
  .financing-asset { grid-column: 1; grid-row: auto; width: min(78%,280px); max-height: 170px; }
  .financing-copy h2 { font-size: 2.2rem; }
  .financing-copy > p { font-size: .92rem; }
  .payment-highlight { font-size: .69rem; }

  .quote-section { padding: 31px 0; }
  .quote-layout { width: min(100% - 30px,680px); grid-template-columns: 1fr; }
  .quote-photo { min-height: 410px; border-radius: 20px 20px 0 0; }
  .quote-photo img { object-position: 57% center; }
  .quote-form { margin: -14px 0 0; padding: 23px 17px; border-radius: 20px; }
  .quote-form header { margin-bottom: 17px; }
  .quote-fields { grid-template-columns: 1fr; gap: 12px; }
  .quote-field-wide { grid-column: auto; }
  .quote-consent { margin: 15px 0; }

  .closing-section { padding-bottom: 30px; }
  .closing-card { min-height: 500px; display: flex; align-items: flex-end; border-radius: 20px; background: #f3d9df; }
  .closing-card > img { object-position: 36% center; }
  .closing-shade { background: linear-gradient(180deg,transparent 38%,rgba(255,249,248,.48) 58%,rgba(255,249,248,.97) 77%); }
  .closing-copy { width: 100%; margin: 0; padding: 25px 19px 28px; text-align: center; }
  .closing-copy h2 { font-size: 2.45rem; }
  .closing-copy > p { margin-bottom: 18px; font-size: 2.35rem; }
}

@media (max-width: 390px) {
  .cruises-hero { min-height: 580px; }
  .cruises-hero-inner { min-height: 580px; }
  .cruise-line-card { grid-template-columns: 1fr; }
  .cruise-line-card > img { grid-column: 1; grid-row: 1; min-height: 205px; }
  .cruise-line-copy { grid-column: 1; grid-row: 2; padding: 17px; }
  .cruise-line-copy .cruises-button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .cruises-button,
  .destination-card img { transition: none; }
}
