.perspectives-page .stories-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(12px,1.6vw,22px)}
.perspectives-page .story{position:relative;display:block;width:100%;border:0;padding:0;border-radius:0;overflow:hidden;background:#121D35;color:#EEF4FA;text-align:left;cursor:pointer;font-family:Jost,sans-serif;isolation:isolate;}
.perspectives-page .story-wide{grid-column:span 12;aspect-ratio:21/9;}
.perspectives-page .story-half{grid-column:span 6;aspect-ratio:4/3.3;}
.perspectives-page .story-third{grid-column:span 4;aspect-ratio:3/4;}
.perspectives-page .story .photo{position:absolute;inset:0;z-index:-1;}
.perspectives-page .story .photo img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.78) contrast(1.04) brightness(.86);}
.perspectives-page .story .photo:before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,#16223F 0%,#2A4A74 38%,#3A6894 62%,#9CC4E4 100%);mix-blend-mode:soft-light;opacity:.7;pointer-events:none;}
.perspectives-page .story .photo:after{content:'';position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(11,19,36,.12),rgba(11,19,36,.15) 30%,rgba(11,19,36,.88));pointer-events:none;transition:background .4s ease;}
.perspectives-page .story .over{position:absolute;bottom:clamp(24px,3vw,44px);left:clamp(24px,3vw,44px);right:clamp(24px,3vw,44px);max-height:calc(100% - 48px);overflow-y:auto;scrollbar-width:thin;}
.perspectives-page .story-wide .over{max-width:820px;}
.perspectives-page .story .line{display:block;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:400;font-size:clamp(1.5rem,2.6vw,2.4rem);line-height:1.12;color:#EEF4FA;}
.perspectives-page .story .ctx{display:block;font-family:Jost,sans-serif;font-weight:500;font-size:11.5px;line-height:1.65;text-transform:uppercase;letter-spacing:.22em;color:#9CC4E4;margin-top:18px;}
.perspectives-page .story .full{display:block;font-family:Jost,sans-serif;font-size:15.5px;font-weight:300;line-height:1.6;color:#EEF4FA;max-height:0;opacity:0;overflow:hidden;transition:max-height .6s ease,opacity .4s ease;}
.perspectives-page .story .full:before{content:'';display:block;height:20px;}
.perspectives-page .story:focus-visible{outline:2px solid #9CC4E4;outline-offset:5px;}
.perspectives-page .story:focus-visible .full,.perspectives-page .story[aria-expanded="true"] .full{max-height:300px;opacity:1;}
.perspectives-page .story:focus-visible .photo:after,.perspectives-page .story[aria-expanded="true"] .photo:after{background:linear-gradient(180deg,rgba(11,19,36,.4),rgba(11,19,36,.94));}
@media(hover:hover) and (pointer:fine){.perspectives-page .story:hover .full{max-height:300px;opacity:1}.perspectives-page .story:hover .photo:after{background:linear-gradient(180deg,rgba(11,19,36,.4),rgba(11,19,36,.94));}}
@media(max-width:859px){.perspectives-page .story{grid-column:span 12;aspect-ratio:4/4.4;}.perspectives-page .story-wide .over{max-width:none;}}
@media(prefers-reduced-motion:reduce){.perspectives-page .story .full,.perspectives-page .story .photo:after{transition:none;}}

/* The reveal icon sits beneath each attribution. */
.perspectives-page .story .story-cue{display:flex;align-items:center;margin-top:8px;padding:8px;overflow:visible;color:#9CC4E4;}
.perspectives-page .story .story-pm{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border:1px solid #9CC4E4;background:rgba(11,19,36,.45);color:#9CC4E4;font-family:Jost,sans-serif;font-size:16px;font-weight:300;line-height:1;transition:transform .3s;}
.perspectives-page .story:focus-visible .story-pm,.perspectives-page .story[aria-expanded="true"] .story-pm{transform:rotate(45deg);}
.perspectives-page .story .over{max-height:calc(100% - 48px);}
@media(hover:hover) and (pointer:fine){.perspectives-page .story:hover .story-pm{transform:rotate(45deg);}}
@media(prefers-reduced-motion:reduce){.perspectives-page .story .story-pm{transition:none;}}

/* Keep the skiers visible in the wide card and the lantern scene in the half card. */
.perspectives-page .story-wide .photo img{object-position:50% 60%;}
.perspectives-page .story .photo img[src^="/assets/responsive-v300/mum-daughter-lantern-v218-"]{object-position:50% 100%;}

/* Allow for all four corners of the rotating 26px square. */
.perspectives-page .story .story-pm{box-sizing:border-box;flex:0 0 26px;}

.perspectives-page .story .photo img[src^="/assets/responsive-v300/client-perspectives-glacier-v226-"]{object-position:25% 50%;}

/* Let the longer coaching testimonial reveal in full within the scrollable card. */
.perspectives-page .story:focus-visible #story-full-6,.perspectives-page .story[aria-expanded="true"] #story-full-6{max-height:1200px;}
@media(hover:hover) and (pointer:fine){.perspectives-page .story:hover #story-full-6{max-height:1200px;}}

/* Desktop cards reveal on hover; retain the existing mobile tap controls. */
@media(min-width:860px){
  .perspectives-page .story .story-cue{display:none;}
}
@media(min-width:860px) and (prefers-reduced-motion:no-preference){
  .perspectives-page .story .full{transition:max-height 1.4s ease,opacity 1s ease;}
}
