/* Sections */
.section{padding:72px 0}
.features{margin-top:64px;display:grid;grid-template-columns:repeat(auto-fit, 192px);gap:16px;justify-content:flex-start}
.feature{background:transparent;border:1px solid #4D4941;border-radius:16px;padding:18px;width:192px;height:192px;display:flex;flex-direction:column;justify-content:center;gap:8px;color:#4D4941}
.feature .icon{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:transparent;margin-bottom:0}
.feature svg{width:40px;height:40px}
/* Force inline SVG shapes to use the same card color */
.feature svg, .feature svg *{fill:#4D4941;stroke:#4D4941}
/* Allow external SVG images to size like inline svgs */
.feature .icon img{width:40px;height:40px;display:block}

/* Feature text uses Body/Body Light */
.features .feature p{
	font-family: 'Poppins', sans-serif;
	font-weight: 300;
	font-size: 16px;
	line-height: 100%;
	letter-spacing: 0%;
}
@media (max-width:980px){.features{justify-content:flex-start}}
@media (max-width:560px){.features{justify-content:flex-start}}

/* App */
.app{background:#fff;height:670px;position:relative;overflow:hidden}
.app .container{height:100%;display:grid}
.app__grid{display:grid;gap:40px;grid-template-columns:.9fr 1.1fr;align-items:center;justify-content:space-between;padding:64px 0;height:100%;align-content:center;margin-right:390px}
.app__grid > *{align-self:center}
.app__grid > img{max-width:100%;max-height:calc(100% - 256px);height:auto;width:auto;justify-self:center;align-self:center;object-fit:contain;padding:128px 0}
.phone{position:relative;width:min(320px,80vw);aspect-ratio:9/18;border-radius:36px;padding:10px;border:10px solid #111;background:#000;box-shadow:var(--shadow);overflow:hidden}
.phone img{width:100%;height:100%;object-fit:cover;border-radius:26px;filter:saturate(1.05)}
.phone__badge{position:absolute;inset:auto 10px 10px auto;background:rgba(0,0,0,.65);color:#fff;font-weight:700;padding:8px 10px;border-radius:10px;font-size:14px;line-height:1.1}
.store-badges{display:flex;gap:14px;align-items:center;margin-top:18px}
.store-badges img{height:44px}
@media (max-width:980px){.app__grid{grid-template-columns:1fr;margin-right:0}.app__mock{order:2}}

/* Benefits */
.benefits{background:#3b342e;color:#fff}
.benefits .container{margin-left:0;margin-right:auto}
.benefits__grid{display:grid;gap:40px;grid-template-columns:1fr 1fr;align-items:center;justify-items:start;justify-content:start}
.benefits__copy{text-align:left !important;justify-self:start}
.benefits__copy h3,
.benefits__copy p,
.benefits__copy ul,
.benefits__copy li{ text-align:left }
.benefits__media img{width:100%;height:100%;object-fit:cover;border-radius:16px}
.checklist{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px}
.checklist li{position:relative;padding-left:28px}
.checklist li::before{content:"";position:absolute;left:0;top:.35em;width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand-2));box-shadow:0 0 0 3px rgba(255,255,255,.15) inset}
@media (max-width:980px){.benefits__grid{grid-template-columns:1fr}}

/* Footer */
.footer{background:#1a1816;color:#d6d3d1;padding:28px 0}
.footer__inner{display:flex;align-items:center;justify-content:space-between;gap:16px}
.footer a{color:#b7b4b2;text-decoration:none}
