/* Corafter Phase 7 — supplied poster integration, scroll-stacked heroes and image-safe service cards. */
:root{--hero-stack-header:76px;--hero-stack-ink:#071b45}
/* Home hero remains pinned while following sections rise over it, creating a layered scroll reveal. */
.home-scroll-stack{position:relative;isolation:isolate;overflow:clip}
.home-scroll-stack>.rd-hero{position:sticky;top:0;z-index:0;height:100svh;min-height:680px;max-height:1000px;padding-top:calc(var(--hero-stack-header) + 48px);display:flex;align-items:center;overflow:hidden}
.home-scroll-stack>.rd-hero .hero-inner{position:relative;z-index:2;min-height:0;align-items:center}
.home-scroll-stack>.rd-hero .rd-hero-devices{width:100%;min-width:0;max-width:780px;margin-inline:auto;position:relative;isolation:isolate}
.home-scroll-stack>.rd-hero .rd-hero-devices img{display:block;width:100%;height:auto;max-height:min(70svh,700px);object-fit:contain;object-position:center;filter:drop-shadow(0 24px 50px rgba(0,10,45,.35));border-radius:24px}
.home-scroll-stack>.rd-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,16,48,.35),transparent 70%);pointer-events:none}
.home-scroll-stack>section:not(.rd-hero){position:relative;z-index:2;isolation:isolate;background:#fff;box-shadow:0 -24px 70px rgba(3,16,49,.12)}
.home-scroll-stack>.stats-strip{background:#fff;min-height:120px}
/* Every hero has deliberate depth and enough contrast behind its copy. */
.page-hero,.portfolio-hero,.service-hero{isolation:isolate;overflow:hidden}
.page-hero:before,.portfolio-hero:before,.service-hero:before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 78% 28%,rgba(30,113,255,.32),transparent 38%),linear-gradient(120deg,#061638 0%,#08245b 52%,#07183e 100%)}
.page-hero:after{content:"";position:absolute;z-index:-1;right:-2%;top:0;width:min(58%,850px);height:100%;background-position:center;background-repeat:no-repeat;background-size:contain;opacity:.68;pointer-events:none;mask-image:linear-gradient(90deg,transparent 0%,#000 22%,#000 100%)}
body.page-services .page-hero:after{background-image:url('../images/hero-posters/software-development.webp')}
body.page-about .page-hero:after{background-image:url('../images/hero-posters/enterprise-solutions.webp')}
body.page-portfolio .portfolio-hero:after{content:"";position:absolute;z-index:-1;right:0;top:0;width:58%;height:100%;background:url('../images/hero-posters/website-development.webp') center/contain no-repeat;opacity:.48;pointer-events:none}
body.page-process .page-hero:after{background-image:url('../images/hero-posters/it-consulting.webp')}
body.page-blog .page-hero:after{background-image:url('../images/hero-posters/seo-digital-solutions.webp')}
body.page-contact .page-hero:after{background-image:url('../images/hero-posters/custom-business-solutions.webp')}
/* Service-detail poster is the hero's primary visual; avoid tiny/cropped stock-like SVG collages. */
.service-hero .service-hero-grid{position:relative;z-index:1}
.service-hero .service-hero-visual{min-width:0;min-height:0;display:grid;place-items:center;position:relative}
.service-poster-frame{position:relative;width:min(100%,720px);aspect-ratio:1.52;display:grid;place-items:center;isolation:isolate;border:1px solid rgba(140,197,255,.4);border-radius:26px;overflow:hidden;background:linear-gradient(145deg,rgba(6,26,72,.5),rgba(22,91,210,.15));box-shadow:0 30px 90px rgba(0,0,0,.28),0 0 55px rgba(35,132,255,.2);transform:perspective(1200px) rotateY(-4deg);}
.service-poster-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(8,30,78,.08),transparent 50%,rgba(0,17,55,.14));pointer-events:none}
.service-poster-frame img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:#061638;}
.service-hero .service-hero-3d-stack,.service-hero .service-float,.service-hero .service-art-backdrop{display:none!important}
/* Poster artwork stays fully visible: cards use a consistent media window and contain-fit, not aggressive cropping. */
.rd-card-media,.service-overview .rd-card-wide .rd-card-media{aspect-ratio:16/10!important;min-height:0!important;background:radial-gradient(ellipse at 70% 30%,#164d9d 0%,#0a2354 58%,#061638 100%);}
.rd-card-media img,.service-overview .rd-card-wide .rd-card-media img{display:block;width:100%;height:100%;object-fit:contain!important;object-position:center!important;padding:0!important;transition:transform .45s ease,filter .45s ease;}
.rd-card-media:after{height:34%;background:linear-gradient(to top,rgba(3,14,43,.45),transparent)}
.rd-card:hover .rd-card-media img{transform:scale(1.025);filter:brightness(1.08)}
.rd-showcase .rd-poster{aspect-ratio:16/10;flex-basis:clamp(280px,34vw,460px);background:#061638}
.rd-showcase .rd-poster img{object-fit:contain;background:linear-gradient(145deg,#061638,#0b2a67)}
.rd-showcase .rd-poster-cap{transform:none;opacity:1;padding:44px 18px 16px}
/* Other content sections form opaque layers above sticky heroes. */
.page-hero,.portfolio-hero,.service-hero{position:sticky;top:0;z-index:0;min-height:620px}
.page-hero+.content-section,.page-hero+.section,.portfolio-hero+#projects,.service-page>section:not(.service-hero){position:relative;z-index:2;background:#fff}
.page-hero .container,.portfolio-hero .container,.service-hero .container{position:relative;z-index:2}
@media(max-width:900px){
 .home-scroll-stack>.rd-hero{height:auto;min-height:100svh;max-height:none;padding-top:calc(var(--hero-stack-header) + 42px);padding-bottom:42px}
 .home-scroll-stack>.rd-hero .hero-inner{grid-template-columns:1fr;gap:18px}
 .home-scroll-stack>.rd-hero .rd-hero-devices{max-width:620px;margin-top:0}
 .home-scroll-stack>.rd-hero .rd-hero-devices img{max-height:42svh}
 .service-poster-frame{width:100%;transform:none;border-radius:18px}
 .service-hero .service-hero-grid{gap:24px}
 .page-hero:after,body.page-portfolio .portfolio-hero:after{right:-12%;width:72%;opacity:.35}
 .page-hero,.portfolio-hero,.service-hero{min-height:0}
}
@media(max-width:600px){
 .home-scroll-stack>.rd-hero{min-height:100svh;padding-top:110px}
 .home-scroll-stack>.rd-hero .rd-hero-devices img{max-height:32svh;border-radius:14px}
 .rd-card-media,.service-overview .rd-card-wide .rd-card-media{aspect-ratio:16/10!important}
 .rd-showcase .rd-poster{flex-basis:min(84vw,360px)}
 .page-hero:after{right:-25%;width:100%;opacity:.24}
 .service-poster-frame{aspect-ratio:1.35}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.rd-card-media img,.rd-poster{transition:none!important}}

/* Phase 8 refinements: edge-to-edge service hero artwork and true stacked home sections. */
.service-page .service-hero{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(680px,100svh,1000px);display:flex;align-items:center;background:#071b45}
.service-page .service-hero:before{content:"";position:absolute;inset:0;z-index:-3;background:radial-gradient(ellipse at 82% 35%,rgba(26,104,255,.48),transparent 44%),linear-gradient(110deg,#061638 0%,#08245b 60%,#0b3d9d 100%)}
.service-page .service-hero:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(4,17,49,.98) 0%,rgba(4,22,61,.91) 37%,rgba(4,22,61,.42) 63%,rgba(4,22,61,.04) 100%),linear-gradient(0deg,rgba(3,15,44,.24),transparent 35%)}
.service-page .service-hero-grid{width:100%;min-height:clamp(680px,100svh,1000px);display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);align-items:center;gap:24px;position:relative;z-index:1;padding-block:calc(var(--hero-stack-header) + 42px) 70px}
.service-page .service-hero-copy{position:relative;z-index:3;max-width:650px}
.service-page .service-hero-visual{position:absolute;z-index:0;right:0;top:0;bottom:0;width:61%;height:100%;display:block;overflow:hidden;pointer-events:none}
.service-page .service-poster-frame{position:absolute;inset:0;width:100%;height:100%;max-width:none;aspect-ratio:auto;border:0;border-radius:0;overflow:hidden;background:transparent;box-shadow:none;transform:none;display:block}
.service-page .service-poster-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,22,60,.96) 0%,rgba(5,22,60,.76) 13%,rgba(5,22,60,.18) 42%,rgba(5,22,60,.02) 68%),linear-gradient(0deg,rgba(5,22,60,.24),transparent 24%);pointer-events:none}
.service-page .service-poster-frame img{width:100%;height:100%;object-fit:cover;object-position:center;background:transparent}
.service-page .service-hero .service-hero-3d-stack,.service-page .service-hero .service-float,.service-page .service-hero .service-art-backdrop{display:none!important}
.service-page .service-hero .wave{z-index:2}

/* On the homepage every major section is a full-screen layer. The next section
   arrives naturally, then overlays the preceding sticky section. */
.home-scroll-stack{position:relative;isolation:isolate;overflow:clip;--stack-section-height:100svh}
.home-scroll-stack>section{position:sticky;top:0;min-height:var(--stack-section-height);height:auto;isolation:isolate;overflow:hidden}
.home-scroll-stack>.rd-hero{z-index:1;height:var(--stack-section-height);min-height:680px;max-height:none}
.home-scroll-stack>.stats-strip{z-index:2;display:flex;align-items:center;padding-block:clamp(42px,8vh,100px);background:#f8faff;box-shadow:0 -24px 70px rgba(3,16,49,.16)}
.home-scroll-stack>.services-section{z-index:3;display:flex;align-items:center;padding-block:clamp(64px,9vh,110px);background:#fff;box-shadow:0 -24px 70px rgba(3,16,49,.14)}
.home-scroll-stack>.rd-showcase{z-index:4;display:flex;flex-direction:column;justify-content:center;padding-block:clamp(64px,9vh,110px);background:#f5f8ff;box-shadow:0 -24px 70px rgba(3,16,49,.14)}
.home-scroll-stack>.why-section{z-index:5;display:flex;align-items:center;padding-block:clamp(64px,9vh,110px);background:#fff;box-shadow:0 -24px 70px rgba(3,16,49,.14)}
.home-scroll-stack>.portfolio-section{z-index:6;display:flex;align-items:center;padding-block:clamp(64px,9vh,110px);background:#f5f8ff;box-shadow:0 -24px 70px rgba(3,16,49,.14)}
.home-scroll-stack>.process-preview{z-index:7;display:flex;align-items:center;padding-block:clamp(64px,9vh,110px);background:linear-gradient(135deg,#061638,#0a2d71 65%,#1046aa);box-shadow:0 -24px 70px rgba(3,16,49,.2)}
/* Fix: the catch-all white rule above (specificity 0,2,1) outranked the process section's own dark gradient, leaving its white copy invisible. */
.home-scroll-stack>section.process-preview{background:linear-gradient(135deg,#061638,#0a2d71 65%,#1046aa)}
.home-scroll-stack>section.process-preview .eyebrow{color:#8ecbff}
.home-scroll-stack>.cta-section{z-index:8;display:flex;align-items:center;padding-block:clamp(64px,9vh,110px);background:#fff;box-shadow:0 -24px 70px rgba(3,16,49,.14)}
.home-scroll-stack>.section>.container,.home-scroll-stack>.process-preview>.container{width:100%}
.home-scroll-stack>.rd-showcase>.container{width:100%}
@media(max-width:900px){
 .service-page .service-hero{min-height:760px;align-items:flex-start}
 .service-page .service-hero-grid{min-height:760px;grid-template-columns:1fr;align-content:start;gap:24px;padding-top:calc(var(--hero-stack-header) + 52px);padding-bottom:300px}
 .service-page .service-hero-copy{max-width:720px}
 .service-page .service-hero-visual{top:auto;bottom:0;right:0;width:100%;height:48%;opacity:.85}
 .service-page .service-hero:after{background:linear-gradient(180deg,rgba(4,17,49,.98) 0%,rgba(4,22,61,.88) 42%,rgba(4,22,61,.12) 100%)}
 .home-scroll-stack>section{min-height:100svh}
 .home-scroll-stack>.rd-hero{height:100svh;min-height:720px}
 .home-scroll-stack>.stats-strip,.home-scroll-stack>.services-section,.home-scroll-stack>.rd-showcase,.home-scroll-stack>.why-section,.home-scroll-stack>.portfolio-section,.home-scroll-stack>.process-preview,.home-scroll-stack>.cta-section{padding-block:64px}
}
@media(max-width:600px){
 .service-page .service-hero,.service-page .service-hero-grid{min-height:780px}
 .service-page .service-hero-grid{padding-top:120px;padding-bottom:270px}
 .service-page .service-hero-visual{height:38%;opacity:.78}
 .service-page .service-poster-frame img{object-fit:contain;object-position:center bottom}
 .home-scroll-stack{--stack-section-height:100svh}
 .home-scroll-stack>.rd-hero{height:100svh;min-height:740px}
 .home-scroll-stack>.stats-strip,.home-scroll-stack>.services-section,.home-scroll-stack>.rd-showcase,.home-scroll-stack>.why-section,.home-scroll-stack>.portfolio-section,.home-scroll-stack>.process-preview,.home-scroll-stack>.cta-section{padding-block:48px;min-height:100svh}
}
@media(prefers-reduced-motion:reduce){.home-scroll-stack>section{scroll-behavior:auto}}
