/* Public Check-in page only. Every rule is scoped to .checkin-feature-page.
   White throughout except the dark hero and the "Two ways to ask" band (.story-dark). The page base, the hero (its default
   placement fits this tablet photo: tablet and hands x 695-1580, y 130-775 in the 1672x941 source), the type
   scale, screenshot frames, the lightbox, reveals and the related/FAQ/CTA sections come from feature-story.css
   (sharedStory: true). */

/* The tablet photo's backdrop is a studio gradient, #1f1f1f at the top to #94959a at the bottom. On wide screens the
   band repeats it so the faded photo edge disappears, and darkens it behind the copy (eased, so the fade has no
   visible edge) so the white text stays above 7:1. On narrow screens the photo's top edge fades into the band. */
@media(min-width:1001px){
 .checkin-feature-page .story-hero{background:linear-gradient(to right,#222 34%,rgba(34,34,34,.9) 40%,rgba(34,34,34,.6) 47%,rgba(34,34,34,.25) 55%,rgba(34,34,34,0) 64%),linear-gradient(#1f1f1f,#94959a) #222;}
}
@media(max-width:1000px){
 .checkin-feature-page .story-hero__art{-webkit-mask-image:linear-gradient(transparent,#000 20%);mask-image:linear-gradient(transparent,#000 20%);}
}
/* Phones: the angled tablet spans more of the photo's width than the kit's crop leaves room for. */
@media(max-width:760px){
 .checkin-feature-page{--story-hero-crop-top:-12%;--story-hero-crop-width:160%;}
}

/* The first thirty seconds: a centred intro, then the kit's step rail (.story-rail). */
.checkin-feature-page .cif-flow{padding:var(--story-section-space) 0;scroll-margin-top:80px;}

.checkin-feature-page .cif-style__grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(32px,5vw,64px);align-items:center;}
.checkin-feature-page .cif-style__grid p:not(.story-label){margin:22px 0 0;max-width:var(--story-measure);font-size:var(--story-text-body);}

.checkin-feature-page .cif-desk{padding:var(--story-section-space) 0;}
.checkin-feature-page .cif-desk__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(48px,7vw,100px);align-items:center;}
.checkin-feature-page .cif-desk h2{max-width:20ch;}
.checkin-feature-page .cif-desk__body{margin:22px 0 0;max-width:var(--story-measure);color:var(--story-body-muted);font-size:var(--story-text-body);}
.checkin-feature-page .cif-visual--desk{width:min(100%,322px);justify-self:center;}

@media(max-width:760px){
 .checkin-feature-page :is(.cif-style__grid,.cif-desk__grid){grid-template-columns:1fr;gap:28px;}
 .checkin-feature-page .cif-visual--desk{justify-self:start;}
}
