/* rrptravel.ca: RRP Travel Adventures. One stylesheet for the whole site.
   The look is a travel-agency site-builder template that nobody finished: free fonts used
   confidently, a palette a shade too bright, everything in the first screen selling. */
@font-face { font-family: 'Poppins'; font-weight: 700; font-display: swap; src: url(/a/20260915/fonts/poppins-700.woff2) format('woff2'); }
@font-face { font-family: 'Poppins'; font-weight: 800; font-display: swap; src: url(/a/20260915/fonts/poppins-800.woff2) format('woff2'); }
@font-face { font-family: 'Oswald'; font-weight: 200 700; font-display: swap; src: url(/a/20260915/fonts/oswald-var.woff2) format('woff2'); }
@font-face { font-family: 'Caveat'; font-weight: 700; font-display: swap; src: url(/a/20260915/fonts/caveat-700.woff2) format('woff2'); }

:root {
  --blue: #12aeef; --blue-2: #0a6fd6; --blue-3: #083c86; --yellow: #ffe500; --red: #e1251b; --red-2: #b8150d;
  --navy: #0f2d4a; --ink: #1f2933; --mute: #5f6b76; --bg: #f5f8fb; --line: #e1e8ee; --green: #22b14c; --star: #f7b500;
  --head: 'Poppins', 'Segoe UI', Arial, sans-serif; --body: 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; --hand: 'Caveat', 'Segoe Script', cursive;
  --wrap: 1160px; --gutter: 20px;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 16px/1.55 var(--body); }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--blue-2); }
h1, h2, h3, h4 { font-family: var(--head); font-weight: 800; line-height: 1.1; margin: 0; letter-spacing: -.01em; }
p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
button { font: inherit; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* the button, the one thing every page is for */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5em; min-height: 52px; padding: 0 28px; border: 0; border-radius: 12px;
  background: var(--red); color: #fff; font: 800 17px/1 var(--head); letter-spacing: .04em; text-transform: uppercase; text-decoration: none; cursor: pointer;
  box-shadow: 0 4px 0 var(--red-2), 0 10px 22px rgba(225, 37, 27, .28); transition: transform .12s, box-shadow .12s; }
