/* =============================
   Modern UI Theme (Clean Build)
   - Refreshed palette, neutrals, shadows, radii
   - Consolidated selectors, removed duplicates
   - Drop-in replacement for your CSS
   ============================= */

/* ----------------------------------
   Root: variables
---------------------------------- */
:root{
  /* Typography */
  --font-heading:"Plus Jakarta Sans",sans-serif;
  --font-body:"Outfit",sans-serif;
  --font-icon:"Font Awesome 5 Pro";
  --font-base:20px; --font-sm:18px; --font-xsm:16px; --font-lg:22px;
  --font-normal:400; --font-medium:500; --font-semi-bold:600; --font-bold:700;
  --font-size--h1:64px; --font-size--h2:48px; --font-size--h3:32px;
  --font-size--h4:24px; --font-size--h5:20px; --font-size--h6:18px;

  /* Brand palette */
  --color-primary:#6B5BFF;              /* electric indigo */
  --color-secondary:#22D3EE;            /* bright cyan */
  --color-red:#EF4444;                  /* red */
  --color-yellow:#F59E0B;               /* amber */
  --color-green:#10B981;                /* emerald */
  --color-blue:#3B82F6;                 /* blue */
  --color-white:#FFFFFF; --color-black:#000000;

  /* Neutrals */
  --color-dark:#0F172A;                 /* slate-900 */
  --color-medium:#64748B;               /* slate-500/600 */
  --color-light:#E5E7EB;                /* slate-200 */

  /* RGB (for alpha) */
  --color-primary-rgb:107,91,255;
  --color-secondary-rgb:34,211,238;
  --color-red-rgb:239,68,68;
  --color-green-rgb:16,185,129;
  --color-blue-rgb:59,130,246;
  --color-white-rgb:255,255,255; --color-black-rgb:0,0,0;
  --color-dark-rgb:15,23,42; --color-medium-rgb:100,116,139; --color-light-rgb:229,231,235;
  --color-dark-scroll:120,132,158;

  /* Surfaces */
  --bg-1:#F8FAFC; --bg-2:#F1F5F9; --bg-3:#E2E8F0; --bg-white:#FFFFFF; --bg-dark:var(--color-dark);
  --bg-primary-light:rgba(var(--color-primary-rgb),.07);

  /* Text */
  --text-dark:var(--color-dark); --text-medium:var(--color-medium); --text-white:var(--color-white); --text-light:#94A3B8;

  /* Borders, shadows, radii */
  --border-color:#E2E8F0; --border-color-2:#CBD5E1;
  --shadow-md:0 8px 24px -12px rgba(2,6,23,.18);
  --shadow-round:0 16px 40px -16px rgba(2,6,23,.28);
  --radius-sm:8px; --radius-md:12px; --radius-lg:16px; --radius-xl:24px; --radius-pill:50rem; --radius-circle:50%;

  /* Gradient */
  --gradient-1:linear-gradient(135deg,var(--color-primary) 0%,var(--color-secondary) 100%);
}

/* ----------------------------------
   Base elements
---------------------------------- */
*{box-sizing:border-box}
:focus{outline:0}
:focus-visible{outline:none!important;box-shadow:0 0 0 3px rgba(var(--color-primary-rgb),.35)!important;border-radius:8px}
html,body{height:100%}
img{max-width:100%;display:block}
ul{padding:0;margin:0}
::-webkit-scrollbar{width:6px;height:10px}
::-webkit-scrollbar-track{background-color:var(--bg-2)}
::-webkit-scrollbar-thumb{border-radius:30px;background:rgba(var(--color-dark-scroll),.25)}

body{
  font-family:var(--font-body);
  font-size:var(--font-base);
  font-weight:var(--font-normal);
  letter-spacing:.02em;
  color:var(--text-medium);
  overflow-x:hidden;
  background-color:var(--bg-white);
}

a{color:var(--text-dark);text-decoration:none;outline:0!important;transition:color .2s ease}
a:hover{color:var(--color-primary);text-decoration:underline;text-underline-offset:3px}

:is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6){
  font-family:var(--font-heading);color:var(--text-dark);font-weight:var(--font-bold);line-height:1.25;margin:0
}
.h1,h1{font-size:var(--font-size--h1)}
.h2,h2{font-size:var(--font-size--h2)}
.h3,h3{font-size:var(--font-size--h3)}
.h4,h4{font-size:var(--font-size--h4)}
.h5,h5{font-size:var(--font-size--h5)}
.h6,h6{font-size:var(--font-size--h6)}

