.comparison-page { background: var(--color-atlantic-navy); }
.comparison-page__hero { position: relative; min-height: 40.625rem; display: grid; overflow: hidden; background: var(--color-atlantic-navy); }
.comparison-page__hero-media, .comparison-page__hero-inner { grid-area: 1 / 1; }
.comparison-page__hero-media { width: 100%; height: 100%; }
.comparison-page__hero-media::after { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,26,43,.96) 0%, rgba(7,26,43,.84) 40%, rgba(13,57,64,.2) 72%, rgba(7,26,43,.28) 100%); content: ""; }
.comparison-page__hero-media img { width: 100%; height: 100%; object-fit: cover; object-position: 72% center; }
.comparison-page__hero-inner { position: relative; z-index: 1; display: flex; align-items: end; width: min(100%, var(--container-max)); min-width: 0; margin-inline: auto; padding: var(--space-8) var(--container-padding); }
.comparison-page__hero-panel { display: flex; width: min(100%, 42.5rem); min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-7); }
.comparison-page__hero-panel h1, .comparison-page__hero-panel p { margin: 0; }
.comparison-page__hero-lead { max-width: 39rem; font-size: var(--text-lead); line-height: var(--line-lead); }
.comparison-page__hero-actions { display: flex; width: 100%; min-width: 0; flex-wrap: wrap; gap: var(--space-3); }
.comparison-page__hero-actions > * { min-width: 0; }
.comparison-page__hero-actions .button-primary { gap: var(--space-2); }
.comparison-page__lead { font-size: var(--text-lead); line-height: var(--line-lead); }
.comparison-page__criteria-intro { width: min(100%, 45rem); }
.comparison-page__criteria-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-7); }
.comparison-page__criterion { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-3); padding: var(--space-5); border: 1px solid var(--color-steel-border); border-radius: var(--radius-card); background: rgba(5,18,29,.3); }
.comparison-page__criterion > * { min-width: 0; margin: 0; }
.comparison-page__criterion--space { grid-column: 1 / span 3; }
.comparison-page__criterion--cabin { grid-column: 4 / span 4; }
.comparison-page__criterion--dining { grid-column: 8 / span 5; }
.comparison-page__criterion--activities { grid-column: 1 / span 7; }
.comparison-page__criterion--casino { grid-column: 8 / span 5; background: var(--color-burgundy-wine); }
.comparison-page__criterion a, .comparison-page__modules a, .comparison-page__timeline a { min-height: 2.75rem; display: inline-flex; align-items: center; }
.comparison-page__profiles-intro { width: min(100%, 42.5rem); }
.comparison-page__profiles-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-7); align-items: start; }
.comparison-page__profile { min-width: 0; }
.comparison-page__profile--city { grid-column: 1 / span 5; }
.comparison-page__profile--ocean { grid-column: 6 / span 3; }
.comparison-page__profile--cabin { grid-column: 9 / span 4; }
.comparison-page__profile--evening { grid-column: 1 / span 5; background: var(--color-burgundy-wine); }
.comparison-page__profile .card__content { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.comparison-page__profile .card__content > * { min-width: 0; margin: 0; }
.comparison-page__profile .media-frame { width: 100%; }
.comparison-page__profile--city .media-frame img { aspect-ratio: 4 / 3; }
.comparison-page__profile--cabin .media-frame img { aspect-ratio: 3 / 4; }
.comparison-page__tradeoff { padding-top: var(--space-3); border-top: 1px solid var(--color-steel-border); color: var(--color-pearl-mist); font-size: var(--text-small); line-height: var(--line-small); }
.comparison-page__profile-links { display: flex; min-width: 0; flex-wrap: wrap; gap: var(--space-3); }
.comparison-page__table-section .deck-marker, .comparison-page__table-section .technical-label { color: rgba(7,26,43,.68); }
.comparison-page__table-section .deck-marker::before, .comparison-page__table-section .technical-label::before { background: var(--color-sunset-copper); }
.comparison-page__table-intro { width: min(100%, 47.5rem); }
.comparison-page__scroll-hint { display: none; margin-top: var(--space-5); color: rgba(7,26,43,.72); font-size: var(--text-small); font-weight: var(--weight-semibold); }
.comparison-page__table-rail { width: 100%; min-width: 0; margin-top: var(--space-5); }
.comparison-page__table { table-layout: fixed; color: var(--color-atlantic-navy); }
.comparison-page__table th, .comparison-page__table td { color: rgba(7,26,43,.84); line-height: var(--line-small); }
.comparison-page__table thead th { color: var(--color-atlantic-navy); }
.comparison-page__table th:first-child { width: 23%; }
.comparison-page__table th:not(:first-child), .comparison-page__table td { width: 19.25%; }
.comparison-page__table tbody th { font-family: var(--font-heading); font-size: var(--text-lead); }
.comparison-page__table tbody th a { color: var(--color-atlantic-navy); }
.comparison-page__evening-cell { background: rgba(13,57,64,.08); }
.comparison-page__casino-cell { background: rgba(84,37,53,.12); }
.comparison-page__cabins-layout, .comparison-page__dining-layout, .comparison-page__day-layout { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-7); align-items: start; }
.comparison-page__cabins-layout > *, .comparison-page__dining-layout > *, .comparison-page__day-layout > * { min-width: 0; width: 100%; }
.comparison-page__cabins-media img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: center; }
.comparison-page__cabins-copy { display: flex; width: min(100%, 35.625rem); min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.comparison-page__cabins-copy > * { min-width: 0; margin: 0; }
.comparison-page__numbered-copy { display: flex; min-width: 0; flex-direction: column; gap: var(--space-5); }
.comparison-page__numbered-copy section { min-width: 0; }
.comparison-page__numbered-copy section > :last-child { margin-bottom: 0; }
.comparison-page__numbered-copy span { color: var(--color-copper-light); font-family: var(--font-mono); font-size: var(--text-micro); letter-spacing: var(--tracking-technical); }
.comparison-page__dining-layout { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.comparison-page__dining-copy { display: flex; width: min(100%, 33.125rem); min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.comparison-page__dining-copy > * { min-width: 0; margin: 0; }
.comparison-page__modules { display: flex; min-width: 0; flex-direction: column; gap: var(--space-5); }
.comparison-page__modules section { min-width: 0; padding-bottom: var(--space-5); border-bottom: 1px solid var(--color-steel-border); }
.comparison-page__modules section:last-child { padding-bottom: 0; border-bottom: 0; }
.comparison-page__dining-media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: center; }
.comparison-page__casino h2 { width: min(100%, 42.5rem); }
.comparison-page__casino-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-7); align-items: start; }
.comparison-page__casino-grid > * { min-width: 0; }
.comparison-page__casino-main { width: min(100%, 38.75rem); }
.comparison-page__casino-side { width: min(100%, 27.5rem); }
.comparison-page__responsible { display: flex; width: min(100%, 38.75rem); min-width: 0; flex-direction: column; gap: var(--space-3); margin-top: var(--space-6); padding: var(--space-5); border: 1px solid var(--color-steel-border); border-radius: var(--radius-card); background: var(--color-deep-teal); }
.comparison-page__responsible > * { margin: 0; }
.comparison-page__day-copy { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.comparison-page__day-copy > * { min-width: 0; margin: 0; }
.comparison-page__timeline { display: flex; width: min(100%, 31.25rem); min-width: 0; flex-direction: column; gap: var(--space-5); }
.comparison-page__timeline section { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: var(--space-4); min-width: 0; padding-left: var(--space-4); border-left: 1px solid var(--color-steel-border); }
.comparison-page__timeline section > * { min-width: 0; }
.comparison-page__timeline time { color: var(--color-copper-light); font-family: var(--font-mono); font-size: var(--text-small); font-variant-numeric: tabular-nums; letter-spacing: var(--tracking-technical); }
.comparison-page__timeline section:last-child { border-left-color: var(--color-sunset-copper); }
.comparison-page__day-media { position: sticky; top: var(--space-7); }
.comparison-page__day-media img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: center; }
.comparison-page__checklist-intro { width: min(100%, 40.625rem); }
.comparison-page__checklist-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5) var(--space-7); margin-top: var(--space-7); padding: 0; list-style: none; }
.comparison-page__checklist-grid > li { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: var(--space-3); min-width: 0; padding-top: var(--space-4); border-top: 1px solid var(--color-steel-border); }
.comparison-page__checklist-grid > li:nth-child(5) { grid-column: 1 / span 2; width: calc(50% - var(--space-7) / 2); }
.comparison-page__checklist-grid > li > * { min-width: 0; }
.comparison-page__checklist-grid > li > span { color: var(--color-copper-light); font-family: var(--font-mono); font-size: var(--text-small); letter-spacing: var(--tracking-technical); }
.comparison-page__checklist-grid h3 { margin-bottom: var(--space-2); }
.comparison-page__checklist-grid p { margin-bottom: 0; }
.comparison-page__verification { display: flex; width: min(100%, 42.5rem); min-width: 0; flex-direction: column; gap: var(--space-3); margin-top: var(--space-7); }
.comparison-page__verification > * { margin: 0; }
.comparison-page__next-intro { width: min(100%, 38.75rem); margin-inline: auto; text-align: center; }
.comparison-page__next-intro .deck-marker { justify-content: center; }
.comparison-page__next-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-7); }
.comparison-page__next-card { display: flex; min-width: 0; min-height: 17rem; flex-direction: column; align-items: flex-start; gap: var(--space-3); padding: var(--space-5); border: 1px solid var(--color-steel-border); border-radius: var(--radius-card); color: var(--color-warm-pearl); text-decoration: none; }
.comparison-page__next-card > * { min-width: 0; margin: 0; }
.comparison-page__next-card > span:last-child { margin-top: auto; color: var(--color-copper-light); font-weight: var(--weight-semibold); }
.comparison-page__next-card:hover { border-color: var(--color-copper-border); color: var(--color-warm-pearl); }
.comparison-page__next-card--primary { border-color: var(--color-sunset-copper); background: var(--color-sunset-copper); color: var(--color-atlantic-navy); }
.comparison-page__next-card--primary :is(h3, p, .technical-label, span:last-child) { color: var(--color-atlantic-navy); }
.comparison-page__next-card--primary .technical-label::before { background: var(--color-atlantic-navy); }
.comparison-page__next-card--primary:hover { border-color: var(--color-copper-light); background: var(--color-copper-light); color: var(--color-atlantic-navy); }
@media (max-width: 1119px) { .comparison-page__criteria-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .comparison-page__criterion--space, .comparison-page__criterion--cabin, .comparison-page__criterion--dining, .comparison-page__criterion--activities, .comparison-page__criterion--casino { grid-column: auto; } .comparison-page__profiles-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .comparison-page__profile--city, .comparison-page__profile--ocean, .comparison-page__profile--cabin, .comparison-page__profile--evening { grid-column: auto; } }
@media (max-width: 1039px) { .comparison-page__scroll-hint { display: block; } .comparison-page__table-rail { overflow-x: auto; overscroll-behavior-x: contain; border: 1px solid rgba(7,26,43,.18); } .comparison-page__table { min-width: 65rem; } .comparison-page__table th:first-child { position: sticky; z-index: 2; left: 0; background: var(--color-warm-pearl); box-shadow: 1px 0 0 rgba(7,26,43,.16); } .comparison-page__table thead th:first-child { z-index: 3; } }
@media (max-width: 979px) { .comparison-page__hero { display: flex; min-height: 0; flex-direction: column; } .comparison-page__hero-media { height: 19rem; } .comparison-page__hero-media::after { background: linear-gradient(180deg, rgba(7,26,43,.1), rgba(7,26,43,.45)); } .comparison-page__hero-media img { object-position: 72% center; } .comparison-page__hero-inner { display: block; width: 100%; padding: 0 var(--container-padding) var(--space-6); } .comparison-page__hero-panel { width: 100%; margin-top: calc(var(--space-6) * -1); padding: var(--space-5); background: var(--color-atlantic-navy); box-shadow: none; } .comparison-page__cabins-layout, .comparison-page__dining-layout, .comparison-page__day-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); } .comparison-page__cabins-media, .comparison-page__dining-media, .comparison-page__day-media { order: -1; } .comparison-page__cabins-copy, .comparison-page__dining-copy { width: 100%; max-width: none; } .comparison-page__day-media { position: static; } }
@media (max-width: 899px) { .comparison-page__casino-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); } .comparison-page__casino-main, .comparison-page__casino-side { width: 100%; max-width: none; } .comparison-page__next-grid { grid-template-columns: minmax(0, 1fr); } .comparison-page__next-card { min-height: 0; } }
@media (max-width: 819px) { .comparison-page__checklist-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); } .comparison-page__checklist-grid > li:nth-child(5) { grid-column: auto; width: 100%; } }
@media (max-width: 679px) { .comparison-page__hero-panel { gap: var(--space-4); } .comparison-page__hero-panel h1 { font-size: clamp(2.625rem, 11vw, 3rem); } .comparison-page__hero-lead { font-size: 1.0625rem; line-height: 1.588; } .comparison-page__hero-actions { flex-direction: column; } .comparison-page__hero-actions > * { width: 100%; } .comparison-page__criteria-grid, .comparison-page__profiles-grid { grid-template-columns: minmax(0, 1fr); } .comparison-page__criterion, .comparison-page__profile { grid-column: auto; } .comparison-page__profile--cabin .media-frame img { aspect-ratio: 4 / 5; } .comparison-page__cabins-media img { aspect-ratio: 4 / 5; } .comparison-page__timeline { width: 100%; } .comparison-page__timeline section { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); } .comparison-page__dining-media img, .comparison-page__day-media img { aspect-ratio: 4 / 3; } .comparison-page__table-rail { margin-inline: calc(var(--container-padding-mobile) * -1); width: calc(100% + var(--container-padding-mobile) * 2); } }
@media (prefers-reduced-motion: reduce) { .comparison-page__day-media { position: static; } }