/* Grab Life · studio components (services, homepage studio sections) */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.svc-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:30px 28px;box-shadow:var(--shadow);display:flex;flex-direction:column;color:var(--ink);text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}
a.svc-card:hover{transform:translateY(-3px);box-shadow:0 1px 2px rgba(22,19,15,.06),0 16px 40px rgba(22,19,15,.12)}
.svc-ico{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;margin-bottom:18px;color:#fff}
.svc-ico svg{width:26px;height:26px}
.svc-card h3{font-family:var(--serif);font-size:1.35rem;margin:0 0 8px}
.svc-card p{color:var(--muted);margin:0 0 14px}
.svc-card .more{margin-top:auto;font-weight:600;color:var(--sun);font-size:.95rem}
.dark .svc-card{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12);color:#fff;box-shadow:none}
.dark .svc-card p{color:rgba(255,255,255,.72)}

.gl-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:8px}
.gl-stat{border-top:2px solid var(--sun);padding-top:14px}
.gl-stat b{display:block;font-family:var(--serif);font-size:2.4rem;line-height:1;color:var(--ink)}
.gl-stat span{color:var(--muted);font-size:.95rem}
.dark .gl-stat b{color:#fff}.dark .gl-stat span{color:rgba(255,255,255,.7)}

.process{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:step}
.process div{position:relative;padding:26px 22px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
.process div::before{counter-increment:step;content:counter(step,decimal-leading-zero);font-family:var(--serif);font-size:1.6rem;color:var(--sun);display:block;margin-bottom:8px}
.process h3{font-size:1.1rem;margin:0 0 6px}
.process p{color:var(--muted);margin:0;font-size:.97rem}

.svc-detail{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:start}
.svc-detail h2{margin:.3em 0 .4em}
.svc-detail .lead{font-size:1.12rem;color:var(--ink-2)}
.dark .svc-detail .lead{color:rgba(255,255,255,.8)}
.ticks{list-style:none;padding:0;margin:18px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
.ticks li{position:relative;padding-left:28px;line-height:1.45}
.ticks li::before{content:"";position:absolute;left:0;top:3px;width:17px;height:17px;border-radius:50%;background:var(--sun) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/12px no-repeat}
.examples{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.dark .examples{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12);box-shadow:none}
.examples h4{font:600 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--sun);margin:0 0 14px}
.ex{display:flex;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--line);color:inherit;text-decoration:none}
.dark .ex{border-color:rgba(255,255,255,.12)}
.ex:first-of-type{border-top:0}
.ex img{width:92px;height:56px;object-fit:cover;border-radius:8px;flex:none;border:1px solid var(--line)}
.ex .ph{width:92px;height:56px;border-radius:8px;flex:none;display:grid;place-items:center;color:#fff;font-weight:700;font-family:var(--serif);font-size:1.2rem}
.ex b{display:block;font-weight:600}
.ex small{color:var(--muted)}
.dark .ex small{color:rgba(255,255,255,.65)}
a.ex:hover b{color:var(--sun)}

.work-stack{position:relative;height:440px}
.work-stack img{position:absolute;width:78%;border-radius:14px;box-shadow:0 24px 60px rgba(0,0,0,.35);border:4px solid #fff}
.work-stack img:nth-child(1){top:0;right:0;transform:rotate(3deg)}
.work-stack img:nth-child(2){top:120px;left:0;transform:rotate(-4deg)}
.work-stack img:nth-child(3){top:250px;right:6%;transform:rotate(1.5deg)}
.hero .hero-copy h1 .hl{color:var(--gold)}

.chip-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.chip{display:inline-block;padding:7px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.4);color:#fff;font-size:.88rem;font-weight:500}

@media (max-width:960px){
  .svc-grid,.process{grid-template-columns:1fr 1fr}
  .gl-stats{grid-template-columns:1fr 1fr}
  .svc-detail{grid-template-columns:1fr;gap:30px}
  .work-stack{height:330px;max-width:520px;margin:30px auto 0}
  .work-stack img:nth-child(2){top:90px}.work-stack img:nth-child(3){top:185px}
}
@media (max-width:620px){
  .svc-grid,.process,.ticks{grid-template-columns:1fr}
  .work-stack{height:260px}
  .work-stack img:nth-child(2){top:70px}.work-stack img:nth-child(3){top:140px}
}