/* Homepage: centered photographic hero and reusable listing carousels.
   Vice-inspired cyan and pink accents over neutral surfaces. */
.home-hero {
  position:relative; isolation:isolate; display:flex; align-items:center;
  min-height:610px; overflow:hidden; background:#101820;
}
.hero-background {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 52%;z-index:-2;}
.home-hero::before {content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#0815226b,#081522a8),linear-gradient(90deg,#07344630,transparent 50%,#57283c20);}
.home-hero::after {content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#40d5e7 0%,#40d5e7 40%,var(--mtp-pink) 100%);}
.hero-content {padding-block:66px 70px;text-align:center;}
.hero-content h1 {max-width:920px;margin-inline:auto;color:#fff;font-size:clamp(3rem,5.7vw,5rem);line-height:1.05;letter-spacing:-.055em;text-wrap:balance;}
.hero-content h1 em {color:#65e1ee;font-style:normal;text-shadow:0 3px 20px #02283830;}
.hero-description {max-width:610px;margin:24px auto 30px;font-size:1.125rem;line-height:1.65;color:#f3f7fa;text-wrap:pretty;}
.hero-actions {display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:510px;margin-inline:auto;}
.hero-action {display:flex;align-items:center;justify-content:center;gap:12px;min-height:59px;padding:16px 18px;border-radius:12px;border:1px solid transparent;font-size:1rem;font-weight:700;line-height:1.3;transition:transform .2s,background .2s,box-shadow .2s;box-shadow:0 5px 18px #00000012;}
.hero-action>span:last-child {margin-left:auto;font-size:1.2rem;}
.action-hotels {background:#5bdfed;color:#10222b;}
.action-hotels:hover {background:#86eaf4;transform:translateY(-2px);}
.action-activities {background:var(--mtp-pink);color:white;}
.action-activities:hover {background:var(--mtp-pink-dark);transform:translateY(-2px);}
.action-neighborhoods {grid-column:1/-1;background:#ffffffed;color:#15252f;border-color:#ffffff90;}
.action-neighborhoods:hover {background:white;transform:translateY(-2px);}
.carousel-section { padding-top: 48px; }
.section-intro { margin-top: 12px; font-size: .9375rem; }
.listing-rail {display:grid;grid-auto-rows:1fr;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;overflow:visible;padding:4px 2px 12px;scrollbar-width:none;}
.listing-rail::-webkit-scrollbar {display:none;width:0;height:0;}
.listing-rail .listing-card {min-width:0;}
.rail-footer {display:flex;justify-content:center;margin-top:22px;}
@media(min-width:761px) and (max-width:1050px){
  .listing-rail {gap:12px;}
  .listing-rail .mtp-card-body {padding:12px;}
  .listing-rail .mtp-card h3 {font-size:1rem;}
  .listing-rail .mtp-card-actions {grid-template-columns:1fr;gap:6px;}
}
@media(max-width:760px){
  .carousel-section {padding-top:32px;}
  .carousel-section h2 {font-size:1.8rem;}
  .listing-rail {grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:84%;gap:15px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:0;}
  .listing-rail .listing-card {scroll-snap-align:start;}
  .rail-footer .text-link {font-size:.8125rem;}
}


@media(max-width:760px) {
  .home-hero {min-height:565px;}
  .hero-content {padding-block:48px 52px;}
  .hero-content h1 {font-size:clamp(2.6rem,10vw,4rem);}
  .hero-description {font-size:1rem;max-width:460px;margin-block:21px 27px;}
  .hero-background {object-position:57% center;}
  .hero-actions {gap:10px;}
  .hero-action {min-height:56px;font-size:.9375rem;padding:14px 12px;gap:8px;}
  .hero-action svg {width:19px;height:19px;}
}
@media(max-width:360px) {
  .hero-action {font-size:.875rem;padding-inline:10px;gap:6px;}
  .hero-action>span:last-child {display:none;}
}
@media(prefers-reduced-motion:no-preference) {
  .hero-content {animation:hero-arrive .55s ease-out both;}
  @keyframes hero-arrive {from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
}
@media(prefers-reduced-motion:reduce) {.hero-action:hover {transform:none;}}
@media(max-width:760px){.hero-action:not(.action-neighborhoods)>span:last-child{display:none;}}

/* Shared centered browse buttons and latest-post cards. */
.browse-all-button {min-width:210px;min-height:48px;padding:13px 24px;border-radius:10px;}









@media(max-width:760px){.browse-all-button{max-width:100%;width:auto}}

/* Only the hotel and activity archive buttons are black. */
#hotels .browse-all-button,#things-to-do .browse-all-button {background:#111317;color:#fff;border-color:#111317;}
#hotels .browse-all-button:hover,#things-to-do .browse-all-button:hover {background:#2b3037;border-color:#2b3037;}

picture.hero-background img{width:100%;height:100%;object-fit:cover;object-position:center}