.btn:hover { transform: translateY(1px); box-shadow: 0 3px 0 var(--red-2), 0 8px 18px rgba(225, 37, 27, .28); }
.btn:active { transform: translateY(3px); box-shadow: 0 1px 0 var(--red-2); }
.btn::after { content: '\203A'; font-size: 1.4em; line-height: 0; margin-top: -2px; }
.btn--big { min-height: 60px; font-size: 19px; width: 100%; }
.btn--sm { min-height: 40px; padding: 0 16px; font-size: 13px; border-radius: 9px; box-shadow: 0 3px 0 var(--red-2); }
.btn--ghost { background: #fff; color: var(--navy); box-shadow: 0 3px 0 #cfd8e0; }
.btn--ghost:hover, .btn--ghost:active { box-shadow: 0 2px 0 #cfd8e0; }

/* urgency bar */
.bar { background: var(--yellow); color: var(--navy); font: 700 13px/1.3 var(--head); text-align: center; padding: 8px 12px; letter-spacing: .02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bar .more { display: none; }
@media (min-width: 600px) { .bar .more { display: inline; } }
.bar b { color: var(--red); }
.bar .blink { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--red); margin: 0 6px 1px 0; animation: blink 1.1s steps(2) infinite; }
@keyframes blink { to { opacity: .15; } }

/* header */
.hd { background: #fff; border-bottom: 1px solid var(--line); position: relative; z-index: 20; }
.hd__in { display: flex; align-items: center; gap: 14px; min-height: 62px; }
.hd__logo { display: block; flex: 0 0 auto; }
.hd__logo img { width: 168px; height: auto; }
.hd__nav { display: none; margin-left: auto; }
.hd__nav a { display: block; padding: 8px 12px; color: var(--navy); font: 700 14px/1 var(--head); text-decoration: none; border-radius: 8px; letter-spacing: .01em; }
.hd__nav a:hover { background: var(--bg); }
.hd__nav a[aria-current] { color: var(--blue-2); }
.hd__lang { display: none; font: 700 12px/1 var(--head); color: var(--mute); }
.hd__lang a { color: var(--mute); text-decoration: none; }
.hd__lang b { color: var(--navy); }
.hd__cta { margin-left: auto; white-space: nowrap; }
.hd__burger { flex: 0 0 auto; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 9px; background: #fff; display: grid; place-items: center; cursor: pointer; padding: 0; }
.hd__burger span { display: block; width: 18px; height: 2px; background: var(--navy); box-shadow: 0 -6px 0 var(--navy), 0 6px 0 var(--navy); }
.hd__menu { display: none; background: #fff; border-top: 1px solid var(--line); }
.hd__menu.is-open { display: block; }
.hd__menu a { display: block; padding: 14px var(--gutter); color: var(--navy); font: 700 16px/1 var(--head); text-decoration: none; border-bottom: 1px solid var(--line); }
.hd__menu a[aria-current] { color: var(--blue-2); }
.hd__menu a.is-fr { color: var(--mute); font-weight: 400; font-size: 14px; }
@media (min-width: 900px) {
  .hd { position: sticky; top: 0; box-shadow: 0 2px 12px rgba(15, 45, 74, .06); }
  .hd__in { min-height: 76px; gap: 22px; }
  .hd__logo img { width: 210px; }
  .hd__nav { display: flex; gap: 2px; }
  .hd__lang { display: block; }
  .hd__cta { margin-left: 0; }
  .hd__burger, .hd__menu { display: none !important; }
}

/* hero */
.hero { position: relative; overflow: hidden; color: #fff; background: linear-gradient(135deg, var(--blue) 0%, var(--blue-2) 62%, var(--blue-3) 100%); }
.hero::before { content: ''; position: absolute; right: -12%; top: -30%; width: 74vw; max-width: 760px; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(255, 229, 0, .55), rgba(255, 229, 0, 0) 68%); pointer-events: none; }
.hero__in { position: relative; display: grid; gap: 26px; padding: 28px 0 34px; }
.hero__chosen { font: 700 26px/1 var(--hand); color: var(--yellow); transform: rotate(-3deg); display: inline-block; text-shadow: 0 2px 0 rgba(0, 0, 0, .18); }
.hero__eyebrow { display: inline-flex; align-items: center; gap: 8px; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; padding: 6px 12px; font: 700 12px/1 var(--head); letter-spacing: .08em; text-transform: uppercase; }
.hero__eyebrow b { color: var(--yellow); }
.hero h1 { font-size: clamp(38px, 10.5vw, 44px); text-transform: uppercase; letter-spacing: -.02em; line-height: .98; text-shadow: 0 3px 0 rgba(0, 0, 0, .14); }
.hero h1 em { font-style: normal; color: var(--yellow); white-space: nowrap; }
.hero__sub { font-size: 17px; line-height: 1.5; max-width: 34em; color: rgba(255, 255, 255, .94); }
.hero__sub b { color: var(--yellow); }
.hero__top { display: grid; gap: 14px; justify-items: start; }
.cd { display: grid; gap: 8px; }
.cd__label { font: 700 12px/1 var(--head); letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .85); }
.cd__row { display: flex; gap: 8px; }
.cd__box { flex: 1 1 0; min-width: 0; max-width: 92px; background: #fff; color: var(--navy); border-radius: 10px; padding: 9px 4px 7px; text-align: center; box-shadow: 0 3px 0 rgba(0, 0, 0, .14); }
.cd__box b { display: block; font: 800 28px/1 var(--head); font-variant-numeric: tabular-nums; }
.cd__box small { display: block; font: 700 10px/1 var(--head); letter-spacing: .12em; text-transform: uppercase; color: var(--mute); margin-top: 4px; }
.hero__cta { display: grid; gap: 10px; width: 100%; max-width: 420px; }
.hero__secure { display: flex; gap: 14px; flex-wrap: wrap; font: 700 12px/1.3 var(--head); color: rgba(255, 255, 255, .9); }
.hero__secure span::before { content: '\2713'; display: inline-grid; place-items: center; width: 15px; height: 15px; border-radius: 50%; background: var(--green); color: #fff; font-size: 10px; margin-right: 5px; vertical-align: 0; }
.live { display: inline-flex; align-items: center; gap: 8px; background: var(--navy); color: #fff; border-radius: 8px; padding: 8px 12px; font: 700 13px/1.2 var(--head); }
.live i { width: 9px; height: 9px; border-radius: 50%; background: #ff4b3e; box-shadow: 0 0 0 0 rgba(255, 75, 62, .7); animation: pulse 1.6s infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 7px rgba(255, 75, 62, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 75, 62, 0); } }
.hero__art { position: relative; justify-self: center; width: min(100%, 330px); }
.hero__art img { border-radius: 8px; box-shadow: 0 18px 34px rgba(0, 0, 0, .35), 0 2px 0 rgba(255, 255, 255, .25); }
.hero__art .sticker { position: absolute; right: -8px; top: -14px; width: 92px; height: 92px; border-radius: 50%; background: var(--yellow); color: var(--navy); display: grid; place-items: center; text-align: center; font: 800 12px/1.05 var(--head); text-transform: uppercase; transform: rotate(9deg); box-shadow: 0 6px 14px rgba(0, 0, 0, .25); padding: 8px; }
.hero__art .sticker b { color: var(--red); font-size: 20px; display: block; }
@media (min-width: 900px) {
  .hero__in { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; gap: 40px; padding: 48px 0 56px; }
  .hero h1 { font-size: clamp(48px, 4.6vw, 66px); }
  .hero__sub { font-size: 19px; }
  .hero__cta { grid-template-columns: auto 1fr; align-items: center; max-width: none; }
  .btn--big { width: auto; padding: 0 40px; }
  .hero__art { width: min(100%, 440px); justify-self: end; }
  .hero__art .sticker { width: 116px; height: 116px; font-size: 14px; right: -18px; top: -22px; }
  .hero__art .sticker b { font-size: 26px; }
  .cd__box { max-width: 104px; }
  .cd__box b { font-size: 34px; }
}

/* trust strip */
.trust { background: #fff; border-bottom: 1px solid var(--line); }
.trust__in { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 10px; padding: 18px 0; }
.trust__cell { display: flex; align-items: center; gap: 10px; min-width: 0; font: 700 12px/1.2 var(--head); color: var(--navy); }
.trust__cell small { display: block; font: 400 11px/1.3 var(--body); color: var(--mute); }
.trust__ico { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; font-size: 18px; }
.trust__ico--star { background: #e8f7ee; color: #00b67a; }
.trust__ico--ver { background: #e8f7ee; color: var(--green); }
.trust__ico--lock { background: #eaf2fb; color: var(--blue-2); }
.trust__stars { color: var(--star); letter-spacing: -.05em; font-size: 13px; }
.trust__feat { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px 16px; white-space: nowrap; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); font: 700 11px/1 var(--head); color: var(--mute); text-transform: uppercase; letter-spacing: .1em; border-top: 1px solid var(--line); padding-top: 14px; }
.trust__feat span { font: 800 15px/1 var(--head); color: #b3bcc5; letter-spacing: -.02em; text-transform: none; filter: grayscale(1); }
.trust__feat span.serif { font-family: Georgia, 'Times New Roman', serif; font-weight: 700; font-style: italic; }
@media (min-width: 900px) {
  .trust__in { grid-template-columns: repeat(3, auto) 1fr; align-items: center; gap: 24px; padding: 16px 0; }
  .trust__feat { grid-column: auto; border-top: 0; padding-top: 0; justify-content: flex-end; -webkit-mask-image: none; mask-image: none; }
}

/* sections */
.sec { padding: 40px 0; }
.sec--white { background: #fff; }
.sec--navy { background: var(--navy); color: #fff; }
.sec__head { display: grid; gap: 8px; margin-bottom: 22px; }
.sec__tag { display: inline-block; justify-self: start; background: var(--red); color: #fff; font: 800 11px/1 var(--head); letter-spacing: .12em; text-transform: uppercase; padding: 6px 10px; border-radius: 6px; }
.sec__tag--blue { background: var(--blue-2); }
.sec__tag--yellow { background: var(--yellow); color: var(--navy); }
.sec h2 { font-size: clamp(26px, 6.6vw, 30px); text-transform: uppercase; color: var(--navy); }
.sec--navy h2 { color: #fff; }
.sec__lede { color: var(--mute); font-size: 16px; max-width: 40em; }
.sec--navy .sec__lede { color: rgba(255, 255, 255, .8); }
@media (min-width: 900px) { .sec { padding: 64px 0; } .sec h2 { font-size: 38px; } .sec__head { margin-bottom: 32px; } }

/* departures */
.dep { display: grid; gap: 14px; }
.dep__card { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 16px; display: grid; gap: 10px; box-shadow: 0 6px 18px rgba(15, 45, 74, .06); }
.dep__card.is-hot { border-color: var(--red); box-shadow: 0 0 0 3px rgba(225, 37, 27, .12), 0 6px 18px rgba(15, 45, 74, .06); }
.dep__flag { position: absolute; top: -10px; left: 14px; background: var(--red); color: #fff; font: 800 10px/1 var(--head); letter-spacing: .1em; text-transform: uppercase; padding: 5px 8px; border-radius: 5px; }
.dep__when { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.dep__date { font: 800 20px/1.1 var(--head); color: var(--navy); text-transform: uppercase; }
.dep__date small { display: block; font: 700 12px/1.3 var(--head); color: var(--mute); text-transform: none; letter-spacing: 0; }
.dep__price { text-align: right; font: 800 24px/1 var(--head); color: var(--navy); white-space: nowrap; }
.dep__price s { display: block; font: 400 12px/1.4 var(--body); color: var(--mute); }
.dep__price small { font: 700 11px/1 var(--head); color: var(--mute); letter-spacing: .06em; text-transform: uppercase; }
.dep__meter { height: 8px; background: #edf1f5; border-radius: 4px; overflow: hidden; }
.dep__meter i { display: block; height: 100%; background: linear-gradient(90deg, #ff8a00, var(--red)); border-radius: 4px; }
.dep__notes { display: grid; gap: 4px; font: 700 13px/1.3 var(--head); color: var(--red); }
.dep__notes .eye { color: var(--navy); }
.dep__notes .eye b { color: var(--red); }
.dep__card .btn { width: 100%; }
.dep__all { margin-top: 18px; text-align: center; font: 700 15px/1.3 var(--head); }
@media (min-width: 900px) { .dep { grid-template-columns: repeat(3, 1fr); gap: 20px; } .dep__card { padding: 20px; gap: 12px; } }

/* features */
.why { display: grid; gap: 14px; }
.why__tile { background: #fff; border-radius: 14px; padding: 20px; border: 1px solid var(--line); display: grid; gap: 8px; }
.why__ico { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; font-size: 26px; background: linear-gradient(135deg, #fff6a3, var(--yellow)); }
.why__tile h3 { font-size: 15px; letter-spacing: .06em; text-transform: uppercase; color: var(--navy); }
.why__tile p { color: var(--mute); font-size: 15px; }
.incl { margin-top: 18px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px; display: grid; gap: 10px; }
.incl h3 { font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--navy); }
.incl ul { display: grid; gap: 6px; font-size: 15px; }
.incl li::before { content: '\2713'; display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--green); color: #fff; font-size: 11px; margin-right: 8px; }
.incl small { color: var(--mute); font-size: 12px; }
@media (min-width: 900px) { .why { grid-template-columns: repeat(3, 1fr); gap: 20px; } .incl { grid-template-columns: auto 1fr; align-items: center; gap: 12px 32px; margin-top: 24px; } .incl ul { grid-template-columns: repeat(4, auto); gap: 24px; } .incl small { grid-column: 1 / -1; } }

/* reviews: the search-result panel, as seen on the internet */
.gg { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; box-shadow: 0 6px 18px rgba(15, 45, 74, .06); font-family: Arial, Roboto, 'Helvetica Neue', sans-serif; color: #202124; }
.gg__top { padding: 14px 16px 0; border-bottom: 1px solid #dadce0; display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; align-items: center; }
.gg__logo { font: 700 24px/1 'Poppins', Arial, sans-serif; letter-spacing: -.03em; }
.gg__logo span:nth-child(1) { color: #4285f4; } .gg__logo span:nth-child(2) { color: #ea4335; } .gg__logo span:nth-child(3) { color: #fbbc05; } .gg__logo span:nth-child(4) { color: #4285f4; } .gg__logo span:nth-child(5) { color: #34a853; } .gg__logo span:nth-child(6) { color: #ea4335; }
.gg__search { display: flex; align-items: center; gap: 10px; border: 1px solid #dfe1e5; border-radius: 24px; padding: 8px 14px; font-size: 15px; box-shadow: 0 1px 4px rgba(32, 33, 36, .12); min-width: 0; }
.gg__search span { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gg__search i { font-style: normal; color: #70757a; font-size: 13px; flex: 0 0 auto; }
.gg__mic { width: 12px; height: 12px; border-radius: 6px; background: #ea4335; }
.gg__lens { width: 12px; height: 12px; border-radius: 50%; background: conic-gradient(#4285f4, #34a853, #fbbc05, #ea4335, #4285f4); }
.gg__go { color: #4285f4 !important; font-size: 18px !important; transform: rotate(-45deg); }
.gg__tabs { grid-column: 1 / -1; display: flex; gap: 18px; font-size: 13px; color: #5f6368; overflow: hidden; white-space: nowrap; padding-top: 4px; }
.gg__tabs b, .gg__tabs span { padding: 8px 0 10px; }
.gg__tabs b { color: #1a73e8; border-bottom: 3px solid #1a73e8; font-weight: 400; }
.gg__panel { padding: 16px; display: grid; gap: 8px; }
.gg__name { font-size: 24px; line-height: 1.2; }
.gg__score { display: flex; align-items: center; gap: 6px; font-size: 14px; }
.gg__score b { font-weight: 400; }
.gg__score a { color: #1a73e8; text-decoration: none; }
.gg__score i { font-style: normal; color: #70757a; }
.gg__stars { color: #fbbc04; font-size: 14px; letter-spacing: -.06em; }
.gg__type { font-size: 14px; color: #70757a; }
.gg__btns { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 10px; }
.gg__btn { display: inline-flex; align-items: center; gap: 8px; border: 1px solid #dadce0; border-radius: 20px; padding: 7px 14px; font-size: 14px; color: #202124; }
.gg__btn i { width: 16px; height: 16px; border-radius: 50%; background: #1a73e8; display: inline-block; }
.gg__btn i.is-dir { border-radius: 3px; transform: rotate(45deg); width: 12px; height: 12px; margin: 0 2px; }
.gg__btn i.is-save { border-radius: 2px 2px 0 0; width: 11px; height: 15px; clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 72%, 0 100%); }
.gg__btn i.is-share { clip-path: polygon(50% 0, 100% 50%, 50% 100%, 50% 70%, 0 70%, 0 30%, 50% 30%); border-radius: 0; }
.gg__btn i.is-call { clip-path: polygon(20% 0, 45% 0, 55% 30%, 40% 42%, 58% 60%, 70% 45%, 100% 55%, 100% 80%, 80% 100%, 0 20%); border-radius: 0; }
.gg__h { font-size: 20px; padding-top: 8px; border-top: 1px solid #dadce0; }
.gg__list { display: grid; gap: 4px; }
.gg__list li { display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid #f1f3f4; }
.gg__av { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; color: #fff; font: 700 15px/1 Arial, sans-serif; }
.gg__who { font-size: 14px; font-weight: 700; }
.gg__who small { display: block; font-weight: 400; font-size: 12px; color: #70757a; }
.gg__meta { font-size: 12px; color: #70757a; display: flex; align-items: center; gap: 6px; margin: 4px 0 6px; }
.gg__new { background: #fff; border: 1px solid #dadce0; color: #202124; font-size: 10px; padding: 2px 5px; border-radius: 3px; letter-spacing: .04em; }
.gg__txt { font-size: 14px; line-height: 1.5; }
.gg__expand { font-size: 14px; }
.gg__expand button { border: 1px solid #dadce0; background: #fff; border-radius: 20px; padding: 8px 16px; color: #1a73e8; cursor: pointer; }
.gg__list.is-open li.gg__extra { display: grid; }
.gg__list li.gg__extra { display: none; }
.gg__more { padding-top: 4px; font-size: 14px; }
.gg__more a { color: #1a73e8; text-decoration: none; }
@media (min-width: 900px) {
  .gg__top { padding: 18px 24px 0; }
  .gg__panel { padding: 22px 24px 20px; grid-template-columns: 1fr; }
  .gg__list { grid-template-columns: 1fr 1fr; column-gap: 40px; }
  .gg__list li.gg__extra { display: grid; }
  .gg__expand { display: none; }
  .gg__name { font-size: 28px; }
}

/* founder */
.founder { display: grid; gap: 18px; justify-items: start; }
.founder__av { width: 84px; height: 84px; border-radius: 50%; background: #d9dee3; display: grid; place-items: center; overflow: hidden; }
.founder__av svg { width: 100%; height: 100%; }
.founder q { quotes: none; font-size: 18px; line-height: 1.55; max-width: 36em; }
.founder q b { color: var(--yellow); }
.founder__sig { font: 700 40px/1 var(--hand); color: var(--yellow); }
.founder__sig small { display: block; font: 700 11px/1.4 var(--head); letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .7); margin-top: 2px; }
@media (min-width: 900px) { .founder { grid-template-columns: auto 1fr; gap: 20px 32px; } .founder__av { width: 110px; height: 110px; grid-row: span 2; } .founder q { font-size: 21px; } }

/* chumbox */
.chum { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.chum a { display: block; background: #fff; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; aspect-ratio: 400 / 207; }
.chum a img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.chum__label { display: flex; justify-content: space-between; align-items: baseline; font: 700 11px/1 var(--head); letter-spacing: .1em; text-transform: uppercase; color: var(--mute); margin-bottom: 10px; }
.chum__label b { color: var(--navy); font-size: 14px; letter-spacing: 0; }
@media (min-width: 900px) { .chum { grid-template-columns: repeat(3, 1fr); gap: 14px; } }

/* footer */
.ft { background: var(--navy); color: rgba(255, 255, 255, .82); font-size: 14px; }
.ft__in { display: grid; gap: 22px; padding: 34px 0 28px; }
.ft__logo img { width: 190px; }
.ft__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.ft h4 { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: #fff; margin-bottom: 8px; }
.ft ul { display: grid; gap: 6px; }
.ft ul a { color: rgba(255, 255, 255, .82); text-decoration: none; }
.ft ul a:hover { color: #fff; text-decoration: underline; }
.ft__pay { font-size: 13px; color: rgba(255, 255, 255, .7); }
.ft__pay span { display: inline-block; width: 34px; height: 22px; border-radius: 4px; background: rgba(255, 255, 255, .14); margin: 0 3px 0 0; vertical-align: middle; }
.ft__fine { border-top: 1px solid rgba(255, 255, 255, .14); padding-top: 18px; display: grid; gap: 10px; font-size: 12px; line-height: 1.5; color: rgba(255, 255, 255, .62); }
.ft__fine b { color: rgba(255, 255, 255, .82); font-weight: 600; }
.ft__meta { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
.ft__meta a { color: rgba(255, 255, 255, .62); }
.ft__badge { display: inline-block; border: 1px solid rgba(255, 255, 255, .3); border-radius: 4px; padding: 2px 6px; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
@media (min-width: 900px) { .ft__in { grid-template-columns: 1.2fr 2fr; gap: 24px 48px; padding: 48px 0 30px; } .ft__cols { grid-template-columns: repeat(3, 1fr); } .ft__fine { grid-column: 1 / -1; } }

/* the phone's bottom bar: shows once the hero's button has scrolled away */
.sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -6px 18px rgba(15, 45, 74, .12);
  display: flex; align-items: center; gap: 12px; padding: 8px var(--gutter); transform: translateY(110%); transition: transform .25s; padding-bottom: max(8px, env(safe-area-inset-bottom)); }
.sticky.is-on { transform: none; }
.sticky__txt { flex: 1 1 auto; min-width: 0; font: 800 14px/1.2 var(--head); color: var(--navy); }
.sticky__txt small { display: block; font: 700 11px/1.3 var(--head); color: var(--red); }
.sticky .btn { flex: 0 0 auto; }
@media (min-width: 900px) { .sticky { display: none; } }
@media (prefers-reduced-motion: reduce) { .bar .blink, .live i { animation: none; } html { scroll-behavior: auto; } }

/* inner pages: a short band instead of the hero */
.ph { background: linear-gradient(120deg, var(--blue-2), var(--blue-3)); color: #fff; }
.ph__in { display: grid; gap: 12px; padding: 28px 0 26px; justify-items: start; }
.ph h1 { font-size: clamp(28px, 7vw, 34px); text-transform: uppercase; line-height: 1.02; max-width: 18em; }
.ph__lede { font-size: 16px; color: rgba(255, 255, 255, .9); max-width: 40em; }
.ph__tools { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; font: 700 12px/1 var(--head); color: rgba(255, 255, 255, .85); margin-top: 4px; }
.ph__tools select { margin-left: 6px; font: 700 12px/1 var(--head); border: 0; border-radius: 6px; padding: 7px 8px; color: var(--navy); }
@media (min-width: 900px) { .ph__in { padding: 44px 0 40px; } .ph h1 { font-size: 46px; } .ph__lede { font-size: 18px; } }

/* excursions */
.ex { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; display: grid; box-shadow: 0 6px 18px rgba(15, 45, 74, .06); }
.ex__pic { position: relative; aspect-ratio: 16 / 9; background: linear-gradient(135deg, var(--a, #ccc), var(--b, #666)); display: grid; place-items: center; font-size: 64px; }
.ex__pic--utopia { aspect-ratio: auto; background: linear-gradient(135deg, var(--blue), var(--blue-3)); padding: 18px; }
.ex__pic--utopia img { width: min(100%, 190px); border-radius: 6px; box-shadow: 0 12px 28px rgba(0, 0, 0, .35); }
.ex__ribbon { position: absolute; top: 26px; right: -48px; transform: rotate(35deg); min-width: 200px; text-align: center; background: #6b7480; color: #fff; font: 800 12px/1 var(--head); letter-spacing: .12em; text-transform: uppercase; padding: 8px 44px; box-shadow: 0 3px 8px rgba(0, 0, 0, .25); }
.ex__ribbon--go { background: var(--red); }
.ex__body { padding: 16px; display: grid; gap: 8px; align-content: start; }
.ex__tag { font: 800 11px/1 var(--head); letter-spacing: .12em; text-transform: uppercase; color: var(--red); }
.ex h2, .ex h3 { color: var(--navy); font-size: 20px; text-transform: uppercase; }
.ex--feat h2 { font-size: clamp(24px, 6vw, 30px); }
.ex__meta { font: 700 12px/1.4 var(--head); color: var(--mute); }
.ex__stars { color: var(--star); letter-spacing: -.05em; font-size: 14px; }
.ex__desc { font-size: 15px; color: var(--ink); }
.ex__price { font: 800 26px/1 var(--head); color: var(--navy); }
.ex__price s { display: block; font: 400 12px/1.4 var(--body); color: var(--mute); }
.ex__price small { font: 700 11px/1 var(--head); color: var(--mute); letter-spacing: .06em; text-transform: uppercase; }
.ex__scar { display: flex; align-items: center; gap: 8px; font: 700 13px/1.3 var(--head); color: var(--red); }
.ex__scar i { width: 9px; height: 9px; border-radius: 50%; background: var(--red); animation: pulse 1.6s infinite; flex: 0 0 auto; }
.ex__actions { display: flex; align-items: center; gap: 14px; font: 700 13px/1 var(--head); }
.btn--out { background: #c3c9d0; color: #fff; box-shadow: 0 3px 0 #9aa3ad; cursor: not-allowed; min-height: 44px; padding: 0 18px; font-size: 14px; }
.btn--out::after { content: none; }
.is-out .ex__pic { filter: saturate(.55); }
.is-out h3, .is-out .ex__price b { color: #6b7480; }
.ex__h { margin: 30px 0 14px; font-size: 22px; text-transform: uppercase; color: var(--navy); }
.exg { display: grid; gap: 14px; }
.ex__note { margin-top: 20px; font-size: 12px; color: var(--mute); }
.ex__cta { margin-top: 26px; background: var(--navy); color: #fff; border-radius: 14px; padding: 22px 20px; display: grid; gap: 14px; justify-items: center; text-align: center; }
.ex__cta p { font: 800 22px/1.1 var(--head); text-transform: uppercase; }
@media (min-width: 900px) {
  .ex--feat { grid-template-columns: 340px 1fr; }
  .ex--feat .ex__body { padding: 28px 32px; }
  .ex__pic--utopia img { width: min(100%, 260px); }
  .exg { grid-template-columns: repeat(4, 1fr); gap: 20px; }
  .ex__body { padding: 18px; }
  .ex__cta { grid-template-columns: 1fr auto; text-align: left; justify-items: start; padding: 26px 32px; }
}

/* the pop-up: one at a time, never on the home page, closable in one tap, another BOOK NOW */
.pop { position: fixed; inset: 0; z-index: 50; display: none; place-items: center; padding: 20px; background: rgba(10, 30, 50, .62); }
.pop.is-on { display: grid; }
.pop__box { position: relative; width: min(100%, 420px); background: #fff; border-radius: 16px; padding: 30px 22px 22px; text-align: center; display: grid; gap: 12px; justify-items: center; box-shadow: 0 30px 60px rgba(0, 0, 0, .4); border: 4px solid var(--yellow); }
.pop__x { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; border-radius: 50%; border: 0; background: #eef2f6; color: var(--navy); font: 700 18px/1 var(--head); cursor: pointer; }
.pop__eyebrow { font: 800 12px/1 var(--head); letter-spacing: .14em; text-transform: uppercase; color: var(--red); }
.pop__box h2 { font-size: 26px; line-height: 1.05; text-transform: uppercase; color: var(--navy); }
.pop__box h2 em { font-style: normal; color: var(--red); }
.pop__box p { font-size: 15px; color: var(--ink); }
.pop__box .btn { width: 100%; }
.pop__no { font-size: 12px; color: var(--mute); background: none; border: 0; text-decoration: underline; cursor: pointer; padding: 4px; }
.pop__timer { font: 800 13px/1 var(--head); color: var(--red); font-variant-numeric: tabular-nums; }

.hh-adv {
  --ink: #161616; --red: #C8102E; --navy: #1B2A41; --paper: #F4F1EA; --blue: #DCE8F2;
  container-type: inline-size; position: relative; width: 100%; aspect-ratio: 717 / 1139; background: var(--paper); color: var(--ink);
  font-family: Helvetica, Arial, sans-serif; line-height: 1.3; overflow: hidden;
}
.hh-adv__paper { position: relative; height: 100%; display: grid; grid-template-rows: minmax(0, 9fr) minmax(0, 13fr) minmax(0, 6fr) minmax(0, 72fr) minmax(0, 29fr) minmax(0, 19fr); }
.hh-adv p, .hh-adv figure, .hh-adv ol { margin: 0; }
.hh-adv__mast { display: flex; align-items: center; gap: 1.6cqw; padding: 0 4cqw; color: var(--navy); }
.hh-adv__mark { display: block; height: 4.6cqw; width: auto; max-width: none; }
.hh-adv__brand { font: 600 2.5cqw/1.15 Oswald, sans-serif; letter-spacing: .04cqw; text-transform: uppercase; }
.hh-adv__brand small { display: block; font: 400 1.55cqw/1.3 Oswald, sans-serif; letter-spacing: .25cqw; margin-top: 0; }
.hh-adv__notice { margin-left: auto; font: 500 1.6cqw/1 Oswald, sans-serif; letter-spacing: .12cqw; color: #6b6b6b; }
.hh-adv__red { position: relative; color: #fff; isolation: isolate; }
.hh-adv__red::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--red); filter: blur(.04cqw); }
.hh-adv__band { display: flex; align-items: center; justify-content: space-between; padding: 0 4cqw; }
.hh-adv__band .hh-adv__h1 { font: 700 7.6cqw/1 Oswald, sans-serif; letter-spacing: .02cqw; white-space: nowrap; }
.hh-adv__band .hh-adv__h1 small { display: block; font: 400 2cqw/1.2 Oswald, sans-serif; letter-spacing: .3cqw; margin-top: .9cqw; }
.hh-adv__updated { text-align: right; font: 500 1.7cqw/1.4 Oswald, sans-serif; letter-spacing: .1cqw; }
.hh-adv__updated span { display: block; }
.hh-adv__route { display: flex; align-items: center; padding: 0 4cqw; font: 600 2.7cqw/1 Oswald, sans-serif; letter-spacing: .05cqw; }
.hh-adv__route i { font-style: normal; padding: 0 1.6cqw; color: #8a8a8a; font-weight: 400; }
.hh-adv__body { display: grid; grid-template-columns: 55fr 41fr; column-gap: 3cqw; padding: 1.5cqw 4cqw 0; min-height: 0; align-items: start; }
.hh-adv__portrait { width: 100%; height: auto; aspect-ratio: 4 / 5; display: block; object-fit: cover; border: .15cqw solid #a9a9a9; background: #2a2a2a; }
.hh-adv__details { display: flex; flex-direction: column; gap: 1.6cqw; min-width: 0; }
.hh-adv__poi { display: inline-block; align-self: flex-start; padding: .7cqw 1.3cqw .6cqw; font: 600 2.3cqw/1.2 Oswald, sans-serif; letter-spacing: .08cqw; }
.hh-adv__name { font: 700 6.4cqw/1.05 Oswald, sans-serif; margin-top: .9cqw; overflow-wrap: anywhere; }
.hh-adv__field .hh-adv__h3 { font: 600 1.9cqw/1.2 Oswald, sans-serif; letter-spacing: .06cqw; border-top: .12cqw solid var(--red); padding-top: .8cqw; margin-bottom: .45cqw; }
.hh-adv__field p { font-size: 1.85cqw; line-height: 1.38; }
.hh-adv__aka { font: 700 3.3cqw/1.15 Oswald, sans-serif; }
.hh-adv__hazard { display: flex; align-items: center; justify-content: space-between; padding: 1.2cqw 1.5cqw; }
.hh-adv__hazard .hh-adv__h3 { font: 600 1.85cqw/1.2 Oswald, sans-serif; letter-spacing: .08cqw; }
.hh-adv__hazard p { font: 700 5cqw/1.05 Oswald, sans-serif; }
.hh-adv__hazard svg { width: 8.5cqw; height: 8.5cqw; flex: 0 0 auto; }
.hh-adv__tadv .hh-adv__h3 { font: 600 1.9cqw/1.2 Oswald, sans-serif; margin-bottom: .45cqw; }
.hh-adv__tadv p { font-size: 1.85cqw; line-height: 1.38; }
.hh-adv__enc { display: grid; grid-template-columns: 55fr 41fr; column-gap: 3cqw; padding: 1.5cqw 4cqw; align-items: stretch; }
.hh-adv__steps { background: #e8e9e5; padding: 1.5cqw; }
.hh-adv__steps .hh-adv__h3 { font: 600 2cqw/1.2 Oswald, sans-serif; margin-bottom: 1.1cqw; }
.hh-adv__steps ol { list-style: none; padding: 0; counter-reset: s; display: grid; gap: .9cqw; }
.hh-adv__steps li { counter-increment: s; display: grid; grid-template-columns: 3.6cqw 1fr; align-items: center; gap: 1.2cqw; font-size: 1.85cqw; line-height: 1.25; }
.hh-adv__steps li::before { content: counter(s); display: grid; place-items: center; width: 3.6cqw; height: 3.6cqw; border-radius: 50%; background: var(--red); color: #fff; font: 500 2.3cqw/1 Oswald, sans-serif; }
/* the slot where a safety notice would reassure you: RRP sells it instead (Luke, 2026-09-11) */
.hh-adv__ad { position: relative; margin: 0; border: .12cqw solid #c9c6bd; background: #fff; overflow: hidden; }
.hh-adv__ad img { width: 100%; height: 100%; object-fit: contain; object-position: center; display: block; background: #fff; }
.hh-adv__ad figcaption { position: absolute; left: 0; top: 0; padding: .3cqw .8cqw; font: 400 1.2cqw/1.2 Helvetica, Arial, sans-serif; letter-spacing: .1cqw; color: #666; background: rgba(255,255,255,.85); text-transform: uppercase; }
.hh-adv__foot { background: var(--navy); color: #fff; display: flex; align-items: center; gap: 2cqw; padding: 0 4cqw; }
.hh-adv__foot .hh-adv__mark { height: 5.6cqw; }
.hh-adv__foot .hh-adv__brand { font-size: 2.6cqw; }
.hh-adv__foot .hh-adv__brand small { font-family: Helvetica, Arial, sans-serif; font-size: 1.25cqw; letter-spacing: .18cqw; }
.hh-adv__foot-r { margin-left: auto; text-align: right; font: 400 1.5cqw/1.5 Helvetica, Arial, sans-serif; }
.hh-adv__foot-r b { display: block; font: 500 1.35cqw/1 Oswald, sans-serif; letter-spacing: .3cqw; margin-bottom: 1.8cqw; }
.hh-adv__paper { height: 100%; }
.adv { display: grid; gap: 26px; }
.adv__one { display: grid; gap: 12px; }
.adv__frame { border: 1px solid #cfd3d8; box-shadow: 0 10px 30px rgba(15, 45, 74, .14); background: #F4F1EA; }
.adv__cap { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px 14px; font: 700 12px/1.4 var(--head); color: var(--mute); }
.adv__cap b { color: var(--navy); }
.adv__cap a { color: var(--blue-2); }
.adv__safe { margin-top: 30px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 22px 20px; display: grid; gap: 12px; justify-items: start; }
.adv__safe h2 { font-size: 22px; text-transform: uppercase; color: var(--navy); }
.adv__safe ul { display: grid; gap: 6px; font-size: 15px; }
.adv__safe li::before { content: '\2713'; display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--green); color: #fff; font-size: 11px; margin-right: 8px; }
@media (min-width: 900px) { .adv { grid-template-columns: 1fr 1fr; gap: 40px; } .adv__safe { grid-template-columns: 1fr auto; align-items: center; padding: 28px 32px; } .adv__safe h2 { grid-column: 1 / -1; } }

/* about */
.about { display: grid; gap: 22px; }
.about__story { display: grid; gap: 14px; font-size: 16px; line-height: 1.6; max-width: 44em; }
.about__story h2 { font-size: 28px; text-transform: uppercase; color: var(--navy); }
.stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.stats li { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 16px; text-align: center; }
.stats b { display: block; font: 800 34px/1 var(--head); color: var(--blue-2); }
.stats span { display: block; font: 700 12px/1.3 var(--head); letter-spacing: .06em; text-transform: uppercase; color: var(--mute); margin-top: 6px; }
.awards { display: grid; gap: 12px; }
.awards li { display: grid; grid-template-columns: auto 1fr; gap: 4px 14px; align-items: center; background: var(--bg); border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
.awards__ico { grid-row: span 2; width: 48px; height: 48px; border-radius: 50%; background: linear-gradient(135deg, #fff6a3, var(--yellow)); display: grid; place-items: center; font-size: 24px; }
.awards b { font: 800 15px/1.2 var(--head); color: var(--navy); }
.awards span:not(.awards__ico) { font-size: 13px; color: var(--mute); }
.fleet { display: grid; gap: 16px; }
.fleet__car { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; display: grid; }
.fleet__car img { width: 100%; aspect-ratio: 2 / 1; object-fit: cover; }
.fleet__none { aspect-ratio: 2 / 1; display: grid; place-items: center; align-content: center; gap: 6px; background: repeating-linear-gradient(45deg, #eef2f6 0 12px, #e6ebf0 12px 24px); color: var(--mute); font: 700 12px/1 var(--head); letter-spacing: .1em; text-transform: uppercase; }
.fleet__none span { font-size: 30px; opacity: .6; }
.fleet__body { padding: 16px; display: grid; gap: 10px; }
.fleet__body h3 { font-size: 18px; text-transform: uppercase; color: var(--navy); }
.fleet__body p { font-size: 14px; color: var(--ink); }
.fleet__spec { display: grid; grid-template-columns: auto 1fr; gap: 4px 14px; font-size: 13px; margin: 4px 0 0; }
.fleet__spec dt { color: var(--mute); }
.fleet__spec dd { margin: 0; font-weight: 700; color: var(--navy); }
.team { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.team li { text-align: center; background: var(--bg); border: 1px solid var(--line); border-radius: 12px; padding: 16px 10px; display: grid; gap: 4px; justify-items: center; }
.team__av { width: 64px; height: 64px; border-radius: 50%; background: #d9dee3; color: #fff; display: grid; place-items: center; font: 800 28px/1 var(--head); margin-bottom: 6px; }
.team b { font: 800 14px/1.2 var(--head); color: var(--navy); }
.team span:not(.team__av) { font-size: 12px; color: var(--mute); }
@media (min-width: 900px) {
  .about { grid-template-columns: 1.4fr 1fr; gap: 20px 48px; align-items: start; }
  .about .ex__note { grid-column: 2; margin-top: 0; }
  .stats { grid-template-columns: 1fr 1fr; }
  .awards { grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .fleet { grid-template-columns: repeat(3, 1fr); gap: 20px; }
  .team { grid-template-columns: repeat(4, 1fr); gap: 16px; }
}

/* contact */
.contact { display: grid; gap: 22px; }
.chat { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; display: grid; box-shadow: 0 6px 18px rgba(15, 45, 74, .06); }
.chat__head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: var(--blue-2); color: #fff; }
.chat__head b { font: 800 14px/1.2 var(--head); display: block; }
.chat__head small { font-size: 12px; color: rgba(255, 255, 255, .85); }
.chat__head small i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #3ddc84; margin-right: 4px; }
.chat__av { width: 36px; height: 36px; border-radius: 50%; background: var(--yellow); color: var(--navy); display: grid; place-items: center; font: 800 16px/1 var(--head); }
.chat__badge { margin-left: auto; font: 700 10px/1 var(--head); letter-spacing: .1em; text-transform: uppercase; border: 1px solid rgba(255, 255, 255, .5); border-radius: 999px; padding: 5px 8px; }
.chat__log { padding: 14px; display: grid; gap: 8px; align-content: start; height: 300px; overflow-y: auto; background: var(--bg); }
.chat__msg { max-width: 85%; padding: 9px 12px; border-radius: 14px; font-size: 14px; line-height: 1.4; }
.chat__msg.is-them { background: #fff; border: 1px solid var(--line); border-bottom-left-radius: 4px; justify-self: start; }
.chat__msg.is-me { background: var(--blue-2); color: #fff; border-bottom-right-radius: 4px; justify-self: end; }
.chat__msg.is-typing { color: var(--mute); font-style: italic; }
.chat__msg a { font-weight: 700; }
.chat__form { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--line); }
.chat__form input { flex: 1 1 auto; min-width: 0; border: 1px solid var(--line); border-radius: 9px; padding: 0 12px; font: 15px/1 var(--body); min-height: 40px; }
.chat__fine { padding: 0 14px 12px; font-size: 11px; color: var(--mute); }
.cform { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 18px; display: grid; gap: 12px; }
.cform h2, .cinfo h2 { font-size: 20px; text-transform: uppercase; color: var(--navy); }
.cform form { display: grid; gap: 12px; }
.cform label { display: block; font: 700 12px/1.3 var(--head); color: var(--navy); margin-bottom: 4px; }
.cform input[type=text], .cform input[type=email], .cform select, .cform textarea { width: 100%; border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; font: 15px/1.3 var(--body); background: #fff; }
.cform__consent label { display: flex; gap: 8px; align-items: flex-start; font: 400 12px/1.4 var(--body); color: var(--mute); }
.cform__thanks { background: #e8f7ee; border: 1px solid #b9e6c8; color: #1a5a2e; border-radius: 9px; padding: 10px 12px; font-size: 14px; }
.cinfo { background: var(--navy); color: rgba(255, 255, 255, .88); border-radius: 14px; padding: 20px; display: grid; gap: 10px; justify-items: start; font-size: 14px; }
.cinfo h2 { color: #fff; }
.cinfo h3 { color: var(--yellow); font-size: 13px; letter-spacing: .1em; text-transform: uppercase; margin-top: 8px; }
.cinfo dl { display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; margin: 0; }
.cinfo dt { font: 800 11px/1.6 var(--head); letter-spacing: .1em; text-transform: uppercase; color: var(--yellow); }
.cinfo dd { margin: 0; }
.cinfo small { color: rgba(255, 255, 255, .6); }
@media (min-width: 900px) { .contact { grid-template-columns: 1.1fr 1fr .9fr; gap: 24px; align-items: start; } .chat__log { height: 380px; } }