:root {
      color-scheme: light;
    }

    html,
    body {
      overflow-x: clip;
    }

    body {
      -webkit-font-smoothing: antialiased;
    }

    section[id],
    article[id] {
      scroll-margin-top: 5.5rem;
    }

    :focus-visible {
      outline: 2px solid #1660B8;
      outline-offset: 2px;
    }

    .ico {
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    [hidden] {
      display: none !important;
    }

    /* Logo: crops the empty margin of logo.jpg. Change --h on the element to resize. */
    .logo-crop {
      display: block;
      height: calc(var(--h) * .87);
      overflow: hidden;
    }

    .logo-crop img {
      display: block;
      height: var(--h);
      width: auto;
      max-width: none;
      margin-top: calc(var(--h) * -.041);
    }

    /* Nav underline (hover + current section) */
    .nav-link {
      position: relative;
    }

    .nav-link::after {
      content: "";
      position: absolute;
      left: .75rem;
      right: .75rem;
      bottom: .2rem;
      height: 2px;
      border-radius: 2px;
      background: linear-gradient(90deg, #1660B8, #3A9A2C);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform .25s ease;
    }

    .nav-link:hover::after,
    .dd:hover>.nav-link::after,
    .dd[data-open="true"]>.nav-link::after,
    .nav-link[aria-current="true"]::after {
      transform: scaleX(1);
    }

    .nav-link[aria-current="true"] {
      color: #1660B8;
    }

    /* Typewriter caret */
    .type-caret {
      display: inline-block;
      width: 3px;
      height: .85em;
      margin-left: 4px;
      vertical-align: -.05em;
      background: #3A9A2C;
      animation: caret 1s steps(1) infinite;
    }

    @keyframes caret {
      50% {
        opacity: 0;
      }
    }

    /* Desktop dropdowns */
    .dd-panel {
      opacity: 0;
      visibility: hidden;
      transform: translateY(8px);
      transition: opacity .2s ease, transform .2s ease, visibility .2s;
    }

    .dd:hover>.dd-panel,
    .dd[data-open="true"]>.dd-panel {
      opacity: 1;
      visibility: visible;
      transform: none;
    }

    .dd[data-suppress="true"]>.dd-panel {
      opacity: 0;
      visibility: hidden;
    }

    .dd-chev {
      transition: transform .2s ease;
    }

    .dd:hover .dd-chev,
    .dd[data-open="true"] .dd-chev {
      transform: rotate(180deg);
    }

    /* Mobile drawer + overlay */
    #drawer {
      transform: translateX(-100%);
      visibility: hidden;
      transition: transform .35s cubic-bezier(.22, 1, .36, 1), visibility .35s;
    }

    #drawer[data-open="true"] {
      transform: none;
      visibility: visible;
    }

    #overlay {
      opacity: 0;
      visibility: hidden;
      transition: opacity .3s ease, visibility .3s;
    }

    #overlay[data-open="true"] {
      opacity: 1;
      visibility: visible;
    }

    .acc-panel {
      display: grid;
      grid-template-rows: 0fr;
      transition: grid-template-rows .3s ease;
    }

    .acc-panel>div {
      min-height: 0;
      overflow: hidden;
      visibility: hidden;
      transition: visibility .3s;
    }

    .acc-panel[data-open="true"] {
      grid-template-rows: 1fr;
    }

    .acc-panel[data-open="true"]>div {
      visibility: visible;
    }

    .acc-btn[aria-expanded="true"] .acc-chev {
      transform: rotate(180deg);
    }

    .acc-chev {
      transition: transform .25s ease;
    }

    /* Hero slider: slides stack in one grid cell so the container is always as tall as the tallest slide */
    .slide {
      grid-area: 1 / 1;
      opacity: 0;
      visibility: hidden;
      transition: opacity .7s ease, visibility .7s;
    }

    .slide.is-active {
      opacity: 1;
      visibility: visible;
    }

    .slide .slide-text {
      transform: translateY(14px);
      transition: transform .8s cubic-bezier(.22, 1, .36, 1);
    }

    .slide .slide-art {
      transform: scale(.97);
      transition: transform 1s cubic-bezier(.22, 1, .36, 1);
    }

    .slide.is-active .slide-text,
    .slide.is-active .slide-art {
      transform: none;
    }

    .dot {
      height: .5rem;
      width: .5rem;
      border-radius: 9999px;
      background: #C5D3E6;
      transition: width .3s ease, background-color .3s ease;
    }

    .dot[aria-current="true"] {
      width: 1.75rem;
      background: #1660B8;
    }

    /* Scroll reveal (only when JS is on) */
    .js .reveal {
      opacity: 0;
      transform: translateY(16px);
      transition: opacity .6s ease, transform .6s ease;
      transition-delay: var(--d, 0ms);
    }

    .js .reveal.is-visible {
      opacity: 1;
      transform: none;
    }

    /* WhatsApp button */
    .wa-ring {
      animation: wa-ring 3.2s ease-out infinite;
    }

    @keyframes wa-ring {
      0% {
        transform: scale(1);
        opacity: .35;
      }

      70%,
      100% {
        transform: scale(1.55);
        opacity: 0;
      }
    }

    @keyframes wa-float {

      0%,
      100% {
        transform: translateY(0);
      }

      50% {
        transform: translateY(-4px);
      }
    }

    .wa-btn {
      animation: wa-float 4s ease-in-out infinite;
    }

    .wa-btn:hover {
      animation-play-state: paused;
    }

    details>summary {
      list-style: none;
    }

    details>summary::-webkit-details-marker {
      display: none;
    }

    details[open] .faq-chev {
      transform: rotate(180deg);
    }

    .faq-chev {
      transition: transform .25s ease;
    }

    @media (prefers-reduced-motion: reduce) {
      html {
        scroll-behavior: auto !important;
      }

      *,
      *::before,
      *::after {
        animation: none !important;
        transition-duration: .01ms !important;
      }

      .js .reveal {
        opacity: 1;
        transform: none;
      }
    }
 
    /*  */
     #faq summary { list-style: none; }
  #faq summary::-webkit-details-marker { display: none; }
  #faq .faq-item[open] .faq-bar { opacity: 1; }
  #faq .faq-item[open] .faq-arrow { transform: rotate(180deg); }
  #faq .faq-item[open] .faq-toggle { background: #1660B8; color: #fff; }
  #faq .faq-item[open] .faq-q { background: #3A9A2C; color: #fff; }
  #faq .faq-item[open] .faq-body { animation: faqIn .25s ease-out; }
  @keyframes faqIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
  @media (prefers-reduced-motion: reduce) { #faq * { animation: none !important; transition: none !important; } }


  /*  */

  /* Fallback: Swiper na chollew card gulo pashapashi scroll hobe, upor-niche stack hobe na */
  #testimonials .testimonialSwiper:not(.swiper-initialized) .swiper-wrapper { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
  #testimonials .testimonialSwiper:not(.swiper-initialized) .swiper-slide { flex: 0 0 85%; max-width: 380px; scroll-snap-align: start; }
  #testimonials .t-card { transition: transform .4s ease, box-shadow .4s ease, opacity .4s ease; opacity: .85; transform: scale(.97); }
  #testimonials .swiper-slide-active .t-card { opacity: 1; transform: translateY(-6px) scale(1); box-shadow: 0 20px 40px -12px rgba(11,37,69,.18); border-color: rgba(22,96,184,.3); }
  #testimonials .swiper-pagination-bullet { width: 8px; height: 8px; background: #1660B8; opacity: .22; transition: all .3s; }
  #testimonials .swiper-pagination-bullet-active { width: 26px; border-radius: 9999px; background: #3A9A2C; opacity: 1; }
  @media (max-width: 767px) { #testimonials .t-card { opacity: 1; transform: none; } #testimonials .swiper-slide-active .t-card { transform: none; } }
  @media (prefers-reduced-motion: reduce) { #testimonials * { transition: none !important; } }