/* ===============================================================
   TRAFFORD — МОБИЛЬНАЯ ВЕРСИЯ
   Единственный источник оформления до 900px.
   Страничные стили на этой ширине отключены, поэтому здесь
   нет борьбы приоритетов и почти нет !important.
   =============================================================== */

:root{
  --m-bg:#F2F2F7; --m-card:#FFFFFF;
  --m-ink:#0B0B0F; --m-ink-2:#4B4F58; --m-ink-3:#8A8E99;
  --m-line:#E3E4E8; --m-accent:#4F46E5; --m-accent-soft:#EEEDFE;
  --m-warn:#B45309; --m-warn-bg:#FEF6E7;
  --m-pad:16px; --m-r:16px; --m-r-lg:20px;
  --m-safe-b:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--m-bg); color:var(--m-ink);
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text','Manrope',system-ui,sans-serif;
  font-size:16px; line-height:1.45; letter-spacing:-.01em;
  overflow-x:hidden; padding-bottom:calc(80px + var(--m-safe-b));
}
body::before,body::after{ content:none; }
img,svg,video,iframe,table{ max-width:100%; }
img,video{ height:auto; }
h1,h2,h3,h4{ margin:0 0 10px; color:var(--m-ink); letter-spacing:-.028em; line-height:1.18; }
h1{ font-size:28px; font-weight:800; }
h2{ font-size:22px; font-weight:700; }
h3{ font-size:17px; font-weight:700; }
p{ margin:0 0 10px; color:var(--m-ink-2); font-size:15.5px; }
a{ color:var(--m-accent); text-decoration:none; }
ul{ margin:0 0 10px; padding-left:18px; }
li{ color:var(--m-ink-2); font-size:15px; margin-bottom:5px; }
h1,h2,h3,h4,p,li,td,th,span,div,a{ overflow-wrap:anywhere; }

/* ---------------------------------------------------------- каркас */
.layout,.shell,.wrap,main.content,.content{
  display:block; width:100%; max-width:100%; margin:0;
  padding:14px var(--m-pad) 0; background:none; border:0; box-shadow:none;
}
.layout > .content{ padding:0; }
.glass-card,.agency-home,.hf,.hf-hero,.rules-wrapper,.ip-offer,
.ads-wrap,.agency-wrap,.support-wrap,.crm-wrapper,.dev-wrap,
.seo-details,.profile-glass-wrapper{
  background:none; border:0; border-radius:0; box-shadow:none;
  padding:0; margin:0 0 18px; backdrop-filter:none;
}
.sidebar,.profile-panel,.mobile-bottom-nav,.heartbeat-line,
.topbar-border,.agency-glow,.profile-top-glow,.seo-hidden-block{ display:none; }

/* =============================================================== шапка */
.tb{
  position:sticky; top:0; z-index:80;
  background:rgba(242,242,247,.86);
  -webkit-backdrop-filter:saturate(180%) blur(20px); backdrop-filter:saturate(180%) blur(20px);
  border-bottom:.5px solid var(--m-line);
}
.tb::after{ content:none; }
.tb-in{ display:flex; align-items:center; gap:10px; height:56px; padding:0 var(--m-pad); max-width:100%; }
.tb-logo{ display:flex; align-items:center; gap:8px; font-size:16.5px; font-weight:800;
  letter-spacing:-.035em; color:var(--m-ink); text-decoration:none; white-space:nowrap; }
.tb-logo i{ width:28px; height:28px; border-radius:9px; background:var(--m-ink); color:#fff;
  display:grid; place-items:center; font-style:normal; font-size:13px; font-weight:700; }
