:root {
  --review-bg:#f7f7f5;
  --review-ink:#111318;
  --review-muted:#6e7480;
  --review-primary:#315efb;
  --review-white:#fff;
}

.review-page { background:var(--review-bg); color:var(--review-ink); }
.review-shell { width:1244px; max-width:calc(100% - 196px); margin-inline:auto; }
.review-kicker { margin:0; color:var(--review-muted); font:500 14px/16px "Gilroy",sans-serif; text-transform:uppercase; }

.review-hero {
  position:relative;
  min-height:630px;
  margin-top:66px;
}
.review-hero-copy { width:768px; display:flex; flex-direction:column; gap:32px; }
.review-hero-title { display:flex; flex-direction:column; gap:38px; }
.review-hero h1 { margin:0; font:600 76px/82px "Gilroy",sans-serif; }
.review-hero-title p { margin:0; color:var(--review-primary); font:600 24px/32px "Gilroy",sans-serif; }
.review-tags { margin:0; color:var(--review-muted); font:400 16px/24px "Gilroy",sans-serif; }
.review-hero-visual {
  position:absolute; left:719px; top:60px; width:571px; height:325px; margin:0;
  overflow:hidden; border-radius:22px;
  box-shadow:0 16px 32px -4px rgba(12,12,13,.10),0 4px 4px -4px rgba(12,12,13,.05);
}
.review-hero-visual img { width:100%; height:100%; display:block; object-fit:cover; }

.review-facts { margin-top:68px; min-height:172px; }
.review-facts-grid {
  margin-top:32px;
  display:grid;
  grid-template-columns:287px 198px minmax(0, 524px);
  grid-template-areas:
    "type role area"
    "team period area";
  align-items:start;
  gap:28px 35px;
}
.review-fact { display:flex; flex-direction:column; align-self:start; min-width:0; font:400 18px/28px "Gilroy",sans-serif; }
.review-fact strong { font-weight:600; line-height:22px; margin-bottom:4px; }
.review-fact span { display:block; }
.review-fact-wide { grid-area:area; }
.review-facts-grid .review-fact:nth-child(1){grid-area:type;}
.review-facts-grid .review-fact:nth-child(2){grid-area:role;}
.review-facts-grid .review-fact:nth-child(4){grid-area:team;}
.review-facts-grid .review-fact:nth-child(5){grid-area:period;}

.review-context {
  position:relative;
  margin-top:100px;
  min-height:464px;
}
.review-context-copy { width:612px; }
.review-context-text { margin-top:32px; }
.review-context h2 { margin:0; width:516px; font:600 40px/48px "Gilroy",sans-serif; }
.review-context-body { margin-top:32px; width:612px; }
.review-context-body p { margin:0 0 30px; font:400 19px/30px "Gilroy",sans-serif; }
.review-context-body p:last-child { margin-bottom:0; }
.review-scheme { position:absolute; left:632px; top:48px; width:612px; height:333px; margin:0; }
.review-scheme img { width:100%; height:100%; display:block; object-fit:contain; }

.review-complexity { margin-top:80px; min-height:300px; }
.review-complexity-grid { margin-top:32px; display:grid; grid-template-columns:repeat(4,296px); gap:20px; }
.review-info-card {
  min-height:252px; padding:32px 24px; border-radius:36px; background:#fff;
  display:flex; flex-direction:column; gap:16px;
}
.review-info-card > img { width:24px; height:24px; object-fit:contain; }
.review-info-card h3 { margin:0; font:600 18px/22px "Gilroy",sans-serif; }
.review-info-card p { margin:auto 0 0; font:400 15px/22px "Gilroy",sans-serif; }