p,.text,.card-text{color:var(--text-medium);line-height:1.65;margin:0 0 15px}
p:last-child,.text:last-child,.card-text:last-child{margin-bottom:0}

.font-lg{font-size:var(--font-lg)!important}
.font-sm{font-size:var(--font-sm)!important}
.font-xsm{font-size:var(--font-xsm)!important}
.font-base{font-size:var(--font-base)!important}
.font-medium{font-weight:var(--font-medium)}
.font-bold{font-weight:var(--font-bold)}
.subtitle{color:var(--text-light)}

/* Truncation */
:is(.lc-1,.lc-2,.lc-3,.lc-4,.lc-5){overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical}
.lc-1{-webkit-line-clamp:1}
.lc-2{-webkit-line-clamp:2}
.lc-3{-webkit-line-clamp:3}
.lc-4{-webkit-line-clamp:4}
.lc-5{-webkit-line-clamp:5}

/* Spacing utilities */
.mb-10{margin-bottom:10px!important}.mb-15{margin-bottom:15px!important}.mb-20{margin-bottom:20px!important}.mb-25{margin-bottom:25px!important}.mb-30{margin-bottom:30px!important}.mb-40{margin-bottom:40px!important}.mb-50{margin-bottom:50px!important}
.mt-10{margin-top:10px!important}.mt-15{margin-top:15px!important}.mt-20{margin-top:20px!important}.mt-25{margin-top:25px!important}.mt-30{margin-top:30px!important}.mt-40{margin-top:40px!important}.mt-50{margin-top:50px!important}
.pt-10{padding-top:10px!important}.pt-15{padding-top:15px!important}.pt-20{padding-top:20px!important}.pt-25{padding-top:25px!important}.pt-30{padding-top:30px!important}.pt-40{padding-top:40px!important}.pt-50{padding-top:50px!important}.pt-60{padding-top:60px}.pt-70{padding-top:70px}.pt-75{padding-top:75px}.pt-80{padding-top:80px}.pt-90{padding-top:90px}.pt-100{padding-top:100px}.pt-120{padding-top:120px}
.pb-10{padding-bottom:10px!important}.pb-20{padding-bottom:20px!important}.pb-25{padding-bottom:25px!important}.pb-30{padding-bottom:30px!important}.pb-40{padding-bottom:40px!important}.pb-45{padding-bottom:45px!important}.pb-50{padding-bottom:50px!important}.pb-60{padding-bottom:60px!important}.pb-70{padding-bottom:70px}.pb-75{padding-bottom:75px}.pb-80{padding-bottom:80px}.pb-90{padding-bottom:90px}.pb-100{padding-bottom:100px}.pb-120{padding-bottom:120px}
.p-15{padding:15px!important}.p-20{padding:20px!important}.p-25{padding:25px!important}.p-30{padding:30px!important}.p-40{padding:40px!important}
.px-20{padding-inline:20px}.px-25{padding-inline:25px}.px-30{padding-inline:30px}.px-60{padding-inline:60px}
.ptb-60{padding-block:60px}.ptb-70{padding-block:70px}.ptb-80{padding-block:80px}.ptb-90{padding-block:90px}.ptb-100{padding-block:100px}.ptb-120{padding-block:120px}
.gap-15{gap:15px!important}.gap-20{gap:20px!important}.gap-25{gap:25px!important}

/* Radius utilities */
.radius-0{border-radius:0!important}
.radius-sm{border-radius:var(--radius-sm)!important}
.radius-md{border-radius:var(--radius-md)!important}
.radius-lg{border-radius:var(--radius-lg)!important}
.radius-xl{border-radius:var(--radius-xl)!important}

/* Width utilities */
.mw-75{max-width:75%}.mw-80{max-width:80%}

/* Border color utility */
.border,.border-bottom,.border-end,.border-start,.border-top{border-color:var(--border-color)!important}

