/* ფონტი იტვირთება -ში preconnect-ით (header.php) — @import-ი ამოღებულია render-blocking ჯაჭვის გასაწყვეტად */ * { margin:0; padding:0; box-sizing:border-box; } body { font-family:'Noto Sans Georgian',sans-serif; color:#3E3E3E; background:#fff; } .blue{color:#1E6FBA}.red{color:#E0312E}.orange{color:#F5A623} .wrap{max-width:1180px; margin:0 auto;} /* NAV */ nav{height:84px; background:#fff; border-bottom:1px solid #ECEFF3;} nav .wrap{display:flex; align-items:center; height:84px;} .logo{display:flex; align-items:center;} .logo svg{width:46px; height:46px; margin-right:12px;} .logo .word{font-family:'Noto Sans Georgian'; font-weight:800; font-size:26px; letter-spacing:1px; color:#3E3E3E;} .menu{margin-left:auto; display:flex; align-items:center;} .menu a{font-size:15px; font-weight:700; color:#3E3E3E; text-decoration:none; margin-left:34px; white-space:nowrap;} .menu a.active{color:#1E6FBA;} .menu .cta{background:#E0312E; color:#fff; padding:11px 24px; border-radius:8px;} .nav-toggle{display:none; background:none; border:0; cursor:pointer; padding:8px; margin-left:auto; flex-direction:column; gap:5px;} .nav-toggle span{display:block; width:24px; height:2px; background:#16314C; border-radius:2px;} /* LANGUAGE SWITCH (KA/EN) — segmented pill */ .lang-switch{display:inline-flex; align-items:center; gap:3px; margin-left:30px; padding:3px; background:#F2F5F9; border:1px solid #E6ECF4; border-radius:22px;} .lang-switch a{display:inline-flex; align-items:center; gap:6px; margin:0; padding:6px 12px; border-radius:18px; font-size:13px; font-weight:700; color:#8A97A6; text-decoration:none; line-height:1; transition:background .15s ease, color .15s ease, box-shadow .15s ease;} .lang-switch a:hover{color:#1E6FBA; background:#E7EEF7;} .lang-switch a.on{color:#fff; background:#1E6FBA; box-shadow:0 2px 6px rgba(30,111,186,.28);} .lang-switch a.on:hover{background:#1A63A6;} .lang-switch .flag{display:inline-flex; width:20px; height:13px; border-radius:3px; overflow:hidden; box-shadow:0 0 0 1px rgba(0,0,0,.08);} .lang-switch .flag svg{display:block; width:100%; height:100%;} /* PAGE HERO (inner pages) */ .phero{background:linear-gradient(135deg,#0E3A63 0%,#1E6FBA 80%); padding:64px 0;} .phero h1{color:#fff; font-size:40px; font-weight:800;} .phero .crumb{color:#9FC3E4; font-size:14px; font-weight:700; margin-top:12px;} .phero .crumb b{color:#F5A623;} /* HOME HERO */ .hero{background:linear-gradient(135deg,#0E3A63 0%,#1E6FBA 70%,#2B7FCB 100%); position:relative; overflow:hidden;} .hero .wrap{display:flex; padding:90px 0 100px 0;} .hero-left{width:600px;} .badge{display:inline-block; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35); color:#fff; font-size:13px; font-weight:700; padding:7px 16px; border-radius:20px; margin-bottom:26px;} .hero h1{color:#fff; font-size:38px; font-weight:800; line-height:1.25; letter-spacing:-0.5px;} @media (max-width:640px){ .hero h1{font-size:30px;} } .hero h1 .or{color:#F5A623;} .hero p{color:#CFE2F4; font-size:17px; line-height:1.75; margin-top:24px; width:540px;} .hero-btns{margin-top:38px;} .btn{display:inline-block; font-size:16px; font-weight:700; padding:16px 34px; border-radius:10px; text-decoration:none;} .btn-or{background:#F5A623; color:#16314C;} .btn-blue{background:#1E6FBA; color:#fff;} .btn-red{background:#E0312E; color:#fff;} .btn-ghost{border:2px solid rgba(255,255,255,.6); color:#fff; margin-left:16px;} .hero-right{margin-left:auto; width:480px; position:relative;} .card{background:#fff; border-radius:16px; box-shadow:0 18px 40px rgba(7,30,54,.35);} .mockwin{width:460px; padding:0; overflow:hidden; margin-top:14px;} .mockbar{height:38px; background:#F2F5F9; display:flex; align-items:center; padding-left:16px;} .dot{width:11px;height:11px;border-radius:6px;display:inline-block;margin-right:7px;} .mockbody{padding:22px;} .mockrow{height:13px; border-radius:7px; margin-bottom:12px;} .chiprow{margin-top:6px;} .chip{display:inline-block; font-size:12px; font-weight:700; padding:6px 13px; border-radius:14px; margin-right:8px;} .chip.b{background:#E3EEF8; color:#1E6FBA;} .chip.r{background:#FCE7E6; color:#E0312E;} .chip.o{background:#FDF1DC; color:#D88A0A;} /* STATS */ .stats{background:#fff;} .stats .wrap{display:flex; padding:48px 0;} .stat{width:295px; text-align:center; border-right:1px solid #ECEFF3;} .stat:last-child{border-right:none;} .stat .num{font-family:'Noto Sans Georgian'; font-size:40px; font-weight:800;} .stat .lbl{font-size:14px; color:#76808C; margin-top:6px; font-weight:700;} /* SECTIONS */ .section{padding:84px 0 90px 0;} .section.gray{background:#F6F8FB;} .sec-tag{display:block; text-align:center; font-size:14px; font-weight:800; letter-spacing:2px; color:#E0312E; margin-bottom:14px;} h2.sec{font-size:36px; font-weight:800; text-align:center; color:#22303F;} .sec-sub{text-align:center; color:#76808C; font-size:16px; margin-top:14px;} /* SERVICE CARDS */ .cards{display:flex; flex-wrap:wrap; margin-top:54px; justify-content:space-between; align-items:stretch;} .svc{display:flex; flex-direction:column; width:373px; background:#fff; border-radius:14px; padding:34px 30px 30px 30px; margin-bottom:28px; border:1px solid #ECEFF3; border-top:4px solid #1E6FBA;} .svc.r{border-top-color:#E0312E;} .svc.o{border-top-color:#F5A623;} .ico{width:54px; height:54px; border-radius:12px; display:flex; align-items:center; justify-content:center; margin-bottom:20px; font-size:24px; font-weight:800;} .ico.b{background:#E3EEF8; color:#1E6FBA;} .ico.rr{background:#FCE7E6; color:#E0312E;} .ico.oo{background:#FDF1DC; color:#D88A0A;} .svc h3{font-size:19px; font-weight:800; color:#22303F; margin-bottom:10px;} .svc p{font-size:14.5px; line-height:1.7; color:#76808C;} .svc .tags{margin-top:auto; padding-top:16px;} /* SECURITY PAGE — responsive 4-card grid (scoped, won't affect services) */ .secure-sec .cards{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:46px; justify-content:initial; align-items:stretch; } .secure-sec .svc{ width:auto; margin-bottom:0; box-shadow:0 2px 10px rgba(34,48,63,0.05); transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; } .secure-sec .svc:hover{ transform:translateY(-4px); box-shadow:0 12px 28px rgba(34,48,63,0.12); border-color:#DCE6F1; } @media (max-width:980px){ .secure-sec .cards{grid-template-columns:repeat(2,1fr);} } @media (max-width:560px){ .secure-sec .cards{grid-template-columns:1fr; gap:18px;} } /* PRODUCT BAND */ .product{background:#16314C; padding:90px 0; position:relative; overflow:hidden;} .product .wrap{display:flex; align-items:center;} .pr-left{width:560px;} .pr-tag{color:#F5A623; font-size:14px; font-weight:800; letter-spacing:2px;} .product h2{color:#fff; font-size:38px; font-weight:800; line-height:1.3; margin-top:14px;} .product p{color:#A9BFD4; font-size:16px; line-height:1.8; margin-top:20px;} .pr-feats{margin-top:30px;} .feat{display:flex; align-items:center; margin-bottom:14px;} .tick{width:24px;height:24px;border-radius:12px;background:#F5A623;color:#16314C;font-weight:800;font-size:14px;text-align:center;line-height:24px;margin-right:12px;font-family:'Noto Sans Georgian';} .feat span.t{color:#E8F0F8; font-size:15.5px; font-weight:700;} .pr-right{margin-left:auto; width:520px;} .dash{background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 18px 40px rgba(0,0,0,.4);} .dash-top{background:#1E6FBA; height:54px; display:flex; align-items:center; padding:0 20px;} .dash-top .sq{width:26px;height:26px;border-radius:6px;background:rgba(255,255,255,.25); margin-right:12px;} .dash-top .ttl{color:#fff; font-weight:700; font-size:14px;} .dash-body{display:flex; padding:20px;} .dcol{width:150px; margin-right:14px;} .dcard{border-radius:10px; padding:14px; margin-bottom:12px;} .dnum{font-family:'Noto Sans Georgian'; font-size:24px; font-weight:800;} .dlbl{font-size:11px; color:#76808C; font-weight:700; margin-top:3px;} .bars{display:flex; align-items:flex-end; height:120px; margin-top:8px;} .bar{width:24px; border-radius:5px 5px 0 0; margin-right:10px;} /* FEATURE LIST (product page) */ .fgrid{display:flex; flex-wrap:wrap; justify-content:space-between; margin-top:54px;} .fbox{width:373px; background:#fff; border:1px solid #ECEFF3; border-radius:14px; padding:30px; margin-bottom:28px;} .fbox h3{font-size:18px; font-weight:800; color:#22303F; margin:14px 0 8px 0;} .fbox p{font-size:14px; line-height:1.7; color:#76808C;} /* ABOUT */ .about-flex{display:flex; margin-top:10px;} .about-text{width:640px; font-size:16.5px; line-height:1.9; color:#5A6470;} .about-text p{margin-bottom:18px;} .about-side{margin-left:auto; width:460px;} .mission{border-radius:14px; padding:30px; margin-bottom:20px; color:#fff;} .mission h3{font-size:19px; font-weight:800; margin-bottom:10px;} .mission p{font-size:14.5px; line-height:1.7; opacity:.92;} .timeline{margin-top:50px;} .tl-item{display:flex; margin-bottom:0;} .tl-left{width:120px; text-align:right; padding-right:26px;} .tl-year{font-family:'Noto Sans Georgian'; font-size:22px; font-weight:800; color:#1E6FBA;} .tl-mid{width:40px; position:relative;} .tl-dot{width:16px; height:16px; border-radius:8px; background:#F5A623; border:3px solid #fff; box-shadow:0 0 0 2px #F5A623; margin:6px auto 0 auto;} .tl-line{width:3px; background:#E3EAF1; height:74px; margin:4px auto 0 auto;} .tl-right{width:860px; padding-left:26px; padding-bottom:34px;} .tl-right h4{font-size:17px; font-weight:800; color:#22303F;} .tl-right p{font-size:14.5px; color:#76808C; line-height:1.7; margin-top:6px;} /* CONTACT */ .contact-flex{display:flex; margin-top:54px;} .cform{width:700px; background:#fff; border:1px solid #ECEFF3; border-radius:14px; padding:40px;} .cform h3{font-size:22px; font-weight:800; color:#22303F; margin-bottom:26px;} .frow{display:flex; justify-content:space-between; margin-bottom:18px;} .fld{width:300px;} .fld.full{width:620px;} .fld label{display:block; font-size:13.5px; font-weight:700; color:#22303F; margin-bottom:8px;} .fld .inp{height:48px; border:1.5px solid #DDE4EC; border-radius:9px; background:#FAFBFC; padding:14px; font-size:14px; color:#9AA5B1;} .fld .inp.ta{height:130px;} .cinfo{margin-left:auto; width:440px;} .cibox{background:#fff; border:1px solid #ECEFF3; border-radius:14px; padding:26px 28px; margin-bottom:18px; display:flex; align-items:center;} .cibox .ic{width:50px; height:50px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:800; margin-right:18px;} .cibox h4{font-size:13px; font-weight:700; color:#76808C;} .cibox .v{font-size:16.5px; font-weight:800; color:#22303F; margin-top:4px; font-family:'Noto Sans Georgian';} .map{background:linear-gradient(135deg,#E3EEF8,#F6F8FB); border:1px solid #ECEFF3; border-radius:14px; height:230px; position:relative;} .pin{position:absolute; left:46%; top:38%; width:26px; height:26px; border-radius:13px 13px 13px 0; background:#E0312E; transform:rotate(-45deg);} /* CTA BAND */ .cta-band{background:linear-gradient(90deg,#E0312E 0%,#F5A623 100%); padding:56px 0;} .cta-band .wrap{display:flex; align-items:center;} .cta-band h2{color:#fff; font-size:30px; font-weight:800; width:700px; line-height:1.35;} .btn-white{background:#fff; color:#E0312E; margin-left:auto;} /* FOOTER */ footer{background:#22303F; padding:64px 0 0 0;} footer .wrap{display:flex; padding-bottom:50px;} .fcol{width:280px; margin-right:40px;} .fcol .word{font-family:'Noto Sans Georgian'; font-weight:800; font-size:22px; color:#fff;} .fcol p{color:#8FA0B3; font-size:14px; line-height:1.8; margin-top:16px;} .fcol h3{color:#fff; font-size:16px; font-weight:800; margin-bottom:18px;} .fcol a{display:block; color:#8FA0B3; font-size:14px; text-decoration:none; margin-bottom:11px;} .fbar{border-top:1px solid #33445A; padding:20px 0; text-align:center; color:#8FA0B3; font-size:13px;} /* form elements (real inputs) */ input.inp, select.inp, textarea.inp { width:100%; font-family:inherit; color:#3E3E3E; } textarea.inp { resize:vertical; } button.btn { border:none; cursor:pointer; font-family:inherit; } .notice { padding:14px 18px; border-radius:9px; font-size:14px; font-weight:700; margin-bottom:20px; } .notice.ok { background:#EAF6EF; color:#2E9E5B; } .notice.bad { background:#FCE7E6; color:#E0312E; } .logo { text-decoration:none; } /* PRODUCT CARDS (პროდუქტების სია) */ .pcards{display:flex; justify-content:space-between; flex-wrap:wrap; margin-top:54px;} .pcard{width:373px; background:#fff; border:1px solid #ECEFF3; border-radius:16px; padding:40px 32px 34px 32px; text-align:center; text-decoration:none; display:block; border-top:4px solid #1E6FBA; margin-bottom:28px;} .pcard.r{border-top-color:#E0312E;} .pcard.o{border-top-color:#F5A623;} .pcard:hover{box-shadow:0 14px 34px rgba(20,45,75,.12);} .pc-ico{width:84px; height:84px; border-radius:42px; margin:0 auto 22px auto; display:flex; align-items:center; justify-content:center;} .pc-ico.b{background:#E3EEF8;} .pc-ico.rr{background:#FCE7E6;} .pc-ico.oo{background:#FDF1DC;} .pcard h3{font-size:20px; font-weight:800; color:#22303F; margin-bottom:12px;} .pcard p{font-size:14.5px; line-height:1.7; color:#76808C;} .pc-more{display:inline-block; margin-top:18px; font-weight:800; font-size:14px; color:#1E6FBA;} /* MODULE TABS (პროდუქტის შიდა გვერდი) */ .mtabs{display:flex; justify-content:center; flex-wrap:wrap; gap:16px; margin-top:54px; margin-bottom:32px;} .mtab{ width:176px; text-align:center; text-decoration:none; padding:24px 14px 18px; border-radius:20px; background:#F5F8FC; border:1px solid #E6ECF4; box-shadow:0 1px 3px rgba(20,45,75,.04); transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease; } .mtab:hover{transform:translateY(-3px); border-color:#CBDBEE; box-shadow:0 10px 24px rgba(20,45,75,.10);} /* active — blue gradient card, white icon + label */ .mtab.on{ background:linear-gradient(150deg,#3284D8 0%,#1E6FBA 55%,#15579A 100%); border-color:transparent; box-shadow:0 12px 26px rgba(30,111,186,.32); } .mtab.on:hover{transform:translateY(-3px); box-shadow:0 16px 32px rgba(30,111,186,.36);} /* icon sits directly on the card (no inner box); color driven via currentColor */ .mt-ico{ display:flex; align-items:center; justify-content:center; margin:0 auto 16px; color:#1E6FBA; } .mt-ico svg{width:42px; height:42px;} .mtab.on .mt-ico{color:#fff;} .mtab span{display:block; font-size:13.5px; font-weight:700; color:#3E4B59; line-height:1.4;} .mtab.on span{color:#fff;} /* MODULE SECTIONS */ .mod{padding:74px 0; background:#fff;} .mod.alt{background:#F6F8FB;} .mod .wrap{display:block;} .mod-head{display:flex; align-items:center; gap:44px;} .mod-left{flex:1 1 auto; min-width:0;} .mod-left h2{font-size:31px; font-weight:800; color:#22303F; margin-top:0;} .mod-sub{color:#76808C; font-size:15px; margin-top:10px; line-height:1.6;} .mod-visual{position:relative; overflow:hidden; flex:none; width:440px; min-height:300px; border-radius:20px; display:flex; align-items:center; justify-content:center; box-shadow:0 18px 40px rgba(20,45,75,.20);} /* decorative depth circles */ .mod-visual::before{content:''; position:absolute; width:260px; height:260px; border-radius:50%; background:rgba(255,255,255,.10); top:-80px; right:-70px;} .mod-visual::after{content:''; position:absolute; width:200px; height:200px; border-radius:50%; border:2px solid rgba(255,255,255,.16); bottom:-60px; left:-50px;} .mod-visual > div{position:relative; z-index:1;} /* glass tile holding the icon */ .mv-ico{ display:inline-flex; align-items:center; justify-content:center; width:128px; height:128px; border-radius:30px; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.38); box-shadow:0 14px 34px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.28); backdrop-filter:blur(2px); } /* feature list → responsive grid of check-cards */ .mod-feats{display:grid; grid-template-columns:repeat(auto-fill, minmax(252px, 1fr)); gap:12px; margin-top:36px;} .mod-feat{ display:flex; align-items:flex-start; gap:11px; padding:12px 14px; background:#F6F8FB; border:1px solid #ECEFF3; border-radius:11px; font-size:14px; color:#3E4B59; line-height:1.4; transition:border-color .12s ease, box-shadow .12s ease, transform .12s ease; } .mod.alt .mod-feat{background:#fff;} .mod-feat:hover{border-color:#CBDBEE; box-shadow:0 5px 14px rgba(20,45,75,.07); transform:translateY(-1px);} .mod-feat i{flex:none; width:20px; height:20px; margin-top:1px; border-radius:50%; background:#E3EEF8; display:flex; align-items:center; justify-content:center;} .mod-feat i::before{content:'✓'; font-size:11px; font-weight:800; color:#1E6FBA; line-height:1;} @media (max-width:1200px){ .hero .wrap,.product .wrap,.about-flex,.contact-flex,.stats .wrap,footer .wrap{flex-wrap:wrap;} .hero-right,.pr-right,.about-side,.cinfo{margin-left:0; margin-top:30px;} } @media (max-width:980px){ .mod-head{flex-direction:column; align-items:stretch;} .mod-visual{width:100%; margin-top:24px;} } /* ═══════════════ MOBILE / TABLET RESPONSIVE ═══════════════ */ @media (max-width:768px){ body{overflow-x:hidden;} .wrap{padding-left:18px; padding-right:18px;} /* NAV — hamburger dropdown (JS toggles .open on .menu + .nav-toggle) */ nav{height:auto;} nav .wrap{flex-wrap:wrap; height:auto; padding-top:14px; padding-bottom:14px;} .nav-toggle{display:flex;} .nav-toggle span{transition:transform .22s ease, opacity .18s ease;} .menu{display:none; order:3; width:100%; flex-direction:column; align-items:stretch; margin:12px 0 0;} .menu.open{display:flex;} .menu > a{margin:0; width:100%; font-size:15px; font-weight:700; padding:13px 2px; border-bottom:1px solid #EEF1F5;} .menu > a.cta{width:auto; align-self:flex-start; margin:14px 0 2px; padding:11px 26px; border-bottom:none; color:#fff;} .lang-switch{align-self:flex-start; margin:14px 0 2px;} /* hamburger → X */ .nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);} .nav-toggle.open span:nth-child(2){opacity:0;} .nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);} /* HOME HERO → single column */ .hero .wrap{flex-direction:column; padding:54px 0 60px;} .hero-left{width:100%;} .hero h1{font-size:30px;} .hero p{width:auto;} .hero-btns{display:flex; flex-direction:column; align-items:flex-start; gap:12px;} .btn-ghost{margin-left:0;} .hero-right{width:100%; margin-left:0; margin-top:34px;} .mockwin{width:100%;} /* STATS 4 → 2 */ .stats .wrap{flex-wrap:wrap; padding:36px 0;} .stat{width:50%; border-right:none; margin-bottom:24px;} /* SECTIONS */ .section{padding:54px 0 60px;} h2.sec{font-size:26px;} .sec-sub{font-size:15px;} /* CARDS 3 → 1 (services / products / features / security) */ .svc{width:100%; margin-bottom:20px;} .fbox{width:100%;} .pcard{width:100%;} .secure-sec .cards{grid-template-columns:1fr;} /* PRODUCT BAND → column, dashboard stacked */ .product{padding:54px 0;} .product .wrap{flex-direction:column;} .pr-left{width:100%;} .product h2{font-size:28px;} .pr-right{width:100%; margin-left:0; margin-top:30px;} .dash-body{flex-direction:column;} .dcol{width:100%; margin-right:0;} .dash-body > div{width:100% !important; max-width:100%;} /* ABOUT → column */ .about-flex{flex-direction:column;} .about-text{width:100%;} .about-side{width:100%; margin-left:0; margin-top:30px;} .tl-left{width:78px; padding-right:16px;} .tl-right{width:auto; flex:1 1 auto; padding-left:18px;} /* CONTACT → column, fields stacked */ .contact-flex{flex-direction:column;} .cform{width:100%; padding:24px;} .frow{flex-direction:column; margin-bottom:0;} .fld, .fld.full{width:100%; margin-bottom:18px;} .cinfo{width:100%; margin-left:0; margin-top:24px;} /* CTA */ .cta-band .wrap{flex-direction:column; text-align:center; gap:20px;} .cta-band h2{width:auto; font-size:24px;} .btn-white{margin-left:0;} /* FOOTER → stacked (width:100% !important overrides inline width on .fcol) */ footer .wrap{flex-direction:column; padding-bottom:40px;} .fcol{width:100% !important; margin-right:0; margin-bottom:28px;} /* PRODUCT INNER: tabs horizontal-scroll, module column */ .mtabs{flex-wrap:nowrap; overflow-x:auto; justify-content:flex-start; gap:12px; padding-bottom:8px; -webkit-overflow-scrolling:touch;} .mtab{flex:0 0 auto; width:138px; padding:18px 12px 14px;} .mod{padding:46px 0;} .mod-visual{width:100%;} .mod-left h2{font-size:25px;} /* INNER PAGE HERO */ .phero{padding:44px 0;} .phero h1{font-size:28px;} .btn{padding:14px 26px; font-size:15px;} } @media (max-width:480px){ /* STATS 2 → 1 */ .stat{width:100%; border-right:none; margin-bottom:20px;} /* tighter type */ .hero h1{font-size:26px;} .hero p{font-size:16px;} h2.sec{font-size:23px;} .product h2{font-size:25px;} .phero h1{font-size:23px;} .mod-feats{grid-template-columns:1fr;} .mod-left h2{font-size:23px;} /* full-width hero buttons for easy tapping */ .hero-btns{align-items:stretch;} .hero-btns .btn{display:block; text-align:center; margin-left:0;} /* tighter card / form padding */ .svc{padding:26px 22px;} .cform{padding:20px;} .cibox{padding:20px;} /* keep flagship chart from stretching tall on tiny screens */ .bars{height:96px;} } @media (max-width:480px){ .stat{width:100%; margin-bottom:20px;} .hero h1{font-size:26px;} h2.sec{font-size:23px;} .phero h1{font-size:24px;} .mod-feats{grid-template-columns:1fr;} .svc{padding:26px 22px;} .cform{padding:20px;} } /* ═══════════════ BLOG — LIST (blog.php) ═══════════════ */ /* .blog-list reuses .cards; .blog-card reuses .svc — override to a responsive grid of clean lift-cards */ .blog-list{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:48px; justify-content:initial; align-items:stretch; } .blog-card{ width:auto; margin-bottom:0; position:relative; overflow:hidden; padding:30px 28px 26px; text-decoration:none; box-shadow:0 2px 10px rgba(34,48,63,.05); transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; } .blog-card, .blog-card h3, .blog-card p, .blog-card .chip{text-decoration:none;} .blog-card:hover{ transform:translateY(-5px); box-shadow:0 16px 34px rgba(20,45,75,.14); border-color:#DCE6F1; } /* badge (b=სტატია / r=ქეისი) sits at top-left */ .blog-card .chip{align-self:flex-start; margin:0 0 16px;} /* title + excerpt */ .blog-card h3{font-size:19.5px; line-height:1.4; margin-bottom:11px;} .blog-card:hover h3{color:#1E6FBA;} .blog-card p{ font-size:14.5px; line-height:1.7; color:#76808C; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; } /* read-more pinned to bottom (arrow ↗ already comes from the t() string) */ .blog-card .pc-more{ margin-top:auto; padding-top:18px; display:inline-flex; align-items:center; color:#1E6FBA; font-weight:800; font-size:14px; transition:transform .18s ease; } .blog-card:hover .pc-more{transform:translateX(3px);} @media (max-width:980px){ .blog-list{grid-template-columns:repeat(2,1fr); gap:22px;} } @media (max-width:620px){ .blog-list{grid-template-columns:1fr; gap:18px;} .blog-card{width:auto;} } /* ═══════════════ BLOG — ARTICLE (post.php) ═══════════════ */ .article-wrap{max-width:760px; margin:0 auto;} .article-body{color:#3E4B59; font-size:16.5px; line-height:1.75;} .article-body > *:first-child{margin-top:0;} /* lead paragraph */ .article-body > p:first-of-type{font-size:18px; color:#2C3845; line-height:1.7;} .article-body p{margin:0 0 22px;} .article-body h2{font-size:27px; font-weight:800; color:#22303F; line-height:1.3; margin:42px 0 14px;} .article-body h3{font-size:21px; font-weight:800; color:#22303F; line-height:1.35; margin:32px 0 10px;} .article-body h2 + p, .article-body h3 + p{margin-top:0;} .article-body strong, .article-body b{color:#22303F; font-weight:800;} /* links — brand blue, hover red */ .article-body a{color:#1E6FBA; font-weight:700; text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1.5px; transition:color .15s ease;} .article-body a:hover{color:#E0312E;} /* unordered list — custom orange square bullet */ .article-body ul{list-style:none; margin:0 0 22px; padding:0;} .article-body ul li{position:relative; padding-left:26px; margin-bottom:11px; line-height:1.7;} .article-body ul li::before{content:''; position:absolute; left:3px; top:10px; width:8px; height:8px; border-radius:2px; background:#F5A623;} /* ordered list — brand numerals */ .article-body ol{margin:0 0 22px; padding-left:22px;} .article-body ol li{margin-bottom:11px; line-height:1.7; padding-left:6px;} .article-body ol li::marker{color:#1E6FBA; font-weight:800;} /* blockquote */ .article-body blockquote{margin:26px 0; padding:14px 22px; border-left:4px solid #1E6FBA; background:#F6F8FB; border-radius:0 10px 10px 0; color:#3E4B59; font-style:italic;} .article-body blockquote p:last-child{margin-bottom:0;} /* media */ .article-body img{max-width:100%; height:auto; border-radius:12px; margin:18px 0;} .article-body hr{border:none; border-top:1px solid #E6ECF2; margin:34px 0;} @media (max-width:768px){ .article-body{font-size:16px;} .article-body > p:first-of-type{font-size:17px;} .article-body h2{font-size:23px; margin:32px 0 12px;} .article-body h3{font-size:19px;} } /* ═══════════════ SECURITY / LEGAL POLICY (security-policy.php) ═══════════════ */ /* inherits .article-body typography; this layer adds legal-document polish + tables */ .policy-wrap{max-width:820px; margin:0 auto;} /* section headings — content is manually numbered ("1." "2." …), so NO auto-numbering; a top divider gives clear legal-section separation */ .policy-body h2{ font-size:23px; color:#16314C; line-height:1.35; font-weight:800; margin:46px 0 16px; padding-top:30px; border-top:2px solid #EAEFF4; } .policy-body h2:first-of-type{border-top:none; padding-top:0; margin-top:4px;} /* sub-sections (4.1, 4.2 …) in brand blue for hierarchy */ .policy-body h3{font-size:18px; color:#1E6FBA; margin:30px 0 10px;} .policy-body p{margin:0 0 18px;} .policy-body ul{margin:0 0 20px;} .policy-body ul li{margin-bottom:9px;} .policy-body strong, .policy-body b{color:#16314C;} /* TABLES — full width, bordered, brand header (#1E6FBA), zebra striping */ .policy-body table{ width:100%; border-collapse:collapse; margin:26px 0; font-size:14.5px; border:1px solid #D7E2EE; } .policy-body th{ background:#1E6FBA; color:#fff; text-align:left; font-weight:700; padding:13px 15px; border:1px solid #1A63A6; vertical-align:top; } .policy-body td{ padding:12px 15px; border:1px solid #E6EDF4; color:#3E4B59; vertical-align:top; line-height:1.55; } .policy-body tbody tr:nth-child(even){background:#F6F8FB;} .policy-body tbody tr:hover{background:#EEF4FA;} @media (max-width:768px){ .policy-wrap{max-width:100%;} .policy-body h2{font-size:20px; padding-top:24px; margin:34px 0 12px;} .policy-body h3{font-size:16.5px;} /* tables scroll horizontally instead of breaking layout */ .policy-body table{display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:nowrap;} } /* ═══════════════ SOCIAL SHARE (post.php) ═══════════════ */ .share{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; max-width:760px; margin:40px auto 0; padding-top:26px; border-top:1px solid #E6ECF2; } .share-label{font-size:14px; font-weight:800; color:#76808C; margin-right:4px;} .share-btn{ display:inline-flex; align-items:center; gap:8px; padding:9px 18px; border-radius:8px; font-size:14px; font-weight:700; line-height:1; color:#fff; text-decoration:none; transition:transform .15s ease, box-shadow .15s ease, filter .15s ease; } .share-btn:hover{transform:translateY(-2px); box-shadow:0 7px 18px rgba(20,45,75,.20); filter:brightness(1.06);} .share-btn:active{transform:translateY(0); box-shadow:0 3px 8px rgba(20,45,75,.18);} /* small leading dot in the platform's own brand tone (kept simple, icon-free markup) */ .share-btn::before{content:''; width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.85);} .share-btn.fb{background:#1877F2;} .share-btn.li{background:#0A66C2;} .share-btn.x{background:#000;} @media (max-width:768px){ .share{margin-top:32px; padding-top:22px;} .share-btn{flex:1 1 auto; justify-content:center;} .share-label{flex-basis:100%; margin-bottom:2px;} }