@font-face {
  font-family: "Comic Kings";
  src: url("images/Comic Kings.ttf") format("truetype");
  font-display: swap;
}

:root {
  --ink: #18302b;
  --muted: #596b62;
  --water: #1b8f98;
  --deep: #0f5f63;
  --mint: #8ed9c8;
  --leaf: #78b84a;
  --sun: #ff8a24;
  --sun-line: rgba(255, 138, 36, 0.44);
  --sand: #fff5df;
  --white: #ffffff;
  --line: rgba(24, 48, 43, 0.14);
  --shadow: 0 18px 40px rgba(15, 95, 99, 0.18);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--ink);
  background: #0f5f63;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}

main {
  background: #0f5f63;
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 2000;
  background: rgba(15, 95, 99, 0.96);
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  backdrop-filter: blur(14px);
}

.nav {
  width: min(1120px, calc(100% - 32px));
  min-height: 76px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  position: relative;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  min-width: 280px;
}

.brand > img:first-child {
  width: 86px;
  height: 74px;
  object-fit: contain;
}

.brand-wordmark {
  width: clamp(142px, 18vw, 218px);
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 5px 8px rgba(0, 0, 0, 0.18));
}

.desktop-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}

.desktop-nav a {
  min-height: 42px;
  padding: 10px 14px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 800;
  color: rgba(255, 255, 255, 0.92) !important;
  font-size: 0.95rem;
}

.desktop-nav .button {
  color: #10232d !important;
}

.desktop-nav a:hover,
.desktop-nav a[aria-current="page"] {
  background: rgba(255, 255, 255, 0.13);
  color: var(--white);
}

.nav-toggle,
.hamburger,
.mobile-nav,
.mobile-actions {
  display: none !important;
}

.nav-toggle {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.hamburger {
  width: 42px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  cursor: pointer;
}

.hamburger span,
.hamburger span::before,
.hamburger span::after {
  display: block;
  width: 22px;
  height: 3px;
  border-radius: 99px;
  background: var(--white);
}

.hamburger span {
  position: relative;
}

.hamburger span::before,
.hamburger span::after {
  content: "";
  position: absolute;
  left: 0;
}

.hamburger span::before {
  top: -7px;
}

.hamburger span::after {
  top: 7px;
}

.mobile-nav {
  position: fixed;
  top: 82px;
  right: 16px;
  min-width: 220px;
  padding: 10px;
  gap: 6px;
  border: 1px solid rgba(255, 138, 36, 0.78);
  border-radius: 14px;
  background: #0c3f3d;
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.34);
  z-index: 5000;
}

.mobile-nav a {
  display: block;
  padding: 11px 12px;
  border-radius: 8px;
  color: var(--white) !important;
  background: rgba(255, 255, 255, 0.06);
  font-weight: 900;
  text-decoration: none;
}

.mobile-nav a:hover,
.mobile-nav a[aria-current="page"] {
  background: rgba(255, 138, 36, 0.2);
}

.button,
.button-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 12px 18px;
  border-radius: 8px;
  font-weight: 900;
  text-decoration: none;
  border: 2px solid transparent;
  line-height: 1.1;
}

.button {
  color: #10232d;
  background: var(--sun);
  box-shadow: 0 10px 22px rgba(255, 138, 36, 0.28);
}

.button:hover {
  background: #ff9b45;
}

.button-outline {
  color: var(--deep);
  border-color: rgba(15, 95, 99, 0.28);
  background: var(--white);
}

.button-outline:hover {
  border-color: var(--water);
}

.hero {
  position: relative;
  min-height: calc(100vh - 76px);
  display: grid;
  align-items: end;
  isolation: isolate;
  overflow: hidden;
  color: var(--white);
  background: var(--deep);
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: url("images/J_splash_cropped.JPG") 82% 42% / cover no-repeat;
}

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.68), rgba(0, 0, 0, 0.48) 44%, rgba(0, 0, 0, 0.2)),
    linear-gradient(0deg, rgba(0, 0, 0, 0.56), rgba(0, 0, 0, 0.05) 38%),
    linear-gradient(120deg, rgba(15, 95, 99, 0.32), rgba(15, 95, 99, 0.08) 50%, rgba(255, 138, 36, 0.08));
}

