/* Tenkiu landing — Suave. Hero stays first-version; the rest is polished. */
#landing {
  --tk-red: #f61d32;
  --tk-coral: #f73a4f;
  --tk-blue: #20aeec;
  --tk-blue-soft: #6ac7fb;
  --tk-yellow: #ffc62b;
  --tk-amber: #f8af16;
  --tk-mint: #20d7a7;
  --tk-green: #1bc471;
  --tk-ink: #1a1a1a;
  --tk-peach: #f3d4c4;
  --tk-paper: #fff4ec;
  --tk-shadow: #ffd6a8;
  background-color: var(--tk-paper);
}

/* ── Hero (first Suave — do not restyle layout here) ── */
#landing .lp-hero-eyebrow {
  display: inline-flex;
  margin: 0 0 14px;
  padding: 6px 12px;
  background: #fff;
  color: var(--tk-red);
  border: 2px solid var(--tk-red);
  border-radius: 14px;
  box-shadow: 4px 4px 0 var(--tk-yellow);
  font: 700 11px/1 'Poppins', sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#landing .lp-hero-copy h1 .hl {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: var(--tk-red) !important;
  color: var(--tk-red);
  box-shadow: inset 0 -8px 0 var(--tk-yellow);
}

#landing .start-btn:not(.start-btn-light):not(.start-btn-outline) {
  background: var(--tk-red) !important;
  border: 2px solid var(--tk-red);
  border-radius: 14px;
  box-shadow: 5px 5px 0 var(--tk-yellow);
}
#landing .start-btn:not(.start-btn-light):not(.start-btn-outline):hover {
  transform: translate(-2px, -2px);
  box-shadow: 7px 7px 0 var(--tk-yellow);
}
#landing .start-btn-light {
  background: #fff !important;
  color: var(--tk-red) !important;
  border: 2px solid #fff;
  border-radius: 14px;
  box-shadow: 5px 5px 0 var(--tk-yellow);
}
#landing .start-btn-light:hover {
  background: #fff !important;
  color: var(--tk-red) !important;
  transform: translate(-2px, -2px);
  box-shadow: 7px 7px 0 var(--tk-yellow);
}
#landing .start-btn-outline {
  background: #fff !important;
  color: var(--tk-ink) !important;
  border: 2px solid var(--tk-blue) !important;
  border-radius: 14px;
  box-shadow: 4px 4px 0 var(--tk-blue) !important;
}
#landing .start-btn-outline:hover {
  background: #fff !important;
  color: var(--tk-ink) !important;
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--tk-blue) !important;
}

#landing .lp-int-board {
  background: #fff;
  border: 2px solid var(--tk-coral);
  border-radius: 18px;
  box-shadow: 8px 8px 0 var(--tk-coral);
}
#landing .lp-int-board::before { display: none; }