/* ----------------------------------
   Buttons
---------------------------------- */
.btn,button{cursor:pointer;border:none;background:inherit}
.btn:active,.btn:focus,button:active,button:focus{outline:0;box-shadow:none}
.btn{position:relative;overflow:hidden;font-size:16px;text-transform:capitalize;border-radius:12px;letter-spacing:.02em;font-weight:var(--font-medium);z-index:1;transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease,color .18s ease}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-lg{padding:14px 34px}
.btn-md{padding:10px 24px;font-size:var(--font-sm)}
.btn-sm{padding:6px 14px;font-size:var(--font-sm)}
.btn-icon{display:inline-flex;justify-content:center;align-items:center;width:45px;height:45px;text-align:center;color:var(--text-white);background-color:var(--color-primary);border-radius:12px}
.btn-icon:hover{color:var(--text-white);background-color:var(--color-primary)}
.btn-icon-text{display:inline-flex;align-items:center;gap:10px;--size:30px}
.btn-icon-text i{width:var(--size);height:var(--size);line-height:var(--size);text-align:center;background-color:var(--color-primary);font-size:14px;border-radius:50%;color:var(--text-white);box-shadow:0 14px 20px 5px rgba(var(--color-primary-rgb),.1)}

.btn-primary{color:var(--text-white);background:var(--color-primary);box-shadow:0 6px 18px -6px rgba(var(--color-primary-rgb),.45)}
.btn-primary:hover{background:linear-gradient(135deg,#5D4CF5 0%,#2FD7F0 100%);box-shadow:0 10px 28px -10px rgba(var(--color-primary-rgb),.55)}
.btn-chat{padding:12px 38px;font-size:28px}

/* ----------------------------------
   Cards
---------------------------------- */
.card{--bs-card-bg:var(--bg-white);--bs-body-color:var(--text-medium);border:1px solid var(--border-color);border-radius:16px;transition:all .2s}
.card .card-title{margin-bottom:20px}
.card .card-text{color:var(--text-medium)}
.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}

/* ----------------------------------
   Header / Navigation (desktop + mobile)
---------------------------------- */
.header-area{position:relative;top:0;left:0;width:100%;z-index:999}
.header-area.is-sticky{position:fixed;background:rgba(var(--color-white-rgb),.9);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);box-shadow:var(--shadow-md);animation:slideDown .4s}
.header-area .navbar-nav{margin-inline-end:60px}
.header-area .nav-link{position:relative;padding-block:30px;color:var(--text-dark);font-weight:var(--font-medium)}
.header-area .nav-link.toggle i{font-size:12px;margin-inline-start:2px;transition:transform .3s}
.header-area .nav-link:hover,.header-area .nav-link.active,.header-area .nav-link:focus{color:var(--color-primary)}
.header-area .main-navbar .navbar{position:inherit;padding:0}
.header-area .main-navbar .navbar .navbar-brand{padding:0;margin:0}
.header-area .main-navbar .nav-item{position:relative;margin-inline:10px}

/* Dropdown */
.header-area .main-navbar .menu-dropdown{position:absolute;top:auto;left:0;z-index:99;opacity:0;width:220px;visibility:hidden;list-style:none;margin:0;padding:15px 0;background-color:var(--bg-white);box-shadow:0 0 30px 0 rgba(var(--color-dark-rgb),.12);transform:translateY(10%);transition:transform .2s ease,opacity .2s ease}
.header-area .main-navbar .menu-dropdown .nav-item{margin:0}
.header-area .main-navbar .menu-dropdown .nav-link{display:block;padding:8px 18px;font-size:var(--font-sm);border-inline-start:2px solid transparent}
.header-area .main-navbar .menu-dropdown .nav-link:hover{color:var(--color-primary);background-color:var(--bg-2)}
.header-area .main-navbar .menu-dropdown .nav-link.active{border-inline-start-color:var(--color-primary)}
.header-area .main-navbar .nav-item:hover>.menu-dropdown{opacity:1;visibility:visible;transform:translateY(0)}

/* Burger */
.header-area .menu-toggler{width:34px;height:34px;padding:0;border:0;background:var(--color-primary);border-radius:3px;z-index:1000}
.header-area .menu-toggler span{display:block;width:22px;margin:0 auto;height:2px;background:var(--bg-white);border-radius:10px;position:relative;transition:transform 200ms,top 200ms}
.header-area .menu-toggler span:nth-child(1){top:-4px}
.header-area .menu-toggler span:nth-child(3){top:4px}
.header-area .menu-toggler.active span:nth-child(1){top:0;transform:rotate(45deg)}
.header-area .menu-toggler.active span:nth-child(2){transform:scale(0)}
.header-area .menu-toggler.active span:nth-child(3){top:-4px;transform:rotate(-45deg)}