.hero-content {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
  padding: 72px 0 92px;
  transform: none;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  max-width: 560px;
  margin-bottom: 18px;
  font-family: "Comic Kings", Inter, sans-serif;
  font-size: clamp(2.4rem, 6.4vw, 5.35rem);
  line-height: 0.92;
  font-weight: 400;
  letter-spacing: 0.035em;
}

h2 {
  margin-bottom: 16px;
  font-family: "Comic Kings", Inter, sans-serif;
  font-size: clamp(2.1rem, 5vw, 4rem);
  line-height: 0.96;
  color: var(--deep);
  font-weight: 400;
  letter-spacing: 0.035em;
}

h3 {
  margin-bottom: 8px;
  font-size: 1.28rem;
  line-height: 1.2;
}

.hero-copy {
  max-width: 520px;
  font-size: clamp(1.08rem, 2.1vw, 1.32rem);
  color: rgba(255, 255, 255, 0.93);
}

.hero-actions,
.section-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.quick-strip {
  position: relative;
  background: var(--deep);
  color: var(--white);
}

.quick-strip::before,
.section::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -19px;
  width: min(1760px, calc(100vw - 42px));
  height: 50px;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1600 96' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23ff8a24' d='M0 34 C106 16 183 47 280 31 C394 12 476 33 594 26 C724 19 810 38 934 27 C1054 16 1142 41 1268 29 C1408 16 1494 30 1600 20 L1600 61 C1492 68 1402 49 1270 64 C1144 78 1046 52 930 66 C802 80 710 57 592 69 C464 82 382 59 274 73 C172 86 96 55 0 70 Z'/%3E%3Cpath fill='none' stroke='%23a84909' stroke-opacity='.3' stroke-width='4' stroke-linecap='round' d='M36 42 C144 34 208 53 320 41 M430 36 C532 31 608 48 720 38 M830 42 C942 30 1002 52 1118 39 M1230 43 C1340 34 1416 47 1544 34'/%3E%3Cpath fill='none' stroke='%23fff1cb' stroke-opacity='.34' stroke-width='3' stroke-linecap='round' d='M82 56 C190 49 254 66 366 55 M500 55 C616 47 676 63 790 52 M914 58 C1024 48 1086 65 1200 52 M1310 57 C1402 51 1468 60 1540 51'/%3E%3Cpath fill='none' stroke='%23a84909' stroke-opacity='.22' stroke-width='2' stroke-dasharray='18 18' stroke-linecap='round' d='M16 68 C170 76 244 54 392 66 C532 78 618 56 762 68 C902 80 1002 57 1146 69 C1300 82 1390 58 1584 67'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  transform: translateX(-50%) rotate(-0.35deg);
  z-index: 2;
}

.hero + .quick-strip::before {
  top: -20px;
}

.quick-strip-inner {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(255, 255, 255, 0.18);
}

.quick-item {
  padding: 22px;
  background: var(--deep);
}

.quick-item strong {
  display: block;
  font-size: 1.02rem;
  color: var(--mint);
}

.quick-item span {
  color: rgba(255, 255, 255, 0.84);
}

.section {
  position: relative;
  padding: 78px 0;
  background: #0f5f63;
  color: var(--white);
}

.section h2 {
  color: var(--white);
}

.section.alt {
  background: #0f5f63;
  color: var(--ink);
}

.section.surface {
  background: #0f5f63;
  color: var(--ink);
}

.section.alt h2,
.section.surface h2 {
  color: var(--deep);
}

.section.alt > .container,
.section.surface > .container {
  position: relative;
  padding: 42px;
  border: 1px solid var(--sun-line);
  border-radius: 18px;
  background: #fbfaf2;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.16);
}

.section.alt > .container::before,
.section.surface > .container::before {
  content: "";
  position: absolute;
  left: 22px;
  right: 22px;
  top: -17px;
  height: 34px;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1200 72' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23ff8a24' d='M0 28 C88 13 164 38 252 25 C370 8 460 31 574 22 C700 13 787 37 908 24 C1015 13 1100 28 1200 16 L1200 48 C1095 61 1017 43 904 56 C781 70 692 47 574 58 C452 69 368 47 252 62 C154 75 82 50 0 60 Z'/%3E%3Cpath fill='none' stroke='%23a84909' stroke-opacity='.28' stroke-width='4' stroke-linecap='round' d='M42 34 C150 25 226 44 334 33 M468 30 C566 25 636 43 746 32 M870 35 C982 25 1058 38 1168 28'/%3E%3Cpath fill='none' stroke='%23fff1cb' stroke-opacity='.34' stroke-width='3' stroke-linecap='round' d='M74 48 C176 42 242 54 348 47 M506 47 C626 39 686 54 802 46 M926 49 C1028 43 1088 51 1160 43'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  transform: rotate(0.45deg);
}