/* Geometry lives only in the side gutters, between hero and final CTA. */
#landing .lp-geo-wrap { position: relative; overflow: hidden; }
#landing .lp-geo {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
#landing .lp-geo-wrap > section { position: relative; z-index: 1; }
#landing .lp-geo span {
  position: absolute;
  display: block;
}
#landing .lp-geo .b1 {
  width: 260px; height: 260px; border-radius: 50%;
  background: var(--tk-yellow); opacity: 0.36;
  top: 0; left: calc((100% - 1100px) / 2 - 270px);
}
#landing .lp-geo .b2 {
  width: 180px; height: 180px; border-radius: 44px;
  background: var(--tk-blue); opacity: 0.2;
  top: 1%; right: calc((100% - 1100px) / 2 - 220px); transform: rotate(16deg);
}
#landing .lp-geo .b3 {
  width: 140px; height: 140px; border-radius: 50%;
  background: var(--tk-mint); opacity: 0.28;
  top: 5%; left: calc((100% - 1100px) / 2 - 160px);
}
#landing .lp-geo .b4 {
  width: 220px; height: 80px; border-radius: 999px;
  background: var(--tk-coral); opacity: 0.18;
  top: 8%; right: calc((100% - 1100px) / 2 - 240px); transform: rotate(-10deg);
}
#landing .lp-geo .b5 {
  width: 200px; height: 200px; border-radius: 48px;
  background: var(--tk-yellow); opacity: 0.26;
  top: 16%; left: calc((100% - 1100px) / 2 - 240px); transform: rotate(12deg);
}
#landing .lp-geo .b6 {
  width: 240px; height: 240px; border-radius: 50%;
  background: var(--tk-blue); opacity: 0.16;
  top: 24%; right: calc((100% - 1100px) / 2 - 250px);
}
#landing .lp-geo .b7 {
  width: 170px; height: 170px; border-radius: 40px;
  background: var(--tk-mint); opacity: 0.24;
  top: 32%; left: calc((100% - 1100px) / 2 - 210px); transform: rotate(-14deg);
}
#landing .lp-geo .b8 {
  width: 210px; height: 210px; border-radius: 50%;
  background: var(--tk-coral); opacity: 0.16;
  top: 40%; right: calc((100% - 1100px) / 2 - 230px);
}
#landing .lp-geo .b9 {
  width: 250px; height: 90px; border-radius: 999px;
  background: var(--tk-yellow); opacity: 0.3;
  top: 48%; left: calc((100% - 1100px) / 2 - 260px); transform: rotate(8deg);
}
#landing .lp-geo .b10 {
  width: 190px; height: 190px; border-radius: 46px;
  background: var(--tk-blue); opacity: 0.18;
  top: 56%; right: calc((100% - 1100px) / 2 - 220px); transform: rotate(18deg);
}
#landing .lp-geo .b11 {
  width: 230px; height: 230px; border-radius: 50%;
  background: var(--tk-mint); opacity: 0.22;
  top: 64%; left: calc((100% - 1100px) / 2 - 250px);
}
#landing .lp-geo .b12 {
  width: 160px; height: 160px; border-radius: 36px;
  background: var(--tk-red); opacity: 0.1;
  top: 72%; right: calc((100% - 1100px) / 2 - 200px); transform: rotate(-8deg);
}
#landing .lp-geo .b13 {
  width: 200px; height: 200px; border-radius: 50%;
  background: var(--tk-yellow); opacity: 0.28;
  top: 80%; left: calc((100% - 1100px) / 2 - 230px);
}
#landing .lp-geo .b14 {
  width: 240px; height: 240px; border-radius: 56px;
  background: var(--tk-blue); opacity: 0.16;
  top: 88%; right: calc((100% - 1100px) / 2 - 260px); transform: rotate(10deg);
}
#landing .lp-final-cta {
  position: relative;
  overflow: hidden;
}
#landing .lp-final-cta > *:not(.lp-final-geo) { position: relative; z-index: 1; }
#landing .lp-final-geo {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
#landing .lp-final-geo span {
  position: absolute;
  display: block;
}
#landing .lp-final-geo .c1 {
  width: 180px; height: 180px; border-radius: 44px;
  background: #ffc62b; opacity: 0.14;
  top: -50px; right: -40px; transform: rotate(14deg);
}
#landing .lp-final-geo .c2 {
  width: 280px; height: 280px; border-radius: 50%;
  background: #c41224; opacity: 0.35;
  bottom: -120px; left: -80px;
}

@media (max-width: 1200px) {
  #landing .lp-geo .b1 { left: -120px; top: 0; }
  #landing .lp-geo .b2 { right: -90px; top: 2%; }
  #landing .lp-geo .b3 { left: -70px; top: 6%; }
  #landing .lp-geo .b4 { right: -110px; top: 9%; }
  #landing .lp-geo .b5 { left: -100px; }
  #landing .lp-geo .b6 { right: -110px; }
  #landing .lp-geo .b7 { left: -90px; }
  #landing .lp-geo .b8 { right: -100px; }
  #landing .lp-geo .b9 { left: -130px; }
  #landing .lp-geo .b10 { right: -90px; }
  #landing .lp-geo .b11 { left: -110px; }
  #landing .lp-geo .b12 { right: -80px; }
  #landing .lp-geo .b13 { left: -100px; }
  #landing .lp-geo .b14 { right: -120px; }
}

/* ── Nav (centered, original width) ── */
#landing .lp-nav-link:hover,
#landing .lp-theme-toggle:hover {
  background: #fff;
  box-shadow: 3px 3px 0 var(--tk-yellow);
}

/* ── Section titles ── */
#landing .lp-section h2::after,
#landing .lp-ai-gallery h2::after {
  content: '';
  display: block;
  width: 56px;
  height: 6px;
  margin: 12px auto 0;
  background: var(--tk-yellow);
  border-radius: 4px;
  box-shadow: 2px 2px 0 var(--tk-coral);
}

