/*---------------------------------------------------------------------------------

	Theme Name: Davis
    Text Domain: davis
	Version: 2.1.2
	Description: Davis is a teeny-tiny WordPress theme that can be used a starter theme or a really lightweight blog theme. It consists of three PHP files and weighs in at just 36 KB, excluding screenshot.png. It features the aside post format, Block Editor support, featured images, and a responsive design. Demo: https://andersnoren.se/themes/davis/
	Tags: blog, one-column, custom-menu, featured-images, post-formats, threaded-comments, translation-ready, block-styles, wide-blocks
	Author: Anders Norén
	Author URI: https://andersnoren.se
	License: GNU General Public License version 2.0
	License URI: http://www.gnu.org/licenses/gpl-2.0.html
	Theme URI: https://andersnoren.se/themes/davis-wordpress-theme/
	Requires PHP: 5.4
	Tested up to: 6.3
	
	All files, unless otherwise stated, are released under the GNU General Public License
	version 2.0 (http://www.gnu.org/licenses/gpl-2.0.html)

-----------------------------------------------------------------------------------

	0.	CSS Reset
	1.	Document Setup
	2.  Structure
	3.	Header
	4.	Blog
	5.  Entry Content
	6.	Comments
	7.	Pagination
	8.	Error 404
	9.	Footer
	10. Media Queries

----------------------------------------------------------------------------------- */


/* -------------------------------------------------------------------------------- */
/*	0. CSS Reset
/* -------------------------------------------------------------------------------- */


html, body { 
    margin: 0 !important; 
    padding: 0 !important; 
    height: 100%; 
    min-height: 100%; 
}

h1, h2, h3, h4, h5, h6, p, blockquote, address, cite, img, li, ol, ul, fieldset, form, label, legend, button, table, caption, tr, th, td {
	margin:0;
	padding:0;
	border:0;
	font-weight:normal;
	font-style:normal;
	font-size:100%;
	line-height:1;
	text-align:left;
}

table {
	border-collapse:collapse;
	border-spacing:0;
}

ol, ul { list-style:none; }

blockquote:before, 
blockquote:after { content:""; }

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  display: none;
}

/* Screen Reader Text */

.screen-reader-text {
	clip: rect( 1px, 1px, 1px, 1px );
	height: 1px;
	overflow: hidden;
    position: absolute !important;
    width: 1px;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}


/* -------------------------------------------------------------------------------- */
/*	1. Document Setup
/* -------------------------------------------------------------------------------- */


body {
    background-color: #fff;
	border: none;
    color: #000;
    font-size: 18px;
}

a {
	text-decoration: none;
}

a {
	transition: all 0.3s ease-in-out;
	color: #000;
}

a:hover {
	transform: scale(1.1);
}

body a:hover,
body a:focus { 
	text-decoration: underline; 
}

img {
	display: block;
	height: auto;
    max-width: 100%;
}

iframe {
	display: block;
	width: 100%;
}

.header_email {
	display: flex;
	align-items: center;
}

.header-top-wrapper {
	display: flex;
	align-items: center;
	gap: 20px;
}

.form-row {
	display: flex;
	flex-direction: row;
}

.container {
	max-width: 1440px;
	width: 100%;
	padding: 0px 20px;
	margin: 0 auto;
}

/* Десктоп/мобайл видимость */
.header-links--desktop { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; }
.burger,
.mobile-menu__panel { display: none; }

