/* TechyMarathi – plain CSS, no build step. Colours: edit the variables below. */
@font-face{font-family:Mukta;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/mukta-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Mukta;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/mukta-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  color-scheme:light dark;
  --bg:#f4f7fb; --surface:#fff; --text:#192a3d; --muted:#3a4f66; --border:#d9e2ec;
  --accent:#1559ed; --on-accent:#fff; --link:#1559ed; --focus:#1559ed;
  --shadow:0 1px 2px rgb(25 42 61 / .08);
  --t1:#e6efff; --t2:#ffe8f1; --t3:#fff1d6; --t4:#dff6f1; --t5:#efe8ff;
  --mesh:
    radial-gradient(48rem 38rem at 0% 0%,rgb(21 89 237 / .20),transparent 70%),
    radial-gradient(42rem 34rem at 100% 8%,rgb(255 92 160 / .18),transparent 70%),
    radial-gradient(40rem 34rem at 100% 62%,rgb(20 190 170 / .18),transparent 70%),
    radial-gradient(44rem 36rem at 0% 78%,rgb(255 176 40 / .20),transparent 70%),
    radial-gradient(36rem 30rem at 55% 100%,rgb(130 90 240 / .16),transparent 70%);
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0e1621; --surface:#172333; --text:#eaf0f7; --muted:#b4c2d3; --border:#28405a;
    --accent:#1559ed; --on-accent:#fff; --link:#8fb5ff; --focus:#9dc0ff;
    --shadow:none;
    --t1:#16294a; --t2:#3a1d30; --t3:#38301a; --t4:#12342f; --t5:#2b2049;
    --mesh:
      radial-gradient(48rem 38rem at 0% 0%,rgb(21 89 237 / .38),transparent 70%),
      radial-gradient(42rem 34rem at 100% 8%,rgb(220 50 130 / .28),transparent 70%),
      radial-gradient(40rem 34rem at 100% 62%,rgb(20 160 140 / .26),transparent 70%),
      radial-gradient(44rem 36rem at 0% 78%,rgb(210 140 20 / .24),transparent 70%),
      radial-gradient(36rem 30rem at 55% 100%,rgb(120 80 230 / .30),transparent 70%);
  }
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{position:relative;margin:0;background:var(--bg);color:var(--text);font:400 1.0625rem/1.65 Mukta,system-ui,-apple-system,"Segoe UI",sans-serif;overflow-wrap:anywhere}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:var(--mesh);pointer-events:none}
a{color:var(--link)}
img{display:block;max-width:100%;height:auto}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:12px;top:-60px;background:var(--accent);color:var(--on-accent);padding:8px 14px;border-radius:8px;z-index:10}
.skip:focus{top:12px}
.wrap{width:100%;max-width:64rem;margin-inline:auto;padding-inline:16px}

.hero{padding:40px 0 28px;text-align:center}
.logo{width:96px;height:96px;margin:0 auto 14px;border-radius:50%;border:3px solid var(--surface);box-shadow:0 2px 10px rgb(21 89 237 / .25)}
h1{margin:0;font-size:2.25rem;line-height:1.2;font-weight:700;letter-spacing:-.01em}
.tagline{margin:4px 0 0;font-size:1.375rem;font-weight:700;color:var(--muted)}
.lead{margin:14px auto 0;max-width:34rem;color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:8px 24px;margin-top:22px;border-radius:999px;background:var(--accent);color:var(--on-accent);font-weight:700;text-decoration:none}
.btn:hover{filter:brightness(1.1)}
.btn svg{width:22px;height:22px;flex:none}
.btn:focus-visible{outline-color:var(--focus)}

section{padding:28px 0 8px}
h2{margin:0 0 4px;font-size:1.5rem;line-height:1.3;font-weight:700}
.sub{margin:0 0 16px;color:var(--muted);font-size:1rem}
.grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.grid li:nth-child(5n+1) a{--tint:var(--t1)}
.grid li:nth-child(5n+2) a{--tint:var(--t2)}
.grid li:nth-child(5n+3) a{--tint:var(--t3)}
.grid li:nth-child(5n+4) a{--tint:var(--t4)}
.grid li:nth-child(5n) a{--tint:var(--t5)}
.grid a{display:flex;flex-direction:column;height:100%;background:var(--tint,var(--surface));border:1px solid var(--border);border-radius:14px;overflow:hidden;color:var(--text);text-decoration:none;box-shadow:var(--shadow)}
.grid img{width:100%;aspect-ratio:1;background:#fff}
.grid span{display:block;padding:10px 12px 2px;font-size:.9375rem;line-height:1.4}
.grid time{display:block;padding:0 12px 12px;font-size:.8125rem;line-height:1.4;color:var(--muted)}
.grid a:hover span{text-decoration:underline;text-underline-offset:3px;color:var(--link)}
@media (min-width:600px){.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}}
@media (min-width:900px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}h1{font-size:2.75rem}}

.contact{margin-top:20px;padding:24px 20px;background:var(--surface);border:1px solid var(--border);border-radius:14px;text-align:center}
.contact p{margin:0 auto;max-width:34rem;color:var(--muted)}
.contact .btn{margin-top:16px}
footer{padding:28px 0 40px;text-align:center;color:var(--muted);font-size:.9375rem}
footer p{margin:4px 0}
.notfound{min-height:100vh;display:grid;place-items:center;text-align:center;padding:24px 16px}
@media (prefers-reduced-motion:no-preference){.grid a{transition:transform .15s}.grid a:hover{transform:translateY(-2px)}}