.tb-logo em{ font-style:normal; color:var(--m-accent); }
.tb-nav,.tb-lang{ display:none; }
.tb-r{ margin-left:auto; display:flex; align-items:center; gap:8px; }
.tb-r .btn-secondary{ display:none; }
.tb-icon{
  display:inline-flex; align-items:center; gap:7px; height:38px; padding:0 15px;
  border:0; border-radius:100px; background:var(--m-accent); color:#fff;
  font-size:15px; font-weight:600; cursor:pointer;
}
.tb-icon svg{ width:16px; height:16px; stroke:#fff; flex:0 0 16px; }
.tb-icon::after{ content:"Войти"; white-space:nowrap; }
html[lang="en"] .tb-icon::after{ content:"Log in"; }
.tb-ava{ width:38px; height:38px; border-radius:50%; background:var(--m-accent); color:#fff;
  display:grid; place-items:center; font-size:15px; font-weight:700; text-decoration:none; }

/* бургер рисуем полосками — не зависит от svg */
.tb-burger{ position:relative; width:38px; height:38px; border:0; border-radius:12px;
  background:rgba(120,120,128,.14); cursor:pointer; flex:0 0 38px; }
.tb-burger svg{ display:none; }
.tb-burger::before,.tb-burger::after{
  content:""; position:absolute; left:11px; right:11px; height:2px; border-radius:2px; background:var(--m-ink);
}
.tb-burger::before{ top:13px; box-shadow:0 6px 0 var(--m-ink); }
.tb-burger::after{ bottom:13px; }

/* ==================================================== главная */
.hf-hero{ padding:16px 0 4px; }
.hf-h1{ font-size:30px; font-weight:800; line-height:1.08; letter-spacing:-.035em; }
.hf-sw{ display:inline-block; padding:0 8px; border-radius:9px; color:#fff; }
.hf-sub{ font-size:16px; color:var(--m-ink-2); margin-top:10px; }
.hf-marq{ margin:16px calc(var(--m-pad)*-1) 16px; padding:11px 0; background:var(--m-card);
  border-top:.5px solid var(--m-line); border-bottom:.5px solid var(--m-line); overflow:hidden; }
.hf-track{ display:flex; width:max-content; }
.hf-track a{ padding:0 15px; font-size:15px; font-weight:600; color:var(--m-ink-2); white-space:nowrap; }

.hf-grid{ display:flex; flex-direction:column; gap:10px; padding-bottom:22px; }
.hf-card{ display:flex; flex-direction:row; align-items:stretch; background:var(--m-card);
  border:0; border-radius:var(--m-r-lg); box-shadow:0 1px 3px rgba(0,0,0,.06);
  overflow:hidden; opacity:1; transform:none; }
.hf-field{ width:96px; flex:0 0 96px; padding:11px; display:flex; align-items:center; }
.hf-field::after{ content:none; }
.hf-well{ width:100%; background:none; padding:0; border-radius:13px; overflow:hidden; }
.hf-well img{ width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:13px; }
.hf-body{ display:flex; flex-direction:column; justify-content:center; padding:13px 15px 13px 3px; flex:1; min-width:0; }
.hf-body h3{ font-size:16.5px; margin:0 0 3px; }
.hf-body p{ font-size:14px; margin:0; line-height:1.38; }
.hf-meta{ display:flex; align-items:center; justify-content:space-between; gap:8px;
  margin-top:9px; padding-top:9px; border-top:.5px solid var(--m-line); }
.hf-note{ font-size:11.5px; color:var(--m-ink-3); }
.hf-go{ width:28px; height:28px; border-radius:50%; background:rgba(120,120,128,.10);
  color:var(--m-ink); display:grid; place-items:center; flex:0 0 28px; }
.hf-go svg{ width:13px; height:13px; }

.module-badge{ display:inline-block; margin:0 0 12px; padding:6px 13px; border-radius:100px;
  background:var(--m-accent-soft); color:var(--m-accent); font-size:11px; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; }
.badge,.crm-badge,.tag,.chip,.status{ display:inline-flex; align-items:center; padding:4px 10px;
  border-radius:100px; background:rgba(120,120,128,.12); color:var(--m-ink-2); font-size:11.5px; font-weight:600; }

.rules-card,.warning-box,.leads-warning,.notice{
  background:var(--m-warn-bg); border:1px solid #F5D9A8; border-radius:var(--m-r);
  padding:14px 15px; margin:0 0 16px;
}
.rules-card-text,.warning-box strong{ color:var(--m-warn); font-weight:700; font-size:14.5px; display:block; margin-bottom:6px; }
.rules-card p,.warning-box p{ font-size:14px; }
.rules-btn{ width:100%; margin-top:10px; }

.toggle-wrap,.model-switch,.leads-models{
  display:flex; gap:4px; background:rgba(120,120,128,.10);
  border-radius:12px; padding:3px; margin:0 0 14px;
}
.toggle-btn,.model-switch a,.model-switch button,.leads-models a{
  flex:1 1 0; min-width:0; display:flex; align-items:center; justify-content:center;
  min-height:38px; padding:0 6px; border:0; border-radius:9px; background:none;
  font-size:13px; font-weight:600; color:var(--m-ink-2); text-align:center; line-height:1.15; cursor:pointer;
}
.toggle-btn small,.model-switch small{ display:none; }
.toggle-btn.active,.model-switch .active,.leads-models .active{
  background:var(--m-card); color:var(--m-ink); box-shadow:0 1px 3px rgba(0,0,0,.12);
}

button,.btn,.btn-primary,.btn-secondary,.cta-btn,.modal-submit,
.agency-btn,.ip-main-btn,.dev-btn,input[type=submit],a.btn-open{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:46px; padding:0 18px; border:0; border-radius:13px;
  font-family:inherit; font-size:15.5px; font-weight:600; line-height:1.2;
  text-align:center; cursor:pointer; background:rgba(120,120,128,.12);
  color:var(--m-ink); text-decoration:none;
}
.btn-primary,.cta-btn,.modal-submit,.agency-btn,.ip-main-btn,
.dev-btn,button[type=submit],input[type=submit]{ background:var(--m-accent); color:#fff; }
.btn-danger{ background:#DC2626; color:#fff; }
button:active,.btn:active{ opacity:.7; }

input[type=text],input[type=email],input[type=password],input[type=number],
input[type=search],input[type=tel],input[type=date],select,textarea{
  width:100%; min-height:46px; padding:12px 14px; border:.5px solid var(--m-line);
  border-radius:12px; background:var(--m-card); color:var(--m-ink);
  font-family:inherit; font-size:16px; appearance:none; outline:none;
}
select{ padding-right:38px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238A8E99' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 13px center; }
label{ display:block; font-size:14px; color:var(--m-ink-2); margin-bottom:6px; }
table{ display:block; width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; font-size:14px; }

.seo-block{ margin-top:22px; padding-top:20px; border-top:.5px solid var(--m-line); }
.seo-block h2{ font-size:22px; }
.seo-lead{ font-size:15.5px; }
.seo-faq h3{ font-size:16px; margin:18px 0 10px; }
.seo-faq details{ background:var(--m-card); border:0; border-radius:14px; padding:14px 15px; margin-bottom:8px; }
.seo-faq summary{ display:flex; align-items:center; justify-content:space-between; gap:12px;
  font-size:15.5px; font-weight:600; color:var(--m-ink); list-style:none; cursor:pointer; }
.seo-faq summary::-webkit-details-marker{ display:none; }
.seo-faq summary::after{ content:"+"; color:var(--m-ink-3); font-size:19px; }
.seo-faq details[open] summary::after{ content:"−"; }
.seo-faq details p{ margin:10px 0 0; font-size:14.5px; }
.seo-links{ display:flex; gap:8px; margin:18px calc(var(--m-pad)*-1) 0;
  padding:0 var(--m-pad) 2px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.seo-links::-webkit-scrollbar{ display:none; }
.seo-links span{ flex:0 0 auto; align-self:center; font-size:13px; color:var(--m-ink-3); }
.seo-links a{ flex:0 0 auto; white-space:nowrap; background:var(--m-card); color:var(--m-ink-2);
  padding:8px 14px; border-radius:100px; font-size:13.5px; font-weight:600; }
.seo-kw{ font-size:11px; color:var(--m-ink-3); margin-top:14px; }

.about-block{ margin:20px calc(var(--m-pad)*-1); padding:22px var(--m-pad);
  background:var(--m-card); border:0; border-radius:0;
  border-top:.5px solid var(--m-line); border-bottom:.5px solid var(--m-line); }
.about-block::before{ content:""; display:block; height:3px; margin:-22px calc(var(--m-pad)*-1) 18px;
  background:linear-gradient(90deg,#4F46E5,#0E9BA8 34%,#E2643B 68%,#8B5CF6); }
.about-kicker{ display:inline-block; margin-bottom:12px; padding:6px 13px; border-radius:100px;
  background:var(--m-accent-soft); color:var(--m-accent); font-size:11px; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; }
.about-block h2{ font-size:23px; }
.about-block .seo-grid{ display:block; }
.about-block .seo-card{ background:none; box-shadow:none; border-radius:0;
  border-bottom:.5px solid var(--m-line); padding:14px 0; }
.about-block .seo-card:last-child{ border-bottom:0; }
.about-block .seo-card h3{ font-size:16px; }
.about-block .seo-card p{ font-size:14.5px; margin:0; }

.hf-band{ margin:0 calc(var(--m-pad)*-1) 20px; padding:22px var(--m-pad);
  background:var(--m-card); border-radius:0;
  border-top:.5px solid var(--m-line); border-bottom:.5px solid var(--m-line); }
.hf-band h2{ font-size:21px; }
.hf-nums{ display:grid; grid-template-columns:1fr 1fr; margin-top:16px; border-top:.5px solid var(--m-line); }
.hf-num{ padding:14px 0; }
.hf-num:nth-child(odd){ border-right:.5px solid var(--m-line); padding-right:14px; }
.hf-num:nth-child(even){ padding-left:16px; }
.hf-num b{ display:block; font-size:24px; font-weight:800; letter-spacing:-.04em; }
.hf-num span{ display:block; font-size:12px; color:var(--m-ink-3); margin-top:5px; }

/* ---------------------------------------------------------------
   МОДАЛКИ
   По умолчанию скрыты. Показываются только классом .active/.show
   или инлайновым display:flex, который ставит скрипт.
   --------------------------------------------------------------- */
.modal,.custom-modal,.request-modal,.rules-modal,.auth-modal,
#loginModal,#registerModal,#depositModal,#passwordModal,
#rulesModal,#requestModal,#productModal,#checkoutModal{
  display:none;
  position:fixed; inset:0; z-index:99999;
  align-items:flex-end; justify-content:center;
  background:rgba(0,0,0,.4);
}
.modal.show,.modal.active,
.custom-modal.show,.custom-modal.active,
.request-modal.active,.rules-modal.active,.auth-modal.active,
#loginModal.active,#registerModal.active,
#depositModal.active,#passwordModal.active,
#rulesModal.show,#rulesModal.active,
#requestModal.active,#productModal.active,#checkoutModal.active{
  display:flex;
}
.modal-box,.custom-modal-content,.request-modal-content,.rules-box,.modal-content{
  position:relative; width:100%; max-width:100%; max-height:90vh; overflow:auto;
  padding:12px 18px calc(20px + var(--m-safe-b)); background:var(--m-card);
  border:0; border-radius:var(--m-r-lg) var(--m-r-lg) 0 0; box-shadow:0 -8px 40px rgba(0,0,0,.22);
}
.modal-box::before,.custom-modal-content::before,
.request-modal-content::before,.rules-box::before{
  content:""; display:block; width:38px; height:5px; border-radius:99px;
  background:rgba(60,60,67,.24); margin:0 auto 14px;
}
.modal-close,.request-close,.rules-close,.close{
  position:absolute; top:14px; right:16px; width:30px; height:30px; border-radius:50%;
  background:rgba(120,120,128,.14); color:var(--m-ink); display:grid; place-items:center;
  font-size:19px; line-height:1; cursor:pointer; z-index:5;
}
.modal-actions{ position:sticky; bottom:0; margin-top:14px;
  padding:12px 0 calc(4px + var(--m-safe-b)); background:var(--m-card); border-top:.5px solid var(--m-line); }
.modal-actions button,.modal-actions a{ width:100%; }
.rules-content,.rules-content *{ color:var(--m-ink-2); font-size:15px; }
.rules-content h3,.rules-content h4{ color:var(--m-accent); font-size:16px; }

.dr{ position:fixed; left:0; right:0; bottom:0; z-index:90; max-height:86vh; overflow:auto;
  padding:8px 18px calc(18px + var(--m-safe-b)); background:var(--m-card);
  border-radius:var(--m-r-lg) var(--m-r-lg) 0 0;
  transform:translateY(102%); transition:transform .4s cubic-bezier(.22,1,.36,1); }
.dr.on{ transform:none; }
.dr-grab{ width:38px; height:5px; border-radius:99px; background:rgba(60,60,67,.24); margin:6px auto 14px; }
.dr a{ display:flex; align-items:center; justify-content:space-between; padding:15px 2px;
  font-size:17px; font-weight:600; color:var(--m-ink); text-decoration:none;
  border-bottom:.5px solid var(--m-line); }
.dr a span{ color:var(--m-ink-3); font-size:15px; font-weight:400; }
.dr-acts{ display:grid; gap:9px; margin-top:16px; }
.dr-scrim{ position:fixed; inset:0; z-index:88; background:rgba(0,0,0,.4);
  opacity:0; pointer-events:none; transition:opacity .3s; }
.dr-scrim.on{ opacity:1; pointer-events:auto; }

.dock{ position:fixed; left:12px; right:12px; bottom:calc(10px + var(--m-safe-b)); z-index:60;
  display:flex; gap:8px; padding:8px; background:rgba(255,255,255,.88);
  -webkit-backdrop-filter:saturate(180%) blur(22px); backdrop-filter:saturate(180%) blur(22px);
  border:.5px solid var(--m-line); border-radius:19px; box-shadow:0 8px 30px rgba(0,0,0,.12);
  transform:translateY(140%); transition:transform .4s cubic-bezier(.22,1,.36,1); }
.dock.on{ transform:none; }
.dock > *{ flex:1 1 0; min-width:0; min-height:44px; font-size:15px; padding:0 10px; }

.ft-site{ background:var(--m-card); border-top:.5px solid var(--m-line); margin-top:24px; }
.ft-wrap{ display:grid; gap:22px; padding:24px var(--m-pad) 18px; }
.ft-logo{ display:inline-flex; align-items:center; gap:8px; font-size:17px; font-weight:800;
  color:var(--m-ink); text-decoration:none; }
.ft-logo i{ width:26px; height:26px; border-radius:8px; background:var(--m-ink); color:#fff;
  display:grid; place-items:center; font-style:normal; font-size:12px; }
.ft-logo em{ font-style:normal; color:var(--m-accent); }
.ft-brand p{ font-size:14.5px; margin-top:10px; }
.ft-col{ display:flex; flex-direction:column; gap:2px; }
.ft-col h4{ font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--m-ink-3); margin:0 0 6px; }
.ft-col a{ font-size:16px; color:var(--m-ink-2); padding:7px 0; }
.ft-contact{ display:flex; align-items:flex-start; gap:11px; padding:6px 0; }
.ft-ic{ width:30px; height:30px; border-radius:9px; background:var(--m-bg); color:var(--m-accent);
  display:grid; place-items:center; flex:0 0 30px; }
.ft-contact span:last-child{ display:flex; flex-direction:column; font-size:15px; color:var(--m-ink); }
.ft-contact b{ font-size:11px; font-weight:600; color:var(--m-ink-3); }
.ft-cta{ width:100%; margin-top:10px; }
.ft-bottom{ display:grid; gap:5px; padding:16px var(--m-pad) calc(16px + var(--m-safe-b));
  border-top:.5px solid var(--m-line); font-size:12.5px; color:var(--m-ink-3); }

@media(max-width:380px){
  .agency-grid,.dev-grid,.ip-benefits,.orders-grid,.cards-grid,
  .pay-grid,.products-grid,.geo-grid,.leads-grid,.ads-grid,
  .enterprise-columns,.country-list{ grid-template-columns:1fr; }
  .hf-h1{ font-size:27px; }
}
@media(prefers-reduced-motion:reduce){ *{ animation:none !important; transition:none !important; } }


/* ---------------------------------------------------------------
   Окна входа и регистрации: в разметке у них нет класса,
   только id — поэтому оформляем их отдельно.
   --------------------------------------------------------------- */
#loginModal > div,#registerModal > div,
#depositModal > div,#passwordModal > div{
  position:relative;
  width:100%; max-width:100%;
  max-height:90vh; overflow:auto;
  margin:0;
  padding:12px 18px calc(22px + var(--m-safe-b));
  background:var(--m-card);
  border:0; border-radius:var(--m-r-lg) var(--m-r-lg) 0 0;
  box-shadow:0 -8px 40px rgba(0,0,0,.22);
}
#loginModal > div::before,#registerModal > div::before,
#depositModal > div::before,#passwordModal > div::before{
  content:""; display:block; width:38px; height:5px;
  border-radius:99px; background:rgba(60,60,67,.24); margin:0 auto 16px;
}
#loginModal h2,#registerModal h2,
#loginModal h3,#registerModal h3{
  font-size:21px; font-weight:700; color:var(--m-ink); margin:0 0 16px;
}
#loginModal form,#registerModal form{ display:grid; gap:10px; }
#loginModal input,#registerModal input{ margin:0; }
#loginModal .auth-error,#registerModal .auth-error,
.auth-error{
  background:#FDECEC; color:#9B1C1C;
  border:0; border-radius:12px;
  padding:12px 14px; font-size:14px; margin:0 0 4px;
}
#loginModal p,#registerModal p{ font-size:14.5px; text-align:center; margin:12px 0 0; }

/* ---------------------------------------------------------------
   Элементы, которые раньше прятались страничными стилями.
   Страничные стили на телефоне отключены, поэтому прячем здесь.
   --------------------------------------------------------------- */
.ads-modal,.agency-modal,.dev-modal,.ip-modal,.order-modal,
.search-dropdown,.filter-desc,.ta-sidebar-close,.topbar-burger,
.marquee-mask-target{
  display:none;
}

/* модалки модулей — те же шторки снизу */
.ads-modal.active,.agency-modal.active,.dev-modal.active,
.ip-modal.active,.order-modal.active,
.ads-modal.show,.agency-modal.show,.dev-modal.show,
.ip-modal.show,.order-modal.show{
  display:flex;
  position:fixed; inset:0; z-index:99999;
  align-items:flex-end; justify-content:center;
  background:rgba(0,0,0,.4);
}
.ads-modal > div,.agency-modal > div,.dev-modal > div,
.ip-modal > div,.order-modal > div{
  position:relative;
  width:100%; max-width:100%;
  max-height:90vh; overflow:auto;
  padding:12px 18px calc(22px + var(--m-safe-b));
  background:var(--m-card);
  border:0; border-radius:var(--m-r-lg) var(--m-r-lg) 0 0;
  box-shadow:0 -8px 40px rgba(0,0,0,.22);
}
.ads-modal > div::before,.agency-modal > div::before,
.dev-modal > div::before,.ip-modal > div::before,
.order-modal > div::before{
  content:""; display:block; width:38px; height:5px;
  border-radius:99px; background:rgba(60,60,67,.24); margin:0 auto 16px;
}

/* выпадающий поиск */
.search-dropdown.active,.search-dropdown.show{
  display:block;
  position:absolute; left:0; right:0; top:100%;
  z-index:70; margin-top:6px;
  background:var(--m-card); border-radius:14px;
  box-shadow:0 8px 30px rgba(0,0,0,.14);
  max-height:60vh; overflow:auto;
}

/* ===============================================================
   КАРТОЧКИ МОДУЛЕЙ — по реальным классам из разметки
   Один вид для всех: рамка, отступы, ровная кнопка снизу.
   =============================================================== */

/* --- общая сетка: две в ряд --- */
.agency-grid,.ip-benefits,.ads-line-grid,.dev-grid,
.crm-grid,.country-grid,.leads-grid,.orders-grid,.products-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:0 0 18px;
  padding:0;
  list-style:none;
}

/* --- общая карточка --- */
.agency-item,.ip-benefit,.ads-line-item,.dev-card,
.crm-card,.country-card,.lead-card,.product-card{
  display:flex;
  flex-direction:column;
  min-width:0;
  background:var(--m-card);
  border:.5px solid var(--m-line);
  border-radius:var(--m-r);
  box-shadow:0 1px 2px rgba(0,0,0,.04);
  padding:13px;
  margin:0;
  overflow:hidden;
}

/* заголовки и текст внутри карточек — мельче, чтобы влезали в половину экрана */
.agency-item h3,.agency-item-head,.ip-benefit h3,.ads-line-item h3,
.dev-card h3,.dev-card-inner h3,.product-card h3{
  font-size:14.5px; font-weight:700; line-height:1.25;
  margin:0 0 6px; color:var(--m-ink);
}
.agency-item p,.ip-benefit p,.ads-line-item p,.dev-desc,
.ads-line-sub,.agency-meta,.dev-meta{
  font-size:12.5px; line-height:1.38; color:var(--m-ink-2); margin:0 0 8px;
}
.agency-item li,.ip-benefit li,.dev-features li,.ads-line-item li{
  font-size:12.5px; line-height:1.4; margin-bottom:4px;
}
.dev-features,.ads-line-card ul{ list-style:none; padding:0; margin:0 0 10px; }

.ip-icon,.ads-icon,.dev-icon{ font-size:22px; line-height:1; margin-bottom:8px; }
.agency-pill,.ads-badge,.crm-tag{
  display:inline-flex; align-items:center; align-self:flex-start;
  padding:3px 9px; border-radius:100px;
  background:var(--m-accent-soft); color:var(--m-accent);
  font-size:10.5px; font-weight:700; margin-bottom:6px;
}

/* цена */
.crm-price,.ads-price-line,.agency-price{
  font-size:15px; font-weight:700; color:var(--m-accent); margin:6px 0 8px;
}

/* --- кнопка всегда внизу и одинаковая --- */
.agency-btn,.ip-main-btn,.dev-btn,.ads-line-button,
.lead-buy-btn,.btn-full,.crm-card .btn-primary{
  margin-top:auto;
  width:100%;
  min-height:42px;
  padding:0 10px;
  font-size:13px;
  line-height:1.2;
  white-space:normal;
  border-radius:11px;
}

/* --- широкие карточки на всю ширину --- */
.crm-card,.dev-card.wide,.ads-line-card{ grid-column:1 / -1; }

/* CRM — крупнее, во всю ширину, список с разделителями */
.crm-card{ padding:17px; }
.crm-card h3,.crm-card .crm-title{ font-size:18px; margin-bottom:4px; }
.crm-subtitle{ font-size:13.5px; color:var(--m-ink-2); margin:0 0 12px; }
.crm-features{ list-style:none; padding:0; margin:0 0 12px; }
.crm-features li{
  font-size:14px; padding:8px 0; margin:0; color:var(--m-ink-2);
  border-bottom:.5px solid var(--m-line);
}
.crm-features li:last-child{ border-bottom:0; }
.crm-meta{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
.crm-card .btn-primary{ font-size:15px; min-height:46px; }

/* верхний блок CRM */
.hero-card,.crm-hero{
  background:var(--m-card); border:.5px solid var(--m-line);
  border-radius:var(--m-r); padding:16px; margin:0 0 14px;
}
.hero-description{ font-size:14.5px; color:var(--m-ink-2); }

/* --- платежи: страны --- */
.country-card{ padding:13px 14px; }
.country-percent{ font-size:15px; font-weight:700; color:var(--m-accent); margin-top:4px; }
.country-comment{
  margin-top:7px; padding:5px 8px; border-radius:8px;
  background:var(--m-warn-bg); color:var(--m-warn);
  font-size:11px; line-height:1.3;
}
.country-name{ font-size:15px; font-weight:700; color:var(--m-ink); line-height:1.25; }
/* кнопка прижата к низу — в соседних карточках встаёт на одну линию */
.country-btn{
  margin-top:auto; width:100%; min-height:40px; padding:0 8px;
  background:var(--m-accent); color:#fff;
  font-size:13px; border-radius:11px; white-space:normal;
}
/* отступ между текстом и кнопкой (margin-top:auto в самой высокой карточке равен нулю) */
.country-card > :nth-last-child(2){ margin-bottom:12px; }

/* окно запроса реквизитов (#modal на странице оплаты) */
#modal .modal-title,#rulesModal .modal-title{ font-size:19px; font-weight:700; color:var(--m-ink); margin:0 0 6px; }
#modal .modal-sub{ font-size:14.5px; color:var(--m-ink-2); margin:0 0 14px; }
#modal .form-grid{ display:grid; gap:12px; }
#modal .field input:not([type]),#modal .field input[type=text]{
  width:100%; min-height:46px; padding:12px 14px; border:.5px solid var(--m-line);
  border-radius:12px; background:var(--m-card); color:var(--m-ink);
  font-family:inherit; font-size:16px; appearance:none; outline:none;
}
#modal .field input[type=file]{ width:100%; font-size:14px; }
#modal .modal-actions{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
#modal .modal-actions button:only-child{ grid-column:1 / -1; }
#modal .btn-gold,#rulesModal .btn-gold{ background:var(--m-accent); color:#fff; }
#modal .prebox{
  white-space:pre-wrap; font-size:15px; color:var(--m-ink);
  background:var(--m-bg); border-radius:12px; padding:12px 14px; margin:0 0 4px;
  -webkit-user-select:text; user-select:text;
}
#modal .paid-wrap{ text-align:center; }
#modal .paid-icon{ width:56px; height:56px; margin:4px auto 10px; border-radius:50%;
  background:#DCFCE7; color:#15803D; display:grid; place-items:center; font-size:28px; font-weight:800; }