.review-solutions { margin-top:78px; min-height:745px; }
.review-solutions-grid { margin-top:32px; display:grid; grid-template-columns:repeat(2,612px); gap:20px; }
.review-solution-card {
  width:612px; height:338px; padding:32px; border-radius:36px; background:#fff;
  overflow:hidden; display:grid; grid-template-columns:314px 398px; gap:26px;
}
.review-solution-copy { width:314px; display:flex; flex-direction:column; gap:8px; }
.review-number { color:var(--review-primary); font:600 34px/42px "Gilroy",sans-serif; }
.review-solution-card h3 { margin:0; font:600 24px/32px "Gilroy",sans-serif; }
.review-solution-card p { margin:14px 0 0; font:400 15px/22px "Gilroy",sans-serif; }
.review-solution-visual {
  width:398px; height:224px; margin:0; border:1px solid rgba(0,0,0,.03);
  border-radius:4px; overflow:hidden;
  box-shadow:0 16px 16px -8px rgba(12,12,13,.1),0 4px 4px -4px rgba(12,12,13,.05);
  position:relative;
}
.review-solution-visual img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.review-solution-crop img { width:323.73%; height:323.55%; left:-121.59%; top:-111.94%; max-width:none; }

.review-system {
  position:relative;
  margin-top:100px;
  min-height:479px;
}
.review-system-copy { width:612px; }
.review-system-text { margin-top:32px; }
.review-system h2 { margin:0; width:612px; font:600 34px/42px "Gilroy",sans-serif; }
.review-system-text p { margin:16px 0 0; width:612px; font:400 18px/28px "Gilroy",sans-serif; }

