/* kopateenus — design CSS lifted from the Claude-Design flatten */
body{margin:0;background:#14161a}
*{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{margin:0}
  @keyframes heroZoom{from{transform:scale(1.08)}to{transform:scale(1)}}
  @media (max-width:980px){
    [data-cols]{grid-template-columns:1fr !important}
    [data-cols2]{grid-template-columns:1fr !important}
    #nav-links{display:none !important}
    #menu-btn{display:inline-flex !important}
    [data-hero-h1]{font-size:clamp(40px,11vw,72px) !important}
    [data-split]{grid-template-columns:1fr !important}
    /* gallery: collapse the masonry spans to a clean 2-up grid (was staying 4-wide → tiny tiles) */
    [data-gallery]{grid-template-columns:1fr 1fr !important;grid-auto-rows:42vw !important}
    [data-gallery]>div{grid-area:auto !important;grid-column:auto !important;grid-row:auto !important}
  }
  /* phones: single-column gallery, lighter side gutters, smaller process/stat numerals */
  @media (max-width:560px){
    [data-gallery]{grid-template-columns:1fr !important;grid-auto-rows:64vw !important}
    [data-hero-h1]{font-size:clamp(34px,12vw,56px) !important}
    .kt-narrow-pad{padding-left:18px !important;padding-right:18px !important}
  }

/* hover states (reconstructed from style-hover) */
[data-kthv="12"]:hover{color:#fff}
[data-kthv="13"]:hover{color:#fff}
[data-kthv="14"]:hover{color:#fff}
[data-kthv="15"]:hover{color:#fff}
[data-kthv="16"]:hover{color:#fff}
[data-kthv="17"]:hover{background:#f4b73a}
[data-kthv="18"]:hover{background:#f4b73a}
[data-kthv="19"]:hover{background:rgba(255,255,255,.16)}
[data-kthv="20"]:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
[data-kthv="21"]:hover{gap:10px}
[data-kthv="22"]:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
[data-kthv="23"]:hover{gap:10px}
[data-kthv="24"]:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
[data-kthv="25"]:hover{gap:10px}
[data-kthv="26"]:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
[data-kthv="27"]:hover{gap:10px}
[data-kthv="28"]:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
[data-kthv="29"]:hover{gap:10px}
[data-kthv="30"]:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
[data-kthv="31"]:hover{gap:10px}
[data-kthv="32"]:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
[data-kthv="33"]:hover{gap:10px}
[data-kthv="34"]:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
[data-kthv="35"]:hover{gap:10px}
[data-kthv="36"]:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
[data-kthv="37"]:hover{gap:10px}
[data-kthv="38"]:hover{transform:scale(1.06)}
[data-kthv="39"]:hover{transform:scale(1.06)}
[data-kthv="40"]:hover{transform:scale(1.06)}
[data-kthv="41"]:hover{transform:scale(1.06)}
[data-kthv="42"]:hover{transform:scale(1.06)}
[data-kthv="43"]:hover{transform:scale(1.06)}
[data-kthv="44"]:hover{transform:scale(1.06)}
[data-kthv="45"]:hover{transform:scale(1.06)}
[data-kthv="46"]:hover{background:#f4b73a}
[data-kthv="47"]:hover{color:#f4f1ea}
[data-kthv="48"]:hover{color:#f4f1ea}
[data-kthv="49"]:hover{color:#f4f1ea}
[data-kthv="50"]:hover{color:#f4f1ea}
[data-kthv="51"]:hover{color:#f4f1ea}
[data-kthv="52"]:hover{color:#f4f1ea}
[data-kthv="53"]:hover{color:#f4f1ea}

/* services dropdown (desktop) + mobile menu */
.kt-dd{position:absolute;top:calc(100% + 10px);left:0;min-width:280px;background:#181b1f;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:8px;box-shadow:0 20px 44px rgba(0,0,0,.45);display:none;flex-direction:column;z-index:60}
.kt-svc-menu:hover .kt-dd,.kt-svc-menu:focus-within .kt-dd{display:flex}
.kt-svc-menu::after{content:"";position:absolute;top:100%;left:0;right:0;height:14px}
.kt-dd-link{color:#cfd2d6;text-decoration:none;font-size:14.5px;font-weight:500;padding:9px 12px;border-radius:6px;white-space:nowrap;transition:background .15s}
.kt-dd-link:hover{background:rgba(235,164,22,.14);color:#fff}
.kt-m-link{display:block;color:#e8e9ea;text-decoration:none;font-size:16px;font-weight:600;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.kt-m-svc{display:flex;flex-direction:column;padding:2px 0 8px 14px}
.kt-m-svc .kt-dd-link{color:#aab0b6;padding:7px 0;font-weight:500;white-space:normal}

/* gallery lightbox */
.kt-lb{position:fixed;inset:0;z-index:1000;background:rgba(10,11,13,.94);display:none;align-items:center;justify-content:center}
.kt-lb[data-open="1"]{display:flex}
.kt-lb-img{max-width:92vw;max-height:86vh;object-fit:contain;border-radius:6px;box-shadow:0 24px 70px rgba(0,0,0,.6)}
.kt-lb-x{position:absolute;top:14px;right:22px;background:none;border:none;color:#fff;font-size:42px;line-height:1;cursor:pointer;opacity:.85}
.kt-lb-prev,.kt-lb-next{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:32px;width:54px;height:54px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center}
.kt-lb-prev{left:22px}.kt-lb-next{right:22px}
.kt-lb-x:hover,.kt-lb-prev:hover,.kt-lb-next:hover{background:rgba(235,164,22,.3);opacity:1}
.kt-lb-count{position:absolute;bottom:20px;left:0;right:0;text-align:center;color:#cfd2d6;font-size:14px;letter-spacing:.04em}
@media(max-width:600px){.kt-lb-prev,.kt-lb-next{width:44px;height:44px;font-size:26px}.kt-lb-x{font-size:34px}}

/* accessibility: visible keyboard focus (the design set outline:none on inputs) */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent,#eba416)!important;outline-offset:2px;border-radius:2px}
.kt-gal-item{cursor:zoom-in}

/* ── FAQ accordion ── (answers stay open when JS is off → .js gate only collapses them with JS) */
.kt-faq-q{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;text-align:left;background:none;border:none;padding:18px 0;cursor:pointer;color:inherit;font-family:'Saira Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.01em;font-size:18px;line-height:1.25}
.kt-faq-ic{flex:0 0 auto;transition:transform .25s ease;color:var(--accent,#eba416)}
.kt-faq-q[aria-expanded="true"] .kt-faq-ic{transform:rotate(180deg)}
.kt-faq-a{padding:0 0 18px;font-size:16px;line-height:1.7}
.kt-faq-a>p{margin:0}
.js .kt-faq-a{display:none}
.js .kt-faq-a.kt-open{display:block}
/* card-style FAQ (pricing page) variant */
.kt-faq-card .kt-faq-q{padding:24px 26px}
.kt-faq-card .kt-faq-a{padding:0 26px 24px}

/* ── Blog post body (Gutenberg content) ── */
.kt-prose{font-size:17.5px;line-height:1.75;color:rgb(40,42,45)}
.kt-prose>*:first-child{margin-top:0}
.kt-prose p{margin:0 0 1.25em}
.kt-prose h2{font-family:'Saira Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.01em;font-size:clamp(26px,3.4vw,34px);line-height:1.05;margin:1.7em 0 .55em;color:rgb(22,24,27)}
.kt-prose h3{font-family:'Saira Condensed',sans-serif;font-weight:700;text-transform:uppercase;font-size:clamp(20px,2.4vw,24px);line-height:1.15;margin:1.5em 0 .5em;color:rgb(22,24,27)}
/* Estonian diacritics (Ä Ö Ü Õ) clip on tight uppercase display headings — give the
   inline-styled Saira Condensed headings a touch more leading so accents clear the line
   above. Matches only elements with the font in their style attribute (the design-part +
   PHP-template headings); .kt-prose blog headings get the font via class, so they're untouched. */
[style*="Saira Condensed"]{line-height:1.08 !important}
.kt-prose a{color:rgb(138,94,12);text-decoration:underline;text-underline-offset:2px}
.kt-prose ul,.kt-prose ol{margin:0 0 1.25em;padding-left:1.3em}
.kt-prose li{margin:0 0 .5em}
.kt-prose img,.kt-prose figure img{max-width:100%;height:auto;border-radius:6px}
.kt-prose figure{margin:1.6em 0}
.kt-prose figcaption{font-size:14px;color:rgb(110,114,120);margin-top:8px;text-align:center}
.kt-prose blockquote{margin:1.6em 0;padding:6px 0 6px 22px;border-left:3px solid var(--accent,#eba416);font-size:19px;color:rgb(50,53,57)}
.kt-prose strong{font-weight:700}
.kt-prose hr{border:none;border-top:1px solid rgb(220,214,200);margin:2em 0}

/* ── Pagination (blog list + multipage post) ── */
.kt-pagination{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.kt-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 12px;border:1px solid rgb(214,208,194);border-radius:5px;color:rgb(40,42,45);text-decoration:none;font-weight:600;font-size:15px}
.kt-pagination .page-numbers.current{background:var(--accent,#eba416);border-color:var(--accent,#eba416);color:rgb(20,22,26)}
.kt-pagination a.page-numbers:hover{background:rgba(235,164,22,.14);border-color:var(--accent,#eba416)}
.kt-pagination .page-numbers.dots{border:none}

/* skip-link (a11y: WCAG 2.4.1) */
.kt-skip{position:absolute;left:-9999px;top:0;z-index:2000;background:var(--accent,#eba416);color:#14161a;font-weight:700;padding:10px 18px;border-radius:0 0 5px 0;text-decoration:none}
.kt-skip:focus{left:0}