.section.alt > .container {
  background: var(--sand);
}

.container {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
}

.section-kicker {
  margin-bottom: 10px;
  color: var(--sun);
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.82rem;
}

.section-lead {
  max-width: 720px;
  color: color-mix(in srgb, currentColor 72%, transparent);
  font-size: 1.08rem;
}

.split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.82fr);
  gap: 42px;
  align-items: center;
}

.photo-stack {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 0.72fr;
  gap: 14px;
  align-items: stretch;
}

.photo-stack::after,
.wide-photo::after,
.story-photo::after {
  content: "";
  position: absolute;
  right: 18px;
  bottom: -11px;
  width: 96px;
  height: 42px;
  pointer-events: none;
  background:
    linear-gradient(110deg, transparent 0 30%, var(--sun) 31% 37%, transparent 38%),
    linear-gradient(100deg, transparent 0 47%, var(--sun) 48% 54%, transparent 55%),
    linear-gradient(92deg, transparent 0 64%, var(--sun) 65% 71%, transparent 72%);
  opacity: 0.82;
  transform: rotate(-4deg);
  z-index: 3;
}

.wide-photo,
.story-photo {
  position: relative;
}

.photo-stack picture,
.photo-stack img,
.wide-photo img,
.story-photo img {
  width: 100%;
  height: 100%;
  min-height: 220px;
  object-fit: cover;
  border: 1px solid var(--sun-line);
  border-radius: 18px;
  box-shadow: var(--shadow);
}

.photo-stack picture img {
  min-height: 100%;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.photo-stack picture:first-child,
.photo-stack img:first-child {
  min-height: 380px;
}

.photo-stack picture:last-child,
.photo-stack img:last-child {
  align-self: end;
  min-height: 260px;
}

.feature-grid,
.pricing-grid,
.steps {
  display: grid;
  gap: 18px;
}

.feature-grid {
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  margin-top: 34px;
}

.feature,
.price-card,
.step,
.note-box {
  background: var(--white);
  border: 1px solid var(--sun-line);
  border-radius: 18px;
  padding: 24px;
  box-shadow: 0 10px 28px rgba(24, 48, 43, 0.07);
}

.feature-mark {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  margin-bottom: 18px;
  border-radius: 8px;
  background: rgba(120, 184, 74, 0.18);
  color: var(--deep);
  font-weight: 1000;
}

.feature p,
.price-card p,
.step p,
.note-box p {
  margin-bottom: 0;
  color: var(--muted);
}

.faq-layout {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 34px;
  align-items: start;
  margin-top: 32px;
}

.faq-nav {
  position: sticky;
  top: 104px;
  display: grid;
  gap: 12px;
  padding: 18px;
  border: 1px solid var(--sun-line);
  border-radius: 18px;
  background: var(--white);
  box-shadow: 0 10px 28px rgba(24, 48, 43, 0.07);
}

.faq-nav a {
  padding: 10px 12px;
  border-radius: 12px;
  color: var(--deep);
  font-weight: 900;
  text-decoration: none;
  background: rgba(120, 184, 74, 0.15);
}

.faq-nav a:hover {
  background: rgba(255, 138, 36, 0.16);
}

.faq-content {
  display: grid;
  gap: 26px;
}

.faq-group {
  scroll-margin-top: 110px;
}

.faq-group h3 {
  margin-bottom: 12px;
  font-family: "Comic Kings", Inter, sans-serif;
  font-weight: 400;
  letter-spacing: 0.035em;
  color: var(--deep);
}

.faq-list {
  display: grid;
  gap: 10px;
}

.faq-item {
  border: 1px solid var(--sun-line);
  border-radius: 18px;
  background: var(--white);
  box-shadow: 0 10px 28px rgba(24, 48, 43, 0.06);
  overflow: hidden;
}

.faq-item summary {
  position: relative;
  min-height: 58px;
  display: flex;
  align-items: center;
  padding: 16px 54px 16px 18px;
  color: var(--ink);
  font-weight: 950;
  cursor: pointer;
  list-style: none;
}

.faq-item summary::-webkit-details-marker {
  display: none;
}

.faq-item summary::after {
  content: "+";
  position: absolute;
  right: 18px;
  top: 50%;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  transform: translateY(-50%);
  border-radius: 8px;
  background: rgba(27, 143, 152, 0.16);
  color: var(--deep);
  font-size: 1.3rem;
  line-height: 1;
}

.faq-item[open] summary {
  color: var(--deep);
  background: rgba(142, 217, 200, 0.16);
}

.faq-item[open] summary::after {
  content: "-";
  background: rgba(255, 138, 36, 0.18);
}

.faq-item p {
  margin: 0;
  padding: 0 18px 18px;
  color: var(--muted);
}

.page-hero {
  background: #101816;
  color: var(--white);
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: url("images/T_backfloat.JPG") center / cover no-repeat;
}

.page-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0.42)),
    linear-gradient(120deg, rgba(15, 95, 99, 0.24), rgba(15, 95, 99, 0.06) 60%);
}

