/*
  VIRTUKRAINE — ОСНОВНЫЕ СТИЛИ
  1. Базовая типографика и сетка
  2. Шапка и навигация
  3. Первый экран
  4. Карточки и каталог групп
  5. Мобильное меню
  6. Тёмная тема
  7. Адаптивность

  Главные кнопки первого экрана находятся в самом конце файла
  в разделе «ФИНАЛЬНАЯ ИЕРАРХИЯ CTA».
*/

*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#15171a;background:#fff;line-height:1.6}a{color:inherit}.container{width:min(1120px,calc(100% - 40px));margin:0 auto}.narrow{width:min(760px,calc(100% - 40px))}.site-header{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-bottom:1px solid #e9ecef}.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-weight:800;text-decoration:none;font-size:20px}nav{display:flex;gap:20px}nav a{text-decoration:none;color:#555b63;font-size:15px}.hero{padding:92px 0 72px;background:radial-gradient(circle at 85% 15%,rgba(64,133,255,.12),transparent 30%),linear-gradient(180deg,#f8fbff 0%,#fff 100%)}.hero-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:48px;align-items:center}.badge,.eyebrow{display:inline-block;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#2467d8}h1{font-size:clamp(48px,8vw,86px);line-height:.98;letter-spacing:-.055em;margin:18px 0 24px}h2{font-size:clamp(32px,5vw,52px);line-height:1.05;letter-spacing:-.035em;margin:10px 0 24px}h3{font-size:22px;margin:0 0 10px}.lead{font-size:21px;color:#555b63;max-width:720px}.actions{display:flex;gap:14px;flex-wrap:wrap;margin:30px 0 14px}.button{display:inline-flex;align-items:center;justify-content:center;padding:14px 20px;border-radius:14px;text-decoration:none;font-weight:800;transition:transform .18s ease,box-shadow .18s ease}.button:hover{transform:translateY(-1px)}.primary{background:#15171a;color:#fff;box-shadow:0 10px 28px rgba(21,23,26,.14)}.secondary{background:#fff;border:1px solid #dfe3e8}.light{background:#fff;color:#15171a}.full{width:100%;margin-top:12px}.note{font-size:13px;color:#747a82}.section{padding:84px 0}.alt{background:#f7f8fa}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}.community-grid{display:grid;grid-template-columns:1fr;gap:18px;max-width:760px;margin:34px auto 0}.card{padding:28px;border:1px solid #e6e9ed;border-radius:22px;background:#fff;box-shadow:0 12px 36px rgba(20,25,32,.05)}.featured{border:2px solid #15171a}.tag{display:inline-block;padding:6px 10px;border-radius:999px;background:#15171a;color:#fff;font-size:12px;font-weight:800;margin-bottom:16px}.hero-card{padding:34px}.icon{font-size:40px;margin-bottom:28px}.rules{padding:0;list-style:none;margin:28px 0 32px}.rules li{padding:16px 0;border-bottom:1px solid #dde1e6}.rules li::before{content:"✓";font-weight:900;margin-right:12px}details{border-bottom:1px solid #e3e6ea;padding:18px 0}summary{cursor:pointer;font-weight:800;font-size:18px}details p{color:#5b6168}.cta{padding:78px 0;background:#15171a;color:#fff;text-align:center}.cta p{color:#c8ccd1;font-size:18px}footer{padding:28px 0;border-top:1px solid #e9ecef;color:#71767e;font-size:14px}.footer-row{display:flex;justify-content:space-between;gap:20px}@media(max-width:800px){nav{display:none}.hero{padding-top:64px}.hero-grid,.cards,.community-grid{display:grid;grid-template-columns:1fr;gap:18px;max-width:760px;margin:34px auto 0}.hero-card{margin-top:8px}.footer-row{flex-direction:column}}

