:root{--navy:#161e2a;--primary:#1976f2;--primary2:#0072ef;--accent:#2e91fc;--grey1:#ebebeb;--grey2:#f2f2f2;--text:#595959}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Open Sans",sans-serif;color:var(--text);line-height:1.7;background:#fff}
h1,h2,h3,h4,h5{font-family:"Fira Sans",sans-serif;line-height:1.25}
h2{font-size:clamp(1.8rem,3.4vw,2.7rem);color:var(--navy);margin-bottom:.8rem}
h5{font-size:1.15rem;font-weight:400;color:var(--navy);margin-bottom:1rem}
p{margin-bottom:1rem}
img{max-width:100%;display:block}
a{color:var(--primary)}
.wrap{max-width:1170px;margin:0 auto;padding:0 24px}
.sec{padding:90px 0}
.light{background:var(--grey1)}
.light2{background:var(--grey2)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.center{text-align:center;max-width:900px;margin:0 auto}
.btn{display:inline-block;background:var(--primary);color:#fff;text-decoration:none;font-weight:700;letter-spacing:.06em;padding:15px 34px;border-radius:4px;margin-top:.6rem;box-shadow:0 6px 18px rgba(25,118,242,.25);transition:transform .25s,box-shadow .25s,background .25s}
.btn:hover{transform:translateY(-3px);background:var(--primary2);box-shadow:0 10px 26px rgba(25,118,242,.35)}
header{position:sticky;top:0;z-index:50;background:var(--primary)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:78px}
header .logo img{height:46px}
nav a{color:#fff;text-decoration:none;margin-left:26px;font-weight:600;font-size:.95rem;transition:color .2s}
nav a:hover{color:#dbeafe}

.burger{display:none;background:none;border:0;color:#fff;font-size:1.7rem;cursor:pointer}
.hero{background:#fff url(assets/Home_Banner_2.png) center/cover;position:relative;color:#000;padding:140px 0 150px}

.hero .wrap{position:relative;max-width:1170px}.hero .in{max-width:620px}
.hero h2{color:#000;font-size:clamp(2.2rem,5vw,3.6rem)}.hero h5{color:#000}.hero .btn{background:var(--accent)}
.tp{margin-top:22px;font-size:.9rem;opacity:.85}.tp a{color:#000}
.shot{border-radius:18px;box-shadow:none}
.big{font-size:clamp(1.6rem,3vw,2.3rem);color:var(--navy);text-align:center;max-width:900px;margin:0 auto}
ul.ticks{list-style:none;margin:1rem 0}
ul.ticks li{padding-left:34px;position:relative;margin-bottom:12px}
ul.ticks li:before{content:"\2713";position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;background:var(--primary);color:#fff;font-size:.75rem;display:grid;place-items:center}
.videos{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;margin-top:40px}
.vid{position:relative;padding-top:56.25%;border-radius:14px;overflow:hidden;box-shadow:0 10px 24px rgba(0,0,0,.15);background:#000}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.social{display:flex;gap:34px;justify-content:center;padding:40px 0}
.social a{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;color:#fff;letter-spacing:.15em}
.social img{height:34px}
.socialbar{background:#000 url(assets/file.jpg) center/cover}
footer{background:#000;color:#fff;padding:40px 0;font-size:.9rem}
footer .wrap{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:center}
footer a{color:#fff;text-decoration:none;margin-right:18px}footer a:hover{color:#fff}
footer img{height:40px}
.reveal{opacity:0;transform:translateY(40px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.l{transform:translateX(-50px)}.reveal.r{transform:translateX(50px)}
.reveal.in{opacity:1;transform:none}
.hero .in>*{animation:up .9s both}.hero .in>*:nth-child(2){animation-delay:.15s}.hero .in>*:nth-child(3){animation-delay:.3s}.hero .in>*:nth-child(4){animation-delay:.45s}
@keyframes up{from{opacity:0;transform:translateY(30px)}}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.hero .in>*{animation:none}}
@media (max-width:900px){
 .grid,.videos{grid-template-columns:1fr;gap:32px}.grid .img-first{order:-1}
 .sec{padding:60px 0}.hero{padding:56px 0 0;min-height:calc(100vw*840/360 + 280px);background:#fff url(assets/PHone_Banner.png) bottom center/100% auto no-repeat}
 .burger{display:block}
 nav{display:none;position:absolute;top:78px;left:0;right:0;background:var(--primary);flex-direction:column;padding:16px 24px 24px}
 nav.open{display:flex}nav a{margin:10px 0}
 .social{flex-wrap:wrap;gap:20px}
}

.vid button{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;cursor:pointer;background:#000 center/cover no-repeat}
.vid button:after{content:"";position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;background:rgba(25,118,242,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M8 5v14l11-7z'/%3E%3C/svg%3E") 56% 50%/40px no-repeat;box-shadow:0 10px 30px rgba(0,0,0,.4);transition:transform .25s}
.vid button:hover:after{transform:scale(1.1)}

/* sub pages */
.sub h1{font-size:clamp(1.9rem,4vw,2.9rem);color:var(--navy);margin-bottom:1rem}
.sub h3{font-size:1.4rem;color:var(--navy);margin:1rem 0 .6rem}.sub h4,.sub h6{color:var(--navy);margin:1rem 0 .5rem}
.sub ul,.sub ol{margin:0 0 1rem 1.4rem}.sub li{margin-bottom:.4rem}
.sub .block{max-width:900px;margin:0 auto 24px}.sub .block.center{text-align:center}
.sub .block .shot,.sub .grid .shot{margin:16px auto}
.sub .block .vid{margin:20px auto;max-width:860px}
.sub .grid{margin-bottom:24px}
.sub .grid+.grid{margin-top:40px}
.subhero{background:var(--primary);color:#fff;padding:80px 0}
.subhero h1,.subhero h2,.subhero h3,.subhero h4,.subhero h5,.subhero h6,.subhero p,.subhero a:not(.btn){color:#fff}
.subhero .btn{background:#fff;color:var(--primary)}
.sub table{width:100%;border-collapse:collapse;margin-bottom:1rem}.sub td,.sub th{border:1px solid #ddd;padding:8px}
.posts{display:grid;gap:40px;max-width:900px}
.post h2 a{color:var(--navy);text-decoration:none}.post .meta{font-size:.85rem;color:#888;margin:12px 0 0}
.sub a{word-break:break-word}
.sub table{display:block;overflow-x:auto}.sub .block{overflow-wrap:anywhere}
