/* ============================================================================
   proyeet — DESKTOP stylesheet
   ----------------------------------------------------------------------------
   Loaded with:  <link rel="stylesheet" href="/assets/css/desktop.css"
                       media="(min-width: 861px)">
   Everything here applies ONLY on desktop / wide screens. Plain CSS — no
   @media wrappers needed. Edit this file to change the desktop look, and
   nothing else.
   ============================================================================ */

/* ---- Hero gets more room to breathe ---- */
.hero{padding:90px 0 62px}
.hero h1{font-size:clamp(3rem,5.4vw,4.4rem)}
.hero .cta-row .btn{min-width:210px}

/* ---- Multi-column layouts ---- */
.steps{grid-template-columns:repeat(3,1fr)}
.features{grid-template-columns:repeat(3,1fr)}
.facts.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.kpi-grid{grid-template-columns:repeat(4,1fr)}

/* ---- Hover affordances (desktop pointers only) ---- */
.card,.feature{transition:box-shadow .2s,transform .2s,border-color .2s}
.nav-links a{position:relative}

/* ---- Content pages a touch narrower than full site width for readability ---- */
.wrap.content-wide,.wrap-wide{max-width:1000px}

/* ---- Large-screen / TV scaling for readability across the room ---- */