@media (max-width: 768px) {
  .header-links--desktop { display: none; }
  .mobile-menu__panel {
	display: block;
	z-index: 999;
  }
  .burger { display: inline-flex; flex-direction: column; gap: 6px; background: none; border: 0; padding: 8px; cursor: pointer; }
  .burger span { width: 28px; height: 2px; background: #000; display: block; }

  /* Mobile drawer */
  .mobile-menu { position: fixed; inset: 0; pointer-events: none; opacity: 0; transition: .2s; z-index: 9999; }
  .mobile-menu.is-open { pointer-events: auto; opacity: 1; }

  .mobile-menu__overlay { position: absolute; inset: 0; background: rgba(0,0,0,.45); }
  .mobile-menu__panel {
    position: absolute; right: 0; top: 0; height: 100%;
    width: min(320px, 85vw);
    background: #fff;
    transform: translateX(100%);
    transition: .2s;
    padding: 20px;
    overflow: auto;
  }
  .mobile-menu.is-open .mobile-menu__panel { transform: translateX(0); }

  .mobile-menu__close { background: none; border: 0; font-size: 24px; cursor: pointer; }
  .header-links--mobile { list-style: none; margin: 20px 0 0; padding: 0; display: grid; gap: 14px; }
  .header-links--mobile a { text-decoration: none; color: #000; }
}

/* Чтобы при открытом меню страница не скроллилась */
body.menu-open { overflow: hidden; }

.header-bottom-wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
}


.cards__wrapper-item img {
	max-width: 355px;
	width: 100%;
	height: auto;
	border-radius: 8%;
}

.pre-header {
	padding: 15px 0;
	background: #363636;
    color: #fff;
}

.pre-header a {
	color: #fff !important;
}

.site-header {
	padding: 1.5em 0;
}

a {
	font-size: var(--link);
	color: var(--color-default);
}

.site-header a {
	font-weight: 600;
}

body * {
	font-family: "PT Sans", sans-serif;
  	font-optical-sizing: auto;
  	font-style: normal;
	        -webkit-box-sizing: border-box; 
        -moz-box-sizing: border-box; 
	box-sizing: border-box; 
}


:root {
	--h1: 40px;
	--h2: 32px;
	--h4: 20px;
	--sub: 1.5rem;
	--link: 18px;
	--color-default: #363636;
	--color-one: #1e2db8;
	--color-link: black;
	--background-link: #20c997;

	--margin-top: 130px;
	--margin-default: 45px;
	--margin-low: 20px;

	--download-font: 26px;
}


.h2com {
	font-size: var(--h2) !important;
	margin-bottom: var(--margin-default);
	font-weight: 600;
	line-height: 33px;
}

.example__download {
	text-decoration: underline;
	font-size: var(--download-font);
	color: var(--background-link);
	display: block;

	margin-bottom: var(--margin-default);

	width: fit-content;
}

.example__notic {
	font-weight: bolder;
	font-size: var(--link);
	margin-bottom: var(--margin-default);
	display: block;
}


.banner-hero-img {
	padding: 250px 0px;
	background-size: cover;
	background-position: center right;
		border-radius: 20px;
	position: relative;
}

.banner-hero-why {
	padding: 15px;
	color: #fff;
	font-size: 31px;
	position: absolute;
	border-radius: 20px;
	background-color: rgba(0, 0, 0, 0.75);

	right: 40px;
}

.banner-hero-why ul {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.banner__wrapper-subtitle {
	opacity: 0.9;
	font-size: var(--sub);
	color: #fff;
}

.banner__wrapper-title {
	color: #fff;
}

h1 {
	font-size: var(--h1);
	letter-spacing: 4px;
	font-weight: 600;
}

.banner-hero-wrapper {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 10px 15px;
	background-color: rgba(0, 0, 0, 0.75);
	border-radius: 5px;

	width:fit-content;
}

#left-green {
	position: relative;
	display: block;
}

#left-green::after {
	content: '';
	position: absolute;
	left: -10px;
	height: 100%;
	width: 3px;
	background-color: aqua;

	top: 50%;
	transform: translateY(-50%);
}


.plash__title{
	font-weight: 600;
	font-size: var(--h1);
	color: var(--color-default);
}

.plash__wrapper{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.plash{
	margin-top: 40px;
}

.linkCom,
.goModal {
	font-size: .9rem;
	height: 50px;
	max-width: 140px;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #20c997;

	color: white;
	font-weight: 600;
	font-size: var(--link);

	border-radius: 5px;

	cursor: pointer;
}

.cards__wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.cards{
	margin-top: 40px;
}



.cards h3 {
	font-size: var(--h4);
	font-weight: bold;
}

h3,h4 {
	font-size: var(--h4);
	font-weight: 600;
}

.cards__wrapper-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 15px;
}

.cards__wrapper-item  p {
	text-align: center;
}

.example {
	margin-top: var(--margin-top);
}