.page-hero .container {
  position: relative;
  padding: 72px 0 62px;
}

.page-hero h1 {
  max-width: 840px;
  margin-bottom: 14px;
}

.page-hero p {
  max-width: 690px;
  color: rgba(255, 255, 255, 0.9);
  font-size: 1.12rem;
}

.pricing-grid {
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  margin-top: 36px;
}

.price-card {
  position: relative;
  min-height: 286px;
  display: flex;
  flex-direction: column;
}

.price-card.featured {
  border-color: rgba(255, 138, 36, 0.6);
  box-shadow: 0 18px 44px rgba(255, 138, 36, 0.15);
}

.badge {
  width: fit-content;
  margin-bottom: 14px;
  padding: 6px 10px;
  border-radius: 8px;
  background: rgba(255, 138, 36, 0.15);
  color: #8a4300;
  font-size: 0.78rem;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.price {
  margin: 4px 0 8px;
  font-size: 2.7rem;
  line-height: 1;
  font-weight: 1000;
  color: var(--deep);
}

.per {
  margin-bottom: 18px;
  color: var(--muted);
}

.price-card .button,
.price-card .button-outline {
  margin-top: auto;
}

.fine-print {
  margin-top: 24px;
  color: var(--muted);
  font-size: 0.96rem;
}

.steps {
  grid-template-columns: repeat(3, 1fr);
  margin-top: 34px;
}

.step-number {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin-bottom: 16px;
  border-radius: 8px;
  background: var(--deep);
  color: var(--white);
  font-weight: 1000;
}

.booking-frame {
  width: 100%;
  min-height: 860px;
  border: 1px solid var(--sun-line);
  border-radius: 18px;
  background: var(--white);
  box-shadow: var(--shadow);
}

.onboarding-frame {
  min-height: 980px;
}

.booking-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 28px;
  align-items: start;
}

.booking-side {
  position: sticky;
  top: 102px;
  display: grid;
  gap: 18px;
}

.story-band {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  align-items: center;
}

.review-grid {
  display: grid;
  grid-template-columns: minmax(240px, 0.85fr) minmax(320px, 1.15fr);
  gap: 18px;
  margin-top: 32px;
}

.review-card {
  min-height: 190px;
  padding: 24px;
  border: 1px solid var(--sun-line);
  border-radius: 18px;
  background: var(--white);
  box-shadow: 0 10px 28px rgba(24, 48, 43, 0.07);
}

.review-card > span {
  display: inline-flex;
  margin-bottom: 14px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255, 138, 36, 0.14);
  color: #8a4300;
  font-size: 0.78rem;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.review-card p {
  margin-bottom: 18px;
  color: var(--muted);
}

.review-card blockquote {
  margin: 0 0 16px;
  color: var(--ink);
  font-size: 1.02rem;
  line-height: 1.55;
}

.stars {
  margin-bottom: 10px;
  color: var(--sun);
  font-weight: 1000;
  letter-spacing: 0.12em;
}

