/* Opportunity storytelling, scoped to the home wrapper; native card/drawer styles are untouched. */
.p-opportunity-track.op-motion-enabled {
  background: var(--op-background, #1a2b3e);
  min-height: 0;
}
.op-motion-enabled .p-opportunities {
  position: sticky;
  background: var(--op-background, #1a2b3e);
  min-height: 100svh;
  justify-content: center;
}
.op-motion-enabled .p-section-head,
.op-motion-enabled .p-carousel-bottom {
  opacity: var(--op-copy-opacity, 1);
  transform: translateY(var(--op-copy-y, 0px));
}
.op-motion-enabled .p-card-rail {
  transform: translateX(var(--op-rail-x, 0px));
  will-change: transform;
}
/* Do not leave a long pinned scene or obscure content when motion is paused. */
body.motion-paused .p-opportunity-track.op-motion-enabled {
  height: auto !important;
  background: #f1f1f2 !important;
}
body.motion-paused .op-motion-enabled .p-opportunities {
  position: relative !important;
  top: auto !important;
  background: #f1f1f2 !important;
}
body.motion-paused .op-motion-enabled .p-section-head,
body.motion-paused .op-motion-enabled .p-carousel-bottom {
  opacity: 1 !important;
  transform: none !important;
}
body.motion-paused .op-motion-enabled .p-card-rail { transform: none !important; }
@media (prefers-reduced-motion: reduce) {
  .p-opportunity-track.op-motion-enabled { height: auto !important; background: #f1f1f2 !important; }
  .op-motion-enabled .p-opportunities { position: relative !important; top: auto !important; background: #f1f1f2 !important; }
  .op-motion-enabled .p-section-head, .op-motion-enabled .p-carousel-bottom { opacity: 1 !important; transform: none !important; }
  .op-motion-enabled .p-card-rail { transform: none !important; }
}

/* Compact screens: let native cards occupy the whole screen while they move. */
.ips-preview:not(.interior).op-cards-active .p-header{transform:translateY(-110%);transition:transform .35s ease,background .3s,height .3s}
@media(prefers-reduced-motion:reduce){.ips-preview:not(.interior).op-cards-active .p-header{transform:none}}

/* Both titles occupy the same header slot; the carousel remains visible. */
.p-op-title-swap{display:grid}
.p-op-title-swap>span{grid-area:1 / 1;align-self:start}
.p-op-title-blue{visibility:hidden;opacity:0}
.op-motion-enabled .p-op-title-blue{visibility:visible;opacity:var(--op-intro-opacity,0)}
.op-motion-enabled .p-op-title-white{opacity:var(--op-title-white,1)}
.op-motion-enabled .p-section-head,.op-motion-enabled .p-carousel-bottom,.op-motion-enabled .p-card-window{opacity:1;transform:none}
.op-motion-enabled .p-section-head :is(h2,.p-eyebrow),.op-motion-enabled .p-section-aside p,.op-motion-enabled .p-carousel-controls,.op-motion-enabled .p-carousel-bottom>.p-caption{color:var(--op-ink,#1a2b3e)}
.op-motion-enabled .p-carousel-controls button{color:var(--op-ink,#1a2b3e);border-color:currentColor}
body.motion-paused .p-op-title-blue{visibility:hidden;opacity:0}
body.motion-paused .p-op-title-white{opacity:1}
@media(prefers-reduced-motion:reduce){.p-op-title-blue{visibility:hidden!important;opacity:0!important}.p-op-title-white{opacity:1!important}}

/* Laptop-height carousel: fit the heading, complete cards and CTA together. */
@media (min-width:761px) and (max-height:950px){
 .op-motion-enabled .p-opportunities{padding:88px 0 22px;justify-content:center}
 .p-opportunities .p-section-head{margin-bottom:20px;gap:28px}
 .p-opportunities .p-section-head h2{font-size:clamp(32px,5.1svh,48px);line-height:1.08}
 .p-opportunities .p-section-head .p-eyebrow{margin-bottom:10px;font-size:9px}
 .p-opportunities .p-section-aside p{font-size:11px;line-height:1.6}
 .p-opportunities .p-carousel-controls{margin-top:12px}
 .p-opportunities .p-card-slot{width:clamp(238px,32svh,285px);flex-basis:clamp(238px,32svh,285px)}
 .p-opportunities .p-card-rail{gap:20px}
 .p-opportunities .ips-card-photo{height:clamp(130px,18svh,165px);min-height:0;aspect-ratio:auto}
 .p-opportunities .ips-card-body{padding:14px}
 .p-opportunities .ips-card-location{font-size:10px;line-height:1.5}
 .p-opportunities .ips-card-title{font-size:16px;line-height:1.3;min-height:42px;margin:7px 0 8px}
 .p-opportunities .ips-card-price{margin:8px 0 10px}
 .p-opportunities .ips-card-price>span{font-size:11px}
 .p-opportunities .ips-card-price>strong{font-size:25px;line-height:1.2}
 .p-opportunities .ips-card-facts{padding:11px 0;gap:10px 8px}
 .p-opportunities .ips-card-facts dt,.p-opportunities .ips-card-metrics dt{font-size:10px;line-height:1.4}
 .p-opportunities .ips-card-facts dd{font-size:12px;line-height:1.4}
 .p-opportunities .ips-card-metrics{margin-top:11px;gap:8px}
 .p-opportunities .ips-card-metrics dd{font-size:14px;line-height:1.5}
 .p-opportunities .ips-card-actions{margin-top:10px}
 .p-opportunities .ips-card-open{font-size:11px;min-height:32px;padding:7px 0}
 .p-opportunities .p-carousel-bottom{padding-top:12px}
 .p-opportunities .p-carousel-bottom .p-button{padding:13px 20px}
}
/* On very short windows retain comfortable text and allow ordinary page flow. */
@media (min-width:761px) and (max-height:680px){
 .op-motion-enabled .p-opportunities{padding-top:76px;justify-content:flex-start}
 .p-opportunities .p-section-head{margin-bottom:14px}
 .p-opportunities .p-section-head h2{font-size:30px}
}
@media (min-width:761px) and (max-height:800px){
 .op-motion-enabled .p-opportunities{padding-top:82px;padding-bottom:10px}
 .p-opportunities .p-section-head{margin-bottom:14px;align-items:center}
 .p-opportunities .p-section-head h2{font-size:32px}
 .p-opportunities .p-section-aside p{font-size:10px;line-height:1.45}
 .p-opportunities .p-carousel-controls{margin-top:8px}
 .p-opportunities .ips-card-photo{height:120px}
 .p-opportunities .ips-card-body{padding:12px}
 .p-opportunities .ips-card-location{margin-bottom:4px!important}
 .p-opportunities .ips-card-title{margin:0 0 8px!important}
 .p-opportunities .ips-card-price{margin:4px 0 8px}
 .p-opportunities .ips-card-facts{padding:8px 0;gap:8px}
 .p-opportunities .ips-card-metrics{margin-top:8px}
 .p-opportunities .ips-card-actions{margin-top:6px}
 .p-opportunities .p-carousel-bottom{padding-top:8px}
 .p-opportunities .p-carousel-bottom .p-button{padding:10px 16px}
}

.op-motion-enabled .p-carousel-controls>span{color:var(--op-ink,#1a2b3e)}
