.ankla-trip {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 24px 80px;
  color: #242424;
  font-size: 17px;
  line-height: 1.75;
}
.ankla-trip, .ankla-trip * { box-sizing: border-box; }
.ankla-trip p { margin: 0 0 20px; }
.ankla-trip h1 { font-size: clamp(32px, 4.5vw, 52px); line-height: 1.15; font-weight: 700; max-width: 800px; margin: 0 0 28px; }
.ankla-trip h2 { font-size: 25px; line-height: 1.3; margin: 0 0 20px; }
.ankla-trip p + h2 { margin-top: 36px; }
.ankla-trip__intro {
  position: relative;
  isolation: isolate;
  border: 1px solid #d7edf1;
  border-radius: 20px;
  padding: 48px;
  margin-bottom: 56px;
  background: linear-gradient(115deg, #f2fafb 15%, #e5f6f9 65%, #d5f1f6);
}
.ankla-trip__intro::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  border-radius: inherit;
  background: url("water.svg") right center / auto 100% no-repeat;
  pointer-events: none;
}
.ankla-trip__intro h1 { color: #183b44; max-width: 720px; }
.ankla-trip__intro > p:not(.ankla-trip__eyebrow) { padding-right: 64px; }
.ankla-trip__intro > p:not(.ankla-trip__eyebrow) { max-width: 720px; font-size: 20px; }
.ankla-trip .ankla-trip__eyebrow { color: #236c80; font-size: 14px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 18px; }
.ankla-trip a { color: #17677d; text-decoration: underline; text-underline-offset: 3px; }
.ankla-trip a:hover { color: #000; }
.ankla-trip a:focus-visible { outline: 3px solid #278cac; outline-offset: 5px; }
.ankla-trip a.ankla-trip__button { display: inline-block; background: #00bdde; color: #fff; padding: 12px 24px; border-radius: 4px; font-weight: 700; text-decoration: none; margin-top: 8px; }
.ankla-trip a.ankla-trip__button:hover { background: #00bdde; color: #fff; }
.ankla-trip .ankla-trip__timeline { list-style: none; padding: 0; margin: 0 0 40px; }
.ankla-trip .ankla-trip__step { position: relative; padding: 0 0 48px 36px; }
.ankla-trip__step::before { content: ""; position: absolute; left: 7px; top: 12px; bottom: -12px; width: 2px; background: #c1e9ef; }
.ankla-trip__step:last-child::before { display: none; }
.ankla-trip__step::after { content: ""; position: absolute; left: 0; top: 8px; width: 16px; height: 16px; border: 3px solid #00bdde; border-radius: 50%; background: #fff; }
.ankla-trip .ankla-trip__step:last-child { padding-bottom: 0; }
.ankla-trip__section { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
.ankla-trip__section:has(.ankla-trip__gallery) { grid-template-columns: minmax(0, 1fr) 340px; }
.ankla-trip__section p:last-child { margin-bottom: 0; }
.ankla-trip__gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-content: start; }
.ankla-trip__gallery > :only-child { grid-column: 1 / -1; max-width: 240px; }
.ankla-trip .ankla-trip__photo { margin: 0; }
.ankla-trip__photo-frame { aspect-ratio: 4 / 3; border-radius: 6px; overflow: hidden; background: #f1f8fa; }
.ankla-trip .ankla-trip__photo img { display: block; width: 100%; height: 100%; object-fit: contain; margin: 0; }
.ankla-trip figcaption { font-size: 13px; line-height: 1.5; color: #555; padding-top: 10px; }
.ankla-trip__practical { background: #f1f8fa; border-radius: 8px; padding: 32px; margin: 24px 0 40px; }
.ankla-trip ul { padding-left: 24px; margin: 0 0 24px; }
.ankla-trip li { padding: 5px 0; }
.ankla-trip__contact { border-top: 4px solid #00bdde; padding-top: 32px; scroll-margin-top: 120px; }
.ankla-trip__contact a { overflow-wrap: anywhere; }
@media (max-width: 767px) {
  .ankla-trip { padding: 0 20px 56px; font-size: 16px; }
  .ankla-trip__intro { padding: 28px 24px; margin-bottom: 36px; border-radius: 14px; }
  .ankla-trip__intro::before { background-position: right top; background-size: 230px auto; opacity: .55; }
  .ankla-trip__intro > p:not(.ankla-trip__eyebrow) { padding-right: 0; }
  .ankla-trip__intro > p:not(.ankla-trip__eyebrow) { font-size: 18px; }
  .ankla-trip .ankla-trip__step { padding-left: 26px; }
  .ankla-trip__section:has(.ankla-trip__gallery) { grid-template-columns: minmax(0, 1fr); }
  .ankla-trip__practical { padding: 24px 20px; }
}
/* The parent theme caps its container at 300px here. Give this page the
   viewport width instead, with a single comfortable text gutter. */
@media (max-width: 550px) {
  .ankla-trip {
    width: 100vw;
    max-width: none;
    margin-left: calc(50% - 50vw);
  }
}
@media (max-width: 479px) {
  .ankla-trip__intro {
    width: calc(100% + 40px);
    margin-left: -20px;
    padding: 32px 24px;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
  }
}