/* Homepage composition follows the measured Banff destination reference.
   These rules are intentionally isolated from the visitor guide templates. */
.home-page [hidden] { display: none !important; }
.home-page { padding-bottom: 32px; }
.home-page .destination-hero {
  position: relative;
  isolation: isolate;
  height: clamp(510px, 49.72vw, 784px);
  min-height: 510px;
  overflow: hidden;
  border-radius: 12px;
  background: #334b45;
  color: #fff;
}
.home-page .destination-hero .hero-media,
.home-page .wide-feature > .photo {
  position: absolute;
  inset: 0;
  margin: 0;
  height: 100%;
}
.home-page .destination-hero .hero-media img,
.home-page .wide-feature > .photo img {
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  border-radius: 0;
}
.home-page .hero-shade,
.home-page .feature-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #00000012 0%, #0000001c 35%, #00000042 100%);
  pointer-events: none;
}
.home-page .hero-copy {
  position: absolute;
  inset: 0;
  padding: 58px 8% 94px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  text-shadow: 0 2px 18px #00000055;
}
.home-page .hero-copy .eyebrow {
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  text-transform: none;
  letter-spacing: 0;
  margin: 0 0 26px;
}
.home-page .hero-copy h1 {
  color: #fff;
  max-width: 950px;
  font-size: clamp(54px, 5.38vw, 80px);
  font-weight: 700;
  line-height: 1.045;
  letter-spacing: -.03em;
  margin: 0;
}
.home-page .hero-copy > p:not(.eyebrow) {
  color: #fff;
  max-width: 580px;
  font-size: 19px;
  line-height: 1.5;
  margin: 22px 0 0;
}
.home-page .hero-link {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  font-size: 15px;
  font-weight: 600;
  margin-top: 22px;
  color: #fff;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}
.home-page .hero-controls {
  position: absolute;
  left: 30px;
  bottom: 24px;
  display: flex;
  align-items: center;
  gap: 4px;
  z-index: 2;
}
.home-page .season-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding-right: 16px;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}
.home-page .hero-choice,
.home-page .hero-pause {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #fff;
  font-size: 12px;
  cursor: pointer;
}
.home-page .hero-choice {
  border: 1px solid #ffffff70;
  width: 44px;
  height: 44px;
  margin: 0 3px;
}
.home-page .hero-choice[aria-pressed="true"] {
  color: var(--plum, #43273b);
  background: #fff;
  border-color: #fff;
}
.home-page .hero-pause { border: 1px solid #ffffff70; margin-left: 8px; }
.home-page .hero-media figcaption,
.home-page .wide-feature > .photo figcaption {
  position: absolute;
  bottom: 17px;
  right: 24px;
  z-index: 2;
  max-width: 38%;
  margin: 0;
  color: #fff;
  text-align: right;
  font-size: 12px;
  line-height: 1.45;
  text-shadow: 0 1px 5px #000;
}
.home-page .hero-media figcaption a,
.home-page .wide-feature > .photo figcaption a { color: inherit; }
.home-page :is(.destination-hero, .wide-feature, .image-story) :focus-visible {
  outline: 3px solid #fff;
  outline-offset: 5px;
}
.home-page .discovery-section { margin: 128px 0 0; }
.home-page .section-heading { margin-bottom: 28px; }
.home-page .section-heading h2,
.home-page .planning-section > h2 {
  font-size: 30px;
  line-height: 1.07;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--ink, #262626);
  margin: 0;
}
.home-page .discovery-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 32px;
  margin: 0 0 28px;
}
.home-page .discovery-tabs button {
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  min-height: 44px;
  padding: 11px 0 12px;
  background: transparent;
  color: var(--ink, #262626);
  font-size: 15px;
  line-height: 17px;
  cursor: pointer;
}
.home-page .discovery-tabs button[aria-pressed="true"] {
  border-bottom-color: var(--ink, #262626);
  font-weight: 700;
}
.home-page .discovery-tabs button:hover { border-bottom-color: var(--accent, #ea7660); }
.home-page .discovery-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}
html:not(.js-enhanced) .home-page .discovery-panel + .discovery-panel { margin-top: 48px; }
.home-page .discovery-card {
  display: block;
  min-width: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-decoration: none;
}
.home-page .discovery-card img {
  display: block;
  width: 100%;
  aspect-ratio: 261 / 294;
  height: auto;
  object-fit: cover;
  border-radius: 12px;
  transition: filter .2s ease;
}
.home-page .discovery-card strong {
  display: block;
  margin: 18px 0 8px;
  font-size: 19px;
  line-height: 21px;
  letter-spacing: -.015em;
  font-weight: 700;
}
.home-page .discovery-card .card-detail {
  display: block;
  color: #53534f;
  font-size: 14px;
  line-height: 1.5;
}
.home-page .discovery-card:hover img { filter: brightness(.93); }
.home-page .discovery-card:hover strong { text-decoration: underline; text-underline-offset: 4px; }
.home-page .discovery-credit {
  margin: 20px 0 0;
  font-size: 12px;
  line-height: 1.6;
  color: #66635d;
}
.home-page .wide-feature {
  position: relative;
  isolation: isolate;
  height: 480px;
  border-radius: 12px;
  overflow: hidden;
  margin: 112px 0 0;
  color: #fff;
  background: #334b45;
}
.home-page .wide-feature .feature-shade { background: #00000042; }
.home-page .feature-copy {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 55px 10%;
  text-align: center;
}
.home-page .feature-copy h2 {
  max-width: 780px;
  margin: 0;
  font-size: clamp(36px, 3.8vw, 54px);
  line-height: 1.08;
  color: #fff;
}
.home-page .feature-copy p {
  max-width: 590px;
  margin: 20px 0 26px;
  font-size: 18px;
  line-height: 1.5;
  color: #fff;
}
.home-page .feature-copy .button {
  color: var(--plum, #43273b);
  background: #fff;
  min-height: 48px;
  align-items: center;
  padding: 12px 26px;
}
.home-page .story-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin: 112px 0 0;
}
.home-page .image-story {
  position: relative;
  isolation: isolate;
  display: block;
  aspect-ratio: 1.25;
  min-width: 0;
  width: 100%;
  min-height: 340px;
  overflow: hidden;
  border-radius: 12px;
  color: #fff;
  background: #334b45;
  text-decoration: none;
}
.home-page .image-story::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 15%, #00000026 42%, #000000ab 100%);
  pointer-events: none;
}
.home-page .image-story > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}
.home-page .image-story:hover > img { transform: scale(1.025); }
.home-page .story-copy { position: absolute; left: 34px; right: 34px; bottom: 30px; z-index: 1; }
.home-page .story-copy h2 { font-size: 32px; line-height: 1.08; color: #fff; margin: 0 0 14px; }
.home-page .story-copy p { font-size: 16px; line-height: 1.5; color: #fff; max-width: 400px; margin: 0 0 18px; }
.home-page .story-copy span { font-size: 14px; font-weight: 700; text-decoration: underline; text-underline-offset: 5px; }
.home-page .planning-section { margin: 112px 0 0; }
.home-page .planning-section > h2 { margin-bottom: 36px; }
.home-page .planning-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 32px;
}
.home-page .planning-grid > a {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 23px 0 5px;
  border-top: 1px solid #bdbbb0;
  text-decoration: none;
}
.home-page .planning-grid strong { display: block; font-size: 21px; line-height: 1.15; letter-spacing: -.015em; }
.home-page .planning-grid p { font-size: 15px; line-height: 1.6; color: #53534f; margin: 16px 0 24px; }
.home-page .planning-grid span { font-size: 14px; font-weight: 700; margin-top: auto; text-decoration: underline; text-underline-offset: 5px; }
.home-page .planning-grid > a:hover span { color: var(--plum, #43273b); text-decoration-thickness: 2px; }
.home-page .editorial-feature {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 72px;
  align-items: center;
  margin: 112px 0 0;
  background: var(--paper, #f7f5eb);
}
.home-page .editorial-feature > .photo { margin: 0; }
.home-page .editorial-feature > .photo img {
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: 1.05;
  object-fit: cover;
  border-radius: 12px;
}
.home-page .editorial-copy { padding: 28px 0; }
.home-page .editorial-copy .eyebrow { color: var(--plum, #43273b); font-size: 12px; }
.home-page .editorial-copy h2 { font-size: 40px; line-height: 1.1; letter-spacing: -.025em; margin: 0 0 24px; }
.home-page .editorial-copy p:not(.eyebrow) { font-size: 17px; line-height: 1.65; margin: 0 0 27px; }
.home-page .editorial-copy .button { min-height: 48px; align-items: center; background: var(--plum, #43273b); }
@media (max-width: 900px) {
  .home-page .destination-hero { height: 580px; }
  .home-page .hero-copy h1 { font-size: 60px; }
  .home-page .discovery-grid, .home-page .planning-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 24px; }
  .home-page .discovery-section { margin-top: 88px; }
  .home-page .story-pair, .home-page .wide-feature, .home-page .planning-section, .home-page .editorial-feature { margin-top: 88px; }
  .home-page .image-story { min-height: 360px; }
  .home-page .story-copy { left: 24px; right: 24px; bottom: 26px; }
  .home-page .story-copy h2 { font-size: 28px; }
  .home-page .story-copy p { font-size: 15px; }
  .home-page .editorial-feature { gap: 36px; }
  .home-page .editorial-copy h2 { font-size: 32px; }
}
@media (max-width: 640px) {
  .home-page { padding-bottom: 12px; }
  .home-page .destination-hero { height: 520px; min-height: 0; }
  .home-page .hero-copy { padding: 40px 22px 112px; }
  .home-page .hero-copy h1 { font-size: 44px; line-height: 1.07; }
  .home-page .hero-copy .eyebrow { margin-bottom: 20px; font-size: 13px; }
  .home-page .hero-copy > p:not(.eyebrow) { font-size: 17px; margin-top: 18px; }
  .home-page .hero-link { margin-top: 16px; font-size: 14px; }
  .home-page .hero-controls { left: 18px; right: 18px; bottom: 37px; gap: 0; flex-wrap: wrap; }
  .home-page .season-link { font-size: 12px; padding-right: 6px; }
  .home-page .hero-choice { width: 44px; height: 44px; margin: 0 2px; }
  .home-page .hero-pause { margin-left: 2px; }
  .home-page .hero-media figcaption { right: 18px; bottom: 12px; max-width: calc(100% - 36px); font-size: 12px; }
  .home-page .discovery-section, .home-page .story-pair, .home-page .wide-feature,
  .home-page .planning-section, .home-page .editorial-feature { margin-top: 56px; }
  .home-page .section-heading { margin-bottom: 20px; }
  .home-page .section-heading h2, .home-page .planning-section > h2 { font-size: 28px; line-height: 1.12; }
  .home-page .discovery-tabs { gap: 8px 24px; margin-bottom: 24px; }
  .home-page .discovery-tabs button { font-size: 14px; }
  .home-page .wide-feature { height: 340px; }
  .home-page .feature-copy { padding: 30px 24px 40px; }
  .home-page .feature-copy h2 { font-size: 32px; }
  .home-page .feature-copy p { font-size: 16px; margin: 16px 0 20px; }
  .home-page .wide-feature > .photo figcaption { font-size: 12px; right: 16px; bottom: 12px; max-width: 80%; }
  .home-page .story-pair, .home-page .editorial-feature { grid-template-columns: 1fr; gap: 24px; }
  .home-page .image-story { min-height: 340px; }
  .home-page .story-copy h2 { font-size: 30px; }
  .home-page .planning-section > h2 { margin-bottom: 26px; }
  .home-page .planning-grid { gap: 28px 20px; }
  .home-page .planning-grid strong { font-size: 20px; }
  .home-page .planning-grid p { font-size: 14px; }
  .home-page .editorial-copy { padding: 7px 0 0; }
  .home-page .editorial-copy h2 { font-size: 32px; margin-bottom: 20px; }
  .home-page .editorial-copy p:not(.eyebrow) { font-size: 16px; }
}
@media (max-width: 540px) {
  .home-page .discovery-grid { grid-template-columns: 1fr; gap: 30px; }
  .home-page .discovery-card img { aspect-ratio: 1.12; }
  .home-page .planning-grid { grid-template-columns: 1fr; gap: 24px; }
  .home-page .planning-grid p { margin: 12px 0 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .home-page *, .home-page *::before, .home-page *::after { transition: none !important; animation: none !important; }
  .home-page .image-story:hover > img { transform: none; }
}

/* Controls enhance the complete static page only after handlers are ready. */
html:not(.js-enhanced) .home-page .hero-controls button,
html:not(.js-enhanced) .home-page .discovery-tabs { display: none; }
.home-page .hero-pause:disabled { opacity: .5; cursor: default; }

/* Keep photo controls aligned even on a 320px viewport. */
@media(max-width:640px){
 .home-page .hero-controls{display:grid;grid-template-columns:repeat(4,44px);gap:4px;bottom:40px}
 .home-page .season-link{grid-column:1/-1;min-height:28px}
 .home-page .hero-choice,.home-page .hero-pause{margin:0}
 .home-page .hero-copy{padding-bottom:144px}
}
.home-page .hero-media figcaption,.home-page .wide-feature>.photo figcaption{background:#0009;padding:3px 6px;border-radius:4px}

/* The canvas uses source-coordinate masks, so it follows the image's cover crop. */
.home-page .hero-motion{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.home-page .hero-media figcaption{z-index:3}
html:not(.js-enhanced) .home-page .motion-note{display:none}
@media(prefers-reduced-motion:reduce){.home-page .hero-motion,.home-page .motion-note{display:none!important}}

/* Match the original photo crop without changing the destination layout. */
.home-page .hero-video{object-fit:cover;object-position:center 10%}
.home-page .destination-hero:has(.hero-choice:first-of-type[aria-pressed="true"]) .hero-media img{object-position:center 10%}

/* Central photo attribution: accessible footer link, full records and matching thumbnails. */
.photo-credit-entry{display:grid;grid-template-columns:minmax(180px,320px) minmax(0,1fr);gap:32px;padding:32px 0;border-bottom:1px solid #dedbd1;scroll-margin-top:120px}
.photo-credit-entry img{display:block;width:100%;height:auto;border-radius:8px}
.photo-credit-entry h3{margin:0 0 12px;font-size:1.5rem}
.photo-credit-entry p{margin:0 0 12px;line-height:1.6;overflow-wrap:anywhere}
.photo-credit-entry .credit-work-title{color:#555;font-size:.9rem}
.photo-credits-list{max-width:1000px;margin:0 auto 64px}
.home-page .hero-media figcaption.motion-note{font-size:11px}
/* Each photograph has one site-wide placement; other panels use intentional text layouts. */
.home-page .discovery-card:not(:has(img)){border-top:1px solid var(--line);padding:24px 0;min-height:160px}
.home-page .wide-feature:not(:has(img)){height:auto;min-height:0;background:var(--plum)}
.home-page .wide-feature:not(:has(img)) .feature-copy{position:relative;padding:52px 8%}
.home-page .wide-feature:not(:has(img)) .feature-shade{display:none}
.home-page .image-story:not(:has(img)){background:var(--paper);color:var(--ink);border:1px solid var(--line)}
.home-page .image-story:not(:has(img))::after{display:none}
.home-page .image-story:not(:has(img)) .story-copy :is(h2,p){color:var(--ink)}
.home-page .editorial-feature:not(:has(img)){display:block;padding:36px clamp(24px,5vw,64px);border-radius:12px}
.home-page .editorial-feature:not(:has(img)) .editorial-copy{max-width:760px}
@media(max-width:640px){.photo-credit-entry{grid-template-columns:1fr;gap:20px}.photo-credit-entry img{max-width:400px}}