:root{--case-bg:#101918;--case-panel:#172321;--case-ink:#f4f0e6;--case-muted:#aab7b2;--case-mint:#9ed7c6;--case-gold:#d7b77d;--case-line:rgba(255,255,255,.13)}
.case-page{background:var(--case-bg);color:var(--case-ink)}
.case-page .site-header{background:rgba(16,25,24,.95)}
.case-page .shell{width:min(1320px,calc(100% - 48px));margin-inline:auto}
.case-page .case-hero{padding:clamp(72px,9vw,128px) 0 clamp(48px,6vw,84px)}
.case-page .case-hero h1{max-width:1100px;margin:.18em 0 .28em;font-size:clamp(3rem,7vw,7rem);line-height:.94;letter-spacing:-.06em}
.case-page .case-hero h1 em{color:var(--case-mint);font-style:normal}.case-page .case-lead{max-width:850px;color:var(--case-muted);font-size:clamp(1.05rem,1.6vw,1.35rem)}
.case-page .case-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}.case-page .case-meta span{padding:8px 12px;border:1px solid var(--case-line);border-radius:999px;color:var(--case-muted);font-size:.78rem}
.case-page .case-section{padding:clamp(64px,8vw,110px) 0;border-top:1px solid var(--case-line)}
.case-page .case-heading{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(250px,.7fr);gap:40px;align-items:end;margin-bottom:34px}.case-page .case-heading h2{margin:0;font-size:clamp(2.35rem,4.5vw,5rem);line-height:1;letter-spacing:-.05em}.case-page .case-heading>p{margin:0;color:var(--case-muted)}
.case-cover{position:relative;overflow:hidden;border:1px solid var(--case-line);border-radius:28px;background:var(--case-panel)}.case-cover img{display:block;width:100%;aspect-ratio:1672/940;object-fit:cover}.case-cover .concept{position:absolute;left:16px;top:16px;padding:8px 11px;border:1px solid var(--case-line);border-radius:999px;background:rgba(16,25,24,.9);color:var(--case-mint);font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.case-grid article{padding:24px;border:1px solid var(--case-line);border-radius:20px;background:var(--case-panel)}.case-grid span{color:var(--case-mint);font-size:.75rem;font-weight:800}.case-grid h3{margin:.7em 0 .35em;font-size:1.25rem}.case-grid p,.case-grid li{color:var(--case-muted)}
.case-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;padding:0;list-style:none;counter-reset:step}.case-flow li{min-height:190px;padding:20px;border:1px solid var(--case-line);border-radius:18px;background:var(--case-panel);counter-increment:step}.case-flow li:before{content:"0" counter(step);display:block;margin-bottom:34px;color:var(--case-mint);font-size:.75rem;font-weight:800}.case-flow strong{display:block;margin-bottom:8px}.case-flow span{color:var(--case-muted);font-size:.9rem}
.case-gallery{display:grid;gap:22px}.case-gallery figure{margin:0;overflow:hidden;border:1px solid var(--case-line);border-radius:24px;background:var(--case-panel)}.case-gallery img{display:block;width:100%;height:auto}.case-gallery figcaption{padding:16px 20px;color:var(--case-muted)}.demo-mark{position:absolute;z-index:2;margin:15px;padding:7px 10px;border-radius:999px;background:var(--case-mint);color:#10201c;font-size:.68rem;font-weight:900}.demo-frame{position:relative;max-height:650px;overflow:auto;background:#e9ecef}
.case-boundary{display:grid;grid-template-columns:1fr 1fr;gap:14px}.case-boundary article{padding:25px;border:1px solid var(--case-line);border-radius:20px;background:var(--case-panel)}.case-boundary article:last-child{border-color:rgba(215,183,125,.48)}.case-boundary ul{padding-left:1.15em;color:var(--case-muted)}
.project-tile .visual .concept{position:absolute;z-index:2;left:15px;top:15px;padding:7px 10px;border:1px solid var(--case-line);border-radius:999px;background:rgba(16,25,24,.9);color:var(--case-mint);font-size:.65rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.project-catalog{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}.project-tile{grid-column:span 2;display:flex;min-height:610px;flex-direction:column;overflow:hidden;border:1px solid var(--case-line);border-radius:28px;background:var(--case-panel);color:var(--case-ink);text-decoration:none}.project-tile.featured{grid-column:1/-1;position:relative;min-height:570px}.project-tile .visual{position:relative;height:290px;overflow:hidden;background:#12211e}.project-tile .visual img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .5s ease}.project-tile:hover .visual img,.project-tile:focus-visible .visual img{transform:scale(1.025)}.project-tile .copy{display:flex;flex:1;flex-direction:column;padding:25px}.project-tile h3{margin:.45em 0 .35em;font-size:clamp(2rem,2.8vw,3.25rem);line-height:1;letter-spacing:-.045em}.project-tile p{color:var(--case-muted)}.project-tile small{margin-top:auto;padding-top:25px;color:var(--case-mint);font-weight:800}.project-tile.featured .visual{height:100%;position:absolute;inset:0}.project-tile.featured .visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,25,24,.96),rgba(16,25,24,.45) 65%,rgba(16,25,24,.05))}.project-tile.featured .copy{position:relative;z-index:2;max-width:760px;justify-content:flex-end}.project-tile.featured h3{font-size:clamp(2.6rem,5vw,5.4rem)}
@media(max-width:980px){.project-catalog{grid-template-columns:repeat(2,1fr)}.project-tile{grid-column:span 1}.project-tile.featured{grid-column:1/-1}.case-grid{grid-template-columns:repeat(2,1fr)}.case-flow{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.case-page .shell{width:calc(100% - 28px)}.case-page .case-hero h1{font-size:clamp(2.55rem,12vw,4.5rem)}.case-page .case-heading{grid-template-columns:1fr;gap:16px}.project-catalog,.case-grid,.case-flow,.case-boundary{grid-template-columns:1fr}.project-tile,.project-tile.featured{grid-column:1;min-height:540px}.project-tile .visual{height:245px}.project-tile.featured .visual{height:100%}.case-flow li{min-height:auto}.case-flow li:before{margin-bottom:18px}}
@media(prefers-reduced-motion:reduce){.project-tile .visual img{transition:none}}
