/* =========================================================
   styles.css — CLEAN (без стилей шапки / dropdown / auth-модалок)
   ВАЖНО: удалены все .header/.nav/.nav-dd и related, чтобы НЕ
   перезатирать control-panel-widget.css (и не ломать "Ресурсы").
   ========================================================= */

/* =================== 1) VARIABLES / RESET =================== */

:root{
  /* Palette */
  --bg:#0a0f1d;
  --bg-soft:#0f1630;
  --card:#111a3a;
  --text:#e5e7eb;
  --muted:#9aa4bf;
  --accent:#60a5fa;
  --accent-2:#22d3ee;
  --danger:#ef4444;
  --ok:#22c55e;

  /* Links */
  --link:#ffffff;
  --link-hover:#00A3FF;

  /* Brand */
  --brand:#857BFF;
  --brand-hover:#00A3FF;
  --brand-active:#5C54E6;
  --text-gradient-primary: linear-gradient(135deg, #E7E3EA 0%, #939195 50%, #39333D 100%);

  /* Radius / shadow */
  --radius:16px;
  --shadow: 0 8px 22px rgba(0,0,0,.30), inset 0 0 0 1px rgba(255,255,255,.035);

  /* Layout grid */
  --grid:1180px;

  /* “Aligned” horizontal gutters */
  --aligned-inline-gap: clamp(18px, 6vw, 140px);

  /* Header height (используется для отступа контента под фикс. панель/шапку) */
  --header-h-desktop: 60px;
  /* Fixed control-panel height reservation (to avoid CLS) */
  --ml-cp-h: 60px;

  /* Hero */
  --hero-title-min: 20px;
  --hero-title-fluid: 1.6vw;
  --hero-title-max: 32px;

  --home-hero-desc-min: 15.5px;
  --home-hero-desc-fluid: 1.02vw;
  --home-hero-desc-max: 18px;

  --home-hero-text-minh: clamp(300px, 26cqi, 380px);

  --content-top-gap: 18px;
  --after-hero-shot-gap: 32px;
  --after-hero-actions-gap: 56px;
  --home-hero-shot-top-gap: 104px;

  /* Page overlays */
  --body-gradient-primary: radial-gradient(1200px 800px at 70% -10%, #1e293b 0%, transparent 80%);
  --body-gradient-secondary: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,0));
  --page-overlay-primary: radial-gradient(1200px 800px at 70% -10%, rgba(30,41,59,.7) 0%, transparent 45%);
  --page-overlay-secondary: linear-gradient(0deg, rgba(6,10,20,.85), rgba(6,10,20,.85));

  /* Page scrollbar */
  --page-sb-w: 1px;
  --page-sb-thumb: var(--brand);
  --page-sb-thumb-hover: var(--brand-hover);

  /* Reviews lock */
  --review-card-w: 280px;
  --review-card-h: 320px;
}

/* auth visibility helpers (используется виджетом) */
html[data-ml-auth="user"] [data-auth-visible="guest"],
html[data-ml-auth="guest"] [data-auth-visible="user"]{
  display:none !important;
}

*{ box-sizing:border-box; }

img, video, svg, canvas{
  max-width:100%;
  height:auto;
  display:block;
}

html, body{
  max-width:100%;
  overflow-x:hidden;
  height:100%;
}

/* background on html to avoid right stripe */
html{
  scrollbar-gutter: stable both-edges;
  font-synthesis: none;
  text-rendering: geometricPrecision;
  background-color: var(--bg);
  background-image: var(--body-gradient-primary), var(--body-gradient-secondary);
  background-repeat:no-repeat, no-repeat;
  background-size:auto, auto;
}

body{
  margin:0;
  position:relative;
  font-family:'Unbounded', sans-serif;
  background: transparent;
  color:var(--text);
  line-height:1.6;
}

/* Background image on html */
html::before{
  content:"";
  position:fixed;
  inset:0;
  background-image:url('./assets/hero-bg2.png');
  background-repeat:no-repeat;
  background-size: cover;
  background-position: center top;
  z-index:-1;
  pointer-events:none;
}

html::after{
  content:"";
  position:fixed;
  inset:0;
  opacity:.85;
  background-image: var(--page-overlay-primary), var(--page-overlay-secondary);
  background-repeat:no-repeat, no-repeat;
  background-size:auto, auto;
  background-position:center top, center;
  z-index:-1;
  pointer-events:none;
}

/* WebKit scrollbars */
html::-webkit-scrollbar,
body::-webkit-scrollbar,
*::-webkit-scrollbar{
  width: var(--page-sb-w) !important;
  height: var(--page-sb-w) !important;
  background: transparent !important;
}