/* ── Stats ── */
#landing .lp-stats { border: none; gap: 12px; }
#landing .lp-stat {
  background: #fff;
  border: 2px solid transparent;
  border-radius: 16px;
  padding: 16px 12px;
  text-align: left;
}
#landing .lp-stat:nth-child(1) { border-color: var(--tk-red); box-shadow: 4px 4px 0 var(--tk-red); }
#landing .lp-stat:nth-child(2) { border-color: var(--tk-blue); box-shadow: 4px 4px 0 var(--tk-blue); }
#landing .lp-stat:nth-child(3) { border-color: var(--tk-amber); box-shadow: 4px 4px 0 var(--tk-yellow); }
#landing .lp-stat:nth-child(4) { border-color: var(--tk-mint); box-shadow: 4px 4px 0 var(--tk-mint); }
#landing .lp-stat-num {
  background: none !important;
  -webkit-text-fill-color: unset !important;
}
#landing .lp-stat:nth-child(1) .lp-stat-num { color: var(--tk-red); }
#landing .lp-stat:nth-child(2) .lp-stat-num { color: var(--tk-blue); }
#landing .lp-stat:nth-child(3) .lp-stat-num { color: var(--tk-amber); }
#landing .lp-stat:nth-child(4) .lp-stat-num { color: var(--tk-green); }

/* ── Cards ── */
#landing .lp-step,
#landing .lp-extra-card,
#landing .lp-testimonial,
#landing .lp-plan,
#landing .lp-faq-item,
#landing .benefit,
#landing .lp-compare-wrap,
#landing .lp-domain-card,
#landing .lp-ai-card {
  background: #fff;
  border: 2px solid var(--tk-peach);
  border-radius: 16px;
  box-shadow: 5px 5px 0 var(--tk-shadow);
}
#landing .lp-faq-item { overflow: visible; }
#landing .lp-extra-card:hover,
#landing a.lp-testimonial:hover,
#landing .lp-ai-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 7px 7px 0 var(--tk-yellow);
  border-color: var(--tk-amber);
}

#landing .lp-step-num {
  border-radius: 12px;
  box-shadow: 3px 3px 0 var(--tk-shadow);
}
#landing .lp-step:nth-child(1) .lp-step-num { background: var(--tk-red); }
#landing .lp-step:nth-child(2) .lp-step-num { background: var(--tk-blue); }
#landing .lp-step:nth-child(3) .lp-step-num { background: var(--tk-mint); }

/* ── Vertical chips ── */
#landing .lp-vchip {
  background: #fff;
  border: 2px solid var(--tk-peach);
  box-shadow: 2px 2px 0 var(--tk-shadow);
}
#landing .lp-vchip:hover {
  background: #fff;
  border-color: var(--tk-amber);
  color: var(--tk-ink);
  box-shadow: 3px 3px 0 var(--tk-yellow);
}
#landing .lp-vchip.active {
  background: var(--tk-red);
  color: #fff;
  border-color: var(--tk-red);
  box-shadow: 3px 3px 0 var(--tk-yellow);
}

/* ── Compare ── */
#landing .lp-compare-wrap { overflow: hidden; }
#landing .lp-compare thead th {
  background: #fff8f0;
  border-bottom: 2px solid var(--tk-peach);
}
#landing .lp-compare thead th.lp-cell-tenkiu {
  background: #fff1f2;
  color: var(--tk-red);
}
#landing .lp-compare-more a {
  display: inline-flex;
  padding: 8px 14px;
  background: #fff;
  border: 2px solid var(--tk-peach);
  border-radius: 12px;
  box-shadow: 3px 3px 0 var(--tk-shadow);
}
#landing .lp-compare-more a:hover {
  text-decoration: none;
  transform: translate(-2px, -2px);
  box-shadow: 5px 5px 0 var(--tk-yellow);
  border-color: var(--tk-amber);
}

/* ── Free / guarantee / domain notes ── */
#landing .lp-free-banner {
  background: #e9faf3;
  border: 2px solid var(--tk-mint);
  border-radius: 16px;
  box-shadow: 5px 5px 0 var(--tk-mint);
}
#landing .lp-free-banner-icon {
  border-radius: 12px;
  box-shadow: 2px 2px 0 #b7f0d8;
}
#landing .lp-free-banner-cta {
  background: var(--tk-green);
  border: 2px solid var(--tk-green);
  border-radius: 12px;
  box-shadow: 3px 3px 0 #b7f0d8;
}
#landing .lp-free-banner-cta:hover {
  transform: translate(-2px, -2px);
  box-shadow: 5px 5px 0 #b7f0d8;
}

