html { margin:0; padding:0; }
body {
	font-size:14px;
	font-family:Arial,sans-serif;
	background-color:#fdf6e8;
	margin:0; padding:0;
	color:#3d2b1f;
}
body::before {
	content:'';
	position:fixed;
	top:-30%; left:0; right:0; height:160%;
	background-image:url('/logo/getsms.online.bg.webp');
	background-size:cover;
	background-position:center top;
	z-index:-1;
	transform:translateY(var(--parallax-y,0px));
	will-change:transform;
}
a, a:visited { outline:0; color:#7a4030; text-decoration:none; }
a:hover { text-decoration:underline; color:#b05840; }

#nav-container {
	width:100%; position:fixed; top:0;
	background:rgba(55,30,15,0.88);
	backdrop-filter:blur(6px);
	z-index:100; height:30px;
	box-shadow:0 1px 8px rgba(0,0,0,0.2);
}
nav { max-width:1400px; margin:0 auto; display:block; color:#fff; }
nav ul { width:100%; margin:0; padding:0; background:transparent; list-style:none; position:relative; display:inline-table; white-space:nowrap; }
nav a, nav a:hover, nav a:visited { color:#f5dfc8; text-decoration:none; }
nav a, nav span { padding:6px 20px; display:block; }
nav a:hover, nav span:hover { background:rgba(255,255,255,0.12); transition:all 0.5s; }
nav li { display:inline-block; cursor:pointer; position:relative; }
nav ul ul { width:auto; position:absolute; visibility:hidden; opacity:0; margin:0; text-align:center; box-shadow:5px 5px 5px rgba(0,0,0,0.3); transition:opacity 0.3s ease,visibility 0.3s ease; background:rgba(55,30,15,0.95); }
nav ul ul li { display:block; }
nav li li:not(:first-child) { border-top:1px solid rgba(255,255,255,0.1); }
nav ul ul ul { position:absolute; top:3px; left:100%; }
nav:not(:hover) ul ul { transition:all 0s; transition-delay:0.8s; }
nav ul li:hover>ul { visibility:visible; opacity:1; }
nav a:hover, nav span:hover { transition:all 0.5s; transition-delay:0s; }

#main-container { transition:all 0.5s; transition-delay:0.3s; position:relative; z-index:1; }
.container { margin:30px auto 5px; padding:10px; display:block; max-width:100%; }

.docname { font-size:150%; display:block; margin-top:10px; }

input[type=password], input[type=text], textarea {
	border:1px solid #d4b89a; border-radius:3px; padding:5px 3px; outline:none; background:#fffaf4;
	width:calc(100% - 8px);
}
input[type=checkbox] { display:none; }
input[type=checkbox] + label { display:block; width:18px; height:18px; border:1px solid #d4b89a; border-radius:3px; }
input[type=checkbox] + label span { font-size:120%; display:block; margin:-2px 0 0 3px; }
input[type=checkbox]:checked + label span:before { content:'✔'; }

input[type=button], input[type=submit], .fake_btn {
	border:0; background-color:#6b3a28; color:#fff; padding:10px 16px;
	cursor:pointer; text-transform:uppercase; transition:all 0.2s;
	border-radius:6px; box-shadow:5px 5px 5px rgba(0,0,0,0.15);
	font-family:Arial,sans-serif; font-size:13px;
}
input[type=button]:hover, input[type=submit]:hover, .fake_btn:hover {
	background-color:#9b5030; box-shadow:7px 7px 7px rgba(0,0,0,0.2); transform:translate(1px,-1px);
}
.fake_btn { display:inline-block; text-decoration:none; }
.green_btn { background-color:#3a7a30; box-shadow:5px 5px 5px rgba(40,80,20,0.2); }
.green_btn:hover { background-color:#4a9a3c; }

select {
	background:#fffaf4 url(img/droparr.svg) no-repeat right center;
	-webkit-appearance:none; -moz-appearance:none;
	border:1px solid #d4b89a; border-radius:2px;
	padding:5px 10px 5px 3px; width:100%; scrollbar-width:thin;
}
select option { background-color:#6b3a28; color:#fff; padding:5px; }
select option:checked { color:#000; background:#ccc; }

.hidden { display:none; }
pre { background:#fffaf0; padding:10px; border:1px solid #e8d4b8; border-radius:4px; }

#err-container {
	width:100%; padding:3px; position:fixed; top:30px; left:0; z-index:90;
	background-color:#ffc; color:#f00; text-align:center;
	font-size:14px; font-weight:bold; cursor:pointer;
}

table { border-collapse:collapse; }
table, th, td { border:none; }
td, th { padding:2px 1px 2px 4px; }
.datatable { table-layout:fixed; }
.datatable td { border:1px solid #e8d4b8; overflow:hidden; overflow-wrap:break-word; }
.datatable tr:nth-child(even) { background-color:rgba(0,0,0,0.02); }
.datatable tr:hover { background-color:rgba(0,0,0,0.04); }
.datatable th { background-color:#6b3a28; font-weight:normal; color:#fff; border-color:#8b5a38; border-bottom:none; transition:all 0.5s; }

.chat_btn { position:fixed; z-index:200; border:0; bottom:25px; right:25px; width:60px; height:60px; transition:all 0.2s; }
.chat_btn:hover { transform:rotate(-10deg) scale(1.2); cursor:pointer; }

@keyframes bg_show { 0%{opacity:0} 100%{opacity:1} }
#pop_bg { z-index:100; position:fixed; top:0; right:0; bottom:0; left:0; display:none; background:rgba(0,0,0,0.25); animation:bg_show 0.2s linear; }
#pop_win { z-index:200; width:600px; top:40px; left:50%; margin-left:-300px; padding:5px; text-align:center; position:fixed; display:none; background:#fff; border:1px solid #c4a888; }
#pop_win_data { height:300px; overflow-y:scroll; scrollbar-width:thin; }
#info_win { background:#f0fff0; border:2px solid #2a7060; border-radius:12px; z-index:200; width:280px; padding:5px; text-align:center; position:fixed; display:none; transition:all 1s; }
.info_win_show { animation:info_win_show 1s ease-in-out forwards; }
@keyframes info_win_show { 0%{top:-250px} 100%{top:120px} }
#copy_win { background:rgba(255,248,232,0.95); z-index:300; padding:5px; text-align:center; position:fixed; border:1px solid #2a7060; display:none; animation:copy_win_show 2s linear forwards; }
@keyframes copy_win_show { 0%{opacity:1} 80%{opacity:1} 100%{opacity:0} }

.copy_text {
cursor: copy;
text-decoration: underline;
text-decoration-style: dashed;
}

/* ── LP container ── */
#lp {
	text-align:center;
	width:calc(100% - 20px);
	max-width:1600px;
	margin:0 auto;
	background:rgba(255,255,255,0.1);
	backdrop-filter:blur(10px);
	-webkit-backdrop-filter:blur(10px);
	border-radius:18px;
	border:1px solid rgba(255,220,180,0.6);
	box-shadow:0 8px 40px rgba(100,50,20,0.12);
	padding:10px 28px 28px;
	box-sizing:border-box;
}
#lp .fake_btn { padding:16px 25px; }
#lp .green { color:#2a7060; }
#lp .green-bg { background:#f0fff8; border:2px solid #2a7060; }
#lp h1 { font-size:36px; font-weight:800; line-height:1.1; color:#4a2818; margin-bottom:16px; }
#lp .docname { font-size:36px; font-weight:800; margin-bottom:10px; color:#4a2818; }
#lp input[type="text"],
#lp input[type="password"] { width:100%; padding:12px 14px; border-radius:6px; border:1px solid #c4a888; background:#fffaf4; font-size:14px; transition:all 0.2s ease; outline:none; }
#lp input[type="text"]:focus,
#lp input[type="password"]:focus { background:#fff; box-shadow:5px 5px 5px rgba(0,0,0,0.12); }

/* ── Hero ── */
.lp-general { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:36px 0 40px; }
.hero-logo { height:240px; width:auto; max-width:100%; object-fit:contain; margin-bottom:12px; }
.lp-subtitle { font-size:16px; line-height:1.6; margin-bottom:30px; color:#6a4030; }
.lp-buttons { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* ── Sections ── */
.lp-section { padding-bottom:60px; opacity:0; transform:translateY(40px); transition:opacity 0.7s ease,transform 0.7s ease; }
#lp .visible { opacity:1; transform:translateY(0); }
.lp-section h2 { font-size:26px; font-weight:600; color:#4a2818; margin-bottom:24px; }

/* ── Phone number grid ── */
.phone-grid {
	display:grid;
	grid-template-columns:repeat(5,1fr);
	gap:12px;
}
.phone-card {
	background:rgba(255,255,255,0.9);
	border:1px solid rgba(200,160,120,0.35);
	border-radius:10px;
	box-shadow:3px 3px 8px rgba(100,50,20,0.08);
	padding:12px 10px;
	text-align:center;
	cursor:pointer;
	transition:all 0.2s;
	display:flex; flex-direction:column; align-items:center; gap:6px;
}
.phone-card:hover {
	background:#fff;
	box-shadow:5px 5px 14px rgba(100,50,20,0.16);
	transform:translateY(-2px);
	border-color:rgba(200,120,80,0.5);
}
.phone-card .phone-number { font-size:20px; font-weight:700; color:#4a2818; padding: 10px 0px; }
.phone-card .phone-country { font-size:16px; color:#9a7060; }

/* ── SMS feed ── */
.sms-feed { font-size:14px; display:flex; flex-direction:column; gap:10px; }
.sms-item {
	background:rgba(255,255,255,0.88);
	border:1px solid rgba(200,160,120,0.3);
	border-radius:10px;
	box-shadow:3px 3px 8px rgba(100,50,20,0.07);
	padding:14px 18px;
	text-align:left;
}
.sms-item:hover { box-shadow:5px 5px 14px rgba(100,50,20,0.14); }
.sms-item-header {
	display:flex; align-items:center; gap:10px; margin-bottom:6px;
}
.sms-service {
	font-weight:700; color:#6b3a28;
	background:rgba(107,58,40,0.08);
	border-radius:4px; padding:2px 8px;
}
.sms-time { color:#9a7060; margin-left:auto; white-space:nowrap; }
.sms-text { line-height:1.5; color:#3d2b1f; }

/* ── Box ── */
.lp-box { padding:30px; line-height:1.4; margin:0 auto; position:relative; overflow:hidden; background:rgba(255,248,232,0.95); border:2px solid #c8903a; border-radius:14px; font-size:16px; box-shadow:0 4px 20px rgba(150,90,20,0.12); }
.lp-box::before { content:''; position:absolute; top:0; left:0; right:0; height:6px; background:linear-gradient(90deg,#c8903a,#e8c070,#c8903a); }
.lp-box h2 { margin-bottom:10px; color:#6b3a28; }
.lp-box div { margin-bottom:16px; }
.lp-price-value { font-size:40px; font-weight:800; color:#4a2818; }

/* ── Cards / Features ── */
.lp-card, .lp-faq-item { background:rgba(255,255,255,0.88); border:1px solid rgba(200,160,120,0.3); border-radius:12px; box-shadow:5px 5px 5px rgba(100,50,20,0.08); }
.lp-card:hover, .lp-faq-item:hover { box-shadow:7px 7px 7px rgba(100,50,20,0.14); }
.lp-card:hover { transform:translateY(-3px); }
.lp-card h3, .lp-step h4 { font-size:15px; font-weight:700; color:#4a2818; margin-bottom:6px; }
.lp-card div, .lp-step div, .lp-faq-answer { font-size:14px; line-height:1.6; }
.lp-features { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.lp-card { padding:24px 20px; text-align:left; transition:all 0.25s; }
.lp-card .lp-card-icon { width:40px; height:40px; border-radius:6px; background:rgba(107,58,40,0.06); margin-bottom:12px; font-size:24px; text-align:center; }

/* ── Steps ── */
.lp-steps { display:grid; grid-template-columns:repeat(4,1fr); position:relative; }
.lp-steps::before { content:''; position:absolute; top:20px; left:calc(12.5% + 16px); right:calc(12.5% + 16px); height:2px; background:rgba(107,58,40,0.1); }
.lp-step { padding:0 10px; position:relative; z-index:1; }
.lp-step-num { width:42px; height:42px; border-radius:50%; background:#6b3a28; color:#fff; font-size:16px; font-weight:700; display:flex; align-items:center; justify-content:center; margin:0 auto 12px; }

/* ── FAQ ── */
.lp-faq { max-width:860px; margin:0 auto; }
.lp-faq-item { margin-bottom:8px; overflow:hidden; text-align:left; }
.lp-faq-item summary { padding:14px 18px; font-size:14px; font-weight:600; color:#4a2818; cursor:pointer; list-style:none; }
.lp-faq-item summary::-webkit-details-marker { display:none; }
.lp-faq-item summary:hover { background:rgba(107,58,40,0.03); }
.lp-faq-answer { padding:0 18px 14px; }
.lp-contact { padding:20px 0; font-size:14px; }

/* ── Responsive ── */
@media (max-width:1100px) { .phone-grid { grid-template-columns:repeat(4,1fr); } }
@media (max-width:800px)  { .phone-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:700px) {
	#lp { width:calc(100% - 20px); padding:10px 12px 20px; }
	.lp-general { padding:28px 0 30px; }
	#lp h1 { font-size:28px; }
	.lp-general img { width:64px; }
	.lp-buttons { flex-direction:column; align-items:center; }
	.lp-features { grid-template-columns:1fr; }
	.lp-section h2 { font-size:22px; }
	.lp-steps { grid-template-columns:1fr 1fr; gap:20px; }
	.lp-steps::before { display:none; }
	.phone-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:400px) {
	.lp-steps { grid-template-columns:1fr; }
	.phone-grid { grid-template-columns:repeat(2,1fr); }
}