/* Планшеты */
@media (max-width: 992px) {
  .cards__wrapper {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Мобильные */
@media (max-width: 576px) {
  .cards__wrapper {
    grid-template-columns: 1fr;
  }
}

.stat {
	margin-top: var(--margin-top);
	padding: 40px 0px;
	background-color: #f7f7f5;
}

.stat__number{
	font-size: 2.5rem;
    font-weight: 700;
}

.stat__wrapper-items {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}

.stat__item{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.stat__number{
	position: relative;
	padding-bottom: 5px;
}

.stat__text {
	padding-top: 5px;
	font-size: 18px;
	font-weight: 600;
}

.stat__wrapper-items {
	margin-top: var(--margin-default);
}

.stat__number::after {
	content: '';
	position: absolute;
	width: 50px;
	height: 7px;
	background-color: aqua;
	bottom: -5px;
	left: 50%;
	transform: translateX(-50%);
}

.ready__wrapper{
	display: flex;
	flex-direction: row;
	gap: 60px;
}

.ready {
	margin-top: var(--margin-top);
}

.ready__right p {
	font-size: 18px;
	line-height: 1.5rem;
}

.ready__right h3 {
	margin-bottom: 15px;
	margin-top: 15px;

	opacity: 0.8;
}

.ready__right ul {
	margin: 10px 0px;
	font-size: 16px;
	opacity: 0.9;
	padding-left: 30px;
}

.ready__right ul li {
	padding: 4px 0px;
	list-style:disc;
}


.readyrow {
	margin-top: var(--margin-top);
	    background-color: #fcfcfc;
	padding-bottom: 20px;
}

.readyrow__wrapper-top{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;

	padding-top: var(--margin-default);
	padding-bottom: 20px
}

.readyrow__wrapper-top .h2com {
	margin: 0px !important;
}

.readyrow  #heading__box-h3,
.ready__right h3 {
	font-size: 32px;
	margin: var(--margin-low) 0px;
	color: var(--color-default);
	opacity: 0.8;
}

.readyrow {
	color: var(--color-default);
}

.readyrow ol li {
	list-style: auto;
	padding: 4px 0px;
}
ol li {
	list-style: auto;

}
.readyrow ol {
	margin: 10px 0px;
	padding-left: 30px;
}

.readyrow__box-span {
	margin-bottom: var(--margin-low);
}

.readyrow__wrapper-bottom {
	margin-top: var(--margin-low);
}

.form {
	padding-top: var(--margin-top);
}

.form__wrapper {
	margin-top: var(--margin-default);
}

.form-row {
	display: flex;
	justify-content: space-between;
	gap: 30px;
}

.form-row input {
	background: #f7f7f5;
    border: 1px solid transparent;
	height: 50px;
	max-width: 673px;
	width: 100%;
	margin: 5px 0px;
}

.form-row textarea {
		background: #f7f7f5;
    border: 1px solid transparent;

	max-width: 673px;
	width: 100%;
	margin: 5px 0px;
}

.form-row > div {
	width: 50%;
}

.form-row label {
	color: #363636;
	font-size: 0.85rem;
	margin-bottom: 10px;
}

.form-row .red {
	color: red;
}
 .send  {
	max-width: 450px;
	width: 100%;
	background-color: #20c997;
    color: white;
    font-weight: 600;
	height: 50px;
	border: 0px;
	font-size: var(--link);

}

.send-wrap p{
		margin-top: var(--margin-default);
	display: flex;
	align-items: center;
	flex-direction: row;
	gap: 25px;
}


footer {
	    background-color: #363636;
    color: #fff;

	padding: 20px 0px;
	margin-top: var(--margin-top);
}

footer a {
	color: #fff;
}

.footer-info,
.footer-links {
	width: fit-content;
}


.footer-info > h4,
.footer-links > h4 {
	border-bottom: 1px solid #fff;
	margin-bottom: 15px;
}

.footer__wrapper {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

#header-link,
.footer-links-list ul li {
	display: block;
	padding: 4px 0px;
}

.header_email {
	display: flex;
	align-items: center;
	justify-content: center;
}









/*MODAL*/

/* Floating button */
.contact-fab{
  position: fixed;
  right: 18px;
  bottom: 58px;
  width: 58px;
  height: 58px;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  z-index: 9999;
  box-shadow: 0 14px 35px rgba(0,0,0,.2);
  background: #2aabee;
  display: grid;
  place-items: center;
  overflow: hidden;
}

.contact-fab::after{
  content:"";
  position:absolute;
  inset:-30%;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.25), transparent 55%);
  transform: rotate(10deg);
  animation: fabShine 3.2s linear infinite;
  pointer-events:none;
}

@keyframes fabShine{
  0%{transform: translateX(-20%) rotate(10deg);}
  100%{transform: translateX(20%) rotate(10deg);}
}

.contact-btn.contact-btn--vk{
	background-color: #1b6cff;
}

/* Two icons crossfade */
.contact-fab__icon{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:#fff;
  transition: opacity .4s ease, transform .4s ease;
}

.contact-fab__icon svg{ fill:#fff; }

.contact-fab__icon--wa{ opacity:1; transform: scale(1); }
.contact-fab__icon--tg{ opacity:0; transform: scale(.85); }

/* state: show telegram */
.contact-fab.is-tg{
  background: #1b6cff;
}
.contact-fab.is-tg .contact-fab__icon--wa{ opacity:0; transform: scale(.85); }
.contact-fab.is-tg .contact-fab__icon--tg{ opacity:1; transform: scale(1); }

/* pulse ring */
.contact-fab::before{
  content:"";
  position:absolute;
  inset:-6px;
  border-radius: 999px;
  border: 2px solid rgba(0,0,0,.12);
  animation: fabPulse 1.8s ease-out infinite;
  pointer-events:none;
}
@keyframes fabPulse{
  0%{ transform: scale(.85); opacity:.9; }
  100%{ transform: scale(1.25); opacity:0; }
}

/* Modal base */
.contact-modal{
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: none;
}

.contact-modal.is-open{ display:block; }

.contact-modal__overlay{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.45);
}

.contact-modal__panel{
  position:absolute;
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);
  width: min(760px, calc(100vw - 28px));
  background: #fff;
  border-radius: 16px;
  padding: 22px;
  box-shadow: 0 22px 80px rgba(0,0,0,.25);
}

.contact-modal__close{
  position:absolute;
  right: 14px;
  top: 12px;
  border:0;
  background:none;
  font-size: 22px;
  cursor:pointer;
}

.contact-modal__title{
  text-align:center;
  margin: 0 0 16px;
  font-size: 20px;
}

.contact-modal__grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 16px;
}

