/* Card glass for Work, Services core cards and the poster cards (Film & OTT grid, Home credits).
   v97: cursor glow removed site-wide on the user's request (no gold radial layer, no gold ring, no .is-lit).
   The only hover motion on these cards is a slight grow. Glass styling itself is unchanged. */
body.page-work .work-card,body.page-services .core-services .service-detail{
 position:relative;isolation:isolate;
 background:none;border:0;border-radius:14px;box-shadow:none;
 overflow:visible;-webkit-backdrop-filter:none;backdrop-filter:none}
/* v101: the glass shell (background, border, shadow) lives on a ::before layer so the hover grow
   can scale the shell without changing the card's box, its neighbours or any text (no reflow, text stays 1x). */
body.page-work .work-card::before,body.page-services .core-services .service-detail::before{
 content:"";position:absolute;inset:0;z-index:-1;border-radius:14px;
 background:linear-gradient(145deg,rgba(255,255,255,.68),rgba(250,249,246,.46));
 border:1px solid rgba(255,255,255,.7);
 box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 0 0 1px rgba(16,42,67,.05),0 8px 24px rgba(16,42,67,.05)}
body.page-services .core-services .service-detail::before{
 background:linear-gradient(145deg,rgba(255,255,255,.6),rgba(250,249,246,.4))}
body.page-work .work-card:focus-visible{outline:2px solid #102a43;outline-offset:3px}
/* v114: backdrop-filter removed from the card shells (user request, Oct 19 - hover text must never blur).
   The frosted layer forced the browser to keep the card composited, so on Safari the scaled text was never
   re-rendered sharply while hovered. The glass look is unchanged to the eye: same gradient, border and shadow
   (measured mean pixel delta 0.28/255 with and without the frost over the page background). */
body.page-services .core-services .service-list{gap:14px;background:none;border:0}

/* Poster grids: Film & OTT page + Home featured credits. Same glass family as Work/Services cards.
   v97: Home is back to six small posters in one row on desktop (v91 look), 3 columns on tablet, phone unchanged (2 columns). */
.poster-grid{display:grid;gap:24px}
body.page-film-ott .poster-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
body.page-home .poster-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}
@media(min-width:768px) and (max-width:1100px){
 body.page-film-ott .poster-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 body.page-home .poster-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:767px){
 body.page-film-ott .poster-grid,body.page-home .poster-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}}
body.page-film-ott .poster-card,body.page-home .poster-card{
 position:relative;isolation:isolate;display:flex;flex-direction:column;
 background:rgba(255,255,255,.5);
 border:1px solid rgba(255,255,255,.7);border-radius:14px;
 box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 0 0 1px rgba(16,42,67,.05),0 8px 24px rgba(16,42,67,.05);
 overflow:hidden}
body.page-film-ott .poster-card:focus-visible,body.page-home .poster-card:focus-visible{outline:2px solid #102a43;outline-offset:3px}
.poster-frame{aspect-ratio:2/3;overflow:hidden;background:#e7e9e7}
.poster-frame img{width:100%;height:100%;object-fit:cover;display:block}
.poster-caption{padding:12px 14px 14px;display:flex;flex-direction:column;gap:2px;
 background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(250,249,246,.55));
 border-top:1px solid rgba(16,42,67,.06);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
body.page-film-ott .poster-card .poster-title,body.page-home .poster-card .poster-title{font-size:15px;font-weight:600;line-height:1.3;letter-spacing:-.01em;color:#102a43}
body.page-film-ott .poster-card .poster-year,body.page-home .poster-card .poster-year{font-size:12.5px;font-weight:400;line-height:1.4;color:#596875}
@media(max-width:767px){
 .poster-caption{padding:10px 12px 12px}
 body.page-film-ott .poster-card .poster-title,body.page-home .poster-card .poster-title{font-size:13.5px}
 body.page-film-ott .poster-card .poster-year,body.page-home .poster-card .poster-year{font-size:11.5px}}
body.page-film-ott .poster-card .poster-role,body.page-home .poster-card .poster-role{font-size:9px;font-weight:400;line-height:1.4;letter-spacing:.03em;color:#a8b2bb}

/* v103: whole-card hover grow (user request, Oct 18): the entire card - border shell, picture and text -
   grows together to 1.03, not just the ::before shell. Transform only: the card's layout box never changes,
   so neighbours never move and there is no reflow. Poster cards (Film & OTT, Home) still have no hover motion at all.
   v114 (user request, Oct 19): the grow is INSTANT - the 200ms scale transition made the browser interpolate
   its cached text raster, so the text blurred while growing (on Safari it stayed blurred for the whole hover).
   With no transition the card snaps to 1.03 in a single frame and the text is rendered at its final size.
   v115 (user request, Oct 19): the hover grow is removed from the Services core cards and the Home services
   cards (the Home rule lived inline in index.html) - on the user's DPR-1 monitor Safari still softened the
   text at scale(1.03), and he prefers no zoom over any softness. The grow stays on Work cards only.
   Services cards keep their exact glass look; they simply no longer move on hover. */
/* v116 (user request, Oct 19): hover effect copied from his Webflow reference (vatsal-chevli.webflow.io/work):
   the card LIFTS 5px (whole-pixel translateY, transform only) with a soft shadow, no scale. A whole-pixel
   translate never resamples the text raster, so titles and body text stay as sharp as at rest (scale(1.03) did soften
   them on his DPR-1 Safari). The shadow sits on the ::before shell, not on the text layer. Applies to Work cards,
   Services core cards and Home services cards; layout box never changes so neighbours never move. */
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 body.page-work .work-card,
 body.page-services .core-services .service-detail,
 body.page-home .home-services-grid .service-card{transition:transform .28s ease}
 body.page-work .work-card:hover,
 body.page-services .core-services .service-detail:hover,
 body.page-home .home-services-grid .service-card:hover{transform:translateY(-5px);opacity:1;z-index:1}
 body.page-work .work-card::before,
 body.page-services .core-services .service-detail::before,
 body.page-home .home-services-grid .service-card::before{transition:box-shadow .28s ease}
 body.page-work .work-card:hover::before,
 body.page-services .core-services .service-detail:hover::before,
 body.page-home .home-services-grid .service-card:hover::before{box-shadow:0 12px 28px rgba(16,42,67,.08)}}

/* v104: Deliverables / Project requirements keep the v103 rounded, gapped shape (user liked it) but
   return to the exact v102 colours (user request, Oct 18): flat #f3f5f5 fill, 1px hairline border in
   --line, no shadow, no glass gradient. No hover motion on these cards (earlier user request stands). */
body.page-services .deliverables .service-list{gap:14px;background:none;border:0}
body.page-services .deliverables .service-detail{
 background:#f3f5f5;border:1px solid var(--line);border-radius:14px;box-shadow:none;
 -webkit-backdrop-filter:none;backdrop-filter:none}

/* v104: the card cursor / user-select rules moved to style.css so every page gets them
   (this file only loads on Home, Work, Services and Film & OTT - Contact and About cards
   still showed the text-select I-beam). Same rules, unchanged, now site-wide. */