@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap");
:root{--bg:#0b0c0f;--surface:#111318;--surface-2:#151820;--ink:#f3f4f6;--muted:#9298a3;--line:#272b33;--accent:#c7ff52;--blue:rgba(91,108,255,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;background:radial-gradient(900px 600px at 78% 8%,var(--blue),transparent 65%),var(--bg);color:var(--ink);font:400 17px/1.62 "DM Sans",sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}
.site-header{min-height:78px;padding:0 5vw;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:rgba(11,12,15,.88);backdrop-filter:blur(14px);z-index:20}.brand{font:700 28px "Space Grotesk";letter-spacing:-.08em}.brand span{color:#7f8590}.site-header nav{display:flex;gap:30px;font-size:14px;color:#aeb4be}.site-header nav a:hover,.header-cta:hover{color:#fff}.header-cta{font-weight:600;font-size:14px}
.back{display:block;max-width:1240px;margin:auto;padding:24px 6vw 0;color:#9da4af;font-size:13px}.back:hover{color:#fff}
.case-hero,.intro{padding:70px 6vw 54px;border-bottom:1px solid var(--line)}.eyebrow{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#7d8592}.case-hero h1,.intro h1{font:600 clamp(50px,7vw,94px)/.94 "Space Grotesk";letter-spacing:-.07em;max-width:1050px;margin:18px 0 22px}.case-hero .lede,.case-hero .intro-lead,.intro .intro-lead{font-size:21px;color:#a9afb9;max-width:780px}.meta,.case-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-block:1px solid var(--line);margin-top:48px}.meta div,.case-meta div{min-width:0;padding:22px 18px 22px 0;border-right:1px solid var(--line)}.meta div:not(:first-child),.case-meta div:not(:first-child){padding-left:18px}.meta div:last-child,.case-meta div:last-child{border-right:0}.meta b,.case-meta small{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#747c89;margin-bottom:4px}.meta span,.case-meta strong{color:#d1d5dc;font-weight:500}
.section,.case-body{padding:72px 6vw;border-bottom:1px solid var(--line)}.case-body{max-width:1240px;margin:auto}.section h2,.case-body h2{font:600 clamp(34px,4.4vw,60px)/1 "Space Grotesk";letter-spacing:-.055em;margin:6px 0 18px}.section p,.case-body p,.case-body li{max-width:820px;color:#a1a8b2}.step{display:grid;grid-template-columns:80px minmax(0,1fr);gap:28px;margin-top:38px}.step-no{font:600 14px "Space Grotesk";color:#69717d;padding-top:6px}.step h3{font:600 27px "Space Grotesk";margin:0 0 8px}.step p{margin:0 0 12px}
.grid,.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(32px,6vw,90px)}.grid>*,.two>*{min-width:0}.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:38px}.facts div{background:var(--surface-2);padding:25px}.facts strong{display:block;font:600 32px "Space Grotesk";letter-spacing:-.04em}.facts span{font-size:12px;color:#7f8793}
details{border-top:1px solid var(--line);padding:0}details:last-child{border-bottom:1px solid var(--line)}summary{list-style:none;cursor:pointer;padding:23px 0;font:600 20px "Space Grotesk";display:flex;justify-content:space-between;align-items:center;color:#e7e9ed}summary::-webkit-details-marker{display:none}summary:after{content:'+';font:400 24px "DM Sans";color:#737b87}details[open] summary:after{content:'−'}details .detail{padding:0 0 28px;max-width:820px}.detail ul{padding-left:20px}.detail li{margin:8px 0;color:#a1a8b2}
.result{margin:24px 0 0;padding:18px 20px;border-left:2px solid #6876ff;background:#11151d;color:#d8dbe1;max-width:820px}.result b{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#7f8cff;margin-bottom:5px}.quote{border-left:3px solid #8b94ff;padding:6px 0 6px 20px;font:500 23px/1.35 "Space Grotesk";max-width:820px;margin:30px 0;color:#e7e9ed}
.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:35px}.gallery figure,.evidence-stack figure{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden}.gallery img,.evidence-stack img,.wide-diagram img,.wide-image img,.product-detail-image img,.case-body img,.section img{display:block;width:100%;max-width:100%;height:auto!important;max-height:none!important;object-fit:contain;background:#0e1014}.gallery .large{grid-column:1/-1}.gallery figcaption,.evidence-stack figcaption{font-size:11px;color:#737b87;padding:11px 14px}.evidence-stack{display:grid;gap:20px;margin-top:35px}.wide-diagram{margin-top:32px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px;overflow:hidden}.product-detail-image{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;margin:0 0 40px;overflow:hidden}.product-detail-image span{display:block;color:#747c89;font-size:12px;margin-bottom:12px}.product-detail-image img{border-radius:10px}
.wide-image{margin:0 6vw;overflow:hidden}.wide-image img{border:1px solid var(--line);border-radius:16px}.dark,.outcome{background:#08090c;color:#fff}.dark p,.outcome p,.dark .eyebrow,.outcome .eyebrow{color:#aeb4be}.outcomes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:50px;border-top:1px solid #292e37}.outcomes div{padding:30px;border-right:1px solid #292e37}.outcomes div:last-child{border:0}.outcomes strong{font:600 48px "Space Grotesk";display:block}.closing{padding:80px 6vw 110px;text-align:left}.closing h2{font:600 48px/1 "Space Grotesk";letter-spacing:-.055em;margin:0}.closing p{color:#7f8793;margin:15px 0;max-width:620px}.contact{padding:90px 6vw;background:linear-gradient(135deg,#11151d,#0b0c0f);border-top:1px solid var(--line)}footer{padding:25px 5vw;border-top:1px solid var(--line);font-size:11px;color:#777;display:flex;justify-content:space-between}
/* Strict image containment: no forced heights, no overflow, fluid width */
figure,img{max-width:100%}.case-body figure,.section figure{max-width:100%;overflow:hidden}.case-body .hero-image{width:100%;height:auto!important;max-height:none!important;object-fit:contain}
@media(max-width:900px){.site-header{padding:0 20px}.site-header nav{gap:18px;font-size:12px}.case-hero,.intro,.section,.case-body,.closing{padding-left:20px;padding-right:20px}.back{padding-left:20px;padding-right:20px}.meta,.case-meta{grid-template-columns:1fr 1fr}.meta div:nth-child(2),.case-meta div:nth-child(2){border-right:0}.step{grid-template-columns:45px minmax(0,1fr);gap:14px}.facts,.outcomes{grid-template-columns:1fr}.outcomes div{border-right:0;border-bottom:1px solid #292e37}.gallery{grid-template-columns:1fr}.gallery .large{grid-column:auto}.grid,.two{grid-template-columns:1fr;gap:40px}.case-hero h1,.intro h1{font-size:clamp(48px,10vw,68px)}.intro-lead,.case-hero .lede{font-size:18px}.wide-image{margin:0 20px}}
@media(max-width:620px){.site-header{min-height:68px}.site-header nav{display:none}.header-cta{font-size:12px}.case-hero,.intro{padding-top:52px}.meta,.case-meta{grid-template-columns:1fr}.meta div,.meta div:not(:first-child),.case-meta div,.case-meta div:not(:first-child){padding:18px 0;border-right:0;border-bottom:1px solid var(--line)}.meta div:last-child,.case-meta div:last-child{border-bottom:0}.step{grid-template-columns:1fr;gap:4px}.step-no{padding-top:0}.section,.case-body{padding-top:55px;padding-bottom:55px}.closing h2{font-size:38px}.product-detail-image{padding:12px}.gallery{gap:16px}.back{padding-top:18px}}


/* v1.2 shared case-study shell and fluid media QA */
.case-topbar{max-width:1400px;margin:0 auto;padding:22px clamp(20px,4vw,56px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.09)}
.case-brand{font-size:26px;font-weight:700;letter-spacing:-.04em;text-decoration:none}
.case-brand span{opacity:.45}
.case-back{font-size:14px;text-decoration:none;opacity:.72}
.case-back:hover{opacity:1}
.case-body img,.case-hero img,.gallery img,.wide-diagram img,.product-detail-image img,.evidence-stack img{display:block;width:100%;max-width:100%;height:auto;object-fit:contain}
.case-body figure,.case-hero figure,.gallery figure,.wide-diagram,.product-detail-image,.evidence-stack{max-width:100%;overflow:hidden}
.case-body .container,.case-hero.container{width:100%;}
@media (max-width: 767.98px){
  .case-topbar{padding:16px 18px}
  .case-back{font-size:13px}
  .case-body,.case-hero{padding-left:18px;padding-right:18px}
  .case-body img,.case-hero img{width:100%;}
}

/* v1.3 FedFina master case-study treatment — scoped to this page only */
.fedfina-case .fedfina-hero{padding-top:86px;padding-bottom:0}
.fedfina-case .fedfina-hero h1{margin-bottom:20px}
.fedfina-case .fedfina-hero-note{color:#8f97a3;font-size:15px;line-height:1.65;margin:0 0 8px}
.fedfina-case .meta{margin-top:58px}
.fedfina-case .meta>div{padding:22px 18px 22px 0;border-right:1px solid var(--line)}
.fedfina-case .meta>div:not(:first-child){padding-left:18px}
.fedfina-case .meta>div:last-child{border-right:0}
.fedfina-visual-section{padding:42px 0 78px;border-bottom:1px solid var(--line)}
.fedfina-visual-frame{background:#151922;border:1px solid #282d37;border-radius:20px;padding:14px;overflow:hidden}
.fedfina-visual-frame img{display:block;width:100%;height:auto;border-radius:12px}
.fedfina-case .visual-caption{font-size:11px;color:#737b87;margin:12px 4px 0}
.fedfina-section{padding-top:92px;padding-bottom:92px}
.fedfina-case .case-kicker{font-size:10px;font-weight:700;letter-spacing:.14em;color:#737c8a;text-transform:uppercase;margin:8px 0 0}
.fedfina-case .fedfina-section h2{max-width:820px}
.fedfina-dark-section{background:#08090c}
.fedfina-principles{margin-top:42px}
.fedfina-principles>div>div{height:100%;padding:22px;border:1px solid #272c35;background:#101219;border-radius:12px;display:flex;gap:16px;align-items:flex-start}
.fedfina-principles strong{font:600 13px "Space Grotesk";color:#6876ff}
.fedfina-principles span{font-size:14px;color:#b0b6c0;line-height:1.5}
.fedfina-steps{margin-top:38px;border-top:1px solid var(--line)}
.fedfina-steps article{display:flex;gap:24px;padding:28px 0;border-bottom:1px solid var(--line)}
.fedfina-steps article>span{font:600 13px "Space Grotesk";color:#6876ff;padding-top:4px;flex:0 0 28px}
.fedfina-steps h3{font:600 24px "Space Grotesk";margin:0 0 8px}
.fedfina-steps p{margin:0}
.fedfina-gallery{margin-top:34px}
.fedfina-gallery figure{background:#111318;border-color:#282d37}
.fedfina-gallery img{width:100%;height:auto;display:block}
.fedfina-result{margin-top:32px;border-left:2px solid #6876ff;background:#11151d;padding:20px 22px;color:#d4d8df;font-size:14px;line-height:1.6}
.fedfina-closing{padding-top:90px;padding-bottom:120px}
@media(max-width:767.98px){
 .fedfina-case .fedfina-hero{padding-top:58px}
 .fedfina-case .meta{margin-top:42px}
 .fedfina-case .meta>div,.fedfina-case .meta>div:not(:first-child){padding:18px 0;border-right:0;border-bottom:1px solid var(--line)}
 .fedfina-case .meta>div:last-child{border-bottom:0}
 .fedfina-visual-section{padding-top:28px;padding-bottom:52px}
 .fedfina-section{padding-top:64px;padding-bottom:64px}
 .fedfina-steps article{gap:14px}
}

/* =========================================================
   v1.4 FedFina visual refinement
   Keeps the existing case-study design; removes dead space,
   fixes metadata wrapping, frames project screens and crops
   long enterprise screenshots to a consistent desktop ratio.
   ========================================================= */
.fedfina-case{
  --fed-accent:#6876ff;
  --fed-accent-bright:#8290ff;
  --fed-frame:#151922;
  --fed-frame-border:#2b3140;
  --fed-card:#10131a;
}

.fedfina-case .eyebrow,
.fedfina-case .case-kicker{color:var(--fed-accent-bright)}

.fedfina-case .fedfina-hero{
  padding-top:70px;
  padding-bottom:48px;
}

.fedfina-case .fedfina-hero-note{
  color:#9aa3b2;
  font-size:15px;
  line-height:1.6;
  margin:0 0 8px;
}

/* Four equal metadata blocks — no Bootstrap wrapping/collapse. */
.fedfina-meta{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-top:46px;
}

.fedfina-meta-card{
  min-width:0;
  min-height:96px;
  padding:19px 20px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:linear-gradient(145deg,#12151c,#0f1117);
  border:1px solid var(--fed-frame-border);
  border-radius:12px;
}

.fedfina-meta-card b{
  display:block;
  margin-bottom:7px;
  color:#737c8c;
  font-size:10px;
  font-weight:700;
  line-height:1;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.fedfina-meta-card span{
  display:block;
  color:#d9dde5;
  font-size:15px;
  font-weight:500;
  line-height:1.35;
  overflow-wrap:anywhere;
}

/* The large standalone hero screenshot is no longer needed. */
.fedfina-visual-section{display:none}

.fedfina-case .fedfina-project-section{
  padding-top:64px;
  padding-bottom:64px;
}

.fedfina-case .fedfina-project-section + .fedfina-project-section{
  border-top:0;
}

.fedfina-project-copy{
  min-width:0;
}

.fedfina-case .fedfina-project-copy h2{
  max-width:850px;
  margin-top:4px;
}

/* Consistent desktop showcase frame for every long FedFina screen. */
.fedfina-media{
  width:100%;
  aspect-ratio:16 / 10;
  margin-top:14px;
  padding:10px;
  background:linear-gradient(145deg,#181c25,#10131a);
  border:1px solid var(--fed-frame-border);
  border-radius:16px;
  box-shadow:0 16px 38px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.025);
  overflow:hidden;
}

.fedfina-media:before{
  content:"";
  display:block;
  position:absolute;
}

.fedfina-media img{
  display:block;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:top center;
  border-radius:9px;
  background:#f3f4f6;
}

.fedfina-media-caption{
  margin:9px 3px 0 !important;
  color:#747d8d !important;
  font-size:11px !important;
  line-height:1.4 !important;
}

.fedfina-focus{
  margin-top:24px;
  padding:17px 19px;
  border:1px solid #2a3040;
  border-left:2px solid var(--fed-accent);
  border-radius:10px;
  background:linear-gradient(145deg,rgba(104,118,255,.08),#10131a);
}

.fedfina-focus b{
  display:block;
  margin-bottom:6px;
  color:var(--fed-accent-bright);
  font-size:10px;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.fedfina-focus span{
  display:block;
  color:#d6dae2;
  font-size:14px;
  line-height:1.5;
}

.fedfina-principles{margin-top:28px}

.fedfina-principles>div>div{
  height:100%;
  min-height:88px;
  padding:17px 18px;
  border:1px solid #292f3b;
  background:#10131a;
  border-radius:11px;
  display:flex;
  gap:13px;
  align-items:flex-start;
}

.fedfina-principles strong{
  flex:0 0 auto;
  font:600 12px "Space Grotesk";
  color:var(--fed-accent-bright);
}

.fedfina-principles span{
  color:#b7beca;
  font-size:13px;
  line-height:1.45;
}

.fedfina-steps{
  margin-top:28px;
  border-top:1px solid var(--line);
}

.fedfina-steps article{
  display:flex;
  gap:18px;
  padding:23px 0;
  border-bottom:1px solid var(--line);
}

.fedfina-steps article>span{
  flex:0 0 28px;
  padding-top:3px;
  color:var(--fed-accent-bright);
  font:600 12px "Space Grotesk";
}

.fedfina-steps h3{
  margin:0 0 6px;
  font:600 20px/1.2 "Space Grotesk";
}

.fedfina-steps p{margin:0}

/* Interface evidence: same frame and ratio, now without giant vertical screenshots. */
.fedfina-gallery{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:28px;
}

.fedfina-gallery figure{
  margin:0;
  background:#10131a;
  border:1px solid var(--fed-frame-border);
  border-radius:14px;
  overflow:hidden;
}

.fedfina-gallery-media{
  aspect-ratio:16 / 10;
  padding:9px;
  background:linear-gradient(145deg,#181c25,#10131a);
  overflow:hidden;
}

.fedfina-gallery-media img{
  display:block;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:top center;
  border-radius:8px;
  background:#f3f4f6;
}

.fedfina-gallery figcaption{
  padding:10px 12px !important;
  color:#737c8c !important;
  font-size:11px !important;
}

.fedfina-result{
  margin-top:24px;
  border-left:2px solid var(--fed-accent);
  background:#11151d;
  padding:17px 19px;
  color:#d5dae2;
  font-size:13px;
  line-height:1.55;
  border-radius:0 8px 8px 0;
}

.fedfina-closing{
  padding-top:64px;
  padding-bottom:82px;
}

@media(max-width:991.98px){
  .fedfina-meta{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fedfina-case .fedfina-project-section{padding-top:54px;padding-bottom:54px}
}

@media(max-width:767.98px){
  .fedfina-meta{grid-template-columns:1fr;gap:8px;margin-top:38px}
  .fedfina-meta-card{min-height:78px;padding:16px 18px}
  .fedfina-case .fedfina-hero{padding-top:56px;padding-bottom:40px}
  .fedfina-case .fedfina-project-section{padding-top:48px;padding-bottom:48px}
  .fedfina-media{aspect-ratio:16 / 10;padding:7px;border-radius:12px}
  .fedfina-media img{border-radius:7px}
  .fedfina-gallery{grid-template-columns:1fr;gap:14px}
  .fedfina-gallery-media{padding:7px}
  .fedfina-gallery-media img{border-radius:7px}
}

/* ===== FEDFINA STYLE HERO (HynoHire) ===== */

.case-hero{
    padding:48px 0 72px;
}

.case-topbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding-bottom:28px;
    margin-bottom: 0;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.hero-grid{
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:72px;
    align-items:end;
    margin-bottom:48px;
}

.hero-left h1{
    font-size:92px;
    line-height:.95;
    letter-spacing:-0.06em;
    margin:12px 0 24px;
}

.hero-subtitle{
    font-size:20px;
    line-height:1.7;
    color:#D1D8E8;
    max-width:720px;
}

.hero-right{
    display:flex;
    align-items:flex-end;
}

.hero-right p{
    color:#A8B3C7;
    line-height:1.9;
    margin:0;
}

/* FedFina cards */
.meta-grid{
    display:grid !important;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
    margin:0 0 32px;
}

.meta-grid div{
    background:#0C1220;
    border:1px solid #24314A;
    border-radius:16px;
    padding:22px 20px;
}

.meta-grid span{
    display:block;
    font-size:11px;
    letter-spacing:.14em;
    color:#7E8AA6;
    margin-bottom:10px;
}

.meta-grid strong{
    color:#FFF;
    font-size:18px;
    font-weight:600;
}

.figma-btn{
    display:inline-flex;
    margin-top:8px;
    padding:14px 22px;
    border-radius:12px;
    background:#2563EB;
    color:#fff;
    font-weight:600;
    text-decoration:none;
}

@media(max-width:991px){
    .hero-grid{
        grid-template-columns:1fr;
        gap:28px;
    }

    .meta-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .hero-left h1{
        font-size:64px;
    }
}

/* ---------- Middle Content ---------- */

.narrow{
    max-width:860px;
    margin:auto;
    text-align:center;
}

.section-intro{
    font-size:18px;
    line-height:1.9;
    color:#C8D3E5;
    margin-top:22px;
}

/* Premium image frame */

.visual-showcase{
    padding-top:10px;
}

.case-frame{
    background:linear-gradient(180deg,#0D1528,#08111F);
    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;
    padding:18px;
    overflow:hidden;
    box-shadow:0 30px 70px rgba(0,0,0,.35);
}

.case-frame img{
    width:100%;
    display:block;
    border-radius:14px;
}

.image-caption{
    text-align:center;
    color:#92A0B8;
    font-size:14px;
    margin-top:20px;
}

/* ---------- Conclusion ---------- */

.conclusion-section{
    padding-top:90px;
}

.conclusion-card{
    margin-top:40px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:18px;
    background:linear-gradient(135deg,#0C1322,#0A1020);
    padding:28px 32px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
}

.conclusion-card span{
    display:block;
    font-size:11px;
    letter-spacing:.12em;
    color:#7E8AA6;
    margin-bottom:8px;
}

.conclusion-card strong{
    color:#FFF;
    font-size:18px;
    font-weight:600;
}

@media (max-width:768px){

    .conclusion-card{
        grid-template-columns:1fr;
    }

    .case-frame{
        padding:10px;
        border-radius:18px;
    }

}

/* ===== FedFina Content Block ===== */

.case-content-left{
    max-width:980px;
}

.case-content-left h2{
    font-size:72px;
    line-height:1.03;
    letter-spacing:-0.05em;
    color:#F5F7FA;
    margin:14px 0 26px;
    max-width:900px;
}

.section-body{
    max-width:880px;
    font-size:20px;
    line-height:1.8;
    color:#AEBBD2;
    margin-bottom:42px;
}

.focus-card{
    border:1px solid rgba(59,130,246,.35);
    border-radius:18px;
    padding:22px 24px;
    background:linear-gradient(180deg,#0B1220,#0A101A);
    max-width:880px;
}

.focus-card span{
    display:block;
    color:#4F7DFF;
    font-size:11px;
    font-weight:700;
    letter-spacing:.18em;
    margin-bottom:12px;
}

.focus-card strong{
    color:#FFF;
    font-size:22px;
    line-height:1.6;
    font-weight:500;
}

@media (max-width:768px){

    .case-content-left h2{
        font-size:42px;
    }

    .section-body{
        font-size:17px;
    }

    .focus-card strong{
        font-size:18px;
    }

}

.case-meta-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
    margin-top:42px;
}

.meta-card{
    padding:26px;
    border:1px solid #263146;
    border-radius:16px;
    background:linear-gradient(180deg,#0C1321,#09101A);
}

.meta-card span{
    display:block;
    font-size:11px;
    letter-spacing:.16em;
    color:#7C8798;
    margin-bottom:10px;
}

.meta-card strong{
    color:#fff;
    font-size:18px;
    font-weight:600;
}

@media(max-width:900px){
.case-meta-grid{
grid-template-columns:repeat(2,1fr);
}
}

.case-btn{
display:inline-flex;
margin-top:22px;
padding:14px 22px;
border-radius:999px;
border:1px solid rgba(90,117,255,.35);
background:rgba(90,117,255,.08);
color:#EEF3FF;
font-weight:600;
text-decoration:none;
transition:.25s;
}

.case-btn:hover{
background:rgba(90,117,255,.16);
border-color:#5A75FF;
}
.challenge-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:22px;
margin-top:34px;
}

.challenge-card{
padding:26px;
border:1px solid #243145;
border-radius:16px;
background:#0B111B;
}

.challenge-card h3{
margin-bottom:10px;
font-size:22px;
}

.challenge-card p{
color:#AEB8C9;
line-height:1.7;
}
.rcp-timeline{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:28px;
margin-top:40px;
position:relative;
}

.rcp-timeline:before{
content:"";
position:absolute;
left:8%;
right:8%;
top:26px;
height:1px;
background:#273247;
}

.step{
position:relative;
padding-top:48px;
}

.num{
position:absolute;
top:0;
width:54px;
height:54px;
border-radius:50%;
background:#10192A;
border:1px solid #5A75FF;
display:flex;
align-items:center;
justify-content:center;
font-weight:700;
color:#7EA0FF;
}

.step h4{
margin:14px 0 10px;
font-size:22px;
}

.step p{
color:#AAB4C5;
line-height:1.7;
}

.case-shot{
margin-top:34px;
padding:22px;
border-radius:24px;
background:linear-gradient(180deg,#0E1524,#090F19);
border:1px solid #243145;
box-shadow:0 30px 70px rgba(0,0,0,.35);
}

.case-shot img{
display:block;
width:100%;
border-radius:14px;
background:#fff;
}

.contribution-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:22px;
margin-top:34px;
}

.contribution-card{
padding:24px;
border-radius:16px;
border:1px solid #243145;
background:#0B111B;
}

.contribution-card h4{
margin-bottom:10px;
font-size:20px;
}

.contribution-card p{
color:#AAB4C5;
line-height:1.7;
}

/* RCP Cards */
.process-card{
  padding:28px;
  border:1px solid #2a3040;
  border-radius:14px;
  background:linear-gradient(145deg,rgba(104,118,255,.05),#10131a);
  transition:.25s ease;
}
.process-card:hover{
  border-color:var(--fed-accent);
  transform:translateY(-3px);
}
.process-card .step{
  color:var(--fed-accent-bright);
  font-size:11px;
  font-weight:700;
  letter-spacing:.16em;
  margin-bottom:16px;
}
.process-card h5{
  font:600 26px/1.1 "Space Grotesk";
  color:#fff;
  margin-bottom:12px;
}
.process-card p{
  color:#aab3c2;
  line-height:1.75;
  margin:0;
}
.prototype-link{
  color:#fff;
  text-decoration:none;
  font-weight:500;
}
.prototype-link:hover{
  color:var(--fed-accent-bright);
}

.case-meta-card{
    padding:24px 22px;
    border:1px solid #2a3040;
    border-radius:12px;
    background:linear-gradient(145deg,rgba(104,118,255,.05),#10131a);
}

.case-meta-card span{
    display:block;
    font-size:10px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#737c8a;
    margin-bottom:10px;
}

.case-meta-card strong{
    display:block;
    color:#fff;
    font-size:18px;
    font-weight:600;
    line-height:1.4;
}

/* Portfolio cards */
.feature-card{
    display:flex;
    flex-direction:column;
    height:100%;
}

.feature-card .feature-copy{
    flex:1;
    display:flex;
    flex-direction:column;
}

.feature-card .project-link{
    margin-top:auto;
}

/* Hamburger */
.navbar-toggler{
    padding:0;
}

.navbar-toggler:focus{
    box-shadow:none;
}

/* Offcanvas */
.offcanvas{
    width:280px;
    background:#05070B;
    border-left:1px solid rgba(255,255,255,.08);
}

.offcanvas .nav-link{
    color:#E8E8E8;
    font-weight:500;
    padding:.35rem 0;
}

.offcanvas .nav-link:hover{
    color:#4F7CFF;
}

/* Desktop only */
@media (min-width:992px){
    .offcanvas{
        display:none;
    }
}