#modal .paid-title{ font-size:19px; font-weight:700; }
#modal .paid-amount{ font-size:24px; font-weight:800; color:var(--m-accent); margin:6px 0 10px; }
#modal .paid-proof img{ border-radius:12px; }

/* --- лиды --- */
.lead-card{ padding:14px; }
.lead-card div,.lead-card p{ font-size:13px; line-height:1.5; }
.filter-buttons{
  display:flex; gap:6px; overflow-x:auto; -webkit-overflow-scrolling:touch;
  scrollbar-width:none; margin:0 0 14px; padding-bottom:2px;
}
.filter-buttons::-webkit-scrollbar{ display:none; }
.filter-btn{
  flex:0 0 auto; min-height:36px; padding:0 14px;
  border-radius:100px; border:.5px solid var(--m-line);
  background:var(--m-card); color:var(--m-ink-2);
  font-size:13px; font-weight:600; white-space:nowrap;
}
.filter-btn.active{ background:var(--m-accent); color:#fff; border-color:transparent; }

/* верх страницы лидов — в один столбец */
.hero-left,.hero-right{ width:100%; max-width:100%; }
.leads-hero-grid{ display:block; }

/* --- IP-телефония и реклама: нижняя кнопка отдельно --- */
.ip-bottom-cta,.ads-bottom-cta{ margin:4px 0 18px; }
.ip-bottom-cta .btn-primary,.ip-main-btn{ width:100%; min-height:46px; font-size:15px; }

/* --- разработка --- */
.dev-card-inner{ display:flex; flex-direction:column; height:100%; }
.dev-header,.glass-hero{ background:none; border:0; padding:0; margin:0 0 14px; }

/* --- на узких экранах в один столбец --- */
@media(max-width:390px){
  /* .country-grid сюда не входит: карточки стран короткие
     и влезают по две даже на 320px */
  .agency-grid,.ip-benefits,.ads-line-grid,.dev-grid,
  .leads-grid,.orders-grid,.products-grid{
    grid-template-columns:1fr;
  }
  .agency-item h3,.ip-benefit h3,.ads-line-item h3,.dev-card h3{ font-size:15.5px; }
  .agency-item p,.ip-benefit p,.ads-line-item p,.dev-desc{ font-size:13.5px; }
  .agency-btn,.ip-main-btn,.dev-btn,.ads-line-button{ font-size:14px; min-height:46px; }
}

/* ===============================================================
   АНИМАЦИИ — жили в home-f.css, который на телефоне отключён
   =============================================================== */

/* слово в заголовке: подложка меняет цвет, слово перелистывается */
.hf-sw{
  position:relative;
  display:inline-block;
  padding:0 .12em;
  border-radius:9px;
  color:#fff;
  overflow:hidden;
  vertical-align:baseline;
  z-index:0;
}
.hf-sw i{ font-style:normal; display:block; }
.hf-sw::before{
  content:""; position:absolute; inset:0; z-index:-1;
  border-radius:9px; background:#4F46E5;
  animation:hfHue 16s infinite;
}
@keyframes hfHue{
  0%,24%  { background:#4F46E5; }
  25%,49% { background:#0F9D74; }
  50%,74% { background:#E2643B; }
  75%,100%{ background:#2563EB; }
}

/* бегущая строка услуг */
.hf-track{ animation:hfSlide 34s linear infinite; }
@keyframes hfSlide{ to{ transform:translateX(-50%); } }

/* карточки главной проявляются */
.hf-card{ opacity:1; transform:none; }

@media(prefers-reduced-motion:reduce){
  .hf-sw::before,.hf-track{ animation:none; }
  .hf-sw::before{ background:#4F46E5; }
}

/* ===============================================================
   БЛОК «О ПЛАТФОРМЕ» — рамка налезала на текст
   =============================================================== */
.about-block{ overflow:hidden; }
.about-block .seo-grid{ display:block; }
.about-block .seo-card{
  background:none;
  border:0;
  border-bottom:.5px solid var(--m-line);
  border-radius:0;
  box-shadow:none;
  padding:14px 0;
  margin:0;
  overflow:visible;
}
.about-block .seo-card:last-child{ border-bottom:0; }
.about-block .seo-card h3{ font-size:15.5px; margin:0 0 6px; }
.about-block .seo-card p{ font-size:14px; margin:0; }

/* ===============================================================
   ПОДВАЛ: кнопка была нечитаемой — «.ft-col a» перебивал «.btn-primary»
   =============================================================== */
.ft-col a.btn-primary,
.ft-col a.ft-cta,
a.ft-cta{
  background:var(--m-accent);
  color:#fff;
  min-height:48px;
  border-radius:13px;
  font-size:15.5px;
  font-weight:600;
  justify-content:center;
  padding:0 18px;
}

/* ===============================================================
   COOKIE — выводился под подвалом простым блоком
   =============================================================== */
.cookie-banner{
  position:fixed;
  left:10px; right:10px;
  bottom:calc(10px + var(--m-safe-b));
  /* ниже окон (99999): открытое окно должно быть над баннером,
     иначе баннер закрывает кнопки внизу шторки */
  z-index:99990;
  background:var(--m-card);
  border:.5px solid var(--m-line);
  border-radius:var(--m-r-lg);
  box-shadow:0 12px 40px rgba(0,0,0,.18);
  padding:16px 16px calc(16px + var(--m-safe-b));
  max-height:70vh;
  overflow:auto;
}
.cookie-banner[hidden],
.cookie-banner.is-hidden,
.cookie-banner.hidden{ display:none; }
.cookie-banner__inner{ display:block; }
.cookie-banner__icon{ font-size:22px; margin-bottom:6px; }
.cookie-banner__text{ font-size:13.5px; line-height:1.45; color:var(--m-ink-2); }
.cookie-banner__text strong,
.cookie-banner h3,.cookie-banner h4{
  display:block; font-size:15.5px; font-weight:700;
  color:var(--m-ink); margin-bottom:6px;
}
.cookie-banner__link{ color:var(--m-accent); }
.cookie-banner__actions{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:14px; }
.cookie-banner__actions button,
.cookie-banner__actions a{ width:100%; min-height:44px; font-size:14.5px; }

/* когда куки видны — док не перекрывает их */
body:has(.cookie-banner:not([hidden])) .dock{ bottom:calc(110px + var(--m-safe-b)); }

/* ===============================================================
   СОСТОЯНИЯ ПО УМОЛЧАНИЮ
   Эти элементы прятались страничными стилями. Без них они висели
   на экране постоянно: куки на каждой вкладке, «Загрузка...» под
   подвалом, форма покупки лидов вместо всплывающего окна.
   =============================================================== */

/* --- cookie: показывается только классом .show --- */
.cookie-banner{ display:none; }
.cookie-banner.show{ display:block; }

/* --- глобальный лоадер: только с классом .active --- */
.global-loader{
  display:none;
  position:fixed; inset:0; z-index:100001;
  align-items:center; justify-content:center;
  background:rgba(11,11,15,.55);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
}
.global-loader.active{ display:flex; }
.loader-box{
  display:flex; flex-direction:column; align-items:center; gap:12px;
  padding:22px 26px; border-radius:var(--m-r-lg);
  background:var(--m-card); box-shadow:0 12px 40px rgba(0,0,0,.25);
}
.loader-spinner{
  width:26px; height:26px; border-radius:50%;
  border:2.5px solid var(--m-line); border-top-color:var(--m-accent);
  animation:mSpin .8s linear infinite;
}
@keyframes mSpin{ to{ transform:rotate(360deg); } }
.loader-text{ font-size:14.5px; color:var(--m-ink-2); }

/* --- окно покупки лида: шторка снизу, а не блок в потоке --- */
.lead-modal{
  display:none;
  position:fixed; inset:0; z-index:99999;
  align-items:flex-end; justify-content:center;
  background:rgba(0,0,0,.4);
}
.lead-modal.active,.lead-modal.show{ display:flex; }
.lead-modal-box{
  position:relative;
  width:100%; max-width:100%;
  max-height:90vh; overflow:auto;
  padding:12px 18px calc(22px + var(--m-safe-b));
  background:var(--m-card);
  border:0; border-radius:var(--m-r-lg) var(--m-r-lg) 0 0;
  box-shadow:0 -8px 40px rgba(0,0,0,.22);
}
.lead-modal-box::before{
  content:""; display:block; width:38px; height:5px;
  border-radius:99px; background:rgba(60,60,67,.24); margin:0 auto 16px;
}
.lead-modal-box .lead-buy-btn,
.lead-modal-box button{ width:100%; margin-top:8px; }
.lead-modal-box label{ display:flex; align-items:center; gap:8px; margin:10px 0; }
.lead-modal-box input[type=number]{ width:100%; }

/* ===============================================================
   ТЕКСТ НЕ ВЫХОДИТ ЗА РАМКУ КАРТОЧКИ
   =============================================================== */
.agency-item,.ip-benefit,.ads-line-item,.dev-card,
.crm-card,.country-card,.lead-card,.product-card,
.agency-item *,.ip-benefit *,.ads-line-item *,.dev-card *,
.crm-card *,.country-card *,.lead-card *,.product-card *{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:normal;
}
.lead-card pre,.lead-card code,
.crm-card pre,.crm-card code{ white-space:pre-wrap; }

/* описание услуги под карточками */
.seo-block,.seo-block *{ max-width:100%; overflow-wrap:anywhere; }

/* --- окно заявки (req-modal): тоже шторка снизу --- */
.req-modal-overlay{
  display:none;
  position:fixed; inset:0; z-index:99999;
  align-items:flex-end; justify-content:center;
  background:rgba(0,0,0,.4);
}
.req-modal-overlay.active,.req-modal-overlay.show{ display:flex; }
.req-modal,.req-modal-box{
  position:relative;
  width:100%; max-width:100%;
  max-height:90vh; overflow:auto;
  padding:12px 18px calc(22px + var(--m-safe-b));
  background:var(--m-card);
  border:0; border-radius:var(--m-r-lg) var(--m-r-lg) 0 0;
  box-shadow:0 -8px 40px rgba(0,0,0,.22);
}
.req-modal-body{ font-size:14.5px; color:var(--m-ink-2); }

/* --- элементы с классом hidden --- */
.hidden,[hidden]{ display:none !important; }
.tmodal{
  display:none;
  position:fixed; inset:0; z-index:99999;
  align-items:flex-end; justify-content:center;
  background:rgba(0,0,0,.4);
}
.tmodal.active,.tmodal.show{ display:flex; }
.tmodal.hidden{ display:none !important; }

/* ===============================================================
   МЕНЮ ПОЛЬЗОВАТЕЛЯ (по аватару)
   =============================================================== */
.um-scrim{ position:fixed; inset:0; z-index:94; background:rgba(0,0,0,.18);
  opacity:0; pointer-events:none; transition:opacity .2s; }
.um-scrim.on{ opacity:1; pointer-events:auto; }
.um{
  position:fixed; top:62px; right:12px; z-index:95;
  width:min(300px, calc(100vw - 24px)); max-height:calc(100vh - 80px); overflow:auto;
  background:var(--m-card); border:.5px solid var(--m-line); border-radius:18px;
  box-shadow:0 18px 50px rgba(0,0,0,.18); padding:14px;
  opacity:0; transform:translateY(-6px) scale(.98); transform-origin:top right;
  pointer-events:none; visibility:hidden;
  transition:opacity .18s, transform .18s, visibility 0s .18s;
}
.um.on{ opacity:1; transform:none; pointer-events:auto; visibility:visible;
  transition:opacity .18s, transform .18s; }
.um-head{ display:flex; align-items:center; gap:11px; margin-bottom:12px; }
.um-ava{ width:40px; height:40px; flex:0 0 40px; border-radius:50%; background:var(--m-accent);
  color:#fff; display:grid; place-items:center; font-weight:700; font-size:16px; }
.um-who{ display:flex; flex-direction:column; min-width:0; }
.um-who b{ font-size:15.5px; color:var(--m-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.um-who span{ font-size:13px; color:var(--m-ink-3); }
.um-who strong{ color:var(--m-ink); }
.um-topup{ display:flex; align-items:center; justify-content:center; min-height:44px;
  border-radius:12px; background:var(--m-accent); color:#fff; font-weight:600; font-size:15px; margin-bottom:6px; }
.um-list{ display:flex; flex-direction:column; }
.um-list a{ display:flex; align-items:center; justify-content:space-between;
  min-height:46px; padding:0 2px; font-size:15.5px; color:var(--m-ink);
  border-bottom:.5px solid var(--m-line); }
.um-list a::after{ content:"›"; color:var(--m-ink-3); font-size:20px; line-height:1; }
.um-out{ display:flex; align-items:center; min-height:46px; padding:0 2px;
  font-size:15.5px; font-weight:600; color:#DC2626; }

/* ===============================================================
   КАБИНЕТ — общие элементы
   =============================================================== */
.stats-block h2,.orders-header h2,.requests-top h1{ font-size:26px; font-weight:800; margin:4px 0 12px; }
.requests-top p{ font-size:14.5px; margin-bottom:14px; }

/* статусы: одна палитра на все три раздела */
.req-badge,.request-status,.status-badge,.mobile-card-value.status{
  display:inline-flex; align-items:center; align-self:flex-start;
  padding:4px 9px; border-radius:100px; font-size:11px; font-weight:700;
  letter-spacing:.02em; background:rgba(120,120,128,.12); color:var(--m-ink-2);
  white-space:nowrap;
}
.mobile-card-value.status.paid,.status-badge.status-paid,.request-status.status-active{ background:#DCFCE7; color:#15803D; }
.mobile-card-value.status.pending,.status-badge.status-pending,.request-status.status-pending,
.request-status.status-client_accepted{ background:var(--m-warn-bg); color:var(--m-warn); }
.mobile-card-value.status.requisites_ready,.request-status.status-crm_offer,
.status-badge.status-new{ background:var(--m-accent-soft); color:var(--m-accent); }
.mobile-card-value.status.check_uploaded{ background:#E0F2FE; color:#0369A1; }
.mobile-card-value.status.rejected,.request-status.status-rejected{ background:#FEE2E2; color:#B91C1C; }

/* ===============================================================
   МОИ ЗАПРОСЫ (profile.php)
   =============================================================== */
.stats-grid{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:0 0 18px; }
.stats-grid > div{ display:flex; flex-direction:column; gap:4px; background:var(--m-card);
  border:.5px solid var(--m-line); border-radius:var(--m-r); padding:12px 13px; }
.stats-grid span{ font-size:12.5px; color:var(--m-ink-3); line-height:1.25; }
.stats-grid strong{ font-size:19px; font-weight:800; color:var(--m-ink); letter-spacing:-.02em; }
.stats-grid strong.green{ color:#15803D; }
.stats-grid strong.blue{ color:var(--m-accent); }

.filters{ display:flex; gap:4px; background:rgba(120,120,128,.10);
  border-radius:12px; padding:3px; margin:0 0 14px; }
.filters a{ flex:1 1 0; display:flex; align-items:center; justify-content:center;
  min-height:36px; border-radius:9px; font-size:13px; font-weight:600; color:var(--m-ink-2); }
.filters a.active{ background:var(--m-card); color:var(--m-ink); box-shadow:0 1px 3px rgba(0,0,0,.12); }

/* таблица на телефоне не нужна — есть карточки */
.table-wrapper,.requests-table{ display:none; }
.mobile-cards{ display:flex; flex-direction:column; gap:10px; }
.mobile-card{ background:var(--m-card); border:.5px solid var(--m-line);
  border-radius:var(--m-r); padding:4px 14px 14px; }
.mobile-card-row{ display:flex; align-items:center; justify-content:space-between; gap:12px;
  min-height:40px; border-bottom:.5px solid var(--m-line); }
.mobile-card-row:last-child{ border-bottom:0; }
.mobile-card-label{ font-size:13px; color:var(--m-ink-3); flex:0 0 auto; }
.mobile-card-value{ font-size:14.5px; font-weight:600; color:var(--m-ink); text-align:right; }
.mobile-card-value.green{ color:#15803D; }
.mobile-card-value.blue{ color:var(--m-accent); }
.mobile-card .btn-open-req{ width:100%; margin-top:10px; background:var(--m-accent); color:#fff; }
.mobile-cards > .u47{ padding:30px 10px !important; color:var(--m-ink-3); font-size:15px; }

/* окно запроса (#reqModal) */
.req-modal-header{ display:flex; align-items:center; justify-content:space-between;
  margin:0 0 12px; font-size:18px; font-weight:700; color:var(--m-ink); }
.req-modal-close{ width:30px; height:30px; min-height:0; padding:0; border-radius:50%;
  background:rgba(120,120,128,.14); font-size:14px; }
.req-modal-body .u49{ font-size:34px; }
.req-modal-body .u50{ font-size:17px; font-weight:700; color:var(--m-ink); }
.req-modal-body .u51{ font-size:14px; color:var(--m-ink-2); }
.req-modal-body .u52{ font-size:17px; font-weight:700; color:var(--m-ink); }
.req-modal-body .u53{ font-size:14px; color:var(--m-ink-2); }
.req-modal-body .u55{ font-size:17px; font-weight:700; color:var(--m-ink); }
.rm-section-title{ font-size:12.5px; color:var(--m-ink-3); margin:0 0 6px; }
.rm-requisites-box{ white-space:pre-wrap; background:var(--m-bg); border-radius:12px;
  padding:12px 14px; font-size:15px; color:var(--m-ink); -webkit-user-select:text; user-select:text; }
.rm-field{ margin:0 0 12px; }
.rm-field input[type=file]{ width:100%; font-size:14px; }
.rm-actions{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:14px; }
.rm-actions button:only-child{ grid-column:1 / -1; }
.rm-btn-primary{ background:var(--m-accent); color:#fff; }
.rm-paid-wrap{ text-align:center; }
.rm-paid-icon{ width:56px; height:56px; margin:4px auto 10px; border-radius:50%;
  background:#DCFCE7; color:#15803D; display:grid; place-items:center; font-size:28px; font-weight:800; }
.rm-paid-title{ font-size:18px; font-weight:700; }
.rm-paid-amount{ font-size:24px; font-weight:800; color:var(--m-accent); margin:6px 0 10px; }
.rm-paid-proof img{ border-radius:12px; }

/* ===============================================================
   ПОДПИСКИ (modules/requests)
   =============================================================== */
#requestsContainer{ display:flex; flex-direction:column; gap:10px; }
.request-card{ background:var(--m-card); border:.5px solid var(--m-line);
  border-radius:var(--m-r); padding:14px; }
.request-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.request-type{ font-size:12px; font-weight:800; letter-spacing:.04em; color:var(--m-ink-3); }
.request-body p{ display:flex; justify-content:space-between; gap:12px; margin:0;
  padding:8px 0; border-bottom:.5px solid var(--m-line); font-size:14px; color:var(--m-ink); }
.request-body p b{ font-weight:400; color:var(--m-ink-3); flex:0 0 auto; }
.request-actions .details-btn{ width:100%; margin-top:12px; background:var(--m-accent); color:#fff; }
.empty-state{ text-align:center; padding:30px 10px; }
.empty-state .empty-icon{ font-size:34px; margin-bottom:8px; }
.empty-state h2{ font-size:17px; color:var(--m-ink-2); }

/* содержимое окна подписки */
#requestModalBody .modal-info p{ display:flex; justify-content:space-between; gap:12px; margin:0;
  padding:8px 0; border-bottom:.5px solid var(--m-line); font-size:14px; color:var(--m-ink); }
#requestModalBody .modal-info p b{ font-weight:400; color:var(--m-ink-3); }
#requestModalBody h3{ font-size:18px; margin:0 0 12px; }
#requestModalBody input[type=number]{ background:var(--m-card) !important; border:.5px solid var(--m-line) !important; }
.sub-timer{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; margin:12px 0 0;
  padding:10px 12px; border-radius:12px; font-size:13.5px; background:var(--m-bg); }
.sub-timer .timer-text{ font-weight:700; }
.sub-timer .timer-date{ color:var(--m-ink-3); }
.sub-timer.timer-ok{ background:#DCFCE7; color:#15803D; }
.sub-timer.timer-warn{ background:var(--m-warn-bg); color:var(--m-warn); }
.sub-timer.timer-expired{ background:#FEE2E2; color:#B91C1C; }
.admin-reply-box,.admin-comment-box,.terms-box,.balance-box{
  margin:12px 0 0; padding:12px 13px; border-radius:12px; background:var(--m-bg);
  font-size:14px; color:var(--m-ink); white-space:normal; }
.admin-reply-header{ display:flex; align-items:center; gap:6px; margin-bottom:5px; }
.admin-reply-title,.admin-comment-title{ font-size:12.5px; font-weight:700; color:var(--m-ink-3); margin-bottom:4px; }
.admin-reply-text,.admin-comment-text{ white-space:pre-wrap; }
.balance-date{ font-size:12px; color:var(--m-ink-3); margin-top:4px; }
.request-payment{ margin-top:12px; }
.request-payment .status-wait,.request-payment .status-active,.request-payment .status-rejected{ font-size:14.5px; font-weight:700; }
.request-payment .status-wait{ color:var(--m-warn); }
.request-payment .status-active{ color:#15803D; }
.request-payment .status-rejected{ color:#B91C1C; }
.btn-group{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:12px; }
.btn-group button{ width:100%; font-size:14px; }

/* ===============================================================
   МОИ ЗАКАЗЫ (modules/my-orders)
   =============================================================== */
.orders-header{ margin-bottom:12px; }
.orders-filter{ display:flex; gap:6px; overflow-x:auto; -webkit-overflow-scrolling:touch;
  scrollbar-width:none; margin:0 calc(var(--m-pad)*-1); padding:0 var(--m-pad) 2px; }
.orders-filter::-webkit-scrollbar{ display:none; }
/* у заказов много строк — по одному в ряд на любой ширине */
.orders-grid{ grid-template-columns:1fr; }
.order-card{ display:flex; flex-direction:column; background:var(--m-card);
  border:.5px solid var(--m-line); border-radius:var(--m-r); padding:14px; }
.order-id{ font-size:17px; font-weight:800; color:var(--m-ink); margin-bottom:6px; }
.order-meta{ font-size:14px; line-height:1.75; color:var(--m-ink-2); }
.progress-bar{ height:6px; border-radius:99px; background:rgba(120,120,128,.16);
  overflow:hidden; margin:10px 0; }
.progress-fill{ height:100%; background:var(--m-accent); border-radius:99px; }
.order-card .status-badge{ margin:8px 0 0; text-transform:uppercase; }
.order-card .order-details-btn{ width:100%; margin-top:12px; background:var(--m-accent); color:#fff; }
.orders-grid > .empty{ grid-column:1 / -1; text-align:center; padding:30px 10px; color:var(--m-ink-3); }

/* окно заказа: кнопка «Закрыть» — обычная, не кружок в углу */
.order-modal-box .modal-close{ position:static; width:100%; height:auto; min-height:46px;
  border-radius:13px; margin-top:14px; font-size:15.5px; display:flex; }
#orderModalContent .u31{ font-size:18px; margin:0 0 12px !important; }
#orderModalContent .u32{ font-size:14.5px; line-height:1.8; color:var(--m-ink-2); }
#orderModalContent .u32 strong{ color:var(--m-ink); font-weight:600; }
#orderModalContent .u34{ background:var(--m-bg); border-radius:12px; }

/* ===============================================================
   ОКНА ИЗ ПАНЕЛИ ПРОФИЛЯ: пополнение, транзакции, пароль
   =============================================================== */
.custom-modal .modal-header{ display:flex; align-items:center; justify-content:space-between; margin:0 0 14px; }
.custom-modal .modal-header h3{ margin:0; font-size:18px; }
.custom-modal .modal-header .modal-close{ position:static; }
.quick-amounts{ display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin:0 0 10px; }
.quick-amounts button{ min-height:42px; padding:0; font-size:14.5px; }
.quick-amounts button.active{ background:var(--m-accent-soft); color:var(--m-accent); }
#depositModal form,#passwordModal form{ display:grid; gap:10px; }
.modal-submit{ width:100%; }
.transactions-list{ display:flex; flex-direction:column; }
.transaction-item{ display:flex; align-items:center; justify-content:space-between;
  min-height:46px; border-bottom:.5px solid var(--m-line); font-size:15px; font-weight:600; color:var(--m-ink); }
.transaction-item .status{ font-weight:600; }
.transactions-list .u11{ padding:24px 0; text-align:center; color:var(--m-ink-3); }

/* ===============================================================
   СТРАНИЦА ОПЛАТЫ (payments/pay.php) — отдельная страница без шапки
   =============================================================== */
.pay-page{ padding:16px var(--m-pad) calc(24px + var(--m-safe-b)); }
.pay-page .card{ background:var(--m-card); border:.5px solid var(--m-line);
  border-radius:var(--m-r-lg); padding:16px 16px 18px; margin-top:8px; }
.pay-page .back{ display:inline-flex; font-size:15px; margin-bottom:10px; }
.pay-page h2{ font-size:24px; margin:0 0 10px; }
.pay-page .row{ display:flex; align-items:center; justify-content:space-between; gap:12px;
  min-height:44px; border-bottom:.5px solid var(--m-line); font-size:14px; color:var(--m-ink-3); }
.pay-page .row span{ color:var(--m-ink); font-weight:600; font-size:15px; text-align:right; }
.pay-page form{ margin:0; }
.pay-page .pay-btn{ width:100%; margin-top:10px; background:var(--m-accent); color:#fff; }
.pay-page .pay-btn.balance-btn{ margin-top:16px; background:var(--m-ink); }
.pay-page .err{ margin-top:12px; padding:10px 12px; border-radius:12px; background:#FEE2E2; color:#B91C1C; font-size:14px; }

/* Trafford Pay: кнопка на странице оплаты заказа (сама страница счёта — payments/tpay/tpay.css) */
.pay-page .pay-btn.tp-btn{ background:var(--m-accent); }