/* ================================================================
   DTP Landing Page – Stylesheet v2
   Scope: .dtp-landing-page-body | Source: HTML gốc v16_final
   ================================================================ */

/* ── Reset Flatsome & Outdoor overrides ── */
.dtp-landing-page-body { padding-top: 0 !important; font-size: 16px !important; }
.dtp-landing-page-body #page,
.dtp-landing-page-body #main,
.dtp-landing-page-body .page-wrapper,
.dtp-landing-page-body #wrapper { all: unset; display: block; }

/* ── Outdoor: input padding-left:40px (icon), submit padding:2px ── */
.dtp-landing-page-body input[type=text],
.dtp-landing-page-body input[type=tel],
.dtp-landing-page-body input[type=email],
.dtp-landing-page-body input[type=url],
.dtp-landing-page-body select { padding: 14px 16px !important; height: 52px !important; box-sizing: border-box !important; font-size: 15px !important; line-height: 1.4 !important; }
.dtp-landing-page-body button[type=submit] { padding: 13px 20px !important; }

/* ── Flatsome: th:first-child/td:first-child padding-left:0 ── */
.dtp-landing-page-body .tablebox th:first-child,
.dtp-landing-page-body .tablebox td:first-child { padding-left: 22px !important; }

/* ── Outdoor: body font-size:14px!important ── */
.dtp-landing-page-body h1 { font-size: 48px !important; line-height: 1.08 !important; }
.dtp-landing-page-body h2 { font-size: 36px !important; line-height: 1.18 !important; }
.dtp-landing-page-body h3 { font-size: inherit !important; }

