/* ================= SEKAINFOTECH =================
   Seka = Black | Info = Red | Tech = Blue
==================================================== */

:root{
  --seka: #111; /* Black */
  --info: #e63946; /* Red */
  --tech: #1d4ed8; /* Blue */
  --tech-light:#3b82f6;
  --bg:#f8f9fb;
  --white:#ffffff;
  --text:#2b2d33;
  --muted:#6b7280;
  --shadow:0 10px 30px rgba(17,17,17,.08);
  --radius:14px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Poppins',system-ui,sans-serif;color:var(--text);background:var(--bg);line-height:1.6;}
img{max-width:100%;display:block;}
a{text-decoration:none;color:inherit;}
ul{list-style:none;}
.container{width:min(1140px,90%);margin-inline:auto;}

/* Brand name colors */
.l-seka{color:var(--seka);}
.l-info{color:var(--info);}
.l-tech{color:var(--tech);}

.logo{font-size:1.5rem;font-weight:800;letter-spacing:-.5px;}

/* ================= HEADER ================= */
.header{position:fixed;top:0;left:0;width:100%;z-index:100;transition:.3s;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);box-shadow:0 2px 10px rgba(0,0,0,.06);}
.header.scrolled{background:rgba(17,17,17,.95);}
.header.scrolled .logo span,.header.scrolled .nav-links a{color:#fff;}
.header.scrolled .nav-links a:hover{color:var(--info);}
.nav{display:flex;justify-content:space-between;align-items:center;padding:.9rem 0;}
.nav-links{display:flex;gap:2rem;}
.nav-links a{font-weight:600;font-size:.95rem;color:var(--seka);transition:.25s;position:relative;}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-6px;height:3px;width:0;background:linear-gradient(90deg,var(--info),var(--tech));transition:.3s;border-radius:2px;}
.nav-links a:hover::after{width:100%;}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:0;padding:6px;}
.hamburger span{width:26px;height:3px;background:var(--seka);border-radius:2px;transition:.3s;}