html::-webkit-scrollbar-track,
html::-webkit-scrollbar-track-piece,
body::-webkit-scrollbar-track,
body::-webkit-scrollbar-track-piece,
*::-webkit-scrollbar-track,
*::-webkit-scrollbar-track-piece{
  background: transparent !important;
  border:0 !important;
  margin:0 !important;
  box-shadow:none !important;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
*::-webkit-scrollbar-thumb{
  background: var(--page-sb-thumb) !important;
  border-radius:999px !important;
  border:0 !important;
  background-clip: padding-box !important;
  min-height:24px;
}
html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
*::-webkit-scrollbar-thumb:hover{
  background: var(--page-sb-thumb-hover) !important;
}
html::-webkit-scrollbar-corner,
body::-webkit-scrollbar-corner,
*::-webkit-scrollbar-corner{
  background: transparent !important;
}

.page-root{
  width:100%;
  margin:0 auto;
  transform:none;
  transform-origin:top center;
}

/* =================== 2) BASE ELEMENTS =================== */

.container{
  width:min(100%, var(--grid));
  margin-inline:auto;
  padding-inline:24px;
  min-width:0;
}

h1,h2,h3,h4,h5,h6{ margin:0; }
p{ margin:0 0 1rem; }

.visually-hidden{
  position:absolute!important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

/* =================== 3) LAYOUT =================== */

.section{ padding:56px 0; }
.section h2{ font-size:30px; margin-bottom:8px; }
.section p.lead{ color:var(--muted); margin-top:0; }

.section--interface,
.section--features,
.section--pricing,
.section--reviews,
.footer{
  padding-inline: var(--aligned-inline-gap);
}

.section--pricing{
  scroll-margin-top: 20px;
  padding-bottom: calc(56px + 40px);
}
.section--reviews{
  scroll-margin-top: 92px;
  padding-bottom:0;
}

.section--pricing .container{ position:relative; top:-24px; }

/* =================== 4) COMPONENTS =================== */

/* ---- Buttons -------------------------------------------------- */
.btn{
  appearance:none;
  border:0;
  border-radius:14px;
  padding:16px 44px;
  font-family:'Unbounded', sans-serif;
  font-weight:350;
  font-size:14px;
  cursor:pointer;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;

  background-color:var(--brand);
  color:#fff;
  text-decoration:none;
  box-shadow:var(--shadow);

  transition: background-color .18s ease, transform .12s ease;
}

.btn:visited{ color:#fff; text-decoration:none; }
.btn.is-loading{ opacity:.75; pointer-events:none; }
.btn.outline{ background-color:var(--brand); }

.btn:hover,
.btn:focus-visible,
.btn.outline:hover,
.btn.outline:focus-visible{
  background-color:var(--brand-hover);
  color:#fff;
}

.btn:active,
.btn.outline:active{
  background-color:var(--brand-active);
  transform:translateY(1px);
}

/* ---- Hero CTA / OS note -------------------------------------- */
.hero-cta{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:fit-content;
  gap:10px;
  margin-top:18px;
  margin-left:0;
}
.os-note{
  font-family:'Unbounded', sans-serif;
  font-weight:350;
  font-size:14px;
  color:var(--muted);
  line-height:1;
  margin:0;
  text-align:center;
  width:100%;
}

/* ---- Hero ----------------------------------------------------- */
.hero{
  position:relative;
  overflow:hidden;
  --hero-pad-top: 0px;
  --hero-pad-bottom: 0px;
  padding: var(--hero-pad-top) 0 var(--hero-pad-bottom);
}

.hero-bridge{
  letter-spacing:1px;
  width:min(1100px, calc(100% - 48px));
  margin:0 auto 16px;
  text-align:center;
  font-family:'Unbounded', sans-serif;
  font-weight:350;
  font-size:clamp(18px, 2.1vw, 32px);
  line-height:1.3;
  z-index:2;
}
.hero-bridge::first-line{ color:#fff !important; }

#hero-title,
.slogan,
.hero-bridge{
  font-size: clamp(var(--hero-title-min), var(--hero-title-fluid), var(--hero-title-max)) !important;
  line-height:1.15 !important;
}

/* ---- Features / Interface layout ----------------------------- */
.section--features{
  position:relative;
  padding-top:0;
  z-index:0;
  scroll-margin-top:calc(clamp(80px, 10vh, 140px) - 52px);
}
.section--features > *{ position:relative; z-index:2; }
.section--features .container{
  text-align:center;
  width:100%;
  margin-inline:0;
  padding-inline:0;
}

.features-group + .features-group{ margin-top: clamp(56px, 6vw, 104px); }

.section--pricing .lead{
  text-align:center;
  margin:16px auto clamp(26px, 4.5vw, 44px);
}
.pricing-title{
  text-align:center;
  margin:0 auto clamp(20px, 4vw, 40px);
}

.features-title{
  font-family:'Unbounded', sans-serif;
  font-weight:350;
  font-size:clamp(28px, 3.2vw, 44px);
  line-height:1.15;
  letter-spacing:1px;
  color:#fff;
  margin:0;
}
.features-title span{ color:inherit !important; }

.section--features .lead{
  max-width:780px;
  margin:16px auto 36px;
}
.section--features .features-bullet{ margin-top:26px; }

/* bullet (carousel) */
.features-bullet{
  position:relative;
  margin:44px auto 0;
  width:100%;
  max-width:var(--grid);
  padding:0;
  height:clamp(440px, 52vw, 700px);
  border-radius:14px;
  border:1px solid rgba(255,255,255,.1);
  background:transparent;
  box-shadow:var(--shadow);
  text-align:left;
  overflow:hidden;

  container-type: inline-size;
}

.features-carousel{ position:relative; min-height:100%; height:100%; }
.features-carousel__viewport{
  position:relative;
  overflow:hidden;
  width:100%;
  height:100%;
  touch-action: pan-y;
}

.features-carousel__track{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:100%;
  grid-auto-rows:100%;
  height:100%;
  transition:transform .45s ease;
}

.feature-slide{
  position:relative;
  width:100%;
  height:100%;
  background:transparent;
  isolation:isolate;
}
.feature-slide__bg{
  position:absolute;
  inset:0;
  background-image:var(--feature-image, url('./assets/section-placeholder.jpg'));
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  filter:saturate(1.1);
  z-index:1;
}
.feature-slide__overlay{
  position:absolute;
  inset:0;
  background:transparent;
  z-index:2;
  pointer-events:none;
}

.feature-slide__content{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:16px;
  padding:
    clamp(56px, 4.6vw, 88px)
    clamp(18px, 6vw, 48px)
    calc(clamp(22px, 5vw, 48px) + 48px);
  z-index:3;
  color:var(--text);
  min-height:0;
  overflow-wrap:anywhere;
  word-break:normal;
  hyphens:auto;
}

.feature-slide__eyebrow{
  margin:0;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#a8b4d9;
  font-weight:500;
  display:none;
}
.feature-slide__title{
  margin:0;
  font-family:'Unbounded', sans-serif;
  font-weight:450;
  font-size:clamp(22px, 2.4vw, 30px);
  line-height:1.25;
  color:#00A3FF;
}
.feature-slide__desc{
  margin:0;
  font-size:clamp(14.5px, 1.25vw, 16.5px);
  line-height:1.7;
  color:#d9deea;
  font-weight:250;
}

.features-carousel__controls{
  position:absolute;
  left:50%;
  bottom:16px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:0;
  padding:0;
  border-radius:6px;
  background:transparent;
  border:0;
  box-shadow:none;
  backdrop-filter:none;
  z-index:4;
}

.features-carousel__arrow{
  width:32px; height:32px;
  border-radius:50%;
  border:0;
  background:transparent;
  color:#cfd5e5;
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:background-color .2s ease, transform .2s ease;
}
.features-carousel__arrow::after{
  content:"";
  width:12px;
  height:12px;
  border-left:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateX(1px);
  margin-left:2px;
}
.features-carousel__arrow.is-next::after{
  transform:rotate(-135deg) translateX(-1px);
  margin-left:-4px;
}
.features-carousel__arrow:hover,
.features-carousel__arrow:focus-visible{
  background:rgba(255,255,255,.14);
  outline:none;
}
.features-carousel__arrow:disabled{
  opacity:.45;
  cursor:default;
  pointer-events:none;
}
.features-carousel__arrow:active{ transform:translateY(1px); }

.features-carousel__dots{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:center;
  padding:0 4px;
}
.features-carousel__dot{
  width:8px; height:8px;
  border-radius:999px;
  background:rgba(255,255,255,.32);
  opacity:.7;
  transition:width .2s ease, opacity .2s ease, background-color .2s ease;
}
.features-carousel__dot.is-active{
  width:18px;
  background:#00A3FF;
  opacity:1;
}
.features-carousel__dot button{
  display:block;
  width:100%; height:100%;
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
}

.features-term{ color:#58aaff; font-weight:500; }

.features-bullet .features-carousel__viewport,
.features-bullet .feature-slide,
.features-bullet .feature-slide__bg,
.features-bullet .feature-slide__overlay{
  border-radius: inherit;
}

/* “About” carousel: no arrows */
.section--features .features-carousel__arrow{ display:none !important; }

/* ---- Interface visual ---------------------------------------- */
.section--interface{
  position:relative;
  padding-top:0;
  margin-top:0;
}
.section--interface .container{
  width:100%;
  margin-inline:0;
  padding-inline:0;
  margin-top:18px;
}

.section--pricing .container,
.section--reviews .container,
.footer .container{
  width:min(100%, var(--grid));
  margin-inline:auto;
  padding-inline:0;
}

.interface-visual{
  position:relative;
  margin:34px auto 30px;
  width:100%;
  border-radius:6px;
  overflow:visible;
  box-shadow: 0 30px 60px rgba(12,16,32,0.6), inset 0 0 0 1px rgba(255,255,255,.06);
}
.interface-visual::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(120% 120% at 50% 0%, rgba(133,123,255,.25), transparent 60%);
  opacity:.6;
  pointer-events:none;
}
.interface-visual img{
  display:block;
  width:100%;
  height:auto;
}

/* ---- Pricing -------------------------------------------------- */
.pricing{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:20px;
  margin-top:24px;
  width:100%;
  margin-inline:0;
  min-width:0;
}

@media (max-width:1104px){
  .pricing{
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 18px;
  }
  .price{ aspect-ratio:auto; min-height:0; }
}
@media (max-width:560px){
  .pricing{ grid-template-columns:1fr; }
  .price{ padding: 26px 18px 30px; }
  .price .amount{ font-size:40px; }
}

.pricing-note,
.reviews-note{
  margin:32px auto 0;
  aspect-ratio:4 / 1;
  min-height:200px;
  width:100%;
  max-width:var(--grid);
  padding:22px 28px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  box-shadow:var(--shadow);
  color:var(--text);
  font-size:15px;
  line-height:1.6;
  display:flex;
  align-items:center;
}

.pricing-status{
  margin-top:18px;
  color:var(--muted);
  font-size:14px;
  text-align:center;
}
.section--pricing .pricing-status{
  width:100%;
  margin:18px 0 0;
}

.price{
  width:100%;
  max-width:none;
  padding:26px 18px 30px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.012));
  text-align:center;
  box-shadow:var(--shadow);
  transition:transform .2s ease, border-color .2s ease;
  min-height:310px;
  aspect-ratio: 3 / 3.2;

  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}
.price-title{
  font-size:16px;
  font-weight:600;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:1px;
}
.price:hover{
  transform:translateY(-3px);
  border-color:rgba(255,255,255,.20);
}
.price .amount{ font-size:44px; font-weight:800; }
.price .per{ color:var(--muted); }
.price-cost{
  font-size:15px;
  font-weight:500;
  color:#d1d5ff;
  margin-top:auto;
}
.price .cta{
  margin-top:10px;
  width:100%;
  max-width:240px;
  font-size:14px;
  padding:12px 20px;
  border-radius:10px;
}

.price--current{
  border-color:#857BFF;
  box-shadow:0 0 20px rgba(133,123,255,.38), 0 0 6px rgba(133,123,255,.30), var(--shadow);
  transform:none;
  transition:none;
}
.price--current:hover{
  transform:none;
  border-color:#857BFF;
}
.price--current .price-title{ color:#00A3FF; }
.price--current .cta{
  background-color:transparent;
  border:2px solid #00A3FF;
  color:#00A3FF;
  box-shadow:none;
  pointer-events:none;
  cursor:not-allowed;
  opacity:1;
}
.price--current .cta:hover,
.price--current .cta:focus-visible,
.price--current .cta:active{
  background-color:transparent;
  color:#00A3FF;
  transform:none;
}

/* ---- Reviews -------------------------------------------------- */
.section--reviews .features-title{
  text-align:center;
  margin-inline:auto;
  position:relative;
  top: 0;
}

.section--reviews .reviews-wrapper{
  width:100%;
  margin: 0 0 28px;
  position:relative;
  z-index:1;
  padding-top: 0;
}

.section--reviews .reviews-grid{
  display:block;
  width:100%;
  overflow:hidden;
  padding:0 0 16px;
}

.section--reviews .reviews-track{
  display:flex;
  flex-wrap:nowrap;
  gap:20px;
  width:100%;
  will-change:transform;
  min-width:0;
}

.section--reviews .review-card{
  flex:0 0 calc((100% - 60px)/4);
  max-width:calc((100% - 60px)/4);
}

@media (max-width:1200px){
  .section--reviews .review-card{
    flex:0 0 calc((100% - 20px)/2);
    max-width:calc((100% - 20px)/2);
  }
}
@media (max-width:680px){
  .section--reviews .review-card{
    flex:0 0 100%;
    max-width:100%;
  }
}

/* disable hover bounce for review cards */
.section--reviews .price.review-card{
  transition:border-color .2s ease !important;
}
.section--reviews .price.review-card:hover,
.section--reviews .price.review-card:focus-within{
  transform:none !important;
}

/* lock card size */
.section--reviews .price.review-card{
  flex: 0 0 var(--review-card-w) !important;
  max-width: var(--review-card-w) !important;
  width: var(--review-card-w);
  height: var(--review-card-h);
  min-height: var(--review-card-h);
  aspect-ratio: auto !important;
}
@media (max-width: 360px){
  :root{ --review-card-w: 260px; }
}

.reviews-status{
  margin:20px 0 0;
  text-align:center;
  color:var(--muted);
  font-size:14px;
  width:100%;
}

.review-card{
  display:flex;
  flex-direction:column;
  min-height:290px;
  margin-top:4px;
  align-items:flex-start;
  justify-content:flex-start;
  gap:14px;
  padding:26px 20px 30px;
  scroll-snap-align:start;
  position:relative;
  z-index:0;
}
.review-card:hover,
.review-card:focus-within{ z-index:5; }

.review-card__head{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  text-align:left;
}

.review-card__avatar{
  width:42px;
  height:42px;
  border-radius:50%;
  background:#857BFF;
  position:relative;
}
.review-card__avatar.has-image{
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
}
.review-card__avatar.has-image::after{ display:none; }
.review-card__avatar::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:18px;
  height:18px;
  transform:translate(-50%, -50%);
  background-repeat:no-repeat;
  background-size:contain;
}

.review-card__name{
  font-family:'Unbounded', sans-serif;
  font-size:16px;
  font-weight:500;
  color:#fff;
  flex:1 1 auto;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.review-card__stars{
  margin-left:auto;
  flex:0 0 60px;
  height:12px;
  background-image:url("/assets/star.svg");
  background-repeat:repeat-x;
  background-size:12px 12px;
  background-position:left center;
  opacity:.95;
  pointer-events:none;
}

.review-card__body{
  flex:1;
  min-height:0;
  width:100%;
  overflow:hidden;
}

.review-card__text{
  font-family:'Montserrat', sans-serif;
  font-size:15px;
  line-height:1.6;
  color:#fff;
  margin:0;
  width:100%;
  word-break:break-word;
  text-align:left !important;
}

.review-card__text-content{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-align:left !important;
}

.review-card__footer{
  margin-top:auto;
  align-self:flex-start;
}

.review-card__more{
  margin:8px 0 0;
  background:none;
  border:0;
  padding:0;
  font-family:'Montserrat', sans-serif;
  font-size:15px;
  color:#857BFF;
  cursor:pointer;
  display:inline-block;
  line-height:1.6;
  vertical-align:baseline;
  opacity:.95;
}
.review-card__more[hidden]{ display:none !important; }
.review-card__more:hover,
.review-card__more:focus{ color:#A786FF; opacity:1; }
.review-card__more:focus-visible{
  outline:2px solid #857BFF;
  outline-offset:3px;
}

/* ---- Footer --------------------------------------------------- */
.footer{
  padding:10px 10px;
  padding-inline: var(--aligned-inline-gap);
  color:var(--muted);
  border-top:1px solid rgba(255,255,255,.06);
}
.footer .container{
  width:min(100%, var(--grid));
  margin-inline:auto;
  padding:0;
}

.footer-grid{
  display:grid;
  grid-template-columns:1fr;
  row-gap:32px;
  align-items:start;
}
.footer-brand{ justify-self:center; text-align:center; }
.footer-contacts{ justify-self:center; }

.footer-contacts__body{
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
  justify-items:center;
}

.footer-col{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:flex-start;
  text-align:left;
}
.footer-col h4{
  margin:0;
  font-size:16px;
  font-weight:600;
  color:#857BFF;
}

.footer-resource-list,
.footer-contact-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.footer-resource-link{
  text-decoration:none;
  color:var(--muted);
  font-family:'Unbounded', sans-serif;
  font-size:13px;
  line-height:1.2;
  white-space:normal;
}
.footer-resource-link:hover,
.footer-resource-link:focus-visible{
  color:var(--link-hover);
  outline:none;
}

.footer-contact-link{
  display:grid;
  grid-template-columns:20px auto;
  column-gap:10px;
  align-items:center;
  width:max-content;
  text-decoration:none;
  color:var(--muted);
  font-family:'Unbounded', sans-serif;
  font-size:13px;
  line-height:1.2;
}
.footer-contact-link:hover,
.footer-contact-link:focus-visible{
  color:var(--link-hover);
  outline:none;
}
.footer-contact-icon{
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#7bc3ff;
}
.footer-contact-icon svg{ width:100%; height:100%; }
.footer-contact-value{ white-space:nowrap; }

.footer-disclaimer-wrap{
  margin-top: 14px;
  display:flex;
  justify-content:center;
}

.footer-disclaimer{
  font-size: 12px;
  line-height: 1.35;
  opacity: .65;
  max-width: 980px;
  margin: 0;
}

@media (min-width:1105px){
  .footer-disclaimer-wrap{ justify-content:flex-start; }
}

@media (min-width:1105px){
  .footer{ padding-top:84px; }

  .footer-grid{
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    grid-template-rows:auto auto;
    column-gap: clamp(22px, 5vw, 80px);
    row-gap:0;
    align-items:start;
  }

  .footer-contacts{
    grid-column:2;
    grid-row:1;
    justify-self:center;
    align-self:start;
    margin-top:-18px;
    min-width:0;
  }

  .footer-contacts__body.footer-cols{
    display:grid !important;
    grid-template-columns: repeat(3, max-content);
    column-gap:56px;
    row-gap:16px;
    justify-content:center;
    justify-items:start;
    width:max-content;
    margin-inline:auto;
  }

  .footer-col--docs{ transform: translateX(12px); }

  .footer-brand{
    grid-column:1;
    grid-row:2;
    justify-self:start;
    align-self:end;
    text-align:left;
    margin-top: clamp(36px, 4vw, 66px);
    min-width:0;
  }

  .footer-brand .helper{ white-space:nowrap; }

  .footer-col--docs .footer-resource-link{
    white-space:normal;
    overflow-wrap:anywhere;
    display:inline-block;
    max-width:240px;
    line-height:1.35;
  }
}

/* =================== COOKIE BANNER =================== */
.cookie-banner{
  position:fixed;
  left:50%;
  bottom:20px;
  width:min(1180px, calc(100% - 32px));
  transform:translateX(-50%);
  display:flex;
  align-items:flex-start;
  gap:18px;
  padding:28px 20px 16px 20px;
  background:linear-gradient(135deg, rgba(14,20,42,0.96) 0%, rgba(11,16,30,0.94) 100%);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:10px;
  box-shadow:0 24px 60px rgba(0,0,0,0.45), inset 0 0 0 1px rgba(255,255,255,0.02);
  color:var(--text);
  backdrop-filter: blur(12px);
  z-index:120;
  transition:opacity .25s ease, transform .25s ease, visibility .25s ease;
}
.cookie-banner[hidden]{ display:none !important; }
.cookie-banner.is-hidden{
  opacity:0;
  visibility:hidden;
  transform:translate(-50%, 16px);
  pointer-events:none;
}
.cookie-banner__text{
  flex:1;
  font-size:13.5px;
  line-height:1.55;
  font-weight:250;
}
.cookie-banner__text a{
  color:var(--brand-hover);
  font-weight:600;
  text-decoration:none;
}
.cookie-banner__text a:hover,
.cookie-banner__text a:focus-visible{
  color:#fff;
  text-decoration:underline;
  outline:none;
}
.cookie-banner__actions{
  display:flex;
  align-items:center;
  gap:12px;
}
.cookie-banner__accept{
  padding:12px 24px;
  height:auto;
  min-width:150px;
  border-radius:10px;
  font-weight:350;
  background-color:var(--brand);
  background-image:none;
  box-shadow:var(--shadow);
}
.cookie-banner__accept:focus-visible{
  outline:3px solid rgba(255,255,255,0.5);
  outline-offset:2px;
}
.cookie-banner__close{
  padding:12px 20px;
  height:auto;
  width:auto;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.06);
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:13.5px;
  font-weight:350;
  cursor:pointer;
  transition:background .2s ease, border-color .2s ease, transform .12s ease;
}
.cookie-banner__close:hover,
.cookie-banner__close:focus-visible{
  background:rgba(255,255,255,0.10);
  border-color:rgba(255,255,255,0.22);
  outline:none;
}
.cookie-banner__close:active{ transform:translateY(1px); }

/* =================== POLICY PAGE =================== */
.policy-main{
  padding-top: calc(var(--header-h-desktop) + 28px);
  padding-inline: 0;
}
.policy-main .container,
.policy-viewer .container{
  width:100%;
  margin-inline:auto;
  padding-inline:0;
}
.policy-download{
  font-family:'Unbounded', sans-serif;
  font-size:13.3333px;
  font-weight:350;
  line-height:1;
  letter-spacing:.2px;
}
.policy-hero__wrap{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.policy-kicker{
  text-transform:uppercase;
  letter-spacing:1.2px;
  color:var(--muted);
  font-weight:500;
  margin:0 0 6px;
}
.policy-title{
  font-size:36px;
  line-height:1.1;
  margin:0 0 12px;
}
.policy-subtitle{
  max-width:800px;
  color:var(--muted);
  margin:0 0 18px;
}
.policy-actions{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}
.policy-viewer{
  padding-top:28px;
  margin-top:-36px;
  padding-inline: var(--aligned-inline-gap);
}
.policy-card{
  background:rgba(10,15,29,0.78);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:22px;
  box-shadow:0 20px 50px rgba(0,0,0,0.45);
  padding:16px;
  width:100%;
  max-width:none;
  margin-inline:auto;
}
.policy-embed{
  width:100%;
  height:70vh;
  min-height:520px;
  border:0;
  border-radius:12px;
  background:radial-gradient(800px 600px at 30% 10%, rgba(96,165,250,0.08), transparent), rgba(5,8,18,0.75);
}
.policy-doc{ padding:26px; }
.policy-doc__header{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-bottom:12px;
}
.policy-meta{
  color:var(--muted);
  font-size:13px;
  letter-spacing:.2px;
  margin:0;
}
.policy-doc__title{ font-size:24px; margin:0; }
.policy-lead{ margin:0; color:var(--muted); }
.policy-doc__section{ margin-top:18px; }
.policy-doc__section h3{ margin:0 0 8px; font-size:19px; }
.policy-doc__section p{ margin:0 0 10px; }
.policy-doc__section ol,
.policy-doc__section ul{
  margin:0 0 12px;
  padding-left:22px;
  color:var(--text);
  display:grid;
  gap:6px;
}
.policy-doc__section strong{ color:#fff; font-weight:600; }
.policy-doc a{
  color:var(--brand-hover);
  text-decoration:none;
}
.policy-doc a:hover,
.policy-doc a:focus-visible{
  color:#fff;
  text-decoration:underline;
  outline:none;
}

/* =================== TESTNETS ================= */
.section--testnets{
  scroll-margin-top:92px;
}
.section--testnets .features-bullet{ margin-top:0; }
.section--testnets .features-carousel__arrow{ display:none !important; }
.feature-slide--testnets .feature-slide__bg{ background-position:right center; }
.feature-slide--testnets .feature-slide__overlay{
  background: linear-gradient(
    90deg,
    rgba(6,10,20,.92) 0%,
    rgba(6,10,20,.72) 42%,
    rgba(6,10,20,.18) 62%,
    rgba(6,10,20,0) 78%
  );
}
.section--testnets .feature-slide__desc p{ margin:0; }
.section--testnets .feature-slide__desc .feature-slide__lead{ margin:0 0 16px; }
.section--testnets .feature-slide__desc .feature-slide__subhead{
  margin:16px 0 8px;
  font-weight:500;
  color:#ffffff;
}
.section--testnets .feature-slide__desc .feature-slide__list{
  margin:0;
  padding-left:18px;
  display:grid;
  gap:10px;
}
.section--testnets .feature-slide__desc .feature-slide__list li{ margin:0; }
.section--testnets .feature-slide__desc .feature-slide__result{ margin:16px 0 0; }

/* Center text vertically for testnets */
.section--testnets .feature-slide__content{ justify-content: center; }

/* =================== SLIDER LAYOUT (About + Testnets) =================== */

/* About slider */
.section--features .feature-slide__content{
  inset: 0 auto 0 0;
  width: clamp(420px, 50cqi, 760px);
  max-width: 50%;
}
.section--features .feature-slide__bg{ background-position: right center; }
.section--features .feature-slide__overlay{ background: none !important; }

/* Testnets slider */
.section--testnets .feature-slide__content{
  inset: 0 auto 0 0;
  width: clamp(420px, 50cqi, 760px);
  max-width: 50%;
}
.section--testnets .feature-slide--bots .feature-slide__content{
  inset: 0 auto 0 0;
  width: clamp(420px, 50cqi, 760px);
  max-width: 50%;
}
.section--testnets .feature-slide--interface .feature-slide__overlay{
  background: none !important;
}
.section--testnets .feature-slide--interface .feature-slide__bg{
  background-position: right center;
}

/* Container query: narrow -> text full width */
@container (max-width: 860px){
  .section--features .feature-slide__content,
  .section--testnets .feature-slide__content{
    width: 100%;
    max-width: none;
  }
  .section--features .feature-slide__bg,
  .section--testnets .feature-slide__bg{
    background-position:center;
  }
}

/* fallback */
@media (max-width:1104px){
  .section--features .feature-slide__content,
  .section--testnets .feature-slide__content{
    width:100%;
    max-width:none;
  }
}

/* Narrow desktop: tweak testnets text width */
@media (max-width: 1320px){
  .section--testnets .feature-slide__content{
    max-width: min(46%, 520px);
    width: min(46%, 520px);
  }
}
@media (max-width: 1180px){
  .section--testnets .feature-slide__content{
    max-width: min(52%, 480px);
    width: min(52%, 480px);
    padding:
      clamp(40px, 4.2vw, 64px)
      clamp(14px, 2.2vw, 28px)
      calc(clamp(18px, 3.2vw, 32px) + 48px);
  }
}

/* =================== FAQ =================== */
.section--faq{
  padding: clamp(56px, 5.6vw, 86px) 0;
  padding-top: clamp(40px, 3.6vw, 58px);
  padding-inline: clamp(18px, 3vw, 54px);
  scroll-margin-top:92px;
}
.section--faq .container{
  width:min(100%, var(--grid));
  margin-inline:auto;
  padding-inline:0;
}
.faq-title{
  font-family:'Unbounded', sans-serif;
  font-weight:350;
  font-size:clamp(28px, 3.2vw, 44px);
  line-height:1.15;
  letter-spacing:1px;
  color:#fff;
  text-align:center;
  margin:0 0 clamp(20px, 2.8vw, 30px);
}
.faq{ display:grid; gap:12px; }
.faq-item{
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  box-shadow:var(--shadow);
  overflow:hidden;
}
.faq-q{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:20px 22px;
  background:transparent;
  border:0;
  color:inherit;
  cursor:pointer;
  text-align:left;
}
.faq-q__text{
  font-family:'Inter', sans-serif;
  font-weight:600;
  font-size:17px;
  line-height:1.3;
  color:#fff;
}
.faq-q__icon{
  position:relative;
  width:26px;
  height:26px;
  flex:0 0 26px;
  color:var(--brand-hover);
  opacity:.95;
}
.faq-q__icon::before,
.faq-q__icon::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:22px;
  height:2px;
  background:currentColor;
  transform:translate(-50%, -50%);
  border-radius:2px;
}
.faq-q__icon::after{ transform:translate(-50%, -50%) rotate(90deg); }

.faq-item.is-open{ border-color: rgba(255,255,255,.16); }
.faq-q:hover{ background: rgba(255,255,255,.02); }
.faq-q:focus-visible{
  outline:3px solid rgba(0,163,255,.25);
  outline-offset:3px;
  border-radius:10px;
}
.faq-a{
  overflow:hidden;
  max-height:0px;
  transition:max-height .28s ease;
}
.faq-a__inner{
  padding:0 22px 20px;
  font-family:'Inter', sans-serif;
  font-size:14.5px;
  line-height:1.75;
  color:var(--muted);
  max-width:980px;
}
@media (prefers-reduced-motion: reduce){ .faq-a{ transition:none; } }

/* ================= HERO CTA (HOME ONLY) ================= */
body[data-page="home"]{ padding-top:0 !important; }
body[data-page="home"] main{
  /* Reserve space for fixed control-panel widget (no jump on init) */
  padding-top: calc(var(--ml-cp-h, var(--header-h-desktop)) + var(--content-top-gap)) !important;
}

/* HOME HERO SHOT */
body[data-page="home"] .hero-shot{
  width:min(var(--grid), 100%);
  margin:0 auto var(--after-hero-shot-gap) !important;
  min-height:500px;
  padding:20px 20px;
  border-radius:14px;
  position:relative;
  overflow:visible !important;
  container-type:inline-size;
}

body[data-page="home"] .hero-shot__stage{
  display:grid;
  grid-template-columns: 0.95fr 1.05fr;
  grid-template-areas: "text media";
  gap:22px;
  align-items:center;
  width:100%;
}

@media (max-width:1104px){
  body[data-page="home"] .hero-shot__stage{
    grid-template-columns:1fr !important;
    grid-template-areas:
      "text"
      "media" !important;
    gap:16px !important;
  }
  body[data-page="home"] .hero-shot__media{
    justify-self:center !important;
  }
  body[data-page="home"] .hero-shot__media img{
    width:min(680px, 100%) !important;
    transform:none !important;
  }
  body[data-page="home"] .hero-actions{
    flex-wrap:wrap;
    gap:12px;
  }
  body[data-page="home"] .hero-actions .btn.btn-hero{
    min-width:min(360px, 100%);
  }
}

body[data-page="home"] .hero-shot__text{
  grid-area:text;
  min-width:0;
}

body[data-page="home"] .hero-shot__media{
  grid-area:media;
  justify-self:end;
  min-width:0;
  overflow:visible;
}

body[data-page="home"] .hero-shot__logo{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  margin:0 0 16px;
}
body[data-page="home"] .hero-shot__logo img{
  height: clamp(78px, 7.5vw, 150px);
  width:auto;
  display:block;
}

body[data-page="home"] .hero-shot__media img{
  width:100% !important;
  height:auto !important;
  display:block !important;
}

@media (min-width:1105px){

  /* 1) Делаем правую колонку шире и увеличиваем зазор */
  body[data-page="home"] .hero-shot__stage{
    grid-template-columns: 1fr 1.25fr !important;
    gap: 34px !important;
  }

  /* 2) Жёстко прижимаем медиа вправо */
  body[data-page="home"] .hero-shot__media{
    justify-self: end !important;
    margin-left: auto;
    padding-right: 6px; /* микро-запас */
  }

  /* 3) Убираем “заезд” на текст: сдвиг почти в ноль */
  body[data-page="home"] .hero-shot__media img{
    width: clamp(460px, 38vw, 720px) !important;
    max-width: 720px !important;

    /* БЫЛО: слишком отрицательный X -> залезает на текст */
    transform: translateX(clamp(-55px, -2.8vw, -18px)) scale(1.22) !important;
    transform-origin: left center;
    will-change: auto;
  }
}


/* HOME HERO DESC */
body[data-page="home"] .hero-shot__desc{
  margin-left:0;
  font-size: clamp(var(--home-hero-desc-min), var(--home-hero-desc-fluid), var(--home-hero-desc-max));
  line-height: 1.55;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

@media (min-width:1105px){
  body[data-page="home"] .hero.hero--shot{
    --hero-pad-top: var(--home-hero-shot-top-gap);
    --hero-pad-bottom: 0px;
  }
}

body[data-page="home"] .hero{ padding-bottom:0 !important; }
body[data-page="home"] .hero.hero--actions{
  padding-top:0 !important;
  padding-bottom:6px !important;
  margin:0 !important;
  margin-bottom: var(--after-hero-actions-gap) !important;
  top:0 !important;
}
body[data-page="home"] .hero.hero--bridge{
  padding-top:0 !important;
  padding-bottom:0 !important;
  margin-top:0 !important;
}
body[data-page="home"] .hero.hero--bridge .hero-bridge{
  position:static !important;
  margin:0 auto !important;
}

body[data-page="home"] .home-seo{
  margin-top: 56px;
  margin-bottom: 28px;
}
@media (max-width: 1104px){
  body[data-page="home"] .home-seo{ margin-top: 44px; margin-bottom: 22px; }
}
@media (max-width: 520px){
  body[data-page="home"] .home-seo{ margin-top: 34px; margin-bottom: 18px; }
}

body[data-page="home"] .hero-actions{
  padding-top:10px;
  grid-column:1 / -1;
  justify-self:center;
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:40px;
  margin:0 auto !important;
  flex-wrap:nowrap;
}
body[data-page="home"] .hero-actions .btn.btn-hero{
  height:48px;
  min-width:300px;
  padding:0 40px;
  border-radius:12px;
  font-size:14px;
  font-weight:350;
  letter-spacing:.2px;
  margin:0 !important;
}
body[data-page="home"] .btn-hero--secondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}
body[data-page="home"] .btn-hero__icon-img{
  width:18px;
  height:18px;
  flex:0 0 18px;
  display:block;
}

@media (max-width:1104px){
  :root{ --aligned-inline-gap: clamp(16px, 4vw, 54px); }
}

@media (min-width:1105px){
  .hero{
    --hero-pad-top: clamp(110px, 11vh, 158px);
    --hero-pad-bottom: clamp(0px, 2.4vw, 44px);
  }
}

/* replace cqi with vw to avoid first-frame jitter */
@media (min-width:1105px) and (max-width:1360px){
  body[data-page="home"] .hero-shot__media img{
    width: clamp(450px, 44vw, 740px) !important;
    transform: translateX(clamp(-125px, -7vw, -86px)) scale(1.30) !important;
  }
}
@media (min-width:1105px) and (max-width:1200px){
  body[data-page="home"] .hero-shot__stage{ grid-template-columns: 1fr 1fr; }
  body[data-page="home"] .hero-shot__media img{
    width: clamp(410px, 46vw, 660px) !important;
    transform: translateX(clamp(-105px, -6vw, -66px)) scale(1.22) !important;
  }
}

@media (min-width:1600px) and (max-width:1919px){
  :root{
    --grid:1180px;
    --body-gradient-primary: radial-gradient(1400px 950px at 70% -12%, #16213e 0%, transparent 74%);
    --page-overlay-primary: radial-gradient(1500px 920px at 62% -14%, rgba(30,41,59,.75) 0%, transparent 54%);
  }
}
@media (min-width:1920px){
  :root{
    --grid:1180px;
    --body-gradient-primary: radial-gradient(1600px 1100px at 70% -14%, #16213e 0%, transparent 72%);
    --body-gradient-secondary: radial-gradient(1200px 900px at 8% -6%, rgba(34,211,238,.14) 0%, transparent 78%);
    --page-overlay-primary: radial-gradient(1700px 1020px at 62% -16%, rgba(30,41,59,.78) 0%, transparent 52%);
    --page-overlay-secondary: linear-gradient(0deg, rgba(6,10,20,.9), rgba(6,10,20,.9));
  }
}

body[data-page="home"] .home-hero-pack{
  padding-inline: var(--aligned-inline-gap);
}
@media (min-width:1105px){
  body[data-page="home"] .home-hero-pack{
    width:100%;
    margin:0;
    transform:none;
  }
}

.hero-bridge--mobile{ display:none; }
.hero-bridge--desktop{ display:block; }