.contact-modal__qr{
  background:#f3f6fb;
  border-radius: 14px;
  padding: 14px;
  text-align:center;
      display: flex;
    flex-direction: column;
    align-items: center;
}
.contact-modal__qr-title{
  font-size: 12px;
  margin-bottom: 10px;
  opacity: .8;
}
.contact-modal__qr img{
  width: 220px;
  max-width: 100%;
  border-radius: 10px;
  background:#fff;
  padding:10px;
}

.contact-modal__actions{
  display:grid;
  gap: 12px;
  align-content:center;
}

.contact-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  padding: 14px 14px;
  border-radius: 12px;
  text-decoration:none;
  color:#fff;
  font-weight: 600;
}

.contact-btn__icon{
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display:grid;
  place-items:center;
  background: rgba(255,255,255,.18);
  font-size: 12px;
}

.contact-btn--wa{ background: linear-gradient(90deg, #b6b6b6, #838383); }
.contact-btn--tg{ background: linear-gradient(90deg, #2aabee, #1b6cff); }

.contact-modal__phone{
  margin-top: 14px;
  padding: 14px;
  border-radius: 14px;
  background: #f3f6fb;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
}
.contact-modal__phone-hint{ font-size: 13px; opacity:.8; }
.contact-modal__phone-number{
  font-weight: 800;
  text-decoration:none;
  color:#111;
}

.contact-modal__agree{
  margin-top: 12px;
  display:flex;
  gap: 10px;
  font-size: 12px;
  opacity:.85;
}
.contact-modal__agree a{ color: inherit; }

.contact-modal__footer{
  margin-top: 10px;
  text-align:center;
  font-size: 12px;
  opacity:.7;
}

/* Mobile */
@media (max-width: 680px){
  .contact-modal__grid{ grid-template-columns: 1fr; }
  .contact-modal__phone{ flex-direction: column; align-items:flex-start; }


	.stat__wrapper-items {
		flex-direction: column;
		gap: 20px;
	}

	.cards__wrapper-item img {
		max-width: none;
	}

	:root {
    --h1: 30px;
    --h2: 26px;
    --h4: 18px;
    --sub: 1.3rem;
    --link: 16px;
    --color-default: #363636;
    --color-one: #1e2db8;
    --color-link: black;
    --background-link: #20c997;
    --margin-top: 90px;
    --margin-default: 25px;
    --margin-low: 15px;
    --download-font: 24px;
}

.readyrow #heading__box-h3, .ready__right h3 {
	font-size: 26px;
}

.form-row {
	flex-direction: column;
	width: 100%;
}
.contact-fab {
	bottom: 90px;
}
.form-row input,
.form-row > div{
	width: 100%;
}

.send-wrap p {
	flex-direction: column;
	gap: 0px;
}

.ready__wrapper{
	flex-direction: column-reverse;
}

.banner-hero-img {
	padding: 80px 0px;	
	padding-bottom: 180px;
}

.banner-hero-why {
	bottom: 10px;
	right: auto;
	left: 20px;

	font-size: 21px;
}

.stat__number {
	font-size: 24px;
}
.stat__text {
	font-size: 16px;
}

.plash__wrapper {
	flex-direction: column;
	text-align: center;
	align-items: center;
	justify-content: center;
	gap: 20px;
}
.plash__title {
	text-align: center;
}

.ready__wrapper{
	gap: 15px;
}

.footer__wrapper{
	flex-direction: column;
	gap: 20px;
}
}

body.modal-open{ overflow:hidden; }

.help_wrap {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 20px;
}

.help {
	margin-top: var(--margin-default);
}

.site-main--elementor{
  width: 100%;
  max-width: none;
  padding: 0;
}