/* Responsive header */
.header-area .main-responsive-nav{display:none}
@media (max-width:1199.98px){
  .header-area{height:60px;border-bottom:1px solid var(--border-color)}
  .header-area .main-responsive-nav{display:flex;align-items:center;height:60px}
  .header-area .main-responsive-nav .logo{flex:0 0 auto;max-width:140px}
  .header-area .main-navbar{display:none}
  .mobile-menu{position:fixed;top:0;left:-100%;width:320px;height:100vh;overflow-y:auto;transition:left .25s ease;z-index:999;background:var(--bg-white);box-shadow:var(--shadow-md)}
  .mobile-menu .mobile-menu-wrapper{margin-top:60px;display:flex;flex-direction:column;height:100%}
  .mobile-menu .navbar-nav{width:100%}
  .mobile-menu .navbar-nav li a{display:block;padding:12px 18px;border-bottom:1px solid var(--border-color)}
  .mobile-menu .navbar-nav li ul{padding-inline-start:12px;list-style-type:none}
  .mobile-menu .navbar-nav li li a{font-size:14px}
  .mobile-menu-active .mobile-menu{left:0}
}
body.mobile-menu-active{overflow:hidden}

/* ----------------------------------
   Sections / Hero / Content blocks
---------------------------------- */
.hero-banner{position:relative;z-index:2}
.hero-banner .banner-content{position:relative;z-index:3}
.hero-banner .banner-content p{font-size:var(--font-lg);margin-bottom:0}
.hero-banner .banner-img{position:relative;z-index:1}
.hero-banner .title{position:relative}
.hero-banner_v1{padding-top:150px;overflow:hidden}
.hero-banner_v2{padding-top:150px}
.hero-banner_v2 .banner-img{position:relative;margin-top:-140px}
.hero-banner_v3{padding-top:162px;overflow:hidden;background-position:center bottom}
.hero-banner_v3 .banner-content .title span:not(.shape){position:relative}
.hero-banner_v3 .banner-content .title span:not(.shape)::after{position:absolute;content:"";left:0;bottom:0;width:100%;height:30px;mask:url(https://chatgbt.online/assets/images/shape/title-line.svg) no-repeat center/contain;-webkit-mask:url(https://chatgbt.online/assets/images/shape/title-line.svg) no-repeat center/contain;background-color:var(--color-primary);z-index:-1}

.section-title .title{margin:0}
.section-title .subtitle{display:block;margin-bottom:6px}
.section-title.title-center{text-align:center}
.section-title.title-center .title{max-width:640px;margin-inline:auto}
.section-title.title-center p{max-width:520px;margin-inline:auto}

/* Case / About / Works */
.case-area{position:relative;overflow:hidden;z-index:1}
.case-area_v1 .card{padding:0 25px 25px;margin-top:50px}
.case-area_v1 .card_icon{--size:75px;width:var(--size);height:var(--size);display:grid;place-items:center;margin-top:-50px;background-color:var(--color-white);box-shadow:var(--shadow-md);transition:background-color .2s}
.case-area_v1 .card_icon img{max-width:40px}
.case-area_v1 .card:hover{border-color:var(--color-primary)!important}
.case-area_v1 .card:hover .card_icon{background-color:var(--color-primary)}

.case-area_v2 .case{display:flex;flex-direction:column;align-items:center;justify-content:center;clip-path:circle(50% at 50% 50%);background-color:var(--bg-white);width:100%;height:100%}
.case-area_v2 .case_img{--size:150px;width:var(--size);height:var(--size);display:flex;align-items:center;justify-content:center;padding:20px}

.case-area_v3 .card_icon{display:grid;place-items:center;padding:30px;background-color:var(--bg-primary-light)}
.case-area_v3 .card_icon img{max-height:55px}

.about-area{position:relative;overflow:hidden}
.about-area .card .card-text{flex:auto}
.about-area .about-img{position:relative}
.about-area_v1 .about-img{padding:30px;padding-inline-end:0}
.about-area_v1 .about-img>img{filter:drop-shadow(0 10px 10px rgba(0,0,0,.1))}
.about-area_v1 .about-img::before{position:absolute;content:"";top:0;left:0;right:0;bottom:0;width:86.96%;height:100%;background-color:rgba(var(--color-primary-rgb),.2);border-radius:var(--radius-lg)}
.about-area_v1 .info-list{display:flex;flex-direction:column;gap:15px}
.about-area_v1 .info-list li{position:relative}
.about-area_v1 .info-list li i{--size:25px;width:var(--size);height:var(--size);line-height:var(--size);text-align:center;background-color:var(--bg-primary-light);border-radius:var(--radius-circle);color:var(--color-primary);margin-inline-end:5px}

.about-area_v2 .info-list{display:flex;flex-direction:column;gap:24px}
.about-area_v2 .info-list li{display:flex;align-items:center;gap:15px}
.about-area_v2 .info-list li .icon{--size:80px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:var(--size);height:var(--size);font-size:36px;border-radius:var(--radius-md);color:rgba(var(--color-primary-rgb),.9);background-color:rgba(var(--color-primary-rgb),.2)}

/* Content Works */
.content-works-area{position:relative;overflow:hidden;z-index:1}
.content-works-area_v1 .card{margin-top:30px}
.content-works-area_v1 .card_subtitle{display:block}
.content-works-area_v1 .card_img{padding:60px 15px 0;border-radius:var(--radius-lg) var(--radius-lg) 0 0;background-color:rgba(var(--color-primary-rgb),.2)}
.content-works-area_v1 .card_img>div{border-radius:var(--radius-lg) var(--radius-lg) 0 0}

.content-works-area_v2 .card_subtitle{display:block}
.content-works-area_v2 .card_img{background-color:rgba(var(--color-primary-rgb),.2)}
.content-works-area_v2 .card_content{position:relative}

/* Image Works */
.img-works-area{position:relative;overflow:hidden;z-index:1}
.img-works-area_v1 .card_text{background-color:var(--bg-primary-light)}
.img-works-area_v2 .card_text{background-color:var(--bg-primary-light)}

/* FAQ / Accordion */
.faq-area{position:relative}
.accordion-item{border:none;padding:20px 25px}
.accordion-item .accordion-header .accordion-button{color:var(--text-dark);font-weight:inherit;padding:0;border:none;background:transparent;box-shadow:none;font-size:inherit}
.accordion-item .accordion-header .accordion-button::after{background:none;font-size:22px;font-family:"Font Awesome 5 Pro"!important;content:"+";transform:none;text-align:right}
.accordion-item .accordion-header .accordion-button:not(.collapsed){color:var(--color-primary)}
.accordion-item .accordion-header .accordion-button:not(.collapsed)::after{color:var(--color-primary);content:"-"}
.accordion-item .accordion-body{padding:12px 0 0}
.accordion-item .accordion-body p{margin:0}

/* ----------------------------------
   Sliders / Swiper controls
---------------------------------- */
.slider-navigation{z-index:3}
.slider-navigation .slider-btn{--size:40px;width:var(--size);height:var(--size);display:grid;place-items:center;text-align:center;border-radius:12px;background:rgba(var(--color-dark-rgb),.7);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:#fff;font-size:24px;transition:all .2s}
.slider-navigation .slider-btn:last-child{margin-inline-start:10px}
.slider-navigation .slider-btn:hover{background:var(--color-primary)}

.swiper-pagination .swiper-pagination-bullet{width:10px;height:10px;border-radius:var(--radius-circle);background-color:var(--color-primary);opacity:.35;transition:opacity .2s}
.swiper-pagination .swiper-pagination-bullet-active,.swiper-pagination .swiper-pagination-bullet:hover{opacity:1}
.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:0}

/* ----------------------------------
   Social / Pagination / Go-top
---------------------------------- */
.social-link{--size:36px;display:flex;align-items:center;gap:10px}
.social-link a{text-align:center;width:var(--size);height:var(--size);line-height:var(--size);border-radius:12px;background:rgba(var(--color-primary-rgb),.12);color:var(--color-primary);font-size:var(--font-base)}
.social-link a:hover{background:var(--color-primary);color:#fff}

.pagination-nav .pagination{--bs-pagination-border-radius:0}
.pagination-nav .page-link{color:var(--text-dark);text-align:center;display:inline-block;width:40px;height:40px;line-height:40px;margin:0 5px;padding:0;font-size:var(--font-base);border:none;border-radius:10px;background:transparent}
.pagination-nav .page-item:hover .page-link{color:#fff;background:var(--color-primary)}

.go-top{--size:40px;position:fixed;display:flex;align-items:center;justify-content:center;bottom:45px;right:0;left:0;margin-inline-start:auto;margin-inline-end:0;width:var(--size);height:var(--size);opacity:0;cursor:pointer;text-decoration:none;color:#fff;font-size:20px;background:var(--color-primary);transition:.3s;transform:translateX(15%);border-start-start-radius:var(--radius-sm);border-end-start-radius:var(--radius-sm);z-index:100}
.go-top:hover{transform:translateY(-3px)}

/* ----------------------------------
   Footer / Contact
---------------------------------- */
.footer-area{position:relative;overflow:hidden;z-index:1}
.footer-area :is(p,a,span){color:var(--text-medium)}
.footer-area .info-list li{font-size:var(--font-sm)}
.footer-area .copy-right-area{text-align:center}
.footer-area .copy-right-area.border-top{border-top-color:var(--border-color)}

.footer-links{list-style:none;padding:0;margin:0}
.footer-links li{display:inline;margin-right:15px}
.footer-links a{color:var(--text-medium);text-decoration:none}
.footer-links a:hover{color:var(--color-primary);text-decoration:underline}

.contact-area{position:relative;z-index:1}
.contact-area .card{display:flex;flex-direction:row;align-items:center;padding:25px 30px;background:transparent}
.contact-area .card .icon{display:flex;align-items:center;justify-content:center;width:80px;height:80px;flex:0 0 80px;font-size:28px;color:var(--color-primary)}
.contact-area .card .card-text{padding-inline-start:22px;margin-bottom:0}
.contact-area .card .card-text p{color:var(--text-dark);margin-bottom:5px}

/* ----------------------------------
   Theming: dark mode
---------------------------------- */
.theme-dark{
  --color-dark:#0B1220; --color-dark-rgb:11,18,32;
  --text-dark:#E5E7EB; --text-medium:#94A3B8; --text-light:#64748B;
  --bg-1:#0B1220; --bg-2:#0F172A; --bg-3:#111827; --bg-white:#0F172A;
  --border-color:rgba(148,163,184,.18); --border-color-2:rgba(148,163,184,.28);
  --bg-primary-light:rgba(var(--color-primary-rgb),.12);
}
.theme-dark *{box-shadow:none!important}
.theme-dark .bg-light{background-color:var(--bg-2)!important}
.theme-dark .btn-primary{box-shadow:0 6px 18px -6px rgba(var(--color-primary-rgb),.45)}
.theme-dark .header-area.is-sticky{background:rgba(15,23,42,.8);-webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--border-color)}
.theme-dark .card{background:var(--bg-2);border-color:var(--border-color)}
.theme-dark .footer-area .copy-right-area.border-top{border-top-color:var(--border-color)}

/* Optional auto theme */
.theme-auto{color-scheme:light dark}
@media (prefers-color-scheme:dark){
  .theme-auto{
    --color-dark:#0B1220; --color-dark-rgb:11,18,32;
    --text-dark:#E5E7EB; --text-medium:#94A3B8; --text-light:#64748B;
    --bg-1:#0B1220; --bg-2:#0F172A; --bg-3:#111827; --bg-white:#0F172A;
    --border-color:rgba(148,163,184,.18); --border-color-2:rgba(148,163,184,.28);
    --bg-primary-light:rgba(var(--color-primary-rgb),.12);
  }
}

/* ----------------------------------
   Small helpers
---------------------------------- */
.header-logo{display:flex;align-items:center;gap:8px}
.header-logo img{max-height:40px;vertical-align:middle}
.header-logo .logo-text{font-size:24px;line-height:1}

/* Language buttons block */
.frames_block{display:flex;flex-wrap:wrap;justify-content:center;max-width:1000px;margin:auto}
@media(max-width:991px){.frames_block{margin-inline:3px}}
.lang_but{display:block;margin:12px;width:calc(25% - 24px);padding:12px 20px;font-size:14px;border-radius:8px;border:1px solid var(--border-color-2);color:var(--color-dark);background-color:#EFEFEF;transition:.2s}
.lang_but:hover{box-shadow:-2px -2px 6px rgb(255 255 255 /.6),-2px -2px 4px rgb(255 255 255 /.4),2px 2px 2px rgb(0 0 0 /.05),2px 2px 4px rgb(0 0 0 /.1)}
.lang_but:active{box-shadow:inset -2px -2px 6px rgb(255 255 255 /.7),inset -2px -2px 4px rgb(255 255 255 /.5),inset 2px 2px 2px rgb(0 0 0 /.075),inset 2px 2px 4px rgb(0 0 0 /.15)}
@media(max-width:710px){.lang_but{width:calc(50% - 24px);font-size:12px;margin-top:5px}}
.flag{width:20px;vertical-align:middle;margin-right:6px;float:left}

/* ----------------------------------
   Animations used
---------------------------------- */
@keyframes slideDown{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}