/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/
:root {
  --primary: #2563eb;
  --primary-dark: #1d4ed8;
  --secondary: #f59e0b;
  --dark: #0f172a;
  --gray-900: #1e293b;
  --gray-700: #334155;
  --gray-500: #64748b;
  --gray-300: #cbd5e1;
  --gray-200: #e2e8f0;
  --gray-100: #f1f5f9;
  --gray-50: #f8fafc;
  --white: #ffffff;
  --success: #16a34a;
  --radius: 12px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.1);
  --shadow-lg: 0 10px 30px rgba(0,0,0,0.12);
  --transition: 0.25s ease;
}
body { font-size: 1rem; line-height: 1.5; }
h2 { font-size: 20px; margin: 0 0 1rem; position: relative; }
h2 i { color: #2563eb; margin-right: 10px; }
h3 { font-size: 1.25rem; margin: 0 0 16px; }
/* TABLE */
.tablecontainer { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; }
table, th, td { border: 1px solid #ddd; padding: 8px; text-align: left; }

/* BUTTON */
.my-btn{ display: inline-flex; align-items: center; justify-content: center; padding: 15px 28px; border-radius: 12px; background: var(--primary-dark); color: #fff; transition: var(--transition); font-weight: 600; }
.btn-main { background: var(--primary); }
.btn-main:hover {color: var(--white); transform: translateY(-3px); background: var(--primary-dark); }
.btn-outline { background: transparent; border: 2px solid var(--gray-300); color: var(--dark); font-weight: 500; padding: 14px 24px; text-decoration: none; }
.btn-outline:hover { border-color: var(--primary); color: var(--primary); transform: translateY(-3px); }
.mobile-menu-control-wrapper .menu-toggle { background-color: #2563eb; }
.main-navigation .menu-toggle, .main-navigation .menu-bar-items { color: #fff; }
.section-title { margin-bottom: 60px; }
.section-title h2 {
  /* font-size: clamp(30px,4vw,48px); */
  font-size: clamp(1.45rem,3.2vw,2.25rem);
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 20px;
}
.section-subtitle { color: var(--gray-500); font-size: 1.1rem; max-width: 700px; margin: 0 auto 0 0; }
@media screen and (max-width: 767px) { .section-title { margin-bottom: 40px; }	}
/* .decoration { font-size: clamp(1.5rem,3.5vw,2.5rem); font-weight: 500; margin: 0 0 1.25rem; position: relative; }
 */.title-highlight { color: var(--primary); }
.title-badge { display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px;  background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 999px; font-size: 14px; font-weight: 700; color: var(--primary); margin-bottom: 20px; }
/* #faq .faq-title::after, .decoration::after { content: ''; display: block; width: 60px; height: 4px; background: #2563eb; margin: 10px auto 0; border-radius: 2px;} */


/* == HEADER == */
 

/* === GRID === */
section { padding: 80px 0; }
@media screen and (max-width: 767px) { section { padding: 30px 0; }	}	
.html-container { width: min(1200px,92%); margin:0 auto; }
.grid { display:grid; gap:30px }
.grid-2 { grid-template-columns: repeat(2,1fr); gap: 30px; }
.grid-3 { grid-template-columns: repeat(3,1fr); gap: 30px; }
.grid-4 { grid-template-columns: repeat(4,1fr); gap: 20px; }
@media (max-width: 992px) {
  .grid.grid-2, .grid.grid-3, .grid.grid-4  {
    grid-template-columns: repeat(2,1fr);
  }
}
@media (max-width: 768px) {
  .grid.grid-2, .grid.grid-3, .grid.grid-4 {
    grid-template-columns: 1fr;
  }
}
/* === CARD === */
.card { display: flex; flex-direction: column; height: 100%; }
.card { background: var(--white); border-radius: var(--radius); box-shadow: 0 6px 18px rgba(16,24,40,0.06); padding: 30px; }
.card:hover { transform: translateY(-5px); }
.card h3 { font-size: 1.3rem; margin: 0 0 16px; font-weight: 700; }
.card-icon_box {}
/* .card-icon { width: 48px; height: 48px; margin-bottom: 15px; fill: #2563eb; } */
.card-icon { width: 64px; height: 64px; margin: 0 0 20px; background: #e0e7ff; padding: 14px; border-radius: 16px; }
.cart-header
.price-header h3 { margin-bottom: 15px; }
.card-title { font-weight: 700; margin-bottom: 10px; color: #1e293b; }
.card-description { font-size: 0.95rem; color: #64748b; }
.card-price { font-size: 22px; font-weight: 800; color: var(--dark); margin-bottom: 4px; }
.card-term { font-size: 13px; color: var(--gray-500); margin-bottom: 16px; }
.card-number { font-size: 3rem; font-weight: 800; color: rgba(37,99,235,.15); margin-bottom: 20px; }
.card-features { display: flex; flex-direction: column; gap: 10px; margin: 26px 0 0; }
.card-features { list-style: none; padding: 0; }
.card-features li { display: flex; gap: 18px; align-items: flex-start;}
.card-features li { font-size: 14px; color: var(--gray-700); padding-left: 22px; position: relative; }
.card-features.checked li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--success);
  font-weight: 700;
}
.card-info { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: auto;  }
.divider { height: 1px; background: var(--gray-300); margin: 45px 0; }
/* ICON BOX */
.icon-box {
  width: 56px;
  height: 56px;
  background: linear-gradient(135deg, var(--primary), #60a5fa);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  color: var(--white);
}

/* BACKGROUND */
.bg-light { background-color: #f8fafc; }

/* BOX */
.note_container {
    margin-top:60px;
}
.note-box {
   background: linear-gradient(135deg, #eff6ff, #ffffff);
   padding: 50px;
   border-radius: 30px;
   text-align: center;
   box-shadow: 0 10px 25px rgba(0, 0, 0, .05);
}
.note-info {
  border-radius: 24px;
  padding: 45px; 
  box-shadow: 0 10px 25px rgba(0,0,0,.05);
}
.note-info h3 { font-size: 1.3rem; font-weight: 600; }
.note-info.white { background: #ffffff; }
.note-info.grad { background: linear-gradient(135deg, #eff6ff, #ffffff); }
.note-box h3 { margin-bottom: 15px; }
.note-box p { max-width: 800px; margin: 0 auto 25px; }
@media(max-width:768px) {
    .note-box {
        padding: 35px 25px;
    }
}
#hero h1 {
  font-size: clamp(34px,5vw,58px);
  line-height: 1.1;
  margin: 0 0 28px;
  font-weight: 800;
}
.hero-badge { display: inline-block; padding: 6px 14px; background: rgba(37, 99, 235, 0.1); color: var(--primary); border-radius: 20px; font-size: 13px; font-weight: 600; margin-bottom: 20px; }

/* === ГЛАВНАЯ СТРАНИЦА === */
body.page-template-home {background-color: #fff; }
.home-page_hero { padding-top: 50px; }
.home-page_hero h1 span {
  color: var(--primary);
}
.hero_home .hero-item { position: relative; }
/*.hero_home .hero-item::before {
  content: "✓";
  position: absolute;
  left: 0;
  top3: .9rem;
  font-weight: 700;
  color: #22c55e;
}
*/
/* Для кого */
.home-page_consumer .card {
  padding: 30px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  box-shadow: none;
  transition: var(--transition);
}
.home-page_consumer .card:hover {
  border-color: var(--primary);
  box-shadow: var(--shadow-md);
}
.home-page_consumer .card-icon {
  width: 64px;
  height: 64px;
  margin: 0 0 20px 0;
  fill: #0f172a;
  background: #e0e7ff;
  padding: 14px;
  border-radius: 16px;
}
@media screen and (max-width: 767px) {
.home-page_consumer .card { text-align: center; }
}
/* Услуги */
.home-page_services .grid {
	gap: 24px;
}
.home-page_services .card {
	padding: 32px;
	border-radius: var(--radius);
	background: var(--white);
	border: 2px solid var(--gray-100);
	transition: var(--transition);
}
.home-page_services .card:hover {
	border-color: var(--primary);
	box-shadow: var(--shadow-md);
}
.home-page_services .icon-box {
	width: 56px;
	height: 56px;
	background: linear-gradient(135deg, var(--primary), #60a5fa);
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 20px;
	color: var(--white);
}
.home-page_services .card h3 {
	font-size: 20px;
	margin-bottom: 12px;
	color: var(--dark);
}
.home-page_services .card p {
	color: var(--gray-500);
	margin-bottom: 20px;
	font-size: 15px;
}
.home-page_services .price {
	font-size: 14px;
	color: var(--gray-700);
	font-weight: 600;
	margin-bottom: 20px;
}
.home-page_services .link {
	display: inline-flex;
	align-items: center;
	color: var(--primary);
	gap: 6px;
	font-weight: 600;
	font-size: 14px;
}
.service-bottom {
  margin-top: 60px;
}
.service-box {
  text-align: center;
  background: #fff;
  padding: 55px;
  border-radius: 30px;
  box-shadow: 0 10px 25px rgba(0,0,0,.05);
}
.service-box p {
  max-width: 900px;
  margin: 0 auto 25px;
}
/* Портфолио */
.home-page_portfolio .grid{
	gap: 24px;
	margin-bottom: 40px;
}
.home-page_portfolio .card {
	overflow: hidden;
	padding: 0;
}
.home-page_portfolio .card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-lg);
}
.case-img {
	aspect-ratio: 16/10;
	background: linear-gradient(135deg, #e0e7ff, #dbeafe);
	position: relative;
	overflow: hidden;
}
.case-img img { width: 100%; height: 100%; /*object-fit: cover;*/ }
.case-body { padding: 24px; }
.case-body h3 { font-size: 18px; margin-bottom: 8px; }
.case-meta {
	font-size: 13px;
	color: var(--gray-500);
	margin-bottom: 12px;
}
.case-result {
	display: inline-block;
	padding: 6px 12px;
	background: #dcfce7;
	color: #16a34a;
	border-radius: 20px;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 12px;
}
.case-body p { font-size: 14px; color: var(--gray-700); }
.portfolio-cta { text-align: center; }


/* === СОЗДАНИЕ САЙТОВ === */
body.page-id-16 {background-color: #fff; }
/* Hero */
.development_hero .hero-badge { display: inline-block; padding: 6px 14px; background: rgba(37, 99, 235, 0.1); color: var(--primary); border-radius: 20px; font-size: 13px; font-weight: 600; margin-bottom: 20px; }
.development_hero { padding-top: 50px; }
.development_hero .hero-grid { grid-template-columns: 1.3fr 1fr; }
.development_hero h1 { font-size: clamp(1.8rem, 3vw, 2.6rem); margin: 0 0 30px; line-height: 1.2; }
.development_hero h1 span { color: var(--primary); }
.development_hero .hero-item { padding: 16px; }


/* Какие сайты я разрабатываю */
.pricing-section .card {
  border: 2px solid var(--gray-100);
  border-radius: var(--radius);
  padding: 28px 24px;
  transition: var(--transition);
  display: flex;
  flex-direction: column;
}
.pricing-section .card:hover {
  border-color: var(--primary);
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.pricing-section .card.popular {
  border-color: var(--primary);
  background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%);
  position: relative;
}
.pricing-section .card-badge {
  position: absolute;
  top: -12px;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 170px; 
  background: var(--secondary);
  color: var(--white);
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
}
.pricing-section .card-description {
  font-size: 14px;
  color: var(--gray-500);
  margin-bottom: 20px;
  flex-grow: 1;
}
.pricing-section .card-features {
  list-style: none;
  margin: 0 0 20px 0;
  padding: 0;
}
.pricing-section .card-features li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--success);
  font-weight: 700;
}
.pricing-section .btn {
  margin-top: auto;
}
.card.popular .btn-outline {
  background: var(--primary-dark);
  color: var(--white);
}
/* ЧТО ВХОДИТ */
.development_included .grid {
	gap: 20px;
}
.development_included .card {
  padding: 24px;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.development_included .included-num {
	flex-shrink: 0;
	width: 36px; height: 36px;
	background: var(--primary); 
	color: var(--white);
	border-radius: 10px;
	display: flex; 
	align-items: center; 
	justify-content: center;
	font-weight: 700; 
	font-size: 15px;
}
.development_included .card-title { font-size: 16px; margin-bottom: 4px; }
.development_included .card-description { font-size: 14px; color: var(--gray-500); }

/* Частный специалист или веб-студия? */
.comparison-section{
    background:#fff;
}
.comparison-wrapper{
    display:grid;
    grid-template-columns:
    repeat(2,1fr);
    gap:35px;
    margin-top:50px;
}
.comparison-column{
    background:#fff;
    border-radius:28px;
    padding:40px;
    box-shadow:0 12px 30px rgba(0,0,0,.06);
    transition:.35s ease;
}
.comparison-column:hover{
    transform:translateY(-8px);
}
.specialist{
    border-top:5px solid #2563eb;
}
.studio{
    border-top:5px solid #94a3b8;
}
.comparison-header{
    display:flex;
    align-items:center;
    gap:20px;
    margin-bottom:30px;
}
.comparison-icon{
    width:70px;
    height:70px;
    flex-shrink:0;
}
.comparison-icon svg{
    width:100%;
    height:100%;
}
.comparison-header h3{
    margin:0;
}
.comparison-column ul{
    list-style:none;
}
.comparison-column li{
    position:relative;
    padding-left:32px;
    margin-bottom:16px;
    color:var(--text-light);
}
.specialist li:before{
    content:"✓";
    position:absolute;
    left:0;
    top:0;
    font-weight:700;
    color:#22c55e;
}
.studio li:before{
    content:"•";
    position:absolute;
    left:0;
    top: -.35rem;
    font-size:1.4rem;
    color:#94a3b8;
}
.comparison-result{
    margin-top:60px;
}
.comparison-result-box{
    text-align:center;
    padding:55px;
    border-radius:30px;
    background:
    linear-gradient(
        135deg,
        #eff6ff,
        #ffffff
    );
    box-shadow:0 10px 25px rgba(0,0,0,.05);
}
.comparison-result-box h3{
    margin-bottom:15px;
}
.comparison-result-box p{
    max-width:900px;
    margin:0 auto 25px;
}
@media(max-width:992px){
    .comparison-wrapper{
        grid-template-columns:1fr;
    }
}
@media(max-width:768px){
    .comparison-column{
        padding:30px;
    }
    .comparison-result-box{
        padding:35px 25px;
    }
}
.development_faq .faq-question:hover {
  color: #0f1115;
  background-color: #fff;
}
.development_faq .faq-item[open] .faq-question {
  color: #0f1115;
  background-color: #fff;
}
.development_faq .faq-item:hover {
  border-color: #2563eb;
}

/* === ИНТЕРНЕТ-МАГАЗИН === */
.e-commerce_hero h1 span {
  color: var(--primary);
}
.step-item {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}
.step-number {
	flex-shrink: 0;
	width: 48px;
	height: 48px;
	background: var(--primary);
	color: #fff;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 800;
	font-size: 1.2rem;
	box-shadow: 0 4px 10px rgba(37, 99, 235, 0.3);
}
.step-content h3 {
	margin-bottom: 8px;
}
.pricing_e-commerce .card {
  border: 2px solid var(--gray-100);
  border-radius: var(--radius);
  padding: 28px 24px;
  transition: var(--transition);
  display: flex;
  flex-direction: column;
  text-align: center;
}
.pricing_e-commerce .card:hover {
  border-color: var(--primary);
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.pricing_e-commerce .card.popular {
  border-color: var(--primary);
  background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%);
  position: relative;
}
.pricing_e-commerce .card-badge {
  position: absolute;
  top: -12px;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 170px; 
  background: var(--secondary);
  color: var(--white);
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
}
.pricing_e-commerce .card-description {
  font-size: 14px;
  color: var(--gray-500);
  margin-bottom: 20px;
  flex-grow: 0;
}
.pricing_e-commerce .price-amount {
	font-size: 2.5rem;
	font-weight: 800;
	color: var(--primary);
	margin: 20px 0;
}

.pricing_e-commerce .price-amount span {
	font-size: 1rem;
	color: var(--text-light);
	font-weight: 400;
}
.pricing_e-commerce .price-features {
  list-style: none;
  margin: 0 0 20px 0;
  padding: 0;
  text-align: left;
}
.pricing_e-commerce .price-features li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--success);
  font-weight: 700;
}
.price-features li {
  font-size: 14px;
  color: var(--gray-700);
  padding: 6px 0;
  padding-left: 0px;
  padding-left: 22px;
  position: relative;
}
.pricing_e-commerce .my-btn {
  margin-top: auto;
}
.card.popular .btn-outline {
  background: var(--primary-dark);
  color: var(--white);
}

/* === ИНТЕРНЕТ-МАГАЗИН OPENCART === */
body.page-id-42 {background-color: #fff; }

.information-uni_news_story-8 main {
  padding: 0;
}
.page-information-uni_news_story.information-uni_news_story-8 {
  background: #fff;
}
.ocart-shop_hero .hero-grid {
  grid-template-columns: 1.05fr .95fr;
}
.ocart-shop_hero h1 span {
  color: var(--primary);
}
/* Макет браузера с магазином */
.oc-hero-visual{position:relative}
.oc-browser{background:#fff;border:1px solid #DCE6EC;border-radius:16px;box-shadow:0 16px 38px rgba(11,36,51,.13);
  overflow:hidden;/*transform:rotate(-1.2deg);*/transition:transform .5s ease}
.oc-hero-visual:hover .oc-browser{transform:rotate(0)}
.oc-browser-bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:#F4F8FA;border-bottom:1px solid #DCE6EC;}
.oc-dot{width:10px;height:10px;border-radius:50%}
.oc-dot:nth-child(1){background:#FF5F57}.oc-dot:nth-child(2){background:#FEBC2E}.oc-dot:nth-child(3){background:#28C840}
.oc-url{flex:1; margin-left:8px; background:#fff; border:1px solid #DCE6EC; border-radius:999px; padding:5px 13px; font:500 .7rem 'Inter', sans-serif; color:#5B7280; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

.oc-store{padding:14px;background:#FBFDFE}
.oc-store-top{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.oc-store-logo{display:flex;align-items:center;gap:6px;font:700 .82rem 'Inter', sans-serif;color:#0B2433;white-space:nowrap}
.oc-store-search{flex:1;background:#fff;border:1px solid #DCE6EC;border-radius:8px;padding:7px 11px;
  font-size:.72rem;color:#5B7280;min-width:0}
.oc-store-cart{position:relative;display:grid;place-items:center;width:36px;height:36px;background:#E3F2FB;
  border-radius:9px;flex:none;transition:background .25s;}
.oc-store-cart:hover{background:#1B8FD1;}
.oc-store-cart:hover svg{stroke:#fff}
.oc-store-cart svg{stroke:#0C5E94;transition:stroke .25s}
.oc-cart-badge{position:absolute;top:-7px;right:-8px;background:#FF6B2C;color:#fff;font:700 .62rem 'Inter', sans-serif;;
  min-width:17px;height:17px;border-radius:999px;display:grid;place-items:center;padding:0 4px;border:2px solid #FBFDFE}
.oc-cart-badge.pop{animation:ocPop .45s ease}
@keyframes ocPop{40%{transform:scale(1.55)}}

.oc-store-banner{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#0B2433;color:#fff;
  border-radius:10px;padding:9px 13px;font:600 .72rem 'Golos Text',sans-serif;margin-bottom:12px}
.oc-store-banner b{color:#FFB38A;font-family:'Inter', sans-serif;}

.oc-store-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.oc-pcard{background:#fff;border:1px solid #DCE6EC;border-radius:12px;padding:10px;transition:transform .25s,box-shadow .25s,border-color .25s}
.oc-pcard:hover{transform:translateY(-4px);box-shadow:0 2px 10px rgba(11,36,51,.06);border-color:#1B8FD1}
.oc-pimg{background:#E3F2FB;border-radius:8px;display:grid;place-items:center;padding:12px 0;margin-bottom:8px}
.oc-pimg svg{width:42px;height:42px}
.oc-pname{font:600 .68rem/1.3 'Golos Text',sans-serif;color:#1E313D;margin-bottom:3px}
.oc-pprice{font:700 .76rem 'Inter', sans-serif;color:var(--ink);margin-bottom:9px}
.oc-pprice s{color:#5B7280;font-weight:400;font-size:.64rem;margin-left:5px}
.oc-add{width:100%;background:#E3F2FB;color:#0C5E94;border:none;border-radius:8px;padding:8px 4px;
  font:600 .66rem 'Golos Text',sans-serif;cursor:pointer;transition:background .2s,color .2s}
.oc-add:hover{background:#1B8FD1; color:#fff}
.oc-add.added{background:#18A05E; color:#fff}

/* Плавающие чипы вокруг макета */
.oc-chips{position:absolute;inset:0;pointer-events:none}
.oc-chip{position:absolute; display:flex; align-items:center; gap:7px; background:#fff; border:1px solid #DCE6EC;
  border-radius:999px;padding:9px 15px;font:600 .72rem 'Golos Text',sans-serif;;color:#123A50;
  box-shadow:0 16px 38px rgba(11,36,51,.13);animation:ocFloat 5s ease-in-out infinite}
.oc-chip b{font-family:'Inter', sans-serif;color:#18A05E;}
.oc-chip--1{top:-16px;right:3%}
.oc-chip--2{bottom:26%;left:-14px;animation-delay:1.3s}
.oc-chip--3{bottom:-15px;right:9%;animation-delay:2.4s}
@keyframes ocFloat{50%{transform:translateY(-9px)}}
@media(max-width:560px){
  .oc-chips{position:static;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:16px;pointer-events:auto}
  .oc-chip{position:static;animation:none}
}
/* Compare */
.compare--studio {
  background: #F5F8F9;
}
.card.compare--me {
  border: 2px solid var(--primary);
}
.card.compare--studio {
  border: 1px solid #DCE6EC;
}
.oc-compare-sub {
  font-size: .84rem;
  color: var(--gray-700);
  margin: 0 0 18px;
}
.ocart-shop_compare .card-features {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 13px;
  flex: 1;
}
.ocart-shop_compare .list--cross li::before {
  content: "✕";
  color: #D05A4E;
}
.ocart-shop_compare .list--check li::before {
  content: "✓";
  color: #18A05E;
}
.ocart-shop_compare .card-features li::before {
  position: absolute;
  left: 0;
  top: 5px;
}
/* СОСТАВ РАБОТ */
.oc-wrap {
  width: min(1180px,92%);
  margin-inline: auto;
  position: relative;
  z-index: 1;
}
.ocart-shop_scope .note-info_white {
  background: linear-gradient(135deg, #eff6ff, #ffffff);
}
.ocart-shop_scope .decoration {
  font-size: clamp(1.5rem,3.5vw,2.5rem);
  font-weight: 700;
  margin: 0 0 1.25rem;
  position: relative;
  letter-spacing: -.01em;
  line-height: 2.7rem;
  text-align: left;
}
.oc-scope-grid{display:grid;gap:38px}
@media(min-width:1024px){.oc-scope-grid{grid-template-columns:370px 1fr;gap:56px}}
.oc-scope-intro{align-self:start}
@media(min-width:1024px){.oc-scope-intro{position:sticky;top:90px}}
.oc-scope-intro .oc-btn{margin-top:26px}
.oc-scope-list{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.oc-scope-list>li{display:grid;grid-template-columns:auto 1fr;gap:8px 20px;background:#fff;border:1px solid #DCE6EC;
  border-left:4px solid transparent;border-radius:14px;padding:22px 26px;
  transition:transform .3s,border-color .3s,box-shadow .3s}
.oc-scope-list>li:hover{border-left-color:#2563eb;transform:translateX(8px);box-shadow:0 2px 10px rgba(11,36,51,.06);}
.oc-scope-num{grid-row:span 3;font:800 1.5rem/1 'Inter', sans-serif;color:#C4DCEC;transition:color .3s}
.oc-scope-list>li:hover .oc-scope-num{color:#1B8FD1}
.oc-scope-list h3{margin:0;font:700 1.02rem 'Golos Text',sans-serif;;color:#0B2433}
.oc-scope-list p{margin:4px 0 0;font-size:.9rem;color:#5B7280;line-height:1.6}
.oc-scope-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.oc-mini-tag{font:600 .66rem 'Inter', sans-serif;letter-spacing:.05em;text-transform:uppercase;
  background:#E3F2FB;color:#0C5E94;border-radius:999px;padding:5px 11px}
.oc-mini-tag--free{background:#FFEDE3;color:#18A05E}

/* Какие функции */
.ocart-shop_function .oc-feature {
  display: flex;
  align-items: center;
  position: relative;
  padding: 18px 18px 18px 48px;
  background: #fff;
  border: 1px solid var(--gray-200);
  border-radius: 16px;
  transition: var(--transition);
  box-shadow: none;
  font-weight: 600;
}
.ocart-shop_function .oc-feature:hover {
  border-color: #bfdbfe;
  transform: translateY(-4px);
  box-shadow: 0 15px 35px rgba(37,99,235,.08);
}
.ocart-shop_function .oc-feature::before {
  content: "✓";
  position: absolute;
  top: 50%;
  transform: translatey(-50%);
  left: 18px;
  color: var(--success);
  font-weight: 700;
  font-size: 18px;
}

/* === УСЛУГИ ===*/
body.page-id-13 {
  background-color: #fff;
}
.services_hero h1 span {
  color: var(--primary);
}
.uslugi_services .card-features li {
  font-size: 16px;
}





















/* Преимущества */
.sozdanie-saytov_hero { padding-top: 30px; }
.sozdanie-saytov_hero h1 { font-size: clamp(1.8rem, 3vw, 2.6rem); margin: 0 0 30px; line-height: 1.2; }
.sozdanie-saytov_page.advantages .card { padding: 30px; border-radius: 12px; text-align: center; border: 1px solid #e2e8f0; box-shadow: none; transition: all 0.3s ease; }
.sozdanie-saytov_page.advantages .card:hover { border-color: #2563eb; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }
.sozdanie-saytov_page.advantages .card-icon  { width: 64px; height: 64px; margin: 0 auto 20px; fill: #0f172a; background: #e0e7ff; padding: 14px; border-radius: 16px; }
.sozdanie-saytov_page.advantages .card-title { font-size: 1.25rem; }
.sozdanie-saytov_page.advantages .card-description { color: inherit; }






































.home-page_why .card {
  padding: 35px;
}
.home-page_why .icon-box {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  background: #dcfce7;
  color: #16a34a;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  margin-bottom: 15px;
}
.home-page_services .icon_box svg { width: 120px; height: 120px; }
@media screen and (max-width: 767px) { .home-page_services .icon_box svg { width: 80px; height: 80px; }	}





#stages .grid-2 { gap: 30px; }
#stages .card {
  position: relative;
  padding: 35px;
  border-radius: 24px;
  box-shadow: 0 12px 30px rgba(0,0,0,.06);
  transition: .35s ease;
}
.stages-bottom {
  margin-top: 60px;
}
.stages-box {
  text-align: center;
  background: #fff;
  padding: 55px;
  border-radius: 30px;
  box-shadow: 0 10px 25px rgba(0,0,0,.05);
}


.customer-gets-box {
  padding: 55px;
  border-radius: 30px;
  background: linear-gradient( 135deg, #eff6ff, #ffffff );
  box-shadow: 0 10px 25px rgba(0,0,0,.05);
}
/*.customer-gets .split-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  list-style-type: none;
  padding: 0;
}
*/
.split-list {
  column-count: 2; /* Делит список на 2 колонки */
  column-gap: 20px; /* Отступ между колонками */
  list-style-type: none;
  padding: 0;
  font-size: 1rem;
}

/* Чтобы элементы внутри колонок не разрывались некорректно */
.split-list li {
  break-inside: avoid;
  padding: 5px 0;
}
/* Базовые стили для мобильных устройств (одна колонка) */
@media (max-width: 768px) {
.customer-gets-box {
  padding: 20px;
}	
.split-list {
  column-count: 1; 
  list-style-type: none;
  padding: 0;
  margin: 0;
}
}
/* Стили для экранов крупнее мобильных (планшеты и ПК) */
@media (min-width: 768px) {
  .split-list {
    column-count: 2; /* Включаем 2 колонки */
    column-gap: 30px; /* Расстояние между колонками */
  }
}
.customer-gets .split-list li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 16px;
  color: var(--text-light);
}
.customer-gets .split-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  font-weight: 700;
  color: #22c55e;
}



/*-- Создание сайтов --*/


/* Услуги по созданию сайтов */
.my-services-grid {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 30px;
}
.my-service {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}
.card.my-service {
  color: #6b7280;
}
.card.my-service p{
  line-height: 1.35rem;
}
.my-service .art {
  width: 136px;
  height: 106px;
  background: linear-gradient(90deg,#eef2ff,#fff);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 30px;
  margin-top: 50px;
}
.price-card {
  position: relative;
  background: #fff;
  border-radius: 24px;
  padding: 35px;
  box-shadow: 0 12px 30px rgba(0,0,0,.08);
  transition: .35s ease;
  display: flex;
  flex-direction: column;
}


/* Hero */
#hero {
	min-height: calc(100vh - 151px);
	display: flex;
	align-items: center;
	background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%);
	/*padding-top: 100px;*/ /* space for header if needed */
}
.hero-grid {
  display: grid;
  grid-template-columns: 1fr 450px;
  gap: 32px;
  align-items: center;
}
.hero-graphic {
  background: #fff;
  border-radius: 25px;
  box-shadow: 0 10px 25px rgba(0,0,0,.06);
  padding: 40px 20px;
}
.hero-card {
  display: grid;
  gap: 15px;
}
.hero-item {
  padding: 18px;
  border-radius: 14px;
  background: #f8fafc;
}
.hero-buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}


#hero .hero-heading {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  margin: 0 0 12px;
  line-height: 3rem;
  font-weight: 600;
}
#hero p.lead { color: #6b7280; margin: 0 0 20px; }
.hero-visual {
  position: relative;
  animation: float 6s ease-in-out infinite;
}
@keyframes float {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-20px); }
  100% { transform: translateY(0px); }
}
/*h2 { font-size:1.8rem; margin:0 0 20px; text-align:center; }*/


.portfolio-item { overflow:hidden; border-radius:16px; box-shadow:0 2px 8px rgba(0,0,0,.06); background:#fff; }
.portfolio-item img { display:block; width:100%; height:auto; }
.portfolio-item div { padding:16px; }
/*.cta { display:inline-block; margin-top:20px; padding:14px 26px; background:#0f172a; color:#fff; border-radius:10px; text-decoration:none; font-weight:500; }*/


.cta { display:inline-block;  padding:14px 26px; background:#fc0d1b; color:#fff; border-radius:999px; text-decoration:none; font-weight:600; }
.cta:hover, .cta:active, .cta:focus { color: #fff; }

/* TEMPLATES */
/*footer { background:#0f172a; color:#ddd; text-align:center; padding:30px 20px; }
footer p { margin:6px 0; }*/
.header-cart__icon.fas.fa-shopping-bag:before, .fly-menu__icon-cart:before {
  content:'';
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.24896 2.29245C1.8582 2.15506 1.43005 2.36047 1.29266 2.75123C1.15527 3.142 1.36068 3.57015 1.75145 3.70754L2.01266 3.79937C2.68026 4.03409 3.11902 4.18964 3.44186 4.34805C3.74509 4.49683 3.87876 4.61726 3.96682 4.74612C4.05708 4.87821 4.12678 5.05963 4.16611 5.42298C4.20726 5.80319 4.20828 6.2984 4.20828 7.03835V9.75999C4.20828 11.2125 4.22191 12.2599 4.35897 13.0601C4.50529 13.9144 4.79742 14.526 5.34366 15.1022C5.93752 15.7285 6.69032 16.0012 7.58656 16.1283C8.44479 16.25 9.53464 16.25 10.8804 16.25L16.2861 16.25C17.0278 16.25 17.6518 16.25 18.1568 16.1882C18.6925 16.1227 19.1811 15.9793 19.6076 15.6318C20.0341 15.2842 20.2731 14.8346 20.4455 14.3232C20.6079 13.841 20.7339 13.2299 20.8836 12.5035L21.3925 10.0341L21.3935 10.0295L21.4039 9.97726C21.5686 9.15237 21.7071 8.45848 21.7416 7.90037C21.7777 7.31417 21.711 6.73616 21.3292 6.23977C21.0942 5.93435 20.7639 5.76144 20.4634 5.65586C20.1569 5.54817 19.8103 5.48587 19.4606 5.44677C18.7735 5.36997 17.9389 5.36998 17.1203 5.36999L5.66809 5.36999C5.6648 5.33324 5.66124 5.29709 5.6574 5.26156C5.60367 4.76518 5.48725 4.31246 5.20527 3.89982C4.92109 3.48396 4.54324 3.21762 4.10261 3.00142C3.69052 2.79922 3.16689 2.61514 2.55036 2.39841L2.24896 2.29245ZM5.70828 6.86999H17.089C17.9454 6.86999 18.6991 6.87099 19.2939 6.93748C19.5895 6.97052 19.8107 7.01642 19.9661 7.07104C20.0931 7.11568 20.1361 7.15213 20.1423 7.1574C20.1422 7.15729 20.1426 7.15762 20.1423 7.1574C20.2037 7.23881 20.2704 7.38651 20.2444 7.80796C20.217 8.25153 20.1005 8.84379 19.9229 9.73372L19.9225 9.73594L19.4237 12.1561C19.2623 12.9389 19.1537 13.4593 19.024 13.8441C18.9009 14.2095 18.7853 14.3669 18.66 14.469C18.5348 14.571 18.3573 14.6525 17.9746 14.6993C17.5714 14.7487 17.0399 14.75 16.2406 14.75H10.9377C9.5209 14.75 8.53783 14.7482 7.79716 14.6432C7.08235 14.5418 6.70473 14.3576 6.43219 14.0701C6.11202 13.7325 5.93933 13.4018 5.83744 12.8069C5.72628 12.1578 5.70828 11.249 5.70828 9.75999L5.70828 6.86999Z' fill='%231C274C'%3E%3C/path%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.5002 21.75C6.25756 21.75 5.2502 20.7426 5.2502 19.5C5.2502 18.2573 6.25756 17.25 7.5002 17.25C8.74285 17.25 9.7502 18.2573 9.7502 19.5C9.7502 20.7426 8.74285 21.75 7.5002 21.75ZM6.7502 19.5C6.7502 19.9142 7.08599 20.25 7.5002 20.25C7.91442 20.25 8.2502 19.9142 8.2502 19.5C8.2502 19.0858 7.91442 18.75 7.5002 18.75C7.08599 18.75 6.7502 19.0858 6.7502 19.5Z' fill='%231C274C'%3E%3C/path%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.5002 21.7501C15.2576 21.7501 14.2502 20.7427 14.2502 19.5001C14.2502 18.2574 15.2576 17.2501 16.5002 17.2501C17.7428 17.2501 18.7502 18.2574 18.7502 19.5001C18.7502 20.7427 17.7428 21.7501 16.5002 21.7501ZM15.7502 19.5001C15.7502 19.9143 16.086 20.2501 16.5002 20.2501C16.9144 20.2501 17.2502 19.9143 17.2502 19.5001C17.2502 19.0859 16.9144 18.7501 16.5002 18.7501C16.086 18.7501 15.7502 19.0859 15.7502 19.5001Z' fill='%231C274C'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
  width: 50px;
  height: 50px;
  background-size: 100%;
  background-repeat: no-repeat;  
  display: block;
}
.fly-menu__icon-cart:before {
  width: 30px;
  height: 30px;
  margin: auto;
}
.header-cart__total-items {
  right: -1px;
  top: 4px;
}
.home-page .html-module  {
  padding: 0;
  background: none;
  border-radius: unset;
}
.notification__text a { color: #e1e1e1; }
.common-home .header-search, .common-home #cart { display: none; }
/*.header-block .header-search, .header-block #cart { display: none; }*/
@media (max-width: 991px) { .menu-open { margin: 0 20px 10px 10px; } }
.marker-unset li::marker { font-size: 0; }


#pos-slider .container-fluid { padding: 0; }
.faq-link { font-weight: 500; }
.sp-seo-faq { margin-bottom: 40px; }
.header-block__item-soc {
  order: 2;
}



.footer__text { text-align:center; }

/* ECOMMERCE - PAGE */
.information-information-5 #contact {
  background: #f9fafb;
}






/* Services */
.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(220px,1fr));
  gap: 14px;
}
.service {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.service .art {
  width: 80px;
  height: 64px;
  background: linear-gradient(90deg,#eef2ff,#fff);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* --- Сайт визитка --- */


/* --- Website Advantage --- */
#website-advantages .grid-4 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
#website-advantages .card { background: transparent; padding: 0; border-radius: 0; box-shadow: none; text-align: center;}
#website-advantages .icon-box { width: 70px; height: 70px; background: #dbeafe; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 15px; }
#website-advantages .card-icon { width: 32px; height: 32px; margin-bottom: 0; fill: #2563eb; }
#website-advantages .card-description { color: inherit; }
/* --- Website Portfolio --- */
.portfolio-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.portfolio-item { position: relative; border-radius: 12px; overflow: hidden; }
.portfolio-img {
	width: 100%;
	height: 250px;
	object-fit: cover;
	transition: var(all 0.3s ease);
	background-color: #cbd5e1; /* Placeholder color */
}
.portfolio-overlay {
	position: absolute;
	bottom: 0; left: 0; right: 0;
	background: rgba(255,255,255,0.95);
	padding: 20px;
	transform: translateY(100%);
	transition: var(all 0.3s ease);
}
.portfolio-item:hover .portfolio-overlay { transform: translateY(0); }
.portfolio-item:hover .portfolio-img { transform: scale(1.05); } 


/* --- Types of landing--- */
#type-of-landing .card { padding: 30px; border-radius: 12px; text-align: center; border: 1px solid #e2e8f0; box-shadow: none; transition: all 0.3s ease; }
#type-of-landing .card:hover { border-color: #2563eb; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }
#type-of-landing .card-icon { width: 64px; height: 64px; margin: 0 auto 20px; fill: #0f172a; background: #e0e7ff; padding: 14px; border-radius: 16px; }
/* --- Landing Advantage --- */
/*#landing-advantages .grid-4 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }*/
#landing-advantages .card { background: transparent; padding: 0; border-radius: 0; box-shadow: none; text-align: center;}
#landing-advantages .grid-4 {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    justify-content: center;
}  
#landing-advantages .grid-4 .card {
    width: calc(25% - 18px);
}

#landing-advantages .grid-4 .card:nth-child(n+5) {
    width: calc(25% - 18px);
}
@media (max-width: 767px) {
  #landing-advantages .card {
    grid-template-columns: 1fr;
  }
}
#landing-advantages .icon-box { width: 70px; height: 70px; background: #dbeafe; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 15px; }
#landing-advantages .card-icon { width: 32px; height: 32px; margin-bottom: 0; fill: #2563eb; }
#landing-advantages .card-description { color: inherit; }



/* --- FAQ OLD --- 
#faq .sp-seo-faq { max-width: 820px; margin: 0 auto 40px; }
#faq .faq-title { font-size: 1.55rem; margin: 0 0 3rem; position: relative; font-weight: 600; }
#faq .faq-link { font-size: inherit; font-weight: 600; margin: 0; padding: 20px; }
#faq .faq-text { border-top: 1px solid #f1f5f9; font-size: inherit; padding: 20px; }
#faq .sp-seo-faq .faq-question { background: #fff; padding: 0; }
.faq-list { max-width: 820px; margin: 0 auto; }
details {
	background: #fff;
	margin-bottom: 15px;
	border-radius: 12px;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
	overflow: hidden;
}
summary {
	padding: 20px;
	font-weight: 600;
	cursor: pointer;
	list-style: none;
	position: relative;
}
summary::-webkit-details-marker { display: none; }
summary::after {
	content: '+';
	position: absolute;
	right: 20px;
	font-size: 1.5rem;
	color: #2563eb;
}
details[open] summary::after { content: '-'; }
.faq-answer {
	padding: 0 20px 20px;
	color: #64748b;
	border-top: 1px solid #f1f5f9;
	padding-top: 15px;
}
*/
/* --- Quiz Form --- */
.quiz-section {
	background: #2563eb;
	color: #fff;
}
.quiz-section h2 { color: #fff; }
.quiz-section h2::after { background: #fff; }

.quiz-container {
	background: #fff;
	color: #1e293b;
	max-width: 600px;
	margin: 0 auto;
	padding: 40px;
	border-radius: 12px;
	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}
.quiz-step { display: none; }
.quiz-step.active { display: block; animation: fadeIn 0.5s; }

@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

.quiz-options { display: grid; gap: 10px; margin: 20px 0; }
.quiz-option {
	padding: 15px;
	border: 2px solid #e2e8f0;
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.3s ease;
}
.quiz-option:hover, .quiz-option.selected {
	border-color: #2563eb;
	background-color: #eff6ff;
}
.quiz-nav { display: flex; justify-content: space-between; margin-top: 20px; }
.progress-bar {
	height: 6px;
	background: #e2e8f0;
	border-radius: 3px;
	margin-bottom: 20px;
	overflow: hidden;
}
.progress-fill {
	height: 100%;
	background: #2563eb;
	width: 0%;
	transition: width 0.3s ease;
}
#quiz input[type="text"], input[type="tel"], input[type="email"] {
	width: 100%;
	padding: 12px;
	margin-bottom: 15px;
	border: 1px solid #cbd5e1;
	border-radius: 6px;
}
/* --- Blog --- */
.page-information-uni_news_story {
  background: #f8f9fc;
}
@media (min-width: 992px) {
.page-information-uni_news_story .uni-wrapper {
    margin: 0 0 30px;
    padding: 20px;
    background: #fff;
    border-radius: var(--border-radius-1);
  }
}
/* --- Hero Contact Widget --- */
.hero-contact-widget {
    margin: 20px 0;
    padding: 24px 30px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #6b7280;	
}
.hero-contact-widget__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.hero-contact-widget__content p {
    margin: 0;
    color: #6b7280;
    font-size: 15px;
	font-weight: 500;
    line-height: 1.6;
}
.hero-contact-widget__socials {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}
.hero-contact-widget__socials a {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all .3s ease;
    background: #fff;
    border: 1px solid #e5e7eb;
}
.hero-contact-widget__socials a:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 18px rgba(0,0,0,.1);
}
.hero-contact-widget__socials svg {
    width: 30px;
    height: 30px;
	border-radius: 50%;
}
@media (max-width: 768px) {
    .hero-contact-widget__inner {
        flex-direction: column;
        text-align: center;
    }
}
/* --- Article Contact Widget --- */
.article-contact-widget {
    margin: 40px 0;
    padding: 24px 30px;
    background: #f7f9fc;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
}
.page-information-uni_news_story .article-contact-widget {
    margin: 40px 0;
    padding: 24px 30px;
    background: #fff;
    border: 0;
    border-radius: 12px;
}
.article-contact-widget__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.article-contact-widget__content h3 {
    margin: 0 0 8px;
    font-size: 24px;
    line-height: 1.3;
}

.article-contact-widget__content p {
    margin: 0;
    color: #666;
    font-size: 15px;
    line-height: 1.6;
}

.article-contact-widget__socials {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.article-contact-widget__socials a {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all .3s ease;
    background: #fff;
    border: 1px solid #e5e7eb;
}

.article-contact-widget__socials a:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 18px rgba(0,0,0,.1);
}

.article-contact-widget__socials svg {
    width: 42px;
    height: 42px;
	border-radius: 50%;
}

@media (max-width: 768px) {
    .article-contact-widget__inner {
        flex-direction: column;
        text-align: center;
    }
}

.common-home .sp-seo-faq {
  max-width: 1100px;
  margin: 0 auto 40px;
  padding: 0 20px;
}
.common-home .faq-title {
  text-align: inherit;
}
.common-home #contact {
  background: #f9fafb;
}
.html-module.module-34 {
  margin-bottom: 0;
} 
.common-home .sp-seo-faq {
  padding: 0;
}
/* PRODUCT-PAGE */
.product-data__item.stock {
  display: none;
}
.product-page__wishlist-compare {
  display: none;
}
/* SVG animation */
/* Появление по очереди */
.fade-in {
  opacity: 0;
  transform: translateY(10px);
  animation: fadeUp 0.6s forwards;
}
.delay-1 { animation-delay: 0.2s }
.delay-2 { animation-delay: 0.5s }
.delay-3 { animation-delay: 0.8s }
.delay-4 { animation-delay: 1.1s }
.delay-5 { animation-delay: 1.4s }
@keyframes fadeUp {
  to {
	opacity: 1;
	transform: translateY(0);
  }
}
/* Hover эффекты */
.card:hover {
  transform: translateY(-5px);
  transition: 0.3s;
}
.cta:hover {
  filter: brightness(1.1);
  transform: scale(1.05);
  transition: 0.3s;
}
/* Пульс CTA */
.pulse {
  animation: pulseAnim 2s infinite;
}
@keyframes pulseAnim {
  0% { transform: scale(1) }
  50% { transform: scale(1.05) }
  100% { transform: scale(1) }
}
/* Mobile */
@media (max-width: 767px) {
  .hero-grid, .development_hero .hero-grid, .ocart-shop_hero .hero-grid {
    grid-template-columns: 1fr;
}	
#hero h1 {
  padding-top: 10px;
  line-height: 2.2rem;
}
}
/*-- CTA BAR  --*/
.cta-bar.bottom {
  margin: 60px 0 0 0;
}
.cta-bar {
    margin: 40px 0;
    padding: 18px 22px;
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 55%, #eb317a 130%);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    color: #fff;
    position: relative;
    overflow: hidden;
}

/* мягкое свечение */
.cta-bar::before {
    content: "";
    position: absolute;
    top: -40%;
    right: -30%;
    width: 200px;
    height: 200px;
    background: rgba(235, 49, 122, 0.35);
    filter: blur(60px);
    border-radius: 50%;
}

.cta-bar__text {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cta-bar__title {
    font-size: 18px;
    font-weight: 700;
}

.cta-bar__desc {
    font-size: 0.9rem;
    opacity: 0.85;
}

.cta-bar__icons {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.cta-icon {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: rgba(255,255,255,0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .25s ease;
    text-decoration: none;
    backdrop-filter: blur(6px);
    border: 1px solid rgba(255,255,255,0.18);
}

.cta-icon:hover {
    transform: translateY(-3px);
    background: rgba(235, 49, 122, 0.25);
    border-color: rgba(235, 49, 122, 0.6);
}

.cta-icon svg {
    width: 22px;
    height: 22px;
    fill: #fff;
}

@media (max-width: 768px) {
    .cta-bar {
        flex-direction: column;
        text-align: center;
    }

    .cta-bar__icons {
        justify-content: center;
    }
}
/* ===== CHAT BUTTON ===== */
.saas-chat-btn {
    position: fixed;
    right: 20px;
    bottom: 80px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, #2563eb, #eb317a);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 99999;
    box-shadow: 0 10px 30px rgba(0,0,0,0.25);
    transition: transform .25s ease;
}

.saas-chat-btn:hover {
    transform: scale(1.08);
}

.saas-chat-btn svg {
    width: 26px;
    height: 26px;
    fill: #fff;
}

/* ===== CHAT WINDOW ===== */
.saas-chat-box {
    position: fixed;
    right: 20px;
    bottom: 150px;
    width: 320px;
    max-width: calc(100vw - 40px);
    background: #0f172a;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,0.4);
    z-index: 99999;
    opacity: 0;
    transform: translateY(20px);
    pointer-events: none;
    transition: all .25s ease;
}

.saas-chat-box.active {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* HEADER */
.saas-chat-header {
    background: linear-gradient(135deg, #2563eb, #eb317a);
    padding: 14px;
    color: #fff;
    font-weight: 600;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.saas-chat-close {
    cursor: pointer;
    font-size: 18px;
    opacity: .8;
}

/* BODY */
.saas-chat-body {
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.saas-chat-text {
    font-size: 13px;
    color: #cbd5e1;
    line-height: 1.4;
}

/* CONTACTS */
.saas-chat-links {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 6px;
}

.saas-chat-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    background: #111827;
    text-decoration: none;
    color: #fff;
    font-size: 13px;
    border: 1px solid rgba(255,255,255,0.08);
    transition: .2s;
}

.saas-chat-link:hover {
    border-color: rgba(235,49,122,0.6);
    transform: translateY(-2px);
}
a.saas-chat-link:hover {
  color: #fff;
}
/* CTA BUTTON */
.saas-chat-cta {
    margin-top: 8px;
    padding: 10px 12px;
    border-radius: 12px;
    text-align: center;
    background: linear-gradient(135deg, #2563eb, #eb317a);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}

/* ICON */
.saas-chat-icon {
    width: 18px;
    height: 18px;
    fill: #fff;
}

/* MOBILE */
@media (max-width: 480px) {
    .saas-chat-box {
        width: 92vw;
    }
}
#saasChatBtn::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: rgba(52, 152, 219, 0.5); /* Lighter blue pulse */
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
  animation: pulse 1.5s infinite; /* Repeating pulse animation */
}
/* Step 3: Keyframes for pulse effect */
@keyframes pulse {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.5);
    opacity: 0;
  }
}
/* FAQ SCHEMA */
.faq-section {
  max-width: 840px;
  /* margin: 3rem auto; */
  padding: 0 1rem;
}

.faq-section h2 {
  font-size: 1.8rem;
  color: #1e293b;
  text-align: center;
  margin-bottom: 2rem;
  font-weight: 700;
}

/* Контейнер для аккордеона */
.faq-container {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}  
/* Стилизация элемента details */
.faq-item {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  overflow: hidden;
  transition: box-shadow 0.3s ease, border-color 0.3s ease;
}

.faq-item:hover {
  border-color: #e5e5e5;
}

.faq-item[open] {
  border-color: rgba(0,0,0,.1);
  box-shadow: 0 4px 6px -1px rgba(93, 93, 93, 0.1), 0 2px 4px -1px rgba(93, 93, 93, 0.1);
}

/* Стилизация заголовка вопроса (summary) */
.faq-question {
  padding: 1.25rem 1.5rem;
  font-size: 1.1rem;
  font-weight: 600;
  color: #1e293b;
  cursor: pointer;
  list-style: none; /* Убираем стандартный треугольник */
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background-color 0.2s ease, color 0.2s ease;
}

/* Убираем стандартный маркер для WebKit браузеров */
.faq-question::-webkit-details-marker {
  display: none;
}

.faq-question:hover {
  color: #0f1115;
  background-color: #f2f3f4;
}

/* Кастомная иконка-стрелка */
.faq-question::after {
  content: '';
  width: 10px;
  height: 10px;
  border-right: 2px solid #64748b;
  border-bottom: 2px solid #64748b;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.3s ease, border-color 0.3s ease;
  flex-shrink: 0;
  margin-left: 1rem;
}

/* Состояние открытого вопроса */
.faq-item[open] .faq-question {
  color: #0f1115;
  background-color: #f2f3f4;
}

.faq-item[open] .faq-question::after {
  transform: rotate(225deg) translateY(-2px);
  border-color: rgba(0,0,0,.1);
}

/* Стилизация блока с ответом */
.faq-answer {
  padding: 1rem 1.5rem 1.5rem 1.5rem;
  color: #475569;
  line-height: 1.6;
  font-size: 1rem;
  /* Плавное появление контента (работает в современных браузерах) */
  animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Адаптивность для мобильных устройств */
/* @media (max-width: 600px) {
  .faq-section h2 {
    font-size: 1.5rem;
  }
  .faq-question {
    font-size: 1rem;
    padding: 1rem;
  }
  .faq-answer {
    padding: 0 1rem 1rem 1rem;
    font-size: 0.95rem;
  }
} */

/* === HEADER CTA BAR === */ 
.header-block__item.header-block__item-cta-bar {
  order: 2;
}
.header-contact-widget {
    position: relative;
    display: inline-block;
    font-family: inherit;
}
.header-contact-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 28px;
  background: var(--primary);
  color: #fff;
  font-weight: 700;
  border-radius: 999px;
  transition: var(--transition);
  box-shadow: var(--shadow);
  cursor: pointer;
}
/* .header-contact-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 28px;
    background: linear-gradient(135deg,#2563eb,#eb317a);
    color: #fff;
    text-decoration: none;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: .3s ease;
    box-shadow: 0 8px 25px rgba(37,99,235,.25);
} */
.header-contact-btn:hover {
  transform: translateY(-3px);
  background: #1d4ed8;
  box-shadow: var(--shadow-md);
}
/* .header-contact-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(235,49,122,.25);
} */
.header-contact-dropdown {
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    width: 280px;
    background: #fff;
    border-radius: 16px;
    padding: 18px;
    box-shadow: 0 15px 40px rgba(0,0,0,.12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: .25s ease;
    z-index: 999;
}
.header-contact-widget.active .header-contact-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.contact-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 14px;
    color: #111827;
}
.header-contact-widget .contact-links {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.header-contact-widget .contact-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    text-decoration: none;
    color: #111827;
    border-radius: 10px;
    transition: .2s ease;
}
.contact-link:hover {
    background: #f8fafc;
}
.contact-icon {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
}
.contact-footer {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #e5e7eb;
    font-size: 13px;
    color: #6b7280;
}
@media (max-width:768px) {

    .header-contact-dropdown {
        right: -10px;
        width: 260px;
    }

    .header-contact-btn {
        padding: 9px 14px;
        font-size: 13px;
    }
}
.header__icon.telegram { font-size: 2em; color: #2AABEE; }
.header__icon.whatsapp { font-size: 2em; color: #25D366; }

/* === FOOTER === */
#footer_contact {
  background: linear-gradient(145deg, #1e293b 0%, #0f172a 100%);
  color: #f1f5f9;
  text-align: center;
  padding: 80px 0;
}
#footer_contact h2 { color: #fff; margin-bottom: 16px; }
#footer_contact p { font-size: 1.2rem; margin-bottom: 30px; }
#footer_contact .btn { background: #f59e0b; color: #1e293b; }
#footer_contact .btn:hover { background: #d97706; }
#footer_contact .contact-links {
  display: flex;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
  margin-top: 30px;
  font-size: 1.2rem;
}
#footer_contact .contact-links a { color: #f1f5f9; transition: color 0.2s; }
#footer_contact .contact-links a:hover { color: #eb317a; }
#footer_contact .contact-links i { margin-right: 8px; }
#footer_contact .contact-links svg {
  fill: #f1f5f9;
  width: 1.2rem;
  height: 1.2rem;
  margin-right: 8px;
  vertical-align: center;
}
#footer_contact .contact-links svg:hover { fill: #eb317a; }