:root {
  --chinos-ink: #0f1b33;
  --chinos-muted: #59677e;
  --chinos-blue: #2563eb;
  --chinos-surface: #f5f8fd;
  --chinos-border: #e1e9f4;
}
html { scroll-behavior: smooth; }
body.site-home, body.site-portfolio {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  color: var(--chinos-ink);
  background: var(--chinos-surface);
}
.site-home a, .site-portfolio a { text-decoration: none; }
.site-home :is(a, button, input, select, textarea):focus-visible,
.site-portfolio :is(a, button):focus-visible { outline: 3px solid #60a5fa; outline-offset: 3px; }
.site-home section[id] { scroll-margin-top: 100px; }
.site-home > header { position: fixed; inset: 0 0 auto; z-index: 100; padding: 14px 14px 0; pointer-events: none; }
.site-home > header .glass-nav {
  pointer-events: auto; max-width: 1180px; margin-inline: auto;
  border: 1px solid rgba(226, 232, 240, .92);
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 14px 50px rgba(8, 22, 47, .13);
  backdrop-filter: blur(14px);
}
.site-home .glass-nav > a:first-child { display: inline-flex; align-items: center; gap: 10px; font-size: 1.08rem; letter-spacing: -.05em; white-space: nowrap; }
.site-home .glass-nav > a:first-child::before {
  content: 'C'; display: grid; place-items: center; width: 34px; height: 34px;
  color: #fff; background: linear-gradient(135deg, #2563eb, #06b6d4);
  border-radius: 11px; letter-spacing: 0; box-shadow: 0 6px 18px rgba(37, 99, 235, .25);
}
.site-home .glass-nav div.d-md-flex a { color: #334155; transition: color .2s ease; }
.site-home .glass-nav div.d-md-flex a:hover { color: #1d4ed8; }
.site-home #mobile-menu {
  pointer-events: auto; max-width: 420px; margin: 8px auto 0;
  background: #fff; border: 1px solid var(--chinos-border);
  border-radius: 18px; box-shadow: 0 20px 42px rgba(15, 23, 42, .17);
  line-height: 2.6; text-align: center;
}
.site-home #mobile-menu a { color: var(--chinos-ink); display: inline-block; margin: 0 5px; }

.site-home #home {
  min-height: max(760px, 100svh);
  background: radial-gradient(circle at 78% 25%, #214987 0, transparent 40%), linear-gradient(145deg, #071328, #0c2345 70%, #0a1830) !important;
}
.site-home #home .vertigo-grid {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px;
  overflow: hidden; opacity: .13 !important; filter: saturate(.55);
}
.site-home #home .vertigo-grid::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, #071328 0, rgba(7, 19, 40, .8) 38%, rgba(7, 19, 40, .12) 100%);
}
.site-home #home .grid-item { height: 210px; border-radius: 14px; background-size: cover; background-position: center; }
.site-home #home > .container { z-index: 1; padding-top: 125px !important; padding-bottom: 70px !important; }
.site-home .hero-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(235px, 310px); align-items: center; gap: clamp(30px, 5vw, 90px); }
.site-home .hero-layout.without-epaper { grid-template-columns: 1fr; }
.site-home .hero-copy { max-width: 720px; }
.site-home #home .badge { padding: 10px 15px; border: 1px solid rgba(125, 211, 252, .28); border-radius: 999px; background: rgba(37, 99, 235, .2) !important; color: #bfdbfe; letter-spacing: .12em; text-transform: uppercase; }
.site-home #home h1 { font-size: clamp(3.2rem, 6.5vw, 6.3rem); line-height: .99; letter-spacing: -.07em; margin: 16px 0 24px; }
.site-home #home h1 span { color: #67e8f9 !important; }
.site-home #home .lead { max-width: 610px; color: #d4e2f5 !important; font-size: clamp(1.03rem, 1.55vw, 1.22rem); line-height: 1.72; }
.site-home .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 29px; }
.site-home .hero-actions .btn { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 12px 20px; border-radius: 12px; font-weight: 700; font-size: .92rem; }
.site-home .hero-actions .btn-primary { background: #2563eb; border-color: #2563eb; box-shadow: 0 10px 25px rgba(37, 99, 235, .23); }
.site-home .hero-epaper { min-width: 0; padding: 22px; border: 1px solid rgba(148, 163, 184, .3); border-radius: 24px; background: rgba(15, 32, 63, .82); box-shadow: 0 24px 50px rgba(2, 8, 20, .22); backdrop-filter: blur(12px); }
.site-home .hero-epaper h2 { font-size: .75rem; font-weight: 800; letter-spacing: .15em; color: #67e8f9; }
.site-home .hero-epaper a { display: block; font-weight: 700; color: #fff; line-height: 1.4; }
.site-home .hero-epaper img { display: block; width: 100%; max-height: 315px; margin-top: 16px; border-radius: 12px; object-fit: contain; background: #fff; }

.site-home #news-feed, .site-home #services, .site-home #portfolio, .site-home #contact { padding-top: 85px !important; padding-bottom: 85px !important; }
.site-home #news-feed h2, .site-home #services h2, .site-home #portfolio h2, .site-home #contact h2 { font-weight: 800; letter-spacing: -.045em; }
.site-home #news-feed { background: #fff; max-width: 100%; padding-inline: max(12px, calc((100vw - 1140px) / 2)); }
.site-home #news-feed .swiper, .site-home #portfolio .swiper { padding: 12px 3px 48px; }
.site-home #news-feed .card, .site-home #portfolio .card { border: 1px solid var(--chinos-border); border-radius: 18px; overflow: hidden; box-shadow: 0 10px 30px rgba(18, 37, 67, .06); }
.site-home #news-feed .card-img-top, .site-home #portfolio .card-img-top { display: block; width: 100%; height: 185px; object-fit: cover; background: #e6efff; }
.site-home #news-feed .card-body, .site-home #portfolio .card-body { padding: 20px; }
.site-home #news-feed h5 a { color: var(--chinos-ink); line-height: 1.4; font-weight: 700; }
.site-home #news-feed h5 a:hover, .site-home #portfolio a:hover { color: #1d4ed8; }
.site-home #news-feed small, .site-home #portfolio small { font-weight: 700; letter-spacing: .03em; }
.site-home #news-feed .swiper > button, .site-home #portfolio .swiper > button { width: 38px; height: 38px; padding: 0; border-radius: 11px; margin-top: 10px; }
.site-home #services .card { border: 1px solid #e9eff8 !important; border-radius: 22px !important; box-shadow: 0 15px 35px rgba(15, 39, 76, .05) !important; }
.site-home #services .card h3 { color: var(--chinos-ink); }
.site-home #services .card p { color: var(--chinos-muted); line-height: 1.7; }
.site-home #services .card li { display: inline-block; margin: 5px 6px 0 0; padding: 6px 9px; color: #245293; font-size: .8rem; font-weight: 700; background: #eff6ff; border-radius: 8px; }
.site-home #domain-search { padding-top: 75px !important; padding-bottom: 75px !important; background: linear-gradient(120deg, #102c52, #0d1a31) !important; }
.site-home #domain-search h2 { font-weight: 800; letter-spacing: -.04em; }
.site-home #domain-search .form-control, .site-home #domain-search .form-select, .site-home #domain-search button { min-height: 52px; border-radius: 12px; }
.site-home #domainResult { color: var(--chinos-ink); border: 0; border-radius: 18px; }
.site-home #portfolio .card-img-top { height: 210px; }
.site-home #contact > div { border: 1px solid rgba(255, 255, 255, .09); background: linear-gradient(130deg, #0e2b51, #0a1730) !important; box-shadow: 0 25px 50px rgba(13, 38, 79, .15); }
.site-home #contact .form-control, .site-home #contact .form-select { min-height: 50px; border-radius: 11px; }
.site-home #contact textarea.form-control { min-height: 135px; }
.site-home #contact button { min-height: 50px; font-weight: 700; border-radius: 11px; }
.site-home > footer { background: #08172c !important; }
.site-home > footer a { color: #93c5fd; }
.site-home > footer .container { max-width: 1140px; margin-inline: auto; }
.site-home #cookie-banner { border-top: 1px solid var(--chinos-border); }
.site-home #cookie-banner p { color: var(--chinos-muted); font-size: .88rem; }
.site-home #chat-box { width: min(340px, calc(100vw - 26px)) !important; }

.site-portfolio > header { display: flex; align-items: center; gap: 13px; max-width: 1140px; margin: 14px auto 0; padding: 16px 20px !important; background: #fff; border: 1px solid var(--chinos-border); border-radius: 16px; box-shadow: 0 8px 25px rgba(20, 42, 74, .06); }
.site-portfolio > header a { color: var(--chinos-muted); }
.site-portfolio > header a:first-child { color: var(--chinos-ink); font-weight: 800; margin-right: auto; white-space: nowrap; }
.site-portfolio > header a:last-child { border-radius: 9px; padding: 8px 12px; color: #1d4ed8; background: #eff6ff; white-space: nowrap; }
.site-portfolio > main { max-width: 1140px; padding-top: 60px !important; }
.site-portfolio > main h1 { font-size: clamp(2.3rem, 5vw, 3.6rem); font-weight: 800; letter-spacing: -.05em; }
.site-portfolio > main .text-center p { color: var(--chinos-muted); max-width: 560px; margin-inline: auto; line-height: 1.65; }
.site-portfolio main nav { flex-wrap: wrap; }
.site-portfolio main nav .btn { padding: 9px 18px; border-radius: 10px; font-weight: 700; }
.site-portfolio main .card { border: 1px solid var(--chinos-border); border-radius: 18px; overflow: hidden; box-shadow: 0 10px 30px rgba(15, 37, 69, .06); }
.site-portfolio main .card-img-top { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: #e6efff; }
.site-portfolio main .card-body { padding: 22px; }
.site-portfolio main .card h2 { font-weight: 800; font-size: 1.2rem; }
.site-portfolio main .card p { color: var(--chinos-muted) !important; line-height: 1.6; }
.site-portfolio > footer { max-width: 1140px; color: var(--chinos-muted); }

@media (max-width: 767.98px) {
  .site-home > header { padding: 10px 10px 0; }
  .site-home .glass-nav { padding: 12px 16px !important; }
  .site-home #home { min-height: 0; }
  .site-home #home > .container { padding-top: 118px !important; padding-bottom: 42px !important; }
  .site-home #home .vertigo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); opacity: .09 !important; }
  .site-home #home .vertigo-grid::after { background: rgba(7, 19, 40, .7); }
  .site-home .hero-layout { display: grid; grid-template-columns: 1fr; gap: 25px; }
  .site-home #home h1 { font-size: clamp(2.7rem, 12vw, 4.2rem); }
  .site-home .hero-actions { display: grid; grid-template-columns: 1fr; gap: 9px; }
  .site-home .hero-actions .btn { width: 100%; margin: 0; }
  .site-home .hero-epaper { padding: 18px; }
  .site-home .hero-epaper img { width: auto; max-height: 190px; margin-inline: auto; }
  .site-home #news-feed, .site-home #services, .site-home #portfolio, .site-home #contact { padding-top: 60px !important; padding-bottom: 60px !important; }
  .site-home #portfolio .d-flex.justify-content-between { flex-wrap: wrap; align-items: center; gap: 12px; }
  .site-home #cookie-banner { padding: 14px !important; }
  .site-home #cookie-banner .container { gap: 10px !important; }
  .site-home #cookie-banner button { width: 100%; }
  .site-home > footer { padding: 45px 22px !important; }
  .site-portfolio > header { margin: 10px 12px 0; padding: 12px !important; gap: 6px; font-size: .76rem; }
  .site-portfolio > header a:last-child { padding: 7px; }
  .site-portfolio > main { padding-top: 42px !important; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