.review-author {
  margin-bottom: 14px;
  color: var(--muted);
  font-weight: 900;
}

.review-link {
  color: var(--deep);
  font-weight: 1000;
  text-decoration-color: var(--sun);
  text-underline-offset: 4px;
}

.yelp-review {
  display: block;
}

.contact-card a,
.footer-brand a {
  color: inherit;
  font-weight: 900;
  text-decoration-color: rgba(255, 138, 36, 0.75);
  text-underline-offset: 3px;
}

.policy-content {
  max-width: 900px;
}

.policy-content h2 {
  font-size: clamp(1.8rem, 3.4vw, 2.7rem);
}

.policy-content h3 {
  margin-top: 30px;
  color: var(--deep);
}

.policy-content p,
.policy-content li {
  color: var(--muted);
}

.policy-content a {
  color: var(--deep);
  font-weight: 900;
  text-decoration-color: var(--sun);
  text-underline-offset: 3px;
}

.policy-content ul {
  padding-left: 1.3rem;
}

.site-footer {
  background: #0c3f3d;
  color: var(--white);
  padding: 42px 0;
}

.footer-inner {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}

.footer-brand {
  display: flex;
  align-items: center;
  gap: 12px;
}

.footer-brand img {
  width: 56px;
  height: 56px;
  object-fit: contain;
}

.footer-brand strong {
  font-family: "Comic Kings", Inter, sans-serif;
  font-size: 1.2rem;
  font-weight: 400;
  letter-spacing: 0.04em;
  display: block;
}

.footer-brand span {
  display: block;
  color: rgba(255, 255, 255, 0.82);
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.footer-links a {
  color: rgba(255, 255, 255, 0.84);
  font-weight: 800;
  text-decoration: none;
}

.copyright {
  width: 100%;
  margin: 6px 0 0;
  color: rgba(255, 255, 255, 0.64);
  font-size: 0.88rem;
}

@media (max-width: 1100px) {
  .hero {
    min-height: 720px;
  }

  .hero-content {
    padding-top: 52px;
  }

  .quick-strip-inner,
  .feature-grid,
  .pricing-grid,
  .review-grid,
  .steps,
  .faq-layout,
  .split,
  .booking-layout,
  .story-band {
    grid-template-columns: 1fr;
  }

  .faq-nav {
    position: static;
    grid-template-columns: repeat(2, 1fr);
  }

  .booking-side {
    position: static;
  }

  .photo-stack {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 620px) {
  .nav {
    min-height: 76px;
    align-items: center;
    flex-direction: row;
    gap: 10px;
    padding: 6px 0;
  }

  .brand {
    margin-right: auto;
  }

  .desktop-nav {
    display: none !important;
  }

  .mobile-actions {
    display: flex !important;
    align-items: center;
    gap: 8px;
    margin-left: auto;
  }

  .hamburger {
    display: inline-flex !important;
  }

  .nav-toggle:checked ~ .mobile-nav {
    display: grid !important;
  }

}

@media (max-width: 620px) {
  .brand {
    min-width: 0;
    gap: 8px;
  }

  .brand > img:first-child {
    width: 66px;
    height: 58px;
  }

  .brand-wordmark {
    width: 136px;
  }

  .mobile-book {
    width: auto;
    min-height: 40px;
    padding: 10px 12px;
    font-size: 0.86rem;
  }

  .hero {
    min-height: 690px;
  }

  .hero::before {
    background-image: url("images/T_backfloat.JPG");
    background-position: center;
  }

  .hero-content {
    padding-bottom: 58px;
  }

  .hero-actions,
  .section-actions {
    flex-direction: column;
  }

  .button,
  .button-outline {
    width: 100%;
  }

  .section {
    padding: 56px 0;
  }

  .section.alt > .container,
  .section.surface > .container {
    padding: 24px;
    overflow: hidden;
  }

  .review-grid {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
  }

  .review-card {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
  }

  .yelp-review,
  .yelp-review * {
    max-width: 100% !important;
  }

  .yelp-review iframe {
    width: 100% !important;
  }

  .photo-stack {
    grid-template-columns: 1fr;
  }

  .photo-stack img:first-child,
  .photo-stack img:last-child {
    min-height: 260px;
  }

  .booking-frame {
    min-height: 780px;
  }
}