/* Main chat button: larger and more expressive */
.featured .button.primary.full{
  min-height:72px;
  padding:20px 28px;
  font-size:20px;
  border-radius:18px;
  letter-spacing:.01em;
  transition:transform .22s ease,box-shadow .22s ease,filter .22s ease;
}

.featured .button.primary.full:hover{
  transform:translateY(-4px) scale(1.015);
  box-shadow:0 18px 42px rgba(21,23,26,.24);
  filter:brightness(1.08);
}

.featured .button.primary.full:active{
  transform:translateY(-1px) scale(.995);
}

/* Gentle hover animation for all chat cards */
.community-grid .card{
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}

.community-grid .card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 46px rgba(20,25,32,.10);
}


/* Keep the hero card title on one line on desktop, responsive on smaller screens */
.hero-card h2{
  font-size:clamp(30px,3vw,46px);
  line-height:1.08;
}

@media (min-width:900px){
  .hero-card h2{
    white-space:nowrap;
  }
}

/* Subtle entrance animation for the main hero card */
@keyframes softFadeUp{
  from{
    opacity:0;
    transform:translateY(16px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.hero-card{
  animation:softFadeUp .7s ease both;
}


/* Button hover scale animation */
.button{
  transition:transform .22s ease,box-shadow .22s ease,filter .22s ease;
}

.button:hover{
  transform:translateY(-2px) scale(1.035);
}

.button:active{
  transform:translateY(0) scale(.99);
}


/* Smooth section reveal */
.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .75s ease,transform .75s ease;
  will-change:opacity,transform;
}

.reveal.visible{
  opacity:1;
  transform:translateY(0);
}

/* Responsive layout and readable sizing */
body{
  font-size:18px;
}

p, li{
  font-size:clamp(17px,1.3vw,20px);
}

.site-header .brand{
  font-size:clamp(20px,1.8vw,26px);
}

nav a{
  font-size:16px;
  font-weight:700;
}

.hero{
  min-height:calc(100vh - 72px);
  display:flex;
  align-items:center;
}

.hero-grid{
  grid-template-columns:minmax(0,1.15fr) minmax(420px,.85fr);
}

.hero-card{
  min-width:0;
}

.hero-card p{
  font-size:clamp(18px,1.4vw,22px);
}

.community-grid{
  width:100%;
}

.community-grid .card{
  padding:clamp(28px,3vw,42px);
}

.community-grid .card h3{
  font-size:clamp(28px,2.4vw,38px);
  line-height:1.15;
}

.community-grid .card p{
  font-size:clamp(18px,1.5vw,22px);
}

.button{
  min-height:56px;
  padding:16px 24px;
  font-size:clamp(17px,1.3vw,20px);
}

details summary{
  font-size:clamp(19px,1.5vw,23px);
}

@media(max-width:1100px){
  .hero{
    min-height:auto;
  }

  .hero-grid{
    grid-template-columns:1fr;
    gap:28px;
  }

  .hero-card h2{
    white-space:normal;
  }

  .hero-card{
    max-width:760px;
  }
}

@media(max-width:800px){
  .container,
  .narrow{
    width:min(100% - 28px,760px);
  }

  .site-header{
    position:static;
  }

  .nav{
    min-height:64px;
  }

  .hero{
    padding:56px 0 44px;
  }

  h1{
    font-size:clamp(46px,15vw,72px);
    line-height:.98;
  }

  h2{
    font-size:clamp(34px,10vw,52px);
  }

  .lead{
    font-size:clamp(20px,5.5vw,24px);
  }

  .section{
    padding:64px 0;
  }

  .card{
    padding:24px;
    border-radius:20px;
  }

  .community-grid{
    gap:16px;
  }

  .button,
  .button.full{
    width:100%;
    min-height:60px;
    font-size:18px;
    padding:16px 18px;
  }

  .featured .button.primary.full{
    min-height:68px;
    font-size:20px;
  }

  .rules li{
    padding:18px 0;
  }

  .cta{
    padding:64px 0;
  }
}

@media(max-width:480px){
  body{
    font-size:17px;
  }

  .container,
  .narrow{
    width:min(100% - 22px,760px);
  }

  h1{
    font-size:clamp(42px,16vw,60px);
  }

  h2{
    font-size:clamp(32px,11vw,44px);
  }

  .hero-card h2{
    font-size:clamp(30px,9vw,40px);
  }

  .card{
    padding:22px;
  }

  .community-grid .card h3{
    font-size:clamp(26px,8vw,34px);
  }

  .community-grid .card p{
    font-size:18px;
  }

  .button,
  .button.full{
    font-size:18px;
  }
}

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

  *,
  *::before,
  *::after{
    animation:none !important;
    transition:none !important;
  }

  .reveal{
    opacity:1;
    transform:none;
  }
}


/* Better hero-card text wrapping and proportions */
.hero-grid{
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  gap:36px;
}

.hero-card{
  width:100%;
  max-width:100%;
  overflow:hidden;
}

.hero-card h2{
  font-size:clamp(32px,2.7vw,48px);
  line-height:1.08;
  letter-spacing:-.035em;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:normal;
  margin-bottom:22px;
}

.hero-card p{
  max-width:30ch;
  line-height:1.5;
}

@media (min-width:1400px){
  .hero-card h2{
    font-size:46px;
  }
}

@media (max-width:1100px){
  .hero-grid{
    grid-template-columns:1fr;
  }

  .hero-card{
    max-width:760px;
  }

  .hero-card p{
    max-width:42ch;
  }
}

@media (max-width:600px){
  .hero-card{
    padding:24px;
  }

  .hero-card h2{
    font-size:clamp(30px,9vw,40px);
    line-height:1.1;
  }

  .hero-card p{
    font-size:18px;
  }
}


/* Hero card: star on its own row, title on the next row, never split */
.hero-card{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
  padding:clamp(24px,3vw,38px);
}

.hero-card .icon{
  display:block;
  width:100%;
  margin:0 0 clamp(22px,3vw,34px);
  font-size:clamp(34px,4vw,48px);
  line-height:1;
}

.hero-card h2{
  display:block;
  width:100%;
  margin:0 0 20px;
  font-size:clamp(28px,3.15vw,46px);
  line-height:1.05;
  letter-spacing:-.045em;
  white-space:nowrap;
  overflow:visible;
  overflow-wrap:normal;
  word-break:keep-all;
}

.hero-card p{
  width:100%;
  max-width:34ch;
  margin:0;
  font-size:clamp(18px,1.45vw,22px);
  line-height:1.5;
}

/* Give the right hero card enough room on desktop */
@media (min-width:1101px){
  .hero-grid{
    grid-template-columns:minmax(0,1fr) minmax(500px,.95fr);
    gap:36px;
  }
}

@media (max-width:1100px){
  .hero-card{
    max-width:100%;
  }

  .hero-card h2{
    font-size:clamp(30px,6vw,44px);
  }
}

@media (max-width:600px){
  .hero-card{
    padding:22px;
  }

  .hero-card .icon{
    margin-bottom:20px;
    font-size:38px;
  }

  .hero-card h2{
    font-size:clamp(25px,7.1vw,34px);
    letter-spacing:-.05em;
    white-space:nowrap;
  }

  .hero-card p{
    max-width:none;
    font-size:18px;
    line-height:1.45;
  }
}

@media (max-width:380px){
  .hero-card{
    padding:18px;
  }

  .hero-card h2{
    font-size:clamp(22px,6.8vw,27px);
  }
}


/* Centered hero-card content with safe margins on all screen sizes */
.hero-card{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:clamp(34px,5vw,64px);
}

.hero-card h2{
  width:auto;
  max-width:100%;
  margin:0 auto 24px;
  font-size:clamp(34px,3.5vw,56px);
  line-height:1.08;
  letter-spacing:-.04em;
  white-space:normal;
  overflow-wrap:normal;
  word-break:normal;
  text-wrap:balance;
}

.hero-card p{
  width:auto;
  max-width:34ch;
  margin:0 auto;
  font-size:clamp(19px,1.5vw,23px);
  line-height:1.55;
  text-wrap:balance;
}

@media (max-width:800px){
  .hero-card{
    padding:32px 24px;
  }

  .hero-card h2{
    font-size:clamp(32px,9vw,44px);
    line-height:1.1;
    margin-bottom:20px;
  }

  .hero-card p{
    max-width:30ch;
    font-size:clamp(18px,5vw,21px);
    line-height:1.5;
  }
}

@media (max-width:480px){
  .hero-card{
    padding:28px 20px;
  }

  .hero-card h2{
    font-size:clamp(28px,8.5vw,38px);
  }

  .hero-card p{
    max-width:28ch;
    font-size:18px;
  }
}


/* Animated-feel layered gradient background */
body{
  background:
    radial-gradient(
      circle at 18% 12%,
      rgba(90,140,255,.18),
      transparent 30%
    ),
    radial-gradient(
      circle at 82% 42%,
      rgba(165,105,255,.16),
      transparent 34%
    ),
    radial-gradient(
      circle at 28% 78%,
      rgba(255,125,175,.14),
      transparent 36%
    ),
    linear-gradient(
      180deg,
      #f8fbff 0%,
      #eef4ff 28%,
      #f5efff 58%,
      #fff3f8 82%,
      #f6f9ff 100%
    );
  background-attachment:fixed;
  background-size:cover;
}

.hero{
  background:transparent;
}

.alt{
  background:rgba(255,255,255,.52);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

.section{
  position:relative;
}

.card{
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}


/* Theme toggle */
.theme-toggle{
  flex:0 0 auto;
  width:46px;
  height:46px;
  border:1px solid rgba(21,23,26,.14);
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.82);
  color:#15171a;
  cursor:pointer;
  box-shadow:0 8px 24px rgba(20,25,32,.08);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease;
}

.theme-toggle:hover{
  transform:translateY(-2px) scale(1.06);
  box-shadow:0 12px 30px rgba(20,25,32,.14);
}

.theme-toggle:active{
  transform:scale(.96);
}

.theme-icon{
  font-size:24px;
  line-height:1;
}

/* Dark theme */
html[data-theme="dark"] body{
  color:#f4f6fb;
  background:
    radial-gradient(circle at 18% 12%, rgba(64,112,255,.24), transparent 30%),
    radial-gradient(circle at 82% 42%, rgba(151,78,255,.22), transparent 34%),
    radial-gradient(circle at 28% 78%, rgba(255,80,145,.16), transparent 36%),
    linear-gradient(180deg,#0b1020 0%,#11172b 30%,#171329 62%,#21131f 82%,#0e1422 100%);
  background-attachment:fixed;
  background-size:cover;
}

html[data-theme="dark"] .site-header{
  background:rgba(10,14,24,.78);
  border-bottom-color:rgba(255,255,255,.10);
}

html[data-theme="dark"] .brand,
html[data-theme="dark"] nav a,
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] summary{
  color:#f7f8fb;
}

html[data-theme="dark"] .lead,
html[data-theme="dark"] p,
html[data-theme="dark"] .note,
html[data-theme="dark"] details p,
html[data-theme="dark"] footer{
  color:#cdd4e3;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .alt{
  background:rgba(18,23,38,.78);
  border-color:rgba(255,255,255,.12);
  box-shadow:0 18px 48px rgba(0,0,0,.28);
}

html[data-theme="dark"] .featured{
  border-color:rgba(255,255,255,.75);
}

html[data-theme="dark"] .secondary{
  background:rgba(255,255,255,.08);
  color:#f7f8fb;
  border-color:rgba(255,255,255,.16);
}

html[data-theme="dark"] .primary{
  background:#f5f7fb;
  color:#111318;
  box-shadow:0 12px 32px rgba(0,0,0,.28);
}

html[data-theme="dark"] .tag{
  background:#f5f7fb;
  color:#111318;
}

html[data-theme="dark"] .rules li,
html[data-theme="dark"] details,
html[data-theme="dark"] footer{
  border-color:rgba(255,255,255,.12);
}

html[data-theme="dark"] .theme-toggle{
  background:rgba(18,23,38,.88);
  color:#f7f8fb;
  border-color:rgba(255,255,255,.14);
}

html[data-theme="dark"] .cta{
  background:#080b12;
}

@media(max-width:800px){
  .nav{
    gap:14px;
  }

  .theme-toggle{
    width:44px;
    height:44px;
  }
}

/* Multi-page SEO navigation */
.page-hero{min-height:auto;padding:84px 0 64px}.page-hero h1{font-size:clamp(46px,7vw,76px)}.steps{padding-left:24px}.steps li{margin:12px 0}.link-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:28px}.text-link{display:flex;flex-direction:column;gap:8px;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}.text-link:hover{transform:translateY(-3px);box-shadow:0 18px 46px rgba(20,25,32,.10)}.text-link strong{font-size:22px}.text-link span{color:#5b6168}.seo-links .text-link{min-height:180px}.center-actions{justify-content:center}footer a{text-decoration:none}html[data-theme="dark"] .text-link span{color:#cdd4e3}@media(max-width:800px){.link-cards{grid-template-columns:1fr}.page-hero{padding:54px 0 44px}}

/* Mobile navigation fix: keep all page links visible */
@media (max-width:800px){
  .site-header{
    position:sticky;
    top:0;
  }

  .site-header .nav{
    min-height:auto;
    padding-top:10px;
    padding-bottom:10px;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    column-gap:10px;
    row-gap:8px;
  }

  .site-header .brand{
    max-width:calc(100% - 58px);
    font-size:18px;
    line-height:1.2;
  }

  .site-header nav{
    display:flex;
    order:3;
    width:100%;
    gap:8px;
    overflow-x:auto;
    padding:3px 0 2px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }

  .site-header nav::-webkit-scrollbar{
    display:none;
  }

  .site-header nav a{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    min-height:38px;
    padding:8px 13px;
    border:1px solid rgba(21,23,26,.12);
    border-radius:12px;
    background:rgba(255,255,255,.58);
    font-size:14px;
    line-height:1;
    white-space:nowrap;
  }

  html[data-theme="dark"] .site-header nav a{
    background:rgba(255,255,255,.07);
    border-color:rgba(255,255,255,.14);
  }
}

@media (max-width:390px){
  .site-header .container{
    width:calc(100% - 20px);
  }

  .site-header .brand{
    font-size:16px;
  }

  .site-header nav a{
    padding:8px 11px;
    font-size:13px;
  }
}

/* Mobile slide-out navigation */
.header-actions{display:flex;align-items:center;gap:10px}.menu-toggle{display:none;width:46px;height:46px;padding:0;border:1px solid #dfe3e8;border-radius:14px;background:#fff;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:5px}.menu-toggle span{display:block;width:22px;height:2px;border-radius:2px;background:#15171a}.menu-overlay,.mobile-menu{display:none}

@media(max-width:800px){
  .site-header .nav{min-height:64px;padding:9px 0;flex-wrap:nowrap}
  .desktop-nav{display:none!important}
  .site-header .brand{max-width:calc(100% - 116px);font-size:17px}
  .header-actions{margin-left:auto}
  .menu-toggle{display:flex}
  .menu-overlay{display:block;position:fixed;inset:0;z-index:80;background:rgba(5,8,15,.56);opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease;backdrop-filter:blur(3px)}
  .mobile-menu{display:block;position:fixed;top:0;right:0;z-index:90;width:min(84vw,340px);height:100dvh;padding:18px;background:#fff;box-shadow:-18px 0 50px rgba(0,0,0,.22);transform:translateX(105%);transition:transform .28s ease;overflow-y:auto}
  .mobile-menu-head{display:flex;align-items:center;justify-content:space-between;padding:2px 2px 18px;border-bottom:1px solid #e6e9ed;font-size:22px}
  .menu-close{width:44px;height:44px;border:0;border-radius:12px;background:#f1f3f5;font-size:32px;line-height:1;cursor:pointer}
  .mobile-nav{display:flex;flex-direction:column;gap:8px;padding-top:18px}
  .mobile-nav a{display:flex;align-items:center;min-height:54px;padding:13px 16px;border-radius:14px;text-decoration:none;font-size:18px;font-weight:800;background:#f6f7f9;color:#15171a}
  body.menu-open{overflow:hidden}
  body.menu-open .menu-overlay{opacity:1;visibility:visible}
  body.menu-open .mobile-menu{transform:translateX(0)}
  html[data-theme="dark"] .menu-toggle{background:rgba(18,23,38,.88);border-color:rgba(255,255,255,.14)}
  html[data-theme="dark"] .menu-toggle span{background:#f7f8fb}
  html[data-theme="dark"] .mobile-menu{background:#0f1422;color:#f7f8fb}
  html[data-theme="dark"] .mobile-menu-head{border-color:rgba(255,255,255,.12)}
  html[data-theme="dark"] .menu-close{background:rgba(255,255,255,.08);color:#f7f8fb}
  html[data-theme="dark"] .mobile-nav a{background:rgba(255,255,255,.07);color:#f7f8fb}
}


.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:28px;align-items:start}.article{line-height:1.75}.article p{margin:0 0 1rem}.article h2{margin-top:2rem}.article h3{margin-top:1.4rem}.toc{position:sticky;top:92px}.toc a{display:block;padding:.45rem 0;color:var(--muted);text-decoration:none}.toc a:hover{color:var(--text)}.quick-steps{counter-reset:steps}.quick-steps li{list-style:none;position:relative;padding-left:3rem;margin:1rem 0}.quick-steps li:before{counter-increment:steps;content:counter(steps);position:absolute;left:0;top:-.1rem;width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#fff;font-weight:800}.notice{border-left:4px solid var(--accent);padding:1rem 1.2rem;background:var(--card);border-radius:0 14px 14px 0}.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.related-grid a{text-decoration:none}.footer-links{display:flex;flex-wrap:wrap;gap:12px}.footer-links a{color:inherit}.nav-more{display:none}@media(max-width:900px){.content-grid{grid-template-columns:1fr}.toc{position:static}.related-grid{grid-template-columns:1fr}.desktop-nav{display:none}.menu-toggle{display:flex}}@media(min-width:901px){.menu-toggle{display:none}}

.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}.section-heading h2,.section-heading p{margin-bottom:.35rem}.search-box{display:grid;gap:6px;min-width:min(100%,320px);font-size:.85rem;color:var(--muted)}.search-box input{width:100%;padding:.85rem 1rem;border:1px solid var(--border);border-radius:14px;background:var(--card);color:var(--text);font:inherit}.group-card{display:flex;flex-direction:column}.group-card p{flex:1}.group-top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:.6rem}.group-category{font-size:.83rem;color:var(--muted)}.search-empty{text-align:center;color:var(--muted);padding:2rem}.compact-link{display:flex;flex-direction:column;gap:.35rem;text-decoration:none}.compact-link span{color:var(--muted);font-size:.9rem}@media(max-width:700px){.section-heading{align-items:stretch;flex-direction:column}.search-box{min-width:0}.hero{padding-top:3.2rem}.hero-grid{gap:18px}.community-grid{grid-template-columns:1fr}}


/* Hero CTA hierarchy */
.hero-actions{align-items:center}
.hero-main-cta{
  min-height:60px;
  padding:17px 32px;
  font-size:18px;
  background:#fff;
  color:#15171a;
  border:1px solid rgba(21,23,26,.12);
  box-shadow:0 14px 34px rgba(21,23,26,.14);
}
.hero-main-cta:hover{
  transform:translateY(-2px) scale(1.015);
  box-shadow:0 18px 42px rgba(21,23,26,.2);
}
.hero-groups-cta{
  min-height:52px;
  padding:14px 22px;
  font-size:16px;
}
html[data-theme="dark"] .hero-main-cta{
  background:#fff;
  color:#111318;
  border-color:rgba(255,255,255,.9);
  box-shadow:0 14px 36px rgba(0,0,0,.32);
}
@media(max-width:560px){
  .hero-actions{display:grid;grid-template-columns:1fr;gap:12px}
  .hero-main-cta,.hero-groups-cta{width:100%}
  .hero-main-cta{min-height:62px;font-size:19px}
}


/* ==========================================================
   ФИНАЛЬНАЯ ИЕРАРХИЯ CTA НА ГЛАВНОЙ
   ========================================================== */
.hero-actions {
  align-items: center;
  gap: 14px;
}

/* Главная белая кнопка — основной акцент */
.hero-main-cta {
  min-height: 66px;
  padding: 19px 38px;
  font-size: 20px;
  background: #ffffff;
  color: #111318;
  border: 1px solid rgba(17, 19, 24, 0.12);
  box-shadow: 0 16px 38px rgba(17, 19, 24, 0.20);
}

.hero-main-cta:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 22px 48px rgba(17, 19, 24, 0.27);
}

/* Второстепенная кнопка — намеренно не белая */
.hero-groups-cta,
html[data-theme="dark"] .hero-groups-cta {
  min-height: 52px;
  padding: 14px 23px;
  font-size: 16px;
  background: #2467d8;
  color: #ffffff;
  border: 1px solid #2467d8;
  box-shadow: 0 9px 24px rgba(36, 103, 216, 0.22);
}

.hero-groups-cta:hover {
  background: #1d58bd;
  border-color: #1d58bd;
  box-shadow: 0 13px 30px rgba(36, 103, 216, 0.30);
}

html[data-theme="dark"] .hero-main-cta {
  background: #ffffff;
  color: #111318;
  border-color: rgba(255, 255, 255, 0.95);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.38);
}

@media (max-width: 560px) {
  .hero-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .hero-main-cta,
  .hero-groups-cta {
    width: 100%;
  }

  .hero-main-cta {
    min-height: 68px;
    font-size: 20px;
  }

  .hero-groups-cta {
    min-height: 54px;
    font-size: 16px;
  }
}

/* v16.6 — единые CTA на всех страницах */
.hero .actions {
  align-items: center;
  gap: 12px;
}

.hero-main-cta {
  min-height: 58px;
  padding: 16px 30px;
  border: 2px solid #fff;
  border-radius: 14px;
  background: #fff;
  color: #111827;
  font-size: 1.05rem;
  font-weight: 800;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18);
  text-decoration: none;
}

.hero-main-cta:hover {
  transform: translateY(-2px) scale(1.015);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.23);
}

.hero-groups-cta {
  min-height: 48px;
  padding: 12px 20px;
  font-size: .96rem;
  font-weight: 700;
  opacity: .9;
}

.hero-main-cta:focus-visible,
.hero-groups-cta:focus-visible,
a:focus-visible,
button:focus-visible {
  outline: 3px solid #60a5fa;
  outline-offset: 3px;
}

@media (max-width: 640px) {
  .hero .actions {
    align-items: stretch;
  }
  .hero-main-cta,
  .hero-groups-cta {
    width: 100%;
    justify-content: center;
  }
  .hero-main-cta {
    min-height: 60px;
    font-size: 1.08rem;
  }
}


/* Блок статуса «Проверенная» */
.verified-notice {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 18px;
  align-items: start;
  margin: 22px 0 28px;
  padding: 24px;
  border: 1px solid rgba(34, 197, 94, .32);
  background: linear-gradient(135deg, rgba(34, 197, 94, .10), rgba(59, 130, 246, .06));
}

.verified-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #22c55e;
  color: #fff;
  font-size: 26px;
  font-weight: 900;
  box-shadow: 0 10px 26px rgba(34, 197, 94, .25);
}

.verified-notice h3,
.verified-safety h2 {
  margin-top: 2px;
}

.verified-note {
  margin-top: 10px;
  font-size: .94rem;
  opacity: .82;
}

.text-link {
  display: inline-block;
  margin-top: 8px;
  font-weight: 800;
  text-decoration: none;
}

.text-link:hover {
  text-decoration: underline;
}

.verified-safety {
  padding: 30px;
  border: 1px solid rgba(34, 197, 94, .32);
  background: linear-gradient(135deg, rgba(34, 197, 94, .09), rgba(59, 130, 246, .05));
}

.verified-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 22px 0;
}

.verified-points > div {
  padding: 16px;
  border-radius: 16px;
  background: var(--card, rgba(255,255,255,.05));
  border: 1px solid var(--border, rgba(148,163,184,.18));
}

.verified-points strong,
.verified-points span {
  display: block;
}

.verified-points span {
  margin-top: 7px;
  font-size: .93rem;
  opacity: .82;
}

@media (max-width: 720px) {
  .verified-notice {
    grid-template-columns: 1fr;
    padding: 20px;
  }

  .verified-points {
    grid-template-columns: 1fr;
  }

  .verified-safety {
    padding: 22px;
  }
}


/* Улучшенная карточка статуса «Проверенная» */
.verified-content {
  min-width: 0;
}

.verified-lead {
  margin-top: 10px;
  font-size: 1.02rem;
  line-height: 1.72;
}

.verified-checklist {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin: 18px 0 16px;
  padding: 0;
  list-style: none;
}

.verified-checklist li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border: 1px solid rgba(34, 197, 94, .26);
  border-radius: 999px;
  background: rgba(34, 197, 94, .08);
  font-size: .9rem;
  font-weight: 700;
}

.verified-checklist li::before {
  content: "✓";
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #22c55e;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.verified-safety-heading {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
}

.verified-icon-large {
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  font-size: 30px;
}

.verified-point-icon {
  display: grid !important;
  place-items: center;
  width: 30px;
  height: 30px;
  margin-bottom: 12px;
  border-radius: 10px;
  background: rgba(34, 197, 94, .14);
  color: #22c55e;
  font-size: 17px;
  font-weight: 900;
}

.verified-note-safe {
  padding: 14px 16px;
  border-left: 3px solid #22c55e;
  border-radius: 10px;
  background: rgba(34, 197, 94, .07);
}

@media (max-width: 720px) {
  .verified-checklist {
    display: grid;
    grid-template-columns: 1fr;
  }

  .verified-checklist li {
    border-radius: 14px;
  }

  .verified-safety-heading {
    align-items: flex-start;
  }
}

/* Логотип сайта в шапке на каждой странице */
.site-header .brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.site-header .brand-logo {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: block;
  border-radius: 10px;
  box-shadow: 0 5px 14px rgba(8, 27, 58, .18);
}

.site-header .brand-text {
  min-width: 0;
  line-height: 1.1;
}

@media (max-width: 560px) {
  .site-header .brand {
    gap: 9px;
  }

  .site-header .brand-logo {
    width: 32px;
    height: 32px;
    flex-basis: 32px;
    border-radius: 8px;
  }

  .site-header .brand-text {
    font-size: 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100vw - 125px);
  }
}