#landing .lp-guarantee {
  background: #fff;
  border: 2px solid var(--tk-amber);
  border-radius: 16px;
  box-shadow: 5px 5px 0 var(--tk-yellow);
}
#landing .lp-guarantee-icon {
  background: var(--tk-amber);
  border-radius: 12px;
  box-shadow: 2px 2px 0 #ffe08a;
}

#landing .lp-domain-card.featured {
  background: #fff;
  border-color: var(--tk-red);
  box-shadow: 6px 6px 0 var(--tk-red);
}
#landing .lp-domain-tag.pro {
  background: var(--tk-red);
  box-shadow: 2px 2px 0 var(--tk-yellow);
}
#landing .lp-domain-fineprint {
  background: #fff8df;
  border: 2px solid var(--tk-yellow);
  border-radius: 12px;
  box-shadow: 4px 4px 0 var(--tk-yellow);
}

/* ── Plans ── */
#landing .lp-plan { transform: none; }
#landing .lp-plan:hover {
  transform: translate(-2px, -2px);
  box-shadow: 7px 7px 0 var(--tk-yellow);
}
#landing .lp-plan.featured {
  background: #fff;
  border-color: var(--tk-red);
  box-shadow: 6px 6px 0 var(--tk-red);
  transform: none;
}
#landing .lp-plan.featured:hover {
  transform: translate(-2px, -2px);
  box-shadow: 8px 8px 0 var(--tk-red);
}
#landing .lp-plan.featured::before {
  background: var(--tk-red);
  box-shadow: 2px 2px 0 var(--tk-yellow);
}
#landing .lp-plan-cta {
  border: 2px solid var(--tk-peach);
  border-radius: 12px;
  box-shadow: 3px 3px 0 var(--tk-shadow);
}
#landing .lp-plan-cta:hover {
  background: #fff;
  transform: translate(-2px, -2px);
  box-shadow: 5px 5px 0 var(--tk-yellow);
}
#landing .lp-plan.featured .lp-plan-cta {
  background: var(--tk-red);
  border-color: var(--tk-red);
  box-shadow: 4px 4px 0 var(--tk-yellow);
}
#landing .lp-plan.featured .lp-plan-cta:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--tk-yellow);
}

/* ── FAQ ── */
#landing .lp-faq-item.open {
  border-color: var(--tk-coral);
  box-shadow: 6px 6px 0 var(--tk-coral);
}

/* ── Gallery / press ── */
#landing .lp-ai-card-logoplate {
  background: #fff8f0;
}
#landing .lp-ai-card-logoplate img {
  width: 96px;
  height: 96px;
  max-width: 96px;
  max-height: 96px;
  border-radius: 50%;
  object-fit: cover;
  object-position: center;
  background: #fff;
  border: 2px solid var(--tk-peach);
  box-shadow: 3px 3px 0 var(--tk-shadow);
}
#landing .lp-ai-card-logoplate-fallback {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  border: 2px solid var(--tk-peach);
  box-shadow: 3px 3px 0 var(--tk-shadow);
  color: var(--tk-red);
}

#landing .lp-ai-gallery-badge {
  background: #fff;
  border: 2px solid var(--tk-red);
  box-shadow: 3px 3px 0 var(--tk-yellow);
}
#landing .lp-ai-gallery-more {
  background: #fff;
  border: 2px solid var(--tk-red);
  border-radius: 14px;
  box-shadow: 4px 4px 0 var(--tk-yellow);
}
#landing .lp-ai-gallery-more:hover {
  background: var(--tk-red);
  color: #fff;
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--tk-yellow);
}

#landing .lp-press-logo {
  height: auto;
  padding: 10px 14px;
  opacity: 1;
  filter: none;
  border: 2px solid var(--tk-peach);
  border-radius: 12px;
  background: #fff;
  box-shadow: 3px 3px 0 var(--tk-shadow);
}
#landing .lp-press-logo:hover {
  transform: translate(-2px, -2px);
  box-shadow: 5px 5px 0 var(--tk-yellow);
  border-color: var(--tk-amber);
}

