/* Simple responsive, modern styles for Editkaro */
:root {
  --max-width: 1100px;
  --accent: #0e7cff;
  --muted: #6b7280;
  --bg: #fff;
  --card: #f8fafc;
  --radius: 12px;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color-scheme: light;
}
* {box-sizing: border-box}
html,body{margin:0;padding:0;background:var(--bg);color:#0f172a}
.container{max-width:var(--max-width);margin:0 auto;padding:1rem}
.site-header{border-bottom:1px solid #e6eef8;background:#fff}
.header-row{display:flex;align-items:center;justify-content:space-between;padding:1rem 0}
.logo{font-weight:700;color:var(--accent);text-decoration:none;font-size:1.5rem;font-family:"Cooper Black",serif}
.nav a{margin-left:1rem;text-decoration:none;color:#1f2937}
.nav a[aria-current="page"]{font-weight:600}
.hero{padding:3rem 0;background:linear-gradient(180deg,#f8fbff,transparent)}
.hero-grid{display:grid;grid-template-columns:1fr 420px;gap:2rem;align-items:center}
.hero h1{font-size:2rem;margin:0 0 .5rem}
.hero p{color:var(--muted);margin:0 0 1rem}
.btn{display:inline-block;padding:0.6rem 1rem;background:var(--accent);color:#fff;border-radius:10px;text-decoration:none;border:0;cursor:pointer}
.btn.ghost{background:transparent;color:var(--accent);border:1px solid rgba(14,124,255,0.12)}
.hero-media .video-thumbnail{position:relative;border-radius:12px;overflow:hidden}
.hero-media img{width:100%;display:block}
.play-overlay{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,0.45);color:#fff;padding:.6rem .8rem;border-radius:8px;font-size:1.1rem}
.services{padding:2rem 0}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.card{background:var(--card);padding:1rem;border-radius:12px}
.email-collector{padding:2rem 0}
.inline-form{display:flex;gap:.5rem;max-width:500px}
.inline-form input{flex:1;padding:.6rem;border-radius:10px;border:1px solid #e5e7eb}
.inline-form button{padding:.6rem 1rem;border-radius:10px}
.featured-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}
.mini-card{display:block;background:#fff;border:1px solid #eef2ff;padding:.5rem;border-radius:10px;text-decoration:none;color:inherit}
.mini-card img{width:100%;border-radius:8px}
.site-footer{border-top:1px solid #e6eef8;padding:1.5rem 0;margin-top:2rem}
.footer-grid{display:flex;justify-content:space-between;align-items:center}

.video-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1rem 0}
.video-card{background:#fff;border-radius:10px;overflow:hidden;cursor:pointer;border:1px solid #eef2ff}
.video-card img{width:100%;display:block}
.video-card .meta{padding:.6rem;display:flex;justify-content:space-between;align-items:center;font-size:.95rem;color:#111827}
.filters{margin:1rem 0}
.filter-btn{padding:.4rem .6rem;border-radius:8px;border:1px solid #e6eef8;background:#fff;margin-right:.5rem;cursor:pointer}
.filter-btn.active{background:var(--accent);color:#fff;border-color:transparent}

.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(2,6,23,0.6);z-index:60}
.modal[aria-hidden="false"]{display:flex}
.modal-content{width:90%;max-width:900px;background:#fff;border-radius:12px;padding:1rem;position:relative}
.modal-close{position:absolute;right:1rem;top:1rem;border:0;background:transparent;font-size:1.1rem;cursor:pointer}
.modal-player{aspect-ratio:16/9;background:#000;border-radius:8px;overflow:hidden}

/* Team & About */
.team-card{text-align:center}
.team-card img{width:100%;height:220px;object-fit:cover;border-radius:8px}
.contact-form label{display:block;margin-bottom:.6rem}
.contact-form input,.contact-form textarea{width:100%;padding:.6rem;border-radius:8px;border:1px solid #e6eef8;margin-top:.25rem}
.form-msg{margin-top:.6rem;color:green;font-weight:600}

/* Responsive */
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr; padding:1rem 0}
  .grid-3{grid-template-columns:1fr}
  .video-gallery{grid-template-columns:repeat(2,1fr)}
  .featured-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .video-gallery{grid-template-columns:1fr}
  .nav{display:none}
  .header-row{justify-content:space-between}
}