/* ================= HERO / SLIDER ================= */
.hero{position:relative;}
.slider{position:relative;height:92vh;min-height:520px;overflow:hidden;}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1s ease;}
.slide.active{opacity:1;}
.slide img{width:100%;height:100%;object-fit:cover;}
.slide::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(17,17,17,.85) 0%,rgba(29,78,216,.55) 60%,rgba(230,57,70,.45) 100%);}
.slide-content{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;color:#fff;max-width:min(1140px,90%);margin-inline:auto;}
.slide-content h1,.slide-content h2{font-size:clamp(2rem,5vw,3.4rem);font-weight:800;line-height:1.15;margin-bottom:1rem;}
.slide-content h1 span,.slide-content h2 span{color:#fff;}
.slide-content p{max-width:560px;font-size:1.05rem;margin-bottom:1.8rem;opacity:.95;}
.btn{display:inline-block;padding:.85rem 2rem;border-radius:50px;font-weight:600;transition:.3s;border:0;cursor:pointer;}
.btn-primary{background:linear-gradient(90deg,var(--info),var(--tech));color:#fff;box-shadow:0 8px 20px rgba(230,57,70,.35);}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(29,78,216,.4);}

.slider-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;background:rgba(17,17,17,.55);color:#fff;border:0;width:48px;height:48px;border-radius:50%;font-size:1.2rem;cursor:pointer;transition:.3s;}
.slider-arrow:hover{background:var(--info);}
.prev{left:20px;}
.next{right:20px;}

.slider-dots{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);z-index:5;display:flex;gap:10px;}
.slider-dots button{width:12px;height:12px;border-radius:50%;border:2px solid #fff;background:transparent;cursor:pointer;transition:.3s;}
.slider-dots button.active{background:var(--info);border-color:var(--info);}

/* ================= SECTIONS ================= */
.section{padding:5rem 0;}
.section-title{text-align:center;margin-bottom:3rem;}
.section-title.left{text-align:left;}
.section-title h2{font-size:clamp(1.7rem,3.5vw,2.4rem);font-weight:800;color:var(--seka);}
.section-title h2 span{color:var(--info);}
.section-title p{color:var(--muted);margin-top:.4rem;}

/* ================= SERVICES ================= */
.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.8rem;}
.service-card{background:var(--white);padding:2.2rem 1.8rem;border-radius:var(--radius);box-shadow:var(--shadow);transition:.35s;border-bottom:4px solid transparent;}
.service-card:hover{transform:translateY(-8px);border-bottom-color:var(--tech);}
.service-card:nth-child(even):hover{border-bottom-color:var(--info);}
.service-icon{font-size:2.4rem;margin-bottom:1rem;background:linear-gradient(135deg,rgba(29,78,216,.12),rgba(230,57,70,.12));width:70px;height:70px;display:grid;place-items:center;border-radius:16px;}
.service-card h3{font-size:1.15rem;color:var(--seka);margin-bottom:.6rem;}
.service-card p{color:var(--muted);font-size:.95rem;}

/* ================= ABOUT ================= */
.about{background:linear-gradient(180deg,#fff,#f1f3f9);}
.about-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:3rem;align-items:center;}
.about-image img{border-radius:var(--radius);box-shadow:var(--shadow);}
.about-image{position:relative;}
.about-image::before{content:"";position:absolute;inset:18px -18px -18px 18px;border-radius:var(--radius);background:linear-gradient(135deg,var(--tech),var(--info));opacity:.25;z-index:-1;}
.about-text p{color:var(--muted);margin-bottom:1rem;}
.about-text strong{color:var(--seka);}
.about-stats{display:flex;gap:2rem;margin-top:2rem;flex-wrap:wrap;}
.stat{text-align:center;}
.stat-num{display:block;font-size:2.2rem;font-weight:800;background:linear-gradient(90deg,var(--info),var(--tech));-webkit-background-clip:text;background-clip:text;color:transparent;}
.stat p{font-size:.85rem;margin:0;color:var(--muted);}

/* ================= CONTACT ================= */
.contact{background:var(--seka);color:#fff;}
.contact .section-title h2{color:#fff;}
.contact .section-title p{color:#cbd5e1;}
.contact-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:2.5rem;}
.info-item{display:flex;gap:1rem;align-items:flex-start;margin-bottom:1.6rem;}
.info-icon{font-size:1.4rem;background:rgba(255,255,255,.1);width:52px;height:52px;display:grid;place-items:center;border-radius:12px;flex-shrink:0;}
.info-item h4{font-size:1rem;}
.info-item a:hover{color:var(--info);}
.contact-form{background:rgba(255,255,255,.06);padding:2rem;border-radius:var(--radius);border:1px solid rgba(255,255,255,.12);}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
.contact-form input,.contact-form textarea{width:100%;padding:.9rem 1rem;margin-bottom:1rem;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;font-family:inherit;font-size:.95rem;outline:none;transition:.3s;}
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--tech-light);background:rgba(255,255,255,.12);}
.contact-form ::placeholder{color:#9aa3b2;}
.contact-form .btn{width:100%;}
.form-status{margin-top:.8rem;color:#4ade80;font-size:.9rem;display:none;}

/* ================= FOOTER ================= */
.footer{background:#0b0b0b;color:#9aa3b2;padding:4rem 0 0;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2.5rem;padding-bottom:3rem;}
.footer-col h4{color:#fff;margin-bottom:1.1rem;font-size:1.05rem;}
.footer-col ul li{margin-bottom:.6rem;}
.footer-col a{transition:.25s;}
.footer-col a:hover{color:var(--info);padding-left:4px;}
.footer-logo{margin-bottom:.8rem;display:inline-block;}
.socials{display:flex;gap:.7rem;margin-bottom:1rem;}
.socials a{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.08);font-weight:700;transition:.3s;}
.socials a:hover{background:linear-gradient(135deg,var(--info),var(--tech));color:#fff;transform:translateY(-4px);}
.footer-mail{font-size:.9rem;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:1.2rem 0;text-align:center;font-size:.85rem;}
.footer-bottom .l-seka{color:#fff;}

/* ================= BACK TO TOP ================= */
.back-to-top{position:fixed;bottom:26px;right:26px;width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--info),var(--tech));color:#fff;display:grid;place-items:center;font-size:1.3rem;box-shadow:0 8px 18px rgba(0,0,0,.25);opacity:0;pointer-events:none;transition:.3s;z-index:90;}
.back-to-top.show{opacity:1;pointer-events:auto;}
.back-to-top:hover{transform:translateY(-4px);}

/* ================= REVEAL ANIMATION ================= */
.reveal{opacity:0;transform:translateY(30px);transition:.7s ease;}
.reveal.visible{opacity:1;transform:none;}

/* ================= RESPONSIVE ================= */
@media(max-width:900px){
  .about-grid,.contact-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:700px){
  .hamburger{display:flex;}
  .nav-links{position:fixed;top:64px;right:-100%;flex-direction:column;background:var(--seka);width:min(280px,80%);height:calc(100vh - 64px);padding:2rem;gap:1.4rem;transition:right .35s;}
  .nav-links.open{right:0;}
  .nav-links a{color:#fff !important;}
  .header.scrolled .hamburger span{background:#fff;}
  .slider{height:80vh;}
  .slider-arrow{display:none;}
  .form-row{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;text-align:center;}
  .socials{justify-content:center;}
  .section{padding:3.5rem 0;}
}