/* ── Footer social ── */
#landing .lp-footer-social a {
  border-radius: 10px;
}
#landing .lp-footer-social a:hover {
  background: var(--tk-red);
  box-shadow: 3px 3px 0 var(--tk-yellow);
  transform: translate(-2px, -2px);
}

/* ── Mobile ── */
#landing .lp-nav-toggle {
  display: none;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 2px solid var(--tk-red);
  border-radius: 12px;
  background: #fff;
  box-shadow: 3px 3px 0 var(--tk-yellow);
  cursor: pointer;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
#landing .lp-nav-toggle span {
  display: block;
  width: 18px;
  height: 2px;
  background: var(--tk-red);
  border-radius: 2px;
  transition: transform 160ms, opacity 160ms;
}
#landing .lp-nav.is-open .lp-nav-toggle span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
#landing .lp-nav.is-open .lp-nav-toggle span:nth-child(2) { opacity: 0; }
#landing .lp-nav.is-open .lp-nav-toggle span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

@media (max-width: 768px) {
  #landing .lp-geo { display: none; }
  #landing .lp-nav {
    padding: 12px 16px;
    flex-wrap: wrap;
    align-items: center;
    position: relative;
    z-index: 5;
  }
  #landing .lp-nav-logo img { height: 36px; }
  #landing .lp-nav-toggle { display: inline-flex; margin-left: auto; }
  #landing .lp-nav-actions {
    display: none;
    flex-basis: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    padding: 10px 0 4px;
  }
  #landing .lp-nav.is-open .lp-nav-actions { display: flex; }
  #landing .lp-nav-link {
    width: 100%;
    text-align: left;
    padding: 12px 14px;
    font-size: 15px;
    background: #fff;
    border: 2px solid var(--tk-peach);
    border-radius: 12px;
    white-space: normal;
  }
  #landing .lp-nav-link.landing-cta {
    background: var(--tk-red);
    color: #fff;
    border-color: var(--tk-red);
    box-shadow: 3px 3px 0 var(--tk-yellow);
    text-align: center;
  }
  #landing .lp-hero-ctas {
    flex-direction: column;
    align-items: stretch;
  }
  #landing .lp-hero-ctas .start-btn {
    width: 100%;
    min-width: 0;
    max-width: none;
  }
  #landing .lp-final-geo .c1 {
    width: 120px; height: 120px;
    top: -36px; right: -28px;
  }
  #landing .lp-final-geo .c2 {
    width: 180px; height: 180px;
    bottom: -80px; left: -56px;
  }
  #landing .lp-plan.featured { transform: none; }
  #landing .lp-footer-col a { display: inline-block; padding: 6px 0; }
  #landing .lp-footer-social a { width: 44px; height: 44px; }
  #landing .lp-footer {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
  }
}

@media (max-width: 480px) {
  #landing .lp-section { padding: 24px 16px; }
  #landing .lp-final-cta { padding: 40px 20px; }
}

/* ── WhatsApp float ── */
#lp-wa-float {
  border: 2px solid #128c7e;
  border-radius: 16px;
  box-shadow: 4px 4px 0 var(--tk-mint);
  bottom: calc(22px + env(safe-area-inset-bottom, 0px));
  right: calc(22px + env(safe-area-inset-right, 0px));
}
@media (max-width: 480px) {
  #lp-wa-float {
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    right: calc(14px + env(safe-area-inset-right, 0px));
  }
}

html[data-theme="dark"] #landing { background-color: #1a1612; }
html[data-theme="dark"] #landing .lp-stat,
html[data-theme="dark"] #landing .lp-step,
html[data-theme="dark"] #landing .lp-extra-card,
html[data-theme="dark"] #landing .lp-testimonial,
html[data-theme="dark"] #landing .lp-plan,
html[data-theme="dark"] #landing .lp-faq-item,
html[data-theme="dark"] #landing .benefit,
html[data-theme="dark"] #landing .lp-compare-wrap,
html[data-theme="dark"] #landing .lp-domain-card,
html[data-theme="dark"] #landing .lp-ai-card,
html[data-theme="dark"] #landing .lp-vchip,
html[data-theme="dark"] #landing .lp-press-logo,
html[data-theme="dark"] #landing .lp-guarantee,
html[data-theme="dark"] #landing .lp-ai-gallery-more {
  background: #241c18;
  border-color: #4a372c;
}
html[data-theme="dark"] #landing .lp-nav-link:hover,
html[data-theme="dark"] #landing .lp-theme-toggle:hover {
  background: #241c18;
}