:root {
  --orange:#fd7e14;
  --orange-dark:#d95f00;
  --ink:#101828;
  --muted:#667085;
  --line:#eaecf0;
  --soft:#f8fafc;
  --warm:#fff7ef;
  --white:#fff;
  --green:#14a66a;
  --green-dark:#075e54;
  --red:#e5484d;
  --blue:#1877f2;
  --shadow:0 26px 70px rgba(16,24,40,.12);
  --radius:28px
}* {
  box-sizing:border-box
}html {
  scroll-behavior:smooth
}body {
  margin:0;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);
  background:white;
  line-height:1.6
}a {
  text-decoration:none;
  color:inherit
}.container {
  width:min(1160px,calc(100% - 40px));
  margin:0 auto
}.header {
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(234,236,240,.9)
}.nav {
  height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between
}.logo {
  display:inline-flex;
  align-items:baseline;
  gap:4px;
  font-size:28px;
  font-weight:900;
  letter-spacing:-.06em
}.logo span {
  color:var(--ink)
}.logo strong {
  color:var(--orange)
}.menu {
  display:flex;
  align-items:center;
  gap:24px;
  font-size:14px;
  font-weight:800;
  color:#344054
}.menu a:hover {
  color:var(--orange)
}.menu-cta {
  background:var(--ink);
  color:white!important;
  padding:12px 16px;
  border-radius:999px
}.menu-button {
  display:none;
  border:0;
  background:transparent;
  font-size:28px;
  cursor:pointer
}.tag {
  display:inline-flex;
  color:var(--orange-dark);
  background:rgba(253,126,20,.11);
  border:1px solid rgba(253,126,20,.2);
  border-radius:999px;
  padding:8px 12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:12px;
  font-weight:900
}.hero {
  padding:82px 0 40px;
  background:radial-gradient(circle at 82% 16%,rgba(253,126,20,.22),transparent 28%),radial-gradient(circle at 35% 80%,rgba(20,166,106,.08),transparent 30%),linear-gradient(180deg,#fff7ef 0%,#fff 88%);
  overflow:hidden
}.hero-grid {
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:52px;
  align-items:center
}h1,h2,h3,p {
  margin-top:0
}h1 {
  margin:22px 0 18px;
  font-size:clamp(42px,6vw,72px);
  line-height:.94;
  letter-spacing:-.07em
}.subtitle {
  font-size:20px;
  color:var(--muted);
  max-width:650px
}.reinforcement {
  font-size:17px;
  font-weight:800;
  color:#344054;
  background:rgba(255,255,255,.8);
  border:1px solid var(--line);
  border-radius:18px;
  padding:14px 16px;
  max-width:610px
}.actions {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin:28px 0 24px
}.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:0 20px;
  border-radius:999px;
  font-weight:900;
  transition:.18s ease
}.btn:hover {
  transform:translateY(-2px)
}.primary {
  color:white;
  background:var(--orange);
  box-shadow:0 16px 40px rgba(253,126,20,.28)
}.primary:hover {
  background:var(--orange-dark)
}.secondary {
  color:var(--ink);
  background:white;
  border:1px solid var(--line)
}.dark {
  color:white;
  background:var(--ink)
}.light {
  color:var(--ink);
  background:white
}.micro-proof {
  display:flex;
  flex-wrap:wrap;
  gap:10px
}.micro-proof span {
  border:1px solid var(--line);
  border-radius:999px;
  padding:8px 11px;
  color:#475467;
  font-size:13px;
  font-weight:700;
  background:rgba(255,255,255,.75)
}.hero-visual {
  position:relative;
  min-height:650px
}.phone-card {
  position:absolute;
  width:306px;
  height:610px;
  border:8px solid #1f2937;
  border-radius:44px;
  padding:14px;
  background:#0b1220;
  box-shadow:var(--shadow);
  overflow:hidden
}.phone-card:before {
  content:"";
  position:absolute;
  top:8px;
  left:50%;
  width:82px;
  height:24px;
  background:#0a0f1a;
  border-radius:999px;
  transform:translateX(-50%);
  z-index:4
}.unofficial {
  left:0;
  top:54px;
  transform:rotate(-5deg) scale(.94);
  z-index:1
}.official {
  right:0;
  top:0;
  z-index:2;
  border-color:#e5e7eb;
  background:#f8fafc
}.phone-status {
  height:34px;
  color:white;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  font-size:12px;
  font-weight:900;
  padding:0 6px 3px
}.official .phone-status {
  color:var(--ink)
}.battery-low {
  color:#ff5757;
  border:1px solid currentColor;
  border-radius:5px;
  padding:1px 5px
}.battery-full {
  color:var(--green);
  border:1px solid currentColor;
  border-radius:5px;
  padding:1px 5px
}.phone-header {
  color:white;
  border-radius:22px 22px 0 0;
  padding:14px 14px 16px;
  display:grid;
  gap:2px
}.phone-header small {
  font-size:10px;
  font-weight:900;
  letter-spacing:.1em;
  opacity:.9
}.phone-header strong {
  font-size:15px
}.phone-header.danger {
  background:linear-gradient(135deg,#7f1d1d,#ef4444)
}.phone-header.success {
  background:linear-gradient(135deg,#075e54,#14a66a)
}.verified {
  display:inline-grid;
  place-items:center;
  width:17px;
  height:17px;
  margin-left:4px;
  border-radius:50%;
  background:var(--blue);
  color:white;
  font-size:11px
}.chat {
  height:445px;
  padding:14px 12px;
  display:flex;
  flex-direction:column;
  gap:10px
}.unofficial-chat {
  background:#f3f4f6
}.whatsapp-bg {
  background-color:#e5ddd5;
  background-image:radial-gradient(circle at 20px 20px,rgba(255,255,255,.38) 0 2px,transparent 2px),radial-gradient(circle at 70px 52px,rgba(255,255,255,.30) 0 2px,transparent 2px),radial-gradient(circle at 115px 25px,rgba(255,255,255,.32) 0 1.8px,transparent 1.8px),radial-gradient(circle at 40px 95px,rgba(7,94,84,.07) 0 2px,transparent 2px);
  background-size:120px 120px
}.system-note,.meta-note {
  text-align:center;
  font-size:10px;
  line-height:1.35;
  border-radius:14px;
  padding:8px 10px;
  margin-bottom:3px
}.system-note.bad {
  background:#fee2e2;
  color:#991b1b
}.meta-note {
  background:#fff3c4;
  color:#6b4f00
}.bubble {
  max-width:88%;
  padding:10px 12px;
  border-radius:16px;
  font-size:13px;
  line-height:1.35;
  box-shadow:0 3px 8px rgba(16,24,40,.06)
}.bubble.left {
  align-self:flex-start;
  background:white
}.bubble.right {
  align-self:flex-end;
  background:#d9fdd3
}.danger-line {
  border-left:4px solid var(--red)
}.typo {
  color:#991b1b;
  font-weight:900
}.quick-buttons {
  display:grid;
  gap:8px;
  margin-top:5px
}.quick-buttons button {
  border:1px solid rgba(7,94,84,.2);
  color:var(--green-dark);
  background:white;
  border-radius:999px;
  padding:10px;
  font-size:13px;
  font-weight:900
}.phone-badge {
  text-align:center;
  color:white;
  font-size:12px;
  font-weight:900;
  padding:11px;
  border-radius:0 0 22px 22px
}.phone-badge.bad {
  background:var(--red)
}.phone-badge.good {
  background:var(--green)
}.section {
  padding:88px 0
}.section-title {
  max-width:790px;
  margin:0 auto 44px;
  text-align:center
}.section-title h2,.problem h2,.solution h2,.experiment h2,.contact h2 {
  font-size:clamp(34px,4.6vw,56px);
  line-height:1;
  letter-spacing:-.055em;
  margin:18px 0
}.section-title p,.problem p,.solution p,.experiment p,.contact p {
  font-size:18px;
  color:var(--muted)
}.problem {
  background:white
}.problem-grid {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:46px;
  align-items:center
}.problem h3,.solution h3 {
  font-size:28px;
  line-height:1.12;
  letter-spacing:-.035em;
  color:var(--orange-dark)
}.message-queue {
  display:grid;
  gap:14px;
  padding:28px;
  border-radius:30px;
  background:radial-gradient(circle at 80% 20%,rgba(253,126,20,.18),transparent 35%),var(--soft);
  border:1px solid var(--line);
  box-shadow:var(--shadow)
}.message-queue div {
  padding:16px 18px;
  border-radius:18px;
  background:white;
  border:1px solid var(--line);
  font-weight:900;
  box-shadow:0 8px 22px rgba(16,24,40,.05)
}.solution {
  background:var(--ink);
  color:white
}.solution-grid {
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:48px;
  align-items:center
}.solution p {
  color:rgba(255,255,255,.72)
}.flow-panel {
  background:white;
  color:var(--ink);
  border-radius:var(--radius);
  padding:28px;
  display:grid;
  gap:10px;
  box-shadow:var(--shadow)
}.flow-panel div {
  padding:15px;
  border:1px solid var(--line);
  border-radius:16px;
  text-align:center;
  font-weight:900;
  background:#f8fafc
}.flow-panel span {
  color:var(--orange);
  text-align:center;
  font-weight:900;
  font-size:22px
}.benefits {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:24px 0
}.benefits span {
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.85);
  border-radius:999px;
  padding:10px 12px;
  font-weight:800;
  font-size:14px
}.official-comparison {
  background:var(--warm)
}.comparison-table {
  overflow:hidden;
  border-radius:26px;
  border:1px solid rgba(253,126,20,.18);
  background:white;
  box-shadow:var(--shadow)
}.row {
  display:grid;
  grid-template-columns:1.1fr 1fr 1fr;
  border-bottom:1px solid var(--line)
}.row:last-child {
  border-bottom:0
}.row span,.row strong {
  padding:18px
}.row.head {
  background:var(--ink);
  color:white;
  font-weight:900
}.row strong:nth-child(2) {
  color:var(--green)
}.row strong:nth-child(3) {
  color:var(--red)
}.impact-line,.slogan {
  margin:28px auto 0;
  text-align:center;
  font-size:22px;
  font-weight:900;
  letter-spacing:-.03em
}.channels {
  background:white
}.channel-grid,.automation-grid,.why-grid {
  display:grid;
  gap:18px
}.channel-grid {
  grid-template-columns:1.15fr 1.15fr .85fr .85fr
}.channel-grid article,.automation-grid article,.why-grid article {
  background:white;
  border:1px solid var(--line);
  border-radius:24px;
  padding:24px;
  box-shadow:0 12px 36px rgba(16,24,40,.06)
}.channel-grid article {
  min-height:250px
}.channel-grid article div,.automation-grid article div {
  font-size:34px;
  margin-bottom:14px
}.channel-grid h3,.automation-grid h3 {
  font-size:22px;
  margin-bottom:8px
}.channel-grid p,.automation-grid p {
  color:var(--muted);
  margin-bottom:0
}.primary-channel {
  border-top:5px solid var(--orange)!important
}.primary-channel a {
  display:inline-flex;
  margin-top:18px;
  color:var(--orange-dark);
  font-weight:900
}.automations {
  background:var(--soft)
}.automation-grid {
  grid-template-columns:repeat(4,1fr)
}.why {
  background:white
}.why-grid {
  grid-template-columns:repeat(5,1fr)
}.why-grid strong {
  display:block;
  font-size:18px;
  line-height:1.2;
  margin-bottom:10px
}.why-grid span {
  color:var(--muted)
}.experiment {
  background:radial-gradient(circle at 85% 20%,rgba(253,126,20,.27),transparent 25%),var(--ink);
  color:white
}.experiment-card {
  display:grid;
  grid-template-columns:1fr 380px;
  gap:34px;
  align-items:center
}.experiment p {
  color:rgba(255,255,255,.72)
}.experiment-actions {
  display:grid;
  gap:12px
}.contact {
  background:white
}.contact-grid {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:34px;
  align-items:start
}.contact-box {
  display:grid;
  gap:12px;
  border:1px solid var(--line);
  border-radius:26px;
  padding:26px;
  box-shadow:var(--shadow);
  background:var(--soft)
}.contact-box span {
  color:#475467
}.contact-box strong {
  color:var(--ink)
}.footer {
  background:#080d18;
  color:white;
  padding:38px 0
}.footer-grid {
  display:flex;
  justify-content:space-between;
  gap:28px
}.footer-logo span {
  color:white
}.footer p {
  color:rgba(255,255,255,.65);
  margin:8px 0 0
}.footer-links {
  display:grid;
  gap:8px
}.footer-links a {
  color:rgba(255,255,255,.78)
}.floating {
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:60;
  color:white;
  background:var(--orange);
  border-radius:999px;
  padding:14px 18px;
  font-weight:900;
  box-shadow:0 14px 40px rgba(253,126,20,.35)
}@media (max-width: 1080px) {
  .hero-grid,.problem-grid,.solution-grid,.experiment-card,.contact-grid {
  grid-template-columns:1fr
}.hero-visual {
  min-height:700px
}.unofficial {
  left:8%
}.official {
  right:8%
}.channel-grid,.automation-grid,.why-grid {
  grid-template-columns:1fr 1fr
}
}@media (max-width: 780px) {
  .menu-button {
  display:block
}.menu {
  display:none;
  position:absolute;
  left:20px;
  right:20px;
  top:78px;
  background:white;
  border:1px solid var(--line);
  border-radius:22px;
  padding:18px;
  flex-direction:column;
  align-items:stretch;
  box-shadow:var(--shadow)
}.menu.open {
  display:flex
}.row {
  grid-template-columns:1fr
}.row span,.row strong {
  padding:12px 16px
}
}@media (max-width: 640px) {
  .container {
  width:min(100% - 28px,1160px)
}.hero {
  padding:52px 0 48px
}.section {
  padding:64px 0
}h1 {
  font-size:42px
}.hero-visual {
  min-height:1130px
}.phone-card {
  left:50%!important;
  right:auto!important;
  width:292px;
  transform:translateX(-50%)!important
}.unofficial {
  top:0
}.official {
  top:528px
}.channel-grid,.automation-grid,.why-grid {
  grid-template-columns:1fr
}.footer-grid {
  flex-direction:column
}
}

/* =======================================================
   META TECH PROVIDER
======================================================= */ .trust-meta  {
   padding: 10px 0 28px;
   background: #ffffff;
   
}

.meta-verification-card  {
   padding: 30px 34px;
   background: #ffffff;
   border: 1px solid #e9ecef;
   border-radius: 18px;
   box-shadow: 0 10px 30px rgba(0, 0, 0, .04);
   max-width: 100%;
   overflow: hidden;
   
}

.meta-content  {
   max-width: 920px;
   
}

.meta-logo  {
   margin-bottom: 16px;
   
}

.meta-logo img  {
   display: block;
   width: 120px;
   height: auto;
   max-width: 120px;
   object-fit: contain;
   
}

.meta-badge  {
   display: inline-block;
   margin-bottom: 12px;
   padding: 6px 12px;
   background: rgba(253, 126, 20, .12);
   color: #fd7e14;
   border-radius: 999px;
   font-weight: 800;
   font-size: .85rem;
   
}

.meta-content h3  {
   margin: 0 0 10px;
   color: #101828;
   font-size: 22px;
   line-height: 1.2;
   
}

.meta-content p  {
   margin: 0;
   color: #667085;
   font-size: 16px;
   line-height: 1.65;
   
}

@media (max-width: 768px)  {
   .meta-verification-card  {
   padding: 24px;
   
}

.meta-logo img  {
   width: 108px;
   max-width: 108px;
   
}

}