/* ── Topbar: Outdoor header-top:background:none!important ── */
.dtp-landing-page-body .topbar { background: #fff !important; z-index: 9999 !important; }

/* ── Logo ── */
.dtp-landing-page-body .dtp-site-logo { display: flex; align-items: center; }
.dtp-landing-page-body .dtp-site-logo a { display: flex; align-items: center; text-decoration: none; color: inherit; }
.dtp-landing-page-body .dtp-logo-img { height: 90px; width: auto; display: block; object-fit: contain; max-width: 200px; padding-top: 24px !important; margin: 0; }

/* Hero image — see .hero-photo-img above */

/* ── dtp-badge (đã đổi từ .badge để tránh Flatsome override) ── */
.dtp-landing-page-body .dtp-badge { display: inline-block; background: var(--lime); color: var(--green-dark); border-radius: 999px; padding: 5px 10px; font-size: 13px; font-weight: 700; }
.dtp-landing-page-body .product.selected .dtp-badge,
.dtp-landing-page-body .product.featured-product .dtp-badge { background: var(--green); color: #fff; }


:root {
  --green:#0f7a3b;
  --green-dark:#07522a;
  --lime:#e9f7ef;
  --orange:#ff8a00;
  --dark:#18212b;
  --muted:#5f6b7a;
  --light:#f6f8fa;
  --border:#dfe5ea;
  --shadow:0 10px 30px rgba(0,0,0,.08);
  --radius:18px;
}

* {box-sizing:border-box}

body {
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  color:var(--dark);
  background:#fff;
  line-height:1.55;
}

.dtp-landing-page-body a {text-decoration:none;color:inherit}

.dtp-landing-page-body .topbar {
  position:sticky;top:0;z-index:50;
  background:#fff;border-bottom:1px solid var(--border);
  box-shadow:0 2px 12px rgba(0,0,0,.04);
}

.dtp-landing-page-body .wrap {max-width:1180px;margin:auto;padding:0 22px}

.dtp-landing-page-body .nav {height:80px;display:flex;align-items:center;justify-content:space-between;gap:20px}

.dtp-landing-page-body .logo {display:flex;align-items:center;gap:12px;font-weight: 700;color:var(--green-dark)}

.dtp-landing-page-body .logo-mark {width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--green),#53ba6f);display:grid;place-items:center;color:#fff;font-size:22px}

.dtp-landing-page-body .nav-actions {display:flex;gap:10px;align-items:center}

.dtp-landing-page-body .hotline {font-weight: 700;color:var(--green-dark)}

.dtp-landing-page-body .btn {display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:15px 20px;font-weight:700;font-size:16px;border:1px solid transparent}

.dtp-landing-page-body .btn-primary {background:var(--orange);color:#fff}

.dtp-landing-page-body .btn-green {background:var(--green);color:#fff}

.dtp-landing-page-body .btn-outline {border-color:var(--green);color:var(--green);background:#fff}

.dtp-landing-page-body section {padding:30px 0}

.dtp-landing-page-body .hero {
  padding:62px 0 44px;
  background:linear-gradient(135deg,#edf8f1 0%,#fff 48%,#eef8ff 100%);
}

.dtp-landing-page-body .hero-grid {display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:center;}

.dtp-landing-page-body .eyebrow {display:inline-flex;gap:8px;align-items:center;background:#fff;border:1px solid #cfe7d7;color:var(--green-dark);padding:8px 13px;border-radius:999px;font-weight:700;font-size:14px}

.dtp-landing-page-body h1 {font-size:48px;line-height:1.08;margin:18px 0 16px;color:#10251a}

.dtp-landing-page-body .hero p {font-size:19px;color:#344051;margin:0 0 22px}

.dtp-landing-page-body .ticks {display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}

.dtp-landing-page-body .hero-list {grid-template-columns:1fr 1fr;max-width:760px;gap:14px;margin:20px 0 22px}

.dtp-landing-page-body .hero-list .tick {padding:14px 18px;background:#fff;border:1px solid #d9eee0;border-radius:14px;font-size:16px;font-weight:700}

.dtp-landing-page-body .tick {background:#fff;border:1px solid #d9eee0;border-radius:14px;padding:12px 14px;font-weight:700}

.dtp-landing-page-body .tick:before {content:"✓";color:var(--green);font-weight: 700;margin-right:8px}

.dtp-landing-page-body .hero-cta {display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}

.dtp-landing-page-body .hero-card {background:#fff;border-radius:24px;box-shadow:var(--shadow);padding:14px;border:1px solid #edf0f2}

.dtp-landing-page-body .photo {
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  background: #0b5d32;
  height: 370px;   /* fixed height container */
}

/* Ảnh thật: fill toàn bộ container, không phụ thuộc kích thước gốc */
.dtp-landing-page-body .hero-photo-img {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block;
  border-radius: 0;  /* border-radius đã do .photo đảm nhiệm */
}

/* Placeholder khi chưa upload ảnh */
.dtp-landing-page-body .photo-placeholder {
  height: 370px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: rgba(255,255,255,.7);
  background: linear-gradient(135deg,#0b5d32,#5baa66);
  border-radius: 18px;
  padding: 24px;
  text-align: center;
}
.dtp-landing-page-body .photo-placeholder span { font-size: 48px; }
.dtp-landing-page-body .photo-placeholder p { margin:0; font-size:16px; }

.dtp-landing-page-body .stats {display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:28px}

.dtp-landing-page-body .stat {background:#fff;border:1px solid var(--border);border-radius:16px;padding:16px;text-align:center}

.dtp-landing-page-body .stat strong {display:block;font-size:25px;color:var(--green)}

.dtp-landing-page-body .section-title {text-align:center;max-width:820px;margin:0 auto 34px}

.dtp-landing-page-body h2 {font-size:36px;line-height:1.18;margin:0 0 12px;color:#10251a}

.dtp-landing-page-body .section-title p {color:var(--muted);font-size:17px;margin:0}

.dtp-landing-page-body .price-cards {display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:22px}

.dtp-landing-page-body .price-card {border:1px solid var(--border);border-radius:var(--radius);padding:24px;background:#fff;box-shadow:var(--shadow)}

.dtp-landing-page-body .price-card.featured {border:2px solid var(--green);transform:translateY(-4px)}

.dtp-landing-page-body .price-card h3 {font-size:24px;margin:0 0 6px}

.dtp-landing-page-body .price {font-size:30px;font-weight: 700;color:var(--orange);margin:10px 0}

.dtp-landing-page-body .muted {color:var(--muted)}

.dtp-landing-page-body .tablebox {overflow:hidden;border:1px solid var(--border);border-radius:18px;background:#fff;box-shadow:var(--shadow)}

.dtp-landing-page-body .tablebox table td{font-size: 16px; color: --dark !important;}

.dtp-landing-page-body .tablebox table th{font-weight: 16px; text-transform: none;}

.dtp-landing-page-body table {width:100%;border-collapse:collapse}

.dtp-landing-page-body th, .dtp-landing-page-body td {padding:16px;border-bottom:1px solid var(--border);text-align:left}

.dtp-landing-page-body th {background:var(--green);color:#fff}

.dtp-landing-page-body tr:last-child td {border-bottom:0}

.dtp-landing-page-body .cta-strip {margin-top:24px;background:var(--green-dark);color:#fff;border-radius:18px;padding:22px;display:flex;align-items:center;justify-content:space-between;gap:18px}

.dtp-landing-page-body .grass-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

.dtp-landing-page-body .product {border:1px solid var(--border);border-radius:20px;background:#fff;overflow:hidden;box-shadow:var(--shadow);cursor:pointer;transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease}

.dtp-landing-page-body .product:hover {transform:translateY(-7px);border-color:var(--green);box-shadow:0 18px 42px rgba(15,122,59,.18)}

.dtp-landing-page-body .product:hover .prod-img {transform:scale(1.03)}

.dtp-landing-page-body .product.selected {border:2px solid var(--green);background:#fbfffc;transform:translateY(-5px)}

.dtp-landing-page-body .product.selected .badge {background:var(--green);color:#fff}

.dtp-landing-page-body .product.featured-product {border:2px solid var(--green);transform:translateY(-5px)}

.dtp-landing-page-body .product.featured-product .badge {background:var(--green);color:#fff}

.dtp-landing-page-body .prod-img {height:240px;background-color:#188545;background-size:cover;background-position:center;background-repeat:no-repeat;position:relative;transition:transform .3s ease;overflow:hidden}

.dtp-landing-page-body .prod-img:after {content:"ẢNH CẬN SỢI CỎ";position:absolute;inset:auto 16px 16px;color:#fff;font-weight: 700}

.dtp-landing-page-body .product-body {padding:20px}

.dtp-landing-page-body .product-body p {margin:12px 0;color:#344051}

.dtp-landing-page-body .grass-advice {margin-top:24px;background:#fff;border:1px solid var(--border);border-radius:18px;padding:22px;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:space-between;gap:22px}

.dtp-landing-page-body .grass-advice strong {display:block;font-size:20px;color:#10251a;margin-bottom:4px}

.dtp-landing-page-body .grass-advice-text {color:#344051}

.dtp-landing-page-body .grass-advice .btn {white-space:nowrap}

.dtp-landing-page-body .badge {display:inline-block;background:var(--lime);color:var(--green-dark);border-radius:999px;padding:5px 10px;font-size:13px;font-weight: 700}


.dtp-landing-page-body .project-showcase {display:grid;gap:18px}

.dtp-landing-page-body .project-row {display:grid;grid-template-columns:1fr 1fr;gap:18px}

.dtp-landing-page-body .project-item {background:#fff;border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}

.dtp-landing-page-body .project-image {position:relative;overflow:hidden;background-color:#1b7542;background-size:cover !important;background-position:center !important;background-repeat:no-repeat !important;border-radius:14px}

.dtp-landing-page-body .project-image.small {height:245px}

.dtp-landing-page-body .project-image.large {height:420px}

.dtp-landing-page-body .project-image:before {content:"";position:absolute;inset:0;background:linear-gradient(transparent 42%,rgba(0,0,0,.72));z-index:1}



.dtp-landing-page-body .project-item:hover {transform:translateY(-4px);transition:.25s}

.dtp-landing-page-body .project-overlay {position:absolute;left:18px;bottom:16px;z-index:2}

.dtp-landing-page-body .project-overlay strong {display:block;font-size:20px;letter-spacing:.3px}

.dtp-landing-page-body .project-image.large .project-overlay strong {font-size:28px}

.dtp-landing-page-body .project-caption {padding:12px 16px 15px;color:#344051;font-size:15px}


.dtp-landing-page-body .project-tabs {display:flex;gap:10px;justify-content:center;margin-bottom:20px;flex-wrap:wrap}

.dtp-landing-page-body .tab {padding:10px 16px;border-radius:999px;background:#fff;border:1px solid var(--border);font-weight: 700}

.dtp-landing-page-body .tab.active {background:var(--green);color:#fff;border-color:var(--green)}

.dtp-landing-page-body .gallery {display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

.dtp-landing-page-body .project {
  min-height:210px;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,#1b7542,#9cc66a);position:relative;color:#fff;box-shadow:var(--shadow)
}

.dtp-landing-page-body .project:before {content:"";position:absolute;inset:0;background:linear-gradient(transparent 35%,rgba(0,0,0,.68))}

.dtp-landing-page-body .project-info {position:absolute;bottom:0;padding:16px}

.dtp-landing-page-body .project-info strong {display:block;font-size:18px}


.dtp-landing-page-body .ccgrass-section {background:#f7fbf8}

.dtp-landing-page-body .ccgrass-layout {display:grid;grid-template-columns:.45fr .55fr;gap:30px;align-items:start}

.dtp-landing-page-body .ccgrass-content {background:#fff;border:1px solid var(--border);border-radius:22px;padding:32px;box-shadow:var(--shadow)}

.dtp-landing-page-body .trust-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0}

.dtp-landing-page-body .trust-box {background:var(--lime);border:1px solid #cfe7d7;border-radius:16px;padding:16px;text-align:center}

.dtp-landing-page-body .trust-box strong {display:block;font-size:23px;color:var(--green-dark);line-height:1.1}

.dtp-landing-page-body .trust-box span {font-size:13px;color:#344051}

.dtp-landing-page-body .ccgrass-list {display:grid;gap:11px;margin-top:16px}

.dtp-landing-page-body .ccgrass-list div {padding:13px 14px;border:1px solid var(--border);border-radius:14px;background:#fbfffc;font-weight:700}

.dtp-landing-page-body .ccgrass-list div:before {content:"✓";color:var(--green);font-weight: 700;margin-right:8px}

.dtp-landing-page-body .ccgrass-visual {display:grid;gap:16px}

.dtp-landing-page-body .ccgrass-img-card {background:#fff;border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow);overflow:hidden;padding:12px}

.dtp-landing-page-body .ccgrass-img-card img {display:block;width:100%;height:100%;object-fit:contain;border-radius:14px}

.dtp-landing-page-body .ccgrass-img-card.trusted {height:330px}

.dtp-landing-page-body .ccgrass-bottom-grid {display:grid;grid-template-columns:1fr 1fr;gap:16px}

.dtp-landing-page-body .ccgrass-img-card.certificate, .dtp-landing-page-body .ccgrass-logo-card {height:230px}

.dtp-landing-page-body .ccgrass-logo-card {background:#fff;border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow);display:grid;place-items:center;padding:20px;text-align:center}

.dtp-landing-page-body .ccgrass-logo-text {font-size:34px;font-weight: 700;color:var(--green-dark);letter-spacing:-1px}

.dtp-landing-page-body .ccgrass-logo-sub {font-size:14px;color:#667085;margin-top:4px}


.dtp-landing-page-body .brand {background:#f7fbf8}

.dtp-landing-page-body .brand-grid {display:grid;grid-template-columns:.9fr 1.1fr;gap:24px;align-items:center}

.dtp-landing-page-body .brand-card {background:#fff;border:1px solid var(--border);border-radius:22px;padding:28px;box-shadow:var(--shadow)}

.dtp-landing-page-body .logo-row {display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}

.dtp-landing-page-body .brand-logo {height:120px;border:2px dashed #b6d7c0;border-radius:18px;display:grid;place-items:center;font-weight: 700;color:var(--green-dark);text-align:center;background:#fff}

.dtp-landing-page-body .warehouse-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

.dtp-landing-page-body .warehouse-img {height:180px;border-radius:18px;background:linear-gradient(135deg,#d8e8dc,#789c76);display:flex;align-items:end;padding:15px;color:#fff;font-weight: 700;box-shadow:var(--shadow)}

.dtp-landing-page-body .why-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

.dtp-landing-page-body .why {background:#fff;border:1px solid var(--border);border-radius:18px;padding:22px;box-shadow:var(--shadow)}

.dtp-landing-page-body .why .num {width:38px;height:38px;border-radius:12px;background:var(--green);color:#fff;display:grid;place-items:center;font-weight: 700;margin-bottom:12px}

.dtp-landing-page-body .steps {display:grid;grid-template-columns:repeat(6,1fr);gap:12px}

.dtp-landing-page-body .step {background:#fff;border:1px solid var(--border);border-radius:18px;padding:16px;text-align:center;box-shadow:var(--shadow)}

.dtp-landing-page-body .step .ico {height:72px;border-radius:14px;background:var(--lime);display:grid;place-items:center;font-size:26px;margin-bottom:12px}

.dtp-landing-page-body .review-faq {background:#f8fafb}

.dtp-landing-page-body .review-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:30px}

.dtp-landing-page-body .review {background:#fff;border:1px solid var(--border);border-radius:20px;padding:20px;box-shadow:var(--shadow)}

.dtp-landing-page-body .avatar {height:92px;border-radius:16px;background:linear-gradient(135deg,#e3e9ef,#aeb9c4);display:grid;place-items:center;font-weight: 700;color:#fff;margin-bottom:14px}

.dtp-landing-page-body .faq {max-width:900px;margin:auto}

.dtp-landing-page-body details {background:#fff;border:1px solid var(--border);border-radius:14px;padding:16px 18px;margin-bottom:10px}

.dtp-landing-page-body summary {font-weight: 700;cursor:pointer}

.dtp-landing-page-body .final-cta {background:linear-gradient(135deg,var(--green-dark),var(--green));color:#fff;text-align:center}

.dtp-landing-page-body .formbox {max-width:760px;margin:26px auto 0;background:#fff;color:var(--dark);border-radius:22px;padding:22px;box-shadow:var(--shadow)}

.dtp-landing-page-body .final-cta .formbox {max-width:820px}

.dtp-landing-page-body .form-grid {display:grid;grid-template-columns:1fr 1fr;gap:10px}

.dtp-landing-page-body input, .dtp-landing-page-body select {width:100%;padding:14px 16px;height:52px;border:1px solid var(--border);border-radius:12px;font-size:15px;box-sizing:border-box;line-height:1.4;}

.dtp-landing-page-body .full {grid-column:1/-1}

.dtp-landing-page-body .mobile-preview {
  margin-top:70px;padding:40px 0;background:#111827;color:#fff;
}

.dtp-landing-page-body .phone {
  width:390px;max-width:100%;height:780px;margin:20px auto;background:#fff;color:var(--dark);border-radius:38px;padding:14px;border:10px solid #050505;overflow:hidden;box-shadow:0 20px 80px rgba(0,0,0,.35)
}

.dtp-landing-page-body .phone-screen {height:100%;overflow:auto;border-radius:26px;background:#fff}

.dtp-landing-page-body .phone .mini-nav {height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid var(--border);font-weight: 700;color:var(--green-dark)}

.dtp-landing-page-body .phone .mini-hero {padding:22px 16px;background:linear-gradient(135deg,#edf8f1,#fff)}

.dtp-landing-page-body .phone h3 {font-size:25px;line-height:1.12;margin:12px 0}

.dtp-landing-page-body .phone .mini-img {height:210px;border-radius:18px;background:linear-gradient(135deg,#0b5d32,#77b366);display:flex;align-items:end;padding:16px;color:#fff;font-weight: 700}

.dtp-landing-page-body .phone .mini-card {margin:12px 16px;padding:16px;border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow)}

.dtp-landing-page-body .phone .mini-title {font-size:20px;font-weight: 700;color:#10251a}

.dtp-landing-page-body .phone .mini-grid {display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 16px}

.dtp-landing-page-body .phone .mini-photo {height:112px;border-radius:14px;background:linear-gradient(135deg,#1b7542,#9cc66a);display:flex;align-items:end;padding:10px;color:#fff;font-size:12px;font-weight: 700}


.dtp-landing-page-body .warehouse-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

.dtp-landing-page-body .warehouse-card {background:#fff;border:1px solid var(--border);border-radius:18px;overflow:hidden;box-shadow:var(--shadow);transition:transform .25s ease, box-shadow .25s ease}

.dtp-landing-page-body .warehouse-card:hover {transform:translateY(-5px);box-shadow:0 18px 42px rgba(15,122,59,.14)}

.dtp-landing-page-body .warehouse-photo {width:100%;aspect-ratio:4/3;background-color:#789c76;background-size:cover;background-position:center;background-repeat:no-repeat;display:block;overflow:hidden;border-radius:12px 12px 0 0;position:relative}

.dtp-landing-page-body .warehouse-photo:before {content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(0,0,0,.55))}

.dtp-landing-page-body .warehouse-photo span {position:relative}

.dtp-landing-page-body .warehouse-caption {padding:13px 15px;color:#344051;font-weight:700;font-size:15px}


.dtp-landing-page-body .process-grid {display:grid;grid-template-columns:repeat(6,1fr);gap:12px}

.dtp-landing-page-body .process-card {background:#fff;border:1px solid var(--border);border-radius:18px;padding:12px;box-shadow:var(--shadow);text-align:center;transition:transform .25s ease, box-shadow .25s ease}

.dtp-landing-page-body .process-card:hover {transform:translateY(-5px);box-shadow:0 18px 42px rgba(15,122,59,.14)}

.dtp-landing-page-body .process-img {height:120px;border-radius:14px;background-color:#1b7542;background-size:cover;background-position:center;background-repeat:no-repeat;display:flex;align-items:end;justify-content:center;color:#fff;font-weight:700;padding:10px;margin-bottom:12px;position:relative;overflow:hidden}

.dtp-landing-page-body .process-img:before {content:"";position:absolute;inset:0;background:linear-gradient(transparent 42%,rgba(0,0,0,.55))}

.dtp-landing-page-body .process-img span {position:relative}

.dtp-landing-page-body .process-card strong {display:block;color:#10251a;font-size:15px;line-height:1.25}

.dtp-landing-page-body .process-card small {display:block;color:#667085;margin-top:6px;line-height:1.35;font-size:13px !important}


.dtp-landing-page-body .company-info {background:#fff;padding:28px 0}

.dtp-landing-page-body .company-box {background:#fff;border-left:5px solid var(--green);border-radius:14px;padding:28px 32px;box-shadow:var(--shadow);border-top:1px solid var(--border);border-right:1px solid var(--border);border-bottom:1px solid var(--border)}

.dtp-landing-page-body .company-box h3 {margin:0 0 12px;color:#10251a;font-size:23px}

.dtp-landing-page-body .company-box p {margin:8px 0;color:#344051;font-size:17px}

.dtp-landing-page-body .company-actions {margin-top:16px;display:flex;gap:12px;flex-wrap:wrap}


.dtp-landing-page-body .testimonial-section {background:#fff}

.dtp-landing-page-body .testimonial-list {max-width:1040px;margin:auto}

.dtp-landing-page-body .testimonial-item {display:grid;grid-template-columns:110px 1fr;gap:22px;padding:26px 0;border-bottom:1px solid #e5e7eb}

.dtp-landing-page-body .testimonial-item:last-child {border-bottom:0}

.dtp-landing-page-body .testimonial-avatar {width:90px;height:90px;border-radius:50%;background:linear-gradient(135deg,#e3e9ef,#aeb9c4);display:grid;place-items:center;color:#fff;font-weight: 700;overflow:hidden}

.dtp-landing-page-body .stars {color:#e67e00;font-size:22px;letter-spacing:1px;line-height:1}

.dtp-landing-page-body .testimonial-name {font-weight: 700;color:var(--green);font-size:18px;margin:7px 0 12px;text-transform:uppercase}

.dtp-landing-page-body .testimonial-text {font-style:italic;color:#111827;margin:0;line-height:1.6}


.dtp-landing-page-body .faq-section {background:#f8fafb}

.dtp-landing-page-body .quote-layout {display:grid;grid-template-columns:1fr;gap:28px;align-items:start}

.dtp-landing-page-body .quote-panel {background:#fff;border-radius:22px;padding:30px;box-shadow:var(--shadow);border:1px solid var(--border)}

.dtp-landing-page-body .quote-panel h3 {margin:0 0 16px;color:#10251a;font-size:25px}

.dtp-landing-page-body .quote-panel ul {margin:0;padding:0;list-style:none;display:grid;gap:10px}

.dtp-landing-page-body .quote-panel li:before {content:"✓";color:var(--green);font-weight: 700;margin-right:8px}

.dtp-landing-page-body .quote-form {background:#fff;border-radius:22px;padding:28px;box-shadow:var(--shadow);border:1px solid var(--border)}

.dtp-landing-page-body .quote-form .form-grid {grid-template-columns:1fr 1fr}

.dtp-landing-page-body .footer {background:#0b2f1f;color:#fff;padding:36px 0 20px}

.dtp-landing-page-body .footer-grid {display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:24px}

.dtp-landing-page-body .footer h4 {margin:0 0 12px;color:#fff}

.dtp-landing-page-body .footer p, .dtp-landing-page-body .footer li {color:#d7e4dc;margin:7px 0}

.dtp-landing-page-body .footer ul {list-style:none;padding:0;margin:0}

.dtp-landing-page-body .footer-bottom {border-top:1px solid rgba(255,255,255,.15);margin-top:24px;padding-top:14px;color:#b9c8bf;font-size:14px;text-align:center}


@media(max-width:900px) {

  .dtp-landing-page-body .hero-grid, .dtp-landing-page-body .brand-grid, .dtp-landing-page-body .ccgrass-layout {grid-template-columns:1fr}

  .dtp-landing-page-body .price-cards, .dtp-landing-page-body .grass-grid, .dtp-landing-page-body .gallery, .dtp-landing-page-body .warehouse-grid, .dtp-landing-page-body .why-grid, .dtp-landing-page-body .review-grid {grid-template-columns:1fr 1fr}

  .dtp-landing-page-body .steps {grid-template-columns:repeat(3,1fr)}

  .dtp-landing-page-body h1 {font-size:38px}

  .dtp-landing-page-body h2 {font-size:30px}

}


@media(max-width:640px) {

  .dtp-landing-page-body .nav-actions {display:none}

  .dtp-landing-page-body .process-grid, .dtp-landing-page-body .warehouse-grid, .dtp-landing-page-body .quote-layout, .dtp-landing-page-body .footer-grid {grid-template-columns:1fr}

  .dtp-landing-page-body .testimonial-item {grid-template-columns:1fr;text-align:left}

  .dtp-landing-page-body .testimonial-avatar {width:100px;height:100px}

  .dtp-landing-page-body .quote-form .form-grid {grid-template-columns:1fr}

  .dtp-landing-page-body .ticks, .dtp-landing-page-body .price-cards, .dtp-landing-page-body .grass-grid, .dtp-landing-page-body .gallery, .dtp-landing-page-body .warehouse-grid, .dtp-landing-page-body .why-grid, .dtp-landing-page-body .review-grid, .dtp-landing-page-body .form-grid {grid-template-columns:1fr}

  .dtp-landing-page-body .stats {grid-template-columns:1fr 1fr}

  .dtp-landing-page-body .steps {grid-template-columns:1fr 1fr}

  .dtp-landing-page-body .trust-grid {grid-template-columns:1fr}

  .dtp-landing-page-body .ccgrass-img-card.trusted, .dtp-landing-page-body .ccgrass-img-card.certificate {height:auto}

  .dtp-landing-page-body .ccgrass-bottom-grid {grid-template-columns:1fr}

  .dtp-landing-page-body .ccgrass-img-card img {height:auto;object-fit:contain}

  .dtp-landing-page-body .cta-strip {display:block;text-align:center}

  .dtp-landing-page-body .project-row {grid-template-columns:1fr}

  .dtp-landing-page-body .project-image.small {height:230px}

  .dtp-landing-page-body .project-image.large {height:280px}

  .dtp-landing-page-body .grass-advice {display:block;text-align:center}

  .dtp-landing-page-body .grass-advice .btn {margin-top:14px;width:100%}

  .dtp-landing-page-body h1 {font-size:33px}

  .dtp-landing-page-body section {padding:30px 0}

}


  
/* ===== FINAL COMPLETE OVERRIDES ===== */



.dtp-landing-page-body .prod-img {aspect-ratio:4/3;height:auto;background-size:cover !important;background-position:center !important;background-repeat:no-repeat !important;}

.dtp-landing-page-body .project-image.large {aspect-ratio:16/9;height:auto}

.dtp-landing-page-body .project-image.small {aspect-ratio:4/3;height:auto}

.dtp-landing-page-body .ccgrass-layout {grid-template-columns:.45fr .55fr}

.dtp-landing-page-body .ccgrass-img-card.trusted {aspect-ratio:2/1;height:auto}

.dtp-landing-page-body .ccgrass-img-card.certificate, .dtp-landing-page-body .ccgrass-logo-card {aspect-ratio:3/4;height:auto}

.dtp-landing-page-body .commit-section {background:#f8fafb}

.dtp-landing-page-body .commit-grid {display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:26px}

.dtp-landing-page-body .commit-card {background:#fff;border:1px solid var(--border);border-radius:20px;padding:24px;box-shadow:var(--shadow);min-height:210px;transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease}

.dtp-landing-page-body .commit-card:hover {transform:translateY(-5px);border-color:var(--green);box-shadow:0 18px 42px rgba(15,122,59,.15)}

.dtp-landing-page-body .commit-icon {width:46px;height:46px;border-radius:14px;background:var(--lime);display:grid;place-items:center;font-size:24px;margin-bottom:14px}

.dtp-landing-page-body .commit-card h3 {margin:0 0 10px;font-size:22px;color:#10251a}

.dtp-landing-page-body .commit-card p {margin:0;color:#344051}

.dtp-landing-page-body .promise-box {background:#fff;border:1px solid var(--border);border-radius:20px;padding:26px;box-shadow:var(--shadow);margin-top:8px}

.dtp-landing-page-body .promise-box h3 {margin:0 0 18px;font-size:24px;color:#10251a;text-align:center}

.dtp-landing-page-body .promise-list {display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.dtp-landing-page-body .promise-item {background:#fbfffc;border:1px solid #d9eee0;border-radius:14px;padding:13px 14px;font-weight:700;color:#263241}

.dtp-landing-page-body .promise-item:before {content:"✓";color:var(--green);font-weight: 700;margin-right:8px}

.dtp-landing-page-body .commit-cta {margin-top:24px;background:linear-gradient(135deg,var(--green-dark),var(--green));color:#fff;border-radius:20px;padding:26px;display:flex;align-items:center;justify-content:space-between;gap:22px;box-shadow:var(--shadow)}

.dtp-landing-page-body .commit-cta strong {display:block;font-size:22px;margin-bottom:4px}

.dtp-landing-page-body .commit-cta p {margin:0;opacity:.92}

.dtp-landing-page-body .testimonial-item {grid-template-columns:140px 1fr;gap:26px;align-items:start}

.dtp-landing-page-body .testimonial-avatar {width:120px;height:120px}

.dtp-landing-page-body .testimonial-text {font-size:16px}

@media(max-width:900px) {

  .dtp-landing-page-body .ccgrass-layout {grid-template-columns:1fr}

  .dtp-landing-page-body .project-row {grid-template-columns:1fr 1fr}

  .dtp-landing-page-body .commit-grid, .dtp-landing-page-body .promise-list {grid-template-columns:1fr}

  .dtp-landing-page-body .commit-cta {display:block;text-align:center}

  .dtp-landing-page-body .commit-cta .btn {margin-top:16px;width:100%}

}


@media(max-width:640px) {

  .dtp-landing-page-body .hero-grid {grid-template-columns:1fr}

  

  .dtp-landing-page-body .hero-list {grid-template-columns:1fr}

  .dtp-landing-page-body .project-row {grid-template-columns:1fr 1fr;gap:8px}

  .dtp-landing-page-body .project-image.large {aspect-ratio:16/9;height:auto}

  .dtp-landing-page-body .project-image.small {aspect-ratio:4/3;height:auto}

  .dtp-landing-page-body .project-overlay {left:10px;bottom:9px}

  .dtp-landing-page-body .project-overlay strong {font-size:12px}

  .dtp-landing-page-body .project-image.large .project-overlay strong {font-size:18px}

  .dtp-landing-page-body .project-caption {font-size:12px;padding:8px 4px 12px}

  .dtp-landing-page-body .ccgrass-bottom-grid {grid-template-columns:1fr 1fr}

  .dtp-landing-page-body .testimonial-item {grid-template-columns:80px 1fr;gap:14px;align-items:start}

  .dtp-landing-page-body .testimonial-avatar {width:80px;height:80px}

  .dtp-landing-page-body .stars {font-size:18px}

  .dtp-landing-page-body .testimonial-name {font-size:17px;margin:6px 0 10px}

  .dtp-landing-page-body .testimonial-text {font-size:15px;line-height:1.55}

  .dtp-landing-page-body .process-grid {grid-template-columns:1fr 1fr}

  .dtp-landing-page-body .form-grid {grid-template-columns:1fr}

}



  
/* ===== MOBILE MOCKUP REVIEW BLOCK ===== */

.dtp-landing-page-body .mobile-preview {
  margin-top:0;
  padding:40px 0;
  background:#111827;
  color:#fff;
}

.dtp-landing-page-body .phone {
  width:390px;
  max-width:100%;
  height:780px;
  margin:20px auto;
  background:#fff;
  color:var(--dark);
  border-radius:38px;
  padding:14px;
  border:10px solid #050505;
  overflow:hidden;
  box-shadow:0 20px 80px rgba(0,0,0,.35)
}

.dtp-landing-page-body .phone-screen {height:100%;overflow:auto;border-radius:26px;background:#fff}

.dtp-landing-page-body .phone .mini-nav {height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid var(--border);font-weight: 700;color:var(--green-dark)}

.dtp-landing-page-body .phone .mini-hero {padding:22px 16px;background:linear-gradient(135deg,#edf8f1,#fff)}

.dtp-landing-page-body .phone h3 {font-size:25px;line-height:1.12;margin:12px 0}

.dtp-landing-page-body .phone .mini-img {aspect-ratio:4/3;border-radius:18px;background:linear-gradient(135deg,#0b5d32,#77b366);display:flex;align-items:end;padding:16px;color:#fff;font-weight: 700}

.dtp-landing-page-body .phone-section {padding:18px 16px;border-bottom:1px solid #eef0f2}

.dtp-landing-page-body .phone-section h4 {margin:0 0 8px;font-size:20px;line-height:1.2;color:#10251a}

.dtp-landing-page-body .phone-section p {margin:0 0 12px;color:#667085;font-size:14px}

.dtp-landing-page-body .phone-price-card, .dtp-landing-page-body .phone-grass-card, .dtp-landing-page-body .phone-commit-card, .dtp-landing-page-body .phone-process-card {background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 18px rgba(0,0,0,.06);margin-bottom:10px}

.dtp-landing-page-body .phone-price-card {padding:14px}
.dtp-landing-page-body .phone-price {color:var(--orange);font-weight: 700;font-size:20px;margin-top:4px}

.dtp-landing-page-body .phone-grass-img, .dtp-landing-page-body .phone-project-big, .dtp-landing-page-body .phone-project-small, .dtp-landing-page-body .phone-warehouse, .dtp-landing-page-body .phone-process-img {background:linear-gradient(135deg,#1b7542,#9cc66a);display:flex;align-items:end;color:#fff;font-weight: 700;overflow:hidden}

.dtp-landing-page-body .phone-grass-img {aspect-ratio:4/3;padding:12px}
.dtp-landing-page-body .phone-grass-body {padding:14px}

.dtp-landing-page-body .phone-project-big {aspect-ratio:16/9;border-radius:16px;padding:14px;margin:12px 0 8px;font-weight: 700}

.dtp-landing-page-body .phone-project-pair {display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}

.dtp-landing-page-body .phone-project-small {aspect-ratio:4/3;border-radius:14px;padding:10px;font-size:12px}

.dtp-landing-page-body .phone-caption {font-size:12px;color:#667085;margin:0 0 10px}

.dtp-landing-page-body .phone-brand-img {aspect-ratio:2/1;border-radius:16px;background:#fff;border:1px solid var(--border);display:grid;place-items:center;color:var(--green-dark);font-weight: 700;margin-bottom:10px;box-shadow:0 8px 18px rgba(0,0,0,.06);text-align:center}

.dtp-landing-page-body .phone-brand-img.tall {aspect-ratio:3/4;margin:0}

.dtp-landing-page-body .phone-trust {display:grid;gap:8px;margin:10px 0}
.dtp-landing-page-body .phone-trust div {background:var(--lime);border:1px solid #cfe7d7;border-radius:14px;padding:10px;text-align:center;font-weight: 700;color:var(--green-dark)}

.dtp-landing-page-body .phone-warehouse-grid, .dtp-landing-page-body .phone-process {display:grid;grid-template-columns:1fr 1fr;gap:8px}

.dtp-landing-page-body .phone-warehouse {height:140px;border-radius:14px;padding:10px;font-size:12px}

.dtp-landing-page-body .phone-commit-card {padding:13px}
.dtp-landing-page-body .phone-process-card {padding:9px;text-align:center}
.dtp-landing-page-body .phone-process-img {height:80px;border-radius:12px;margin-bottom:8px}

.dtp-landing-page-body .phone-company {background:#fff;border-left:4px solid var(--green);border-radius:12px;padding:14px;box-shadow:0 8px 18px rgba(0,0,0,.06)}

.dtp-landing-page-body .phone-review {display:grid;grid-template-columns:80px 1fr;gap:14px;border-bottom:1px solid #e5e7eb;padding:16px 0}

.dtp-landing-page-body .phone-review-avatar {width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#e3e9ef,#aeb9c4);display:grid;place-items:center;color:#fff;font-weight: 700}

.dtp-landing-page-body .phone-stars {color:#e67e00;font-size:18px}

.dtp-landing-page-body .phone-review-text {font-style:italic;line-height:1.55;color:#111827}

.dtp-landing-page-body .phone-faq details {padding:12px;border-radius:12px;margin-bottom:8px;background:#fff;border:1px solid var(--border)}

.dtp-landing-page-body .phone-form input, .dtp-landing-page-body .phone-form select {margin-bottom:10px}

.dtp-landing-page-body .phone-sticky {position:sticky;bottom:0;background:#fff;border-top:1px solid var(--border);display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px;z-index:5}

.dtp-landing-page-body .phone-sticky a {padding:11px 8px;border-radius:999px;text-align:center;font-size:13px;font-weight: 700}
.dtp-landing-page-body .phone-sticky .call {background:var(--orange);color:#fff}
.dtp-landing-page-body .phone-sticky .zalo {background:var(--green);color:#fff}

/* ================================================================
   CRITICAL OVERRIDES – Flatsome/Outdoor conflicts
   ================================================================ */

/* H1: Flatsome có thể set word-break hoặc font-size khác */
.dtp-landing-page-body h1 {
  font-size: 48px !important;
  line-height: 1.08 !important;
  margin: 18px 0 16px !important;
  color: #10251a !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  word-wrap: normal !important;
  hyphens: none !important;
}

/* Hero grid: 2 cột cân bằng, không bị collapse */
.dtp-landing-page-body .hero-grid {
  display: grid !important;
  grid-template-columns: 1.05fr 0.95fr !important;
  gap: 36px !important;
  align-items: center !important;
}

/* Hero card bên phải */
.dtp-landing-page-body .hero-card {
  background: #fff !important;
  border-radius: 24px !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.08) !important;
  padding: 14px !important;
  border: 1px solid #edf0f2 !important;
  align-self: center !important;
  min-width: 0 !important;
}

/* Photo box: không dùng aspect-ratio gây lỗi layout */


/* Ticks grid: 2×2 */
.dtp-landing-page-body .ticks.hero-list {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 14px !important;
  margin: 20px 0 22px !important;
  max-width: 100% !important;
}

.dtp-landing-page-body .hero-list .tick {
  padding: 14px 18px !important;
  background: #fff !important;
  border: 1px solid #d9eee0 !important;
  border-radius: 14px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  white-space: normal !important;
  word-break: normal !important;
}

/* Wrap đủ rộng, không bị Flatsome co lại */
.dtp-landing-page-body .wrap {
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 0 22px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Responsive: giữ hero 2 cột đến 900px */
@media (max-width: 900px) {
  .dtp-landing-page-body .hero-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ── Fix: loại trừ adminbar khỏi mọi CSS landing page ── */

/* Reset mọi img trong adminbar về kích thước gốc của WP */
#wpadminbar img { all: revert !important; }
#wpadminbar .avatar {
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  display: inline-block !important;
  vertical-align: middle !important;
  max-width: 16px !important;
  object-fit: cover !important;
}

/* img trong landing page: chỉ áp dụng NGOÀI adminbar */
.dtp-landing-page-body :not(#wpadminbar) img:not(.dtp-logo-img) {
  max-width: 100%;
  height: auto;
}

/* ================================================================
   DTP v2.0 – New & Updated Styles
   ================================================================ */

/* ── Project: caption bên dưới ảnh, xóa overlay caption ── */
.dtp-landing-page-body .project-image {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
}
.dtp-landing-page-body .project-image.small { aspect-ratio: 4/3; }
.dtp-landing-page-body .project-image.large { aspect-ratio: 16/9; width: 100%; }
.dtp-landing-page-body .project-overlay {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: linear-gradient(transparent, rgba(0,0,0,.55));
  padding: 16px 14px 12px;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .3px;
}
.dtp-landing-page-body .project-overlay .project-sub {
  font-weight: 400;
  font-size: 12px;
  opacity: .85;
  margin-left: 4px;
}
/* Caption bên dưới: hiển thị rõ ràng */
.dtp-landing-page-body .project-caption {
  font-size: 15px;
  color: #344051;
  padding: 12px 16px 15px;
  line-height: 1.45;
  margin-top: 0;
}
.dtp-landing-page-body .project-item { margin-bottom: 6px; }
.dtp-landing-page-body .project-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-bottom: 18px;
}

/* ── Warehouse: ảnh full box width ── */
.dtp-landing-page-body .warehouse-photo {
  width: 100%;
  aspect-ratio: 4/3;
  border-radius: 12px 12px 0 0;
  background-color: #1b7542;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  display: block;
  overflow: hidden;
  position: relative;
}
.dtp-landing-page-body .warehouse-photo img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block;
  position: absolute;
  inset: 0;
}
/* Placeholder khi chưa có ảnh */
.dtp-landing-page-body .warehouse-placeholder {
  font-size: 32px;
  opacity: .5;
}
.dtp-landing-page-body .warehouse-caption {
  font-size: 13px;
  color: var(--muted);
  margin-top: 8px;
  line-height: 1.45;
}

/* ── Process: bỏ caption đè lên ảnh ── */
.dtp-landing-page-body .process-img {
  aspect-ratio: 4/3;
  border-radius: 12px;
  background-color: #1b7542;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-bottom: 10px;
}
.dtp-landing-page-body .process-img-placeholder {
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  text-align: center;
  padding: 10px;
  opacity: .8;
}

/* ── Form thông báo ── */
.dtp-landing-page-body .dtp-form-success,
.dtp-landing-page-body .dtp-form-error {
  text-align: center;
  padding: 16px 24px;
  border-radius: 12px;
  font-weight: 700;
  margin-bottom: 20px;
  font-size: 16px;
}
.dtp-landing-page-body .dtp-form-success {
  background: #d1fae5;
  color: #065f46;
  border: 1px solid #6ee7b7;
}
.dtp-landing-page-body .dtp-form-error {
  background: #fee2e2;
  color: #991b1b;
  border: 1px solid #fca5a5;
}

/* ── Form field wrap + error message ── */
.dtp-landing-page-body .dtp-form-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.dtp-landing-page-body .dtp-field-error {
  font-size: 12px;
  color: #dc2626;
  font-weight: 600;
  min-height: 16px;
  display: block;
}
.dtp-landing-page-body input.dtp-invalid,
.dtp-landing-page-body select.dtp-invalid {
  border-color: #dc2626 !important;
  background: #fff5f5 !important;
}
.dtp-landing-page-body input.dtp-valid,
.dtp-landing-page-body select.dtp-valid {
  border-color: #059669 !important;
}

/* ── Rich text output ── */
.dtp-landing-page-body .section-title > div p,
.dtp-landing-page-body .dtp-rt-output p { margin: 0 0 6px; }
.dtp-landing-page-body .dtp-rt-output ul,
.dtp-landing-page-body .dtp-rt-output ol { padding-left: 20px; margin: 6px 0; }

/* ── Tooltip lỗi inline dưới field (v2.1) ── */
.dtp-landing-page-body .dtp-field-tooltip {
  display: block;
  height: 0;
  overflow: hidden;
  font-size: 12px !important;
  color: #dc2626 !important;
  font-weight: 600;
  padding: 0 2px;
  transition: height .18s ease, padding .18s ease;
  line-height: 1.4;
}
.dtp-landing-page-body .dtp-field-tooltip.dtp-tooltip-visible {
  height: auto;
  padding: 4px 2px 0;
}

/* Xóa class dtp-field-error cũ nếu còn */
.dtp-landing-page-body .dtp-field-error { display: none; }

/* ── Input state ── */
.dtp-landing-page-body input.dtp-invalid,
.dtp-landing-page-body select.dtp-invalid {
  border: 1.5px solid #dc2626 !important;
  background: #fff5f5 !important;
  outline: none !important;
}
.dtp-landing-page-body input.dtp-valid {
  border: 1.5px solid #059669 !important;
}

/* ── Success box ── */
.dtp-landing-page-body #dtp-form-success-msg {
  text-align: center;
  padding: 20px 28px;
  border-radius: 12px;
  font-weight: 700;
  font-size: 17px !important;
  background: #d1fae5;
  color: #065f46;
  border: 1px solid #6ee7b7;
  margin-bottom: 20px;
}

/* ── Project Group layout v2.2 ── */
/* Desktop: grid 2 cột, pos-0 và pos-1 chia đôi hàng trên, pos-2 (lớn) full width hàng dưới */
/* Desktop: project-group 2 rows — smalls row 1, large row 2 */
.dtp-landing-page-body .project-group {
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin-bottom: 28px;
}
/* Smalls wrapper: 2 cột cạnh nhau */
.dtp-landing-page-body .project-group-smalls {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.dtp-landing-page-body .project-pos-2 .project-image { aspect-ratio: 16/9; }
.dtp-landing-page-body .project-pos-0 .project-image,
.dtp-landing-page-body .project-pos-1 .project-image { aspect-ratio: 4/3; }

/* ── Form submit btn: margin-top cân bằng với gap field ── */
.dtp-landing-page-body .final-cta .full.btn {
  margin-top: 0;
  height: 52px;
  font-size: 16px !important;
}

/* ── Form: xóa margin mặc định của browser trên thẻ <form> ── */
.dtp-landing-page-body .formbox form,
.dtp-landing-page-body #dtp-contact-form {
  margin: 0 !important;
  padding: 0 !important;
}

/* Tooltip ẩn: không chiếm chiều cao (collapse hoàn toàn) */
.dtp-landing-page-body .dtp-field-tooltip:not(.dtp-tooltip-visible) {
  display: none !important;
}

/* Btn submit: xóa margin-bottom mặc định của button */
.dtp-landing-page-body #dtp-submit-btn {
  margin-bottom: 0 !important;
  display: flex;
  width: 100%;
}

/* ================================================================
   DTP v2.6 – Mobile-only overrides (max-width: 767px)
   ================================================================ */

/* ── Grass: badge + tên cùng hàng (desktop cũng áp dụng) ── */
.dtp-landing-page-body .grass-header-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.dtp-landing-page-body .grass-header-row h3 {
  margin: 0;
}
/* Mobile desc: ẩn trên desktop */
.dtp-landing-page-body .grass-mobile-desc { display: none; }

@media (max-width: 767px) {

  /* ── PRICE: ẩn bảng hạng mục + CTA strip ── */
  .dtp-landing-page-body .tablebox,
  .dtp-landing-page-body .cta-strip { display: none !important; }

  /* ── GRASS: ẩn detail desktop, hiện mobile desc, ẩn lời khuyên ── */
  .dtp-landing-page-body .grass-desktop-detail { display: none !important; }
  .dtp-landing-page-body .grass-mobile-desc    { display: block !important; font-size: 13px; color: var(--muted); margin: 0; }
  .dtp-landing-page-body .grass-advice         { display: none !important; }

  /* ── PROJECT: nhóm 3 → ảnh lớn (pos-2) full width, 2 ảnh nhỏ 1 hàng 2 cột, không caption ── */
  .dtp-landing-page-body .project-group {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto !important;
  }
  /* pos-2 (lớn) lên hàng 1, full width */
  .dtp-landing-page-body .project-pos-2 { grid-column: 1 !important; grid-row: 1 !important; }
  /* pos-0 và pos-1 cùng hàng 2, 2 cột */
  .dtp-landing-page-body .project-group-smalls {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px;
    grid-column: 1;
    grid-row: 2;
  }
  /* Ẩn caption của ảnh nhỏ */
  .dtp-landing-page-body .project-pos-0 .project-caption,
  .dtp-landing-page-body .project-pos-1 .project-caption { display: none !important; }

  /* ── CCGRASS: ảnh lên trước mô tả, trust box sau ảnh, ẩn list điểm mạnh ── */
  .dtp-landing-page-body .ccgrass-layout       { display: flex !important; flex-direction: column !important; }
  .dtp-landing-page-body .ccgrass-visual       { order: 1 !important; margin-bottom: 16px; }
  .dtp-landing-page-body .ccgrass-content      { order: 2 !important; }
  .dtp-landing-page-body .ccgrass-list         { display: none !important; }
  /* trust-grid: giữ nguyên layout sau ảnh */
  .dtp-landing-page-body .ccgrass-content .trust-grid { order: 3; }

  /* ── WAREHOUSE: 3 hàng × 2 cột ── */
  .dtp-landing-page-body .warehouse-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }

  /* ── COMMIT: ẩn emoji, hộp cam kết, tiêu đề/mô tả CTA; btn không bg ── */
  .dtp-landing-page-body .commit-icon   { display: none !important; }
  .dtp-landing-page-body .promise-box   { display: none !important; }
  .dtp-landing-page-body .commit-cta-text { display: none !important; }
  .dtp-landing-page-body .commit-cta {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    justify-content: center !important;
  }
  .dtp-landing-page-body .commit-cta-btn {
    background: transparent !important;
    color: var(--green) !important;
    border: 2px solid var(--green) !important;
  }

  /* ── PROCESS: ẩn mô tả ngắn (small) ── */
  .dtp-landing-page-body .process-card small { display: none !important; }

  /* ── COMPANY: ẩn nút gọi điện ── */
  .dtp-landing-page-body .btn-outline { display: none !important; }
}