/* ============================================================
   Charm Resort Long Hải — hardening layer (frontend-only Astro)
   Loaded AFTER style.css. Preserves the clone's visual identity.
   Scope: normal smooth scroll (was fullpage snap), CTA prominence,
   focus-visible, contrast/a11y, trust-signal legibility, reduced motion.
   Single brand accent kept: gold #DCB15B on ocean teal #1A5B74.
   ============================================================ */

/* ---- 1 · Normal smooth scroll (release the fullpage lock) ---- */
html { scroll-behavior: smooth; }
html, body {
  height: auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
#main { transform: none !important; transition: none !important; height: auto !important; }
/* sections stack and flow; keep the full-viewport panel feel without clipping */
#main section { height: auto !important; overflow: visible !important; }
#main section.home-sec { min-height: 100vh; }
/* On ≤991px the hero swaps its cover-background for an in-flow <img> (.bmmb);
   drop the forced 100vh / aspect-ratio so the section hugs the image (no gap below). */
@media (max-width: 991px){
  #main section.home-sec { min-height: 0; aspect-ratio: auto; max-height: none; }
}
/* uniform vertical rhythm on every section (hero keeps its full-height image) */
#main section:not(.home-sec) { padding-top: clamp(60px, 8vh, 110px) !important; padding-bottom: clamp(60px, 8vh, 110px) !important; }
@media (max-width: 640px){ #main section:not(.home-sec) { padding-top: 48px !important; padding-bottom: 48px !important; } }
/* anchor targets clear the fixed header */
#main section[id] { scroll-margin-top: 72px; }

/* ---- 2 · Primary CTA prominence (lead-form submit) ---- */
.contact-sec input[type="submit"],
.popup-form input[type="submit"],
input.wpcf7-submit {
  height: 54px !important;
  width: 100%;
  max-width: 340px;
  font-size: 16px !important;
  letter-spacing: 0.03em;
  box-shadow: 0 10px 24px rgba(220, 177, 91, 0.38);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.3s ease !important;
}
input.wpcf7-submit:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(220, 177, 91, 0.5); }
input.wpcf7-submit:active { transform: translateY(0); box-shadow: 0 6px 16px rgba(220, 177, 91, 0.35); }

/* header pill CTA -> solid gold with dark text (was low-contrast white/transparent) */
.touch-form {
  background: #DCB15B !important;
  color: #123642 !important;
  font-weight: 700 !important;
  border: none !important;
}
.touch-form .icon { border-color: #123642 !important; background: transparent !important; }
.touch-form .icon svg path { fill: #123642 !important; }
.touch-form:hover { background: #E8C274 !important; }
.touch-form:hover .icon { background: #123642 !important; }
.touch-form:hover .icon svg path { fill: #DCB15B !important; }

/* ---- 3 · Focus-visible (keyboard a11y — only 1 :focus rule existed) ---- */
a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #DCB15B;
  outline-offset: 3px;
  border-radius: 4px;
}
input:focus-visible,
textarea:focus-visible {
  outline: 3px solid #DCB15B;
  outline-offset: 0;
}

/* ---- 4 · Contrast & form legibility (ad traffic reads on phones) ---- */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea { color: #123642; }
.wpcf7-form ::placeholder { color: #5b6b74; opacity: 1; } /* decorative hint only; content text stays solid */
.wpcf7-response-output { color: #ffd9d0; }
/* kill the default cyan CF7 box border on the empty response slot (all forms) */
.wpcf7 form .wpcf7-response-output { border: 0; padding: 0; }

/* ---- 5 · Trust signals ----
   The partner logos (investor Phúc Đạt, operator Vienna House by Wyndham,
   designer SSA, builder Central, bank Nam A) are LIGHT logos authored for the
   dark partner-sec overlay — they already read correctly there, so we leave
   their background untouched (a white chip would swallow a white logo — the
   mirror of the dark-bg-swallows-dark-logo trap). We only firm up the labels
   and give the block a touch more breathing room so it reads as a trust strip. */
.partner-sec .first .name,
.partner-sec .list .item .name { color: #F3E7C9; font-weight: 600; letter-spacing: 0.04em; }
.partner-sec .list .item .logo img,
.partner-sec .first .logo img { transition: transform 0.3s ease; }

/* ---- 5b · Shared horizontal lead band (villa, floor, …) ---- */
.leadband { margin: 48px auto 0; position: relative; z-index: 2; }
.leadband-card { max-width: 1040px; margin: 0 auto; text-align: center;
  background: linear-gradient(160deg, #12384a, #0b2733); border: 1px solid rgba(220, 177, 91, 0.4);
  border-radius: 20px; padding: 40px; box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35); }
.leadband-title { font-family: 'Be Vietnam Pro', sans-serif; color: #DCB15B;
  font-size: clamp(22px, 2.8vw, 32px); font-weight: 700; line-height: 1.25; margin: 0 0 8px;
  text-transform: uppercase; letter-spacing: 0.02em; }
.leadband-sub { color: #F3F7F8; font-size: 16px; margin: 0 0 26px; }
.leadband-row { display: flex; gap: 12px; align-items: stretch; }
.leadband-row .wpcf7-form-control-wrap { flex: 1 1 0; display: block; }
.leadband-row input[type="text"],
.leadband-row input[type="tel"],
.leadband-row input[type="email"] { width: 100%; height: 56px; border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.28); background: rgba(255, 255, 255, 0.07); color: #ffffff;
  padding: 0 18px; font-size: 16px; text-align: left; }
.leadband-row input::placeholder { color: #c7d4da; opacity: 1; }
.leadband-row input:focus { outline: none; border-color: #DCB15B; background: rgba(255, 255, 255, 0.12); }
.leadband-submit { flex: 0 0 auto; height: 56px; padding: 0 34px; border: 0; border-radius: 10px;
  background: linear-gradient(180deg, #F0D08A, #DCB15B); color: #123642; font-weight: 700; font-size: 16px;
  text-transform: uppercase; letter-spacing: 0.03em; cursor: pointer; box-shadow: 0 8px 20px rgba(220, 177, 91, 0.35);
  transition: transform 0.2s, box-shadow 0.2s; }
.leadband-submit:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(220, 177, 91, 0.5); }
.leadband .wpcf7 .wpcf7-response-output { color: #ffd9d0; font-size: 14px; margin: 12px 0 0; padding: 0; border: 0; }
@media (max-width: 760px){
  .leadband-card { padding: 28px 20px; }
  .leadband-row { flex-direction: column; }
  .leadband-submit { height: 52px; }
}

/* ---- 6 · Motion — reveal-on-scroll kept; safe fallback for reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
  /* guarantee every reveal element is fully visible & un-transformed (no hidden content) */
  .have-load,
  .home-sec .inner .title,
  .manage-sec .img,
  .around-sec .item,
  [class*="re-active"] { opacity: 1 !important; transform: none !important; }
}
