/* dao/static/css/main.css */

/* ===============================
   Base / Reset
   =============================== */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  padding-top:var(--nav-height,64px);
  padding-bottom: var(--footer-height, 48px);
  font-family:inherit;
  color:inherit;
  background:inherit;
  transition:opacity .18s ease;
}
body.lock{overflow:hidden}
body.x-fade-out{opacity:0}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%;height:auto}
button,input,textarea,select{font:inherit;color:inherit}
.container{width:min(100%,1120px);margin:0 auto;padding:0 1rem}
.skip-link{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:static;width:auto;height:auto;padding:.5rem 1rem;border-radius:var(--radius-control,12px)}

/* ===============================
   Header / Navigation
   =============================== */
.site-header{position:fixed;top:0;left:0;right:0;z-index:1000}
.nav-container{display:flex;align-items:center;justify-content:center;min-height:var(--nav-height,64px);padding:.65rem .75rem}
.nav{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.nav__list{display:flex;gap:clamp(.5rem,3vw,1rem);list-style:none;margin:0;padding:0}
.nav__item{display:flex}
.nav__item--lang .nav__link{
  font-size:.85rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:.35rem .8rem;
  min-width:auto;
}
.nav__link{
  display:inline-flex;align-items:center;justify-content:center;
  padding:.4rem 1rem;
  border-radius:var(--radius-pill,999px);
  font-size:.95rem;font-weight:600;line-height:1;border:1px solid transparent;
  transition:background .15s ease,color .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.nav__burger{
  display:none;align-items:center;justify-content:center;
  padding:.5rem 1rem;border-radius:var(--radius-control,12px);
  border:var(--border-default,1px solid transparent);
  background:var(--surface,#fff);
  font-weight:700;cursor:pointer;line-height:1;
}
.nav__burger:focus-visible{outline:var(--focus-ring,2px solid #175ce1);outline-offset:2px}

/* Правый чип текущего раздела (мобилка) */
.nav__current{
  display:none;
  margin-left:auto;
  padding:.5rem .75rem;
  border-radius:12px;
  border:1px solid var(--color-border,#d5dceb);
  max-width:55vw;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  font-weight:700; line-height:1;
}

/* Мобилка: показываем бургер, прячем десктопный список, чип справа */
@media (max-width:880px){
  .nav__list{display:none}
  .nav__burger{display:inline-flex; margin-left:.25rem;}
  .nav-container{justify-content:space-between}
  .nav__current{display:inline-flex; align-items:center; justify-content:flex-end;}
}

/* ===============================
   Hero
   =============================== */
.hero{
  min-height: calc(100vh - var(--nav-height,64px));
  display:flex;
  align-items:flex-start;
  justify-content:center;
  background:transparent; /* не конфликтуем с фоном страницы */
  padding:0;
}
.hero--minimal{padding-top:.6rem}
/* Home-only: double the top padding */
#home.hero.hero--minimal{padding-top:1.2rem}
.hero--page{padding-top:clamp(3rem,7vw,5rem)}
.hero--tall{min-height: calc(100vh - var(--nav-height,64px))}

#home.hero{height: calc(100svh - var(--nav-height,64px))}
#podpiska-hero.hero{height: calc(100svh - var(--nav-height,64px))}

.hero__inner{display:flex;flex-direction:column;gap:1rem;text-align:center;align-items:center}
.hero__inner--lg{gap:.6rem}

#home .hero__inner{min-height:100%;flex:1;padding-bottom: var(--hero-bottom-gap,24px)}
#podpiska-hero .hero__inner{min-height:100%;flex:1;padding-bottom: var(--hero-bottom-gap,24px)}

.hero__heading{margin:0;font-weight:800;font-size:clamp(2.3rem,6vw,3.4rem);line-height:1.08;letter-spacing:.01em}
.hero__lead{margin:0;max-width:38rem;font-size:1.05rem}
.hero__lead--wide{max-width:42rem}
.hero__buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem}
.hero__buttons--stack{flex-direction:column;width:100%;align-items:center}
.hero__buttons--stack .button{width:min(var(--cta-max-width,480px),100%)}
.brand-top{display:grid;justify-items:center;margin-top:0;margin-bottom:0}
.brand-svg,.brand-png{width:108px;height:auto}
@media (min-width:900px){.brand-svg,.brand-png{width:128px}}
/* Home-only: double brand logo size */
#home .brand-svg, #home .brand-png{width:216px}
@media (min-width:900px){
  #home .brand-svg, #home .brand-png{width:256px}
}
.hero__title{margin:0 auto 0;max-width:32rem}
.hero__title-line{display:block;font-weight:800;font-size:clamp(2rem,6vw,3rem);line-height:1.08}
.hero__title-line--sub{font-size:clamp(1.8rem,5vw,2.6rem)}
.hero__bullets{list-style:none;margin:1.25rem auto 0;padding:0;display:grid;gap:.75rem;max-width:36rem;text-align:left}
.hero__bullet{display:flex;align-items:center;gap:.55rem;font-size:1rem;line-height:1.35}
.hero__bullet::before{
  content:"";width:18px;height:18px;flex:0 0 18px;
  -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.285 6.708a1 1 0 0 1 0 1.414l-9.192 9.192a1 1 0 0 1-1.414 0L3.715 11.54a1 1 0 1 1 1.414-1.414l5.243 5.243 8.485-8.485a1 1 0 0 1 1.428-.176z"/></svg>') no-repeat center / contain;
  mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.285 6.708a1 1 0 0 1 0 1.414l-9.192 9.192a1 1 0 0 1-1.414 0L3.715 11.54a1 1 0 1 1 1.414-1.414l5.243 5.243 8.485-8.485a1 1 0 0 1 1.428-.176z"/></svg>') no-repeat center / contain;
}

/* ===============================
   Sections / Cards / Lists
   =============================== */
.section-include{margin:clamp(2rem,5vw,3.75rem) auto;padding:clamp(2rem,5vw,3.5rem) 0}
.section-include .container{display:grid;gap:clamp(1.25rem,3vw,1.75rem)}
.section-title{margin:0;font-size:clamp(2rem,5vw,2.6rem);font-weight:700;text-align:left}
.section-include--tight{padding:clamp(1.5rem,4vw,2.5rem) 0}
.section-include--cta .hero__buttons{margin-top:1rem}
.section-include > .container > .note{margin:0;max-width:42rem;font-size:1.05rem}
.cards{display:grid;gap:clamp(1rem,3vw,1.5rem)}
.cards--grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{display:flex;flex-direction:column;gap:1rem;padding:1.75rem}
.card h3{margin:0}
.card p{margin:0}
.list{margin:0;padding-left:1.1rem;display:grid;gap:.35rem}
.list--columns{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;padding-left:0;list-style:none}
.list--columns li{flex:1 1 240px;margin:0}
.faq{border-radius:var(--radius-card,24px);padding:1rem 1.25rem;margin-bottom:.75rem}
.faq summary{cursor:pointer;font-weight:600;list-style:none}
.faq summary::-webkit-details-marker{display:none}

/* ===============================
   Buttons & Chips
   =============================== */
.button{
  display:inline-flex;align-items:center;justify-content:center;
  padding:.85rem 1.6rem;min-height:46px;
  font-weight:600;border:none;cursor:pointer;
  transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;
}
.button--pill{border-radius:var(--radius-pill,999px)}
.button--lg{min-height:54px;font-size:1.02rem}
.button:disabled{opacity:.6;cursor:not-allowed}
.button:hover:not(:disabled){transform:translateY(-1px)}
.button--ghost,.button--outline{background:transparent}

/* ===============================
   Page-specific blocks
   =============================== */
.modules .cards{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.integration__grid{display:grid;gap:1.5rem}
@media (min-width:900px){.integration__grid{grid-template-columns:repeat(3,1fr)}}
.integration__step{border-radius:var(--radius-card,24px);padding:1.5rem}
.integration__step strong{display:block;margin-bottom:.45rem}
.confidence__list{display:grid;gap:.75rem;padding:0;list-style:none}
.confidence__item{border-radius:var(--radius-card,24px);padding:1.2rem 1.5rem;display:grid;gap:.25rem}
.plans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(1rem,3vw,1.5rem)}
.plan-card{display:flex;flex-direction:column;gap:.85rem;border-radius:var(--radius-card,24px);padding:1.75rem}
.plan-card .price{margin:0;font-size:1.8rem;font-weight:700}
.plan-card ul{list-style:none;margin:0;padding:0;display:grid;gap:.35rem}
.plan-card footer{margin-top:auto}
.contact-grid{display:grid;gap:1rem;margin-top:1.5rem}
@media (min-width:720px){.contact-grid{grid-template-columns:repeat(3,1fr)}}
.contact-card{border-radius:var(--radius-card,24px);padding:1.5rem;display:grid;gap:.4rem}
.note{text-align:left;font-size:1rem}
.note--center{text-align:center}
.list--check{list-style:none;margin:0;padding:0;display:grid;gap:.35rem}
.list--check li{display:flex;align-items:flex-start;gap:.5rem}
.list--check li::before{content:"";width:14px;height:14px;margin-top:.3rem;border-radius:50%;flex:0 0 14px}

/* ===============================
   Utilities
   =============================== */
section[id]{scroll-margin-top:calc(var(--nav-height,64px) + 12px)}

/* ===== Desktop nav centering & tighter height ===== */
@media (min-width: 881px){
  .nav{ justify-content: center; }
  .nav-container{
    min-height: var(--nav-height,32px);
    padding: .25rem .75rem;
  }
  .nav__list{ justify-content: center; gap: clamp(1rem, 4vw, 2rem); }
  .nav__link{ padding: .35rem 1.2rem; font-size: 1rem; }
}