.review-system-visual { position:absolute; left:632px; top:0; width:612px; height:520px; }
.review-system-visual figure { position:absolute; margin:0; overflow:hidden; border-radius:4px; background:#fff; box-shadow:0 16px 32px -4px rgba(12,12,13,.10),0 4px 4px -4px rgba(12,12,13,.05); }
.review-system-visual img { width:100%; height:100%; display:block; object-fit:cover; }
.review-system-review { left:0; top:88px; width:242px; height:404px; z-index:2; }
.review-system-qa { left:286px; top:0; width:326px; height:230px; z-index:3; }
.review-system-team { left:248px; top:272px; width:364px; height:210px; z-index:1; }

.review-outcome { margin-top:100px; min-height:302px; }
.review-outcome-layout { margin-top:32px; display:grid; grid-template-columns:284px 928px; gap:32px; }
.review-outcome-layout > h2 { margin:0; width:284px; font:600 34px/42px "Gilroy",sans-serif; }
.review-outcome-grid { display:grid; grid-template-columns:repeat(3,296px); gap:20px; }
.review-outcome-card { min-height:254px; padding:32px 24px; border-radius:36px; background:#fff; }
.review-outcome-head { display:flex; gap:16px; align-items:flex-start; }
.review-outcome-head img { width:40px; height:40px; flex:0 0 40px; object-fit:contain; }
.review-outcome-card h3 { min-height:86px; margin:0; font:600 18px/22px "Gilroy",sans-serif; }
.review-outcome-card p { margin:16px 0 0; font:400 15px/22px "Gilroy",sans-serif; }

.review-page .portfolio-case-switcher { margin-top:113px; }
.review-page .contact { padding-top:79px; padding-bottom:100px; }

@media (max-width:1180px) {
  .review-shell { width:calc(100% - 112px); max-width:none; }
  .review-hero { min-height:600px; }
  .review-hero-copy { width:56%; }
  .review-hero h1 { font-size:58px; line-height:64px; }
  .review-hero-title p { font-size:21px; line-height:29px; }
  .review-hero-visual { left:56%; width:48%; height:auto; aspect-ratio:571/325; }

  .review-facts-grid { grid-template-columns:repeat(3,1fr); }
  .review-facts-grid .review-fact:nth-child(n),.review-fact-wide { grid-column:auto; grid-row:auto; grid-area:auto; }

  .review-context { min-height:630px; }
  .review-context-copy { width:46%; }
  .review-context h2,.review-context-body { width:auto; }
  .review-scheme { left:50%; width:50%; height:auto; aspect-ratio:612/333; }

  .review-complexity-grid { grid-template-columns:repeat(2,1fr); }
  .review-solutions { min-height:0; }
  .review-solutions-grid { grid-template-columns:1fr; }
  .review-solution-card { width:100%; grid-template-columns:minmax(270px,314px) 1fr; }
  .review-solution-visual { width:100%; }

  .review-system { min-height:600px; }
  .review-system-copy { width:48%; }
  .review-system h2,.review-system-text p { width:auto; }
  .review-system-visual { left:50%; width:50%; transform:scale(.84); transform-origin:top left; }

  .review-outcome-layout { grid-template-columns:1fr; }
  .review-outcome-grid { grid-template-columns:repeat(3,1fr); }
}

@media (max-width:760px) {
  .review-shell { width:calc(100% - 32px); max-width:none; }
  .review-hero { margin-top:52px; min-height:0; }
  .review-hero-copy { width:100%; gap:22px; }
  .review-hero-title { gap:20px; }
  .review-hero h1 { font-size:40px; line-height:44px; }
  .review-hero-title p { font-size:21px; line-height:27px; }
  .review-tags { font-size:12px; line-height:18px; }
  .review-hero-visual { position:relative; left:auto; top:auto; width:100%; height:auto; aspect-ratio:571/325; margin-top:34px; }

  .review-facts { margin-top:48px; min-height:0; }
  .review-facts-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
  .review-fact { font-size:13px; line-height:19px; }
  .review-fact strong { line-height:18px; }
  .review-fact-wide,.review-facts-grid .review-fact:nth-child(1){ grid-column:1/-1 !important; }

  .review-context { margin-top:64px; min-height:0; }
  .review-context-copy { width:100%; }
  .review-context h2 { width:auto; font-size:32px; line-height:38px; }
  .review-context-body { width:auto; }
  .review-context-body p { font-size:15px; line-height:23px; margin-bottom:20px; }
  .review-scheme { position:relative; left:auto; top:auto; width:100%; height:auto; aspect-ratio:612/333; margin-top:28px; }

  .review-complexity { margin-top:64px; min-height:0; }
  .review-complexity-grid { grid-template-columns:1fr; }
  .review-info-card { min-height:0; border-radius:28px; }

  .review-solutions { margin-top:64px; min-height:0; }
  .review-solutions-grid { grid-template-columns:1fr; }
  .review-solution-card { width:100%; height:auto; padding:26px; border-radius:28px; display:block; }
  .review-solution-copy { width:auto; }
  .review-number { font-size:28px; line-height:34px; }
  .review-solution-card h3 { font-size:24px; line-height:30px; }
  .review-solution-card p { font-size:14px; line-height:21px; }
  .review-solution-visual { width:100%; height:auto; aspect-ratio:398/224; margin-top:26px; }

  .review-system { margin-top:64px; min-height:0; }
  .review-system-copy { width:100%; }
  .review-system h2 { width:auto; font-size:30px; line-height:36px; }
  .review-system-text p { width:auto; font-size:15px; line-height:23px; }
  .review-system-visual { position:relative; left:auto; top:auto; width:100%; height:640px; margin-top:28px; transform:none; }
  .review-system-review { left:0; top:118px; width:42%; height:auto; aspect-ratio:920/1437; }
  .review-system-qa { left:46%; top:0; width:54%; height:auto; aspect-ratio:1660/928; }
  .review-system-team { left:38%; top:360px; width:62%; height:auto; aspect-ratio:1280/752; }

  .review-outcome { margin-top:64px; min-height:0; }
  .review-outcome-layout { display:block; }
  .review-outcome-layout > h2 { width:auto; font-size:30px; line-height:36px; }
  .review-outcome-grid { grid-template-columns:1fr; margin-top:28px; }
  .review-outcome-card { min-height:0; border-radius:28px; }
  .review-outcome-card h3 { min-height:0; }

  .review-page .portfolio-case-switcher { margin-top:64px; }
  .review-page .contact { padding-top:34px; padding-bottom:40px; }
}
