.happy-one-page {
  --happy-ink: #10221f;
  --happy-muted: #5a6d67;
  --happy-green: #16483f;
  --happy-lime: #c9e7b7;
  --happy-gold: #d7b878;
  --happy-paper: #f4f6f2;
  color: var(--happy-ink);
  background: #fff;
}

.happy-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
  gap: clamp(34px, 7vw, 110px);
  align-items: end;
  min-height: 700px;
  overflow: hidden;
  padding: 150px max(6vw, calc((100vw - 1240px) / 2)) 72px;
  color: #fff;
  background:
    radial-gradient(ellipse at 75% 34%, rgba(128, 179, 132, .25), transparent 33%),
    linear-gradient(120deg, #10221f 0%, #17382f 58%, #254f41 100%);
}
.happy-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 42%; }
.happy-hero::after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, rgba(8,22,19,.9) 0%, rgba(8,22,19,.66) 48%, rgba(8,22,19,.38) 100%), linear-gradient(0deg, rgba(8,22,19,.55), transparent 52%); pointer-events: none; }
.happy-hero > :not(.happy-hero-image) { z-index: 1; }

.happy-hero-art { position: absolute; inset: 0 0 0 38%; overflow: hidden; pointer-events: none; opacity: .74; }
.happy-hero-art span { position: absolute; bottom: -17%; width: 15%; height: 86%; border: 1px solid rgba(223, 238, 218, .2); background: linear-gradient(180deg, rgba(206, 229, 200, .15), rgba(16, 34, 31, .08)); transform: skewY(-8deg); }
.happy-hero-art span:nth-child(1) { left: 20%; height: 72%; }
.happy-hero-art span:nth-child(2) { left: 37%; height: 92%; width: 19%; }
.happy-hero-art span:nth-child(3) { left: 58%; height: 65%; width: 17%; }
.happy-hero-art i { position: absolute; left: 12%; right: -10%; bottom: 0; height: 27%; border-top: 1px solid rgba(223, 238, 218, .32); background: linear-gradient(180deg, transparent, rgba(8, 23, 20, .46)); transform: skewY(-7deg); }
.happy-hero-copy, .happy-hero-facts { position: relative; z-index: 1; }
.happy-hero-copy { max-width: 790px; }
.happy-hero .back-link { color: rgba(255,255,255,.74); font-size: 13px; text-decoration: none; }
.happy-eyebrow, .happy-slogan { color: var(--happy-lime); font-size: 12px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.happy-eyebrow { margin: 35px 0 13px; }
.happy-wordmark { margin: 0; font-size: clamp(42px, 7vw, 84px); font-weight: 950; letter-spacing: -.065em; line-height: .94; }
.happy-wordmark b { color: var(--happy-lime); font-weight: 500; }
.happy-slogan { margin: 14px 0 26px; font-size: 11px; letter-spacing: .34em; }
.happy-hero h1 { max-width: 700px; margin: 0; color: #fff; font-family: var(--font-display, Georgia, serif); font-size: clamp(30px, 4vw, 48px); line-height: 1.12; }
.happy-hero-intro { max-width: 650px; margin: 20px 0 0; color: rgba(255,255,255,.8); font-size: 17px; line-height: 1.7; }
.happy-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.happy-hero .button.secondary { color: #fff; border-color: rgba(255,255,255,.48); background: rgba(255,255,255,.06); }
.happy-status { display: flex; align-items: center; gap: 9px; margin: 20px 0 0; color: rgba(255,255,255,.66); font-size: 12px; }
.happy-status span { width: 8px; height: 8px; border-radius: 50%; background: var(--happy-lime); box-shadow: 0 0 0 4px rgba(201,231,183,.14); }
.happy-hero-facts { padding: 23px; border: 1px solid rgba(255,255,255,.18); border-radius: 20px; background: rgba(8,24,20,.48); backdrop-filter: blur(12px); }
.happy-hero-facts .section-kicker { color: var(--happy-lime); }
.happy-hero-facts div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 15px 0; border-bottom: 1px solid rgba(255,255,255,.14); }
.happy-hero-facts div strong { color: #fff; font-size: 22px; }
.happy-hero-facts div span, .happy-hero-facts small { color: rgba(255,255,255,.72); font-size: 12px; }
.happy-hero-facts small { display: block; margin-top: 16px; line-height: 1.55; }

.happy-fact-strip { display: grid; grid-template-columns: repeat(4, 1fr); max-width: 1240px; margin: -1px auto 0; padding: 0 20px; border-bottom: 1px solid #dfe7e1; }
.happy-fact-strip > div { position: relative; padding: 28px 20px; border-right: 1px solid #dfe7e1; }
.happy-fact-strip > div:first-child { border-left: 1px solid #dfe7e1; }
.happy-fact-strip span { position: absolute; top: 15px; right: 16px; color: #a4b4aa; font-size: 10px; font-weight: 900; }
.happy-fact-strip strong, .happy-fact-strip small { display: block; }
.happy-fact-strip strong { font-size: 17px; }
.happy-fact-strip small { margin-top: 7px; color: var(--happy-muted); font-size: 12px; line-height: 1.45; }

.happy-section, .happy-location, .happy-homes, .happy-price, .happy-checks, .happy-contact, .happy-sources { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.happy-section { padding: 94px 0; }
.happy-section-heading { max-width: 760px; margin-bottom: 34px; }
.happy-section-heading h2, .happy-location h2, .happy-price h2, .happy-contact h2 { margin: 8px 0 15px; color: var(--happy-ink); font-family: var(--font-display, Georgia, serif); font-size: clamp(30px, 4vw, 48px); line-height: 1.1; }
.happy-section-heading > p:last-child, .happy-location-copy > p:not(.section-kicker), .happy-price-copy > p:not(.section-kicker), .happy-contact-copy > p:not(.section-kicker) { color: var(--happy-muted); font-size: 16px; line-height: 1.72; }
.happy-overview-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .52fr); gap: 38px; align-items: start; }
.happy-spec-list { margin: 0; border-top: 1px solid #dce4de; }
.happy-spec-list > div { display: grid; grid-template-columns: minmax(150px, .35fr) 1fr; gap: 16px; padding: 16px 0; border-bottom: 1px solid #dce4de; }
.happy-spec-list dt { color: var(--happy-muted); font-size: 13px; }
.happy-spec-list dd { margin: 0; font-size: 15px; font-weight: 750; line-height: 1.5; }
.happy-note-card { padding: 27px; border-radius: 18px; background: var(--happy-paper); }
.happy-note-card h3 { margin: 8px 0 12px; font-size: 22px; line-height: 1.2; }
.happy-note-card p:not(.section-kicker) { color: var(--happy-muted); font-size: 14px; line-height: 1.65; }
.happy-note-card a { color: var(--happy-green); font-weight: 850; text-decoration: none; }

.happy-location { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; padding: 80px 0; }
.happy-route-list { display: grid; gap: 0; margin: 26px 0; padding: 0; list-style: none; border-top: 1px solid #dce4de; }
.happy-route-list li { display: flex; gap: 15px; padding: 16px 0; border-bottom: 1px solid #dce4de; }
.happy-route-list li > span { color: #97aa9d; font-size: 11px; font-weight: 900; }
.happy-route-list strong, .happy-route-list small { display: block; }
.happy-route-list strong { font-size: 15px; }
.happy-route-list small { margin-top: 5px; color: var(--happy-muted); font-size: 13px; line-height: 1.5; }
.happy-map-card { position: relative; min-height: 430px; overflow: hidden; border-radius: 24px; background: #eaf0e9; }
.happy-map-card img { display: block; width: 100%; min-height: 430px; height: 100%; object-fit: cover; border-radius: inherit; }
.happy-map-card figcaption { padding: 10px 12px; color: var(--happy-muted); background: #f4f6f2; font-size: 11px; line-height: 1.5; }
.happy-gallery-card { max-width: 900px; margin: 0 auto; overflow: hidden; border-radius: 22px; background: var(--happy-paper); }
.happy-gallery-card img { display: block; width: 100%; max-height: 780px; object-fit: cover; object-position: center 55%; }
.happy-gallery-card figcaption { padding: 13px 17px; color: var(--happy-muted); font-size: 12px; }
.happy-map-grid { position: absolute; inset: -20%; opacity: .72; background-image: linear-gradient(27deg, transparent 46%, #fff 47%, #fff 50%, transparent 51%), linear-gradient(144deg, transparent 43%, #fff 44%, #fff 47%, transparent 48%), linear-gradient(90deg, rgba(111,148,124,.11) 1px, transparent 1px), linear-gradient(rgba(111,148,124,.11) 1px, transparent 1px); background-size: 100% 100%, 100% 100%, 34px 34px, 34px 34px; transform: rotate(-7deg); }
.happy-map-road { position: absolute; padding: 6px 9px; border-radius: 4px; color: #496256; background: rgba(255,255,255,.82); font-size: 9px; font-weight: 950; letter-spacing: .09em; box-shadow: 0 4px 16px rgba(31,59,43,.08); }
.road-ring { top: 17%; right: 8%; transform: rotate(-12deg); }
.road-pham { left: 8%; top: 44%; transform: rotate(29deg); }
.road-ql13 { right: 7%; bottom: 24%; transform: rotate(-31deg); }
.happy-map-pin { position: absolute; top: 44%; left: 46%; display: grid; justify-items: center; gap: 5px; transform: translate(-50%,-50%); text-align: center; }
.happy-map-pin span { display: grid; width: 52px; height: 52px; place-items: center; border: 6px solid rgba(20,72,63,.16); border-radius: 50%; color: #fff; background: var(--happy-green); font-size: 21px; font-weight: 900; box-shadow: 0 9px 25px rgba(16,49,39,.24); }
.happy-map-pin strong { font-size: 11px; letter-spacing: .08em; }
.happy-map-pin small { color: var(--happy-muted); font-size: 10px; }
.happy-map-card > p { position: absolute; right: 17px; bottom: 12px; color: #667a6d; font-size: 10px; }

.happy-amenity-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.happy-amenity-grid article { min-height: 245px; padding: 25px; border: 1px solid #dfe7e1; border-radius: 18px; background: linear-gradient(145deg,#fff,#f5f7f3); }
.happy-amenity-grid article > span { color: #738b7d; font-size: 10px; font-weight: 950; letter-spacing: .12em; }
.happy-amenity-grid h3 { margin: 24px 0 10px; font-size: 22px; }
.happy-amenity-grid p { color: var(--happy-muted); font-size: 14px; line-height: 1.65; }

.happy-homes { padding: 72px 0; }
.happy-home-types { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.happy-home-types article { position: relative; min-height: 175px; padding: 23px; border-radius: 16px; background: var(--happy-paper); }
.happy-home-types article > span { color: #71887a; font-size: 10px; font-weight: 950; }
.happy-home-types h3 { margin: 14px 0 8px; font-size: 19px; }
.happy-home-types p { margin: 0; color: var(--happy-muted); font-size: 13px; line-height: 1.55; }
.happy-inline-note { margin: 20px 0 0; padding: 15px 18px; border-left: 3px solid var(--happy-gold); color: var(--happy-muted); background: #fbf9f3; font-size: 13px; line-height: 1.6; }

.happy-price { display: grid; grid-template-columns: 1.05fr .75fr; gap: 48px; align-items: center; padding: 54px; border-radius: 24px; color: #fff; background: #142b26; }
.happy-price h2 { color: #fff; }
.happy-price-copy > p:not(.section-kicker) { color: rgba(255,255,255,.76); }
.happy-price .section-kicker { color: var(--happy-lime); }
.happy-price-checklist { padding: 23px; border: 1px solid rgba(255,255,255,.15); border-radius: 16px; background: rgba(255,255,255,.06); }
.happy-price-checklist > div { display: flex; justify-content: space-between; gap: 12px; padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.14); font-size: 13px; }
.happy-price-checklist > div span { color: rgba(255,255,255,.68); }
.happy-price-checklist > div strong { text-align: right; }
.happy-price-checklist small { display: block; margin: 15px 0 20px; color: rgba(255,255,255,.64); font-size: 11px; line-height: 1.5; }

.happy-progress { padding-bottom: 70px; }
.happy-progress-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 16px; }
.happy-progress-card, .happy-partners-card { padding: 26px; border: 1px solid #dfe7e1; border-radius: 18px; }
.happy-date { color: var(--happy-green); font-size: 12px; font-weight: 950; letter-spacing: .1em; }
.happy-progress-card h3, .happy-partners-card h3 { margin: 14px 0 10px; font-size: 23px; }
.happy-progress-card p, .happy-partners-card p:not(.section-kicker) { color: var(--happy-muted); font-size: 14px; line-height: 1.65; }
.happy-checks { padding: 72px 0; }
.happy-checks ol { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 32px; margin: 0; padding-left: 22px; }
.happy-checks li { padding: 4px 0 4px 6px; color: var(--happy-muted); font-size: 15px; line-height: 1.6; }
.happy-disclaimer { margin: 30px 0 0; padding: 18px; color: #6e5a2b; background: #faf6e9; font-size: 12px; line-height: 1.6; }

.happy-contact { display: grid; grid-template-columns: 1fr minmax(300px,.75fr); gap: 48px; align-items: center; padding: 58px; border-radius: 24px; background: var(--happy-paper); }
.happy-contact-copy h2 { font-size: clamp(29px,3.4vw,42px); }
.happy-contact-details { display: flex; flex-wrap: wrap; gap: 12px 22px; margin-top: 23px; }
.happy-contact-details a { color: var(--happy-green); font-weight: 900; text-decoration: none; }
.happy-lead-form { display: grid; gap: 13px; padding: 23px; border-radius: 17px; background: #fff; box-shadow: 0 15px 42px rgba(19,53,38,.08); }
.happy-lead-form label { display: grid; gap: 6px; font-size: 12px; font-weight: 800; }
.happy-lead-form input, .happy-lead-form select, .happy-lead-form textarea { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid #d9e1dc; border-radius: 8px; color: var(--happy-ink); background: #fff; font: inherit; font-size: 14px; }
.happy-lead-form textarea { resize: vertical; }
.happy-lead-form small { color: var(--happy-muted); font-size: 11px; line-height: 1.5; }
.happy-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.happy-sources { padding: 45px 0 65px; }
.happy-sources h2 { font-size: 18px; }
.happy-sources ul { display: grid; gap: 9px; padding-left: 18px; color: var(--happy-muted); font-size: 12px; line-height: 1.5; }
.happy-sources a { color: var(--happy-green); font-weight: 800; }
.happy-sources > p { color: #718078; font-size: 11px; }
.happy-mobile-cta { display: none; }

@media (max-width: 900px) {
  .happy-hero { grid-template-columns: 1fr; gap: 32px; min-height: auto; padding: 130px 28px 54px; }
  .happy-hero-facts { max-width: 470px; }
  .happy-hero-art { left: 18%; opacity: .2; }
  .happy-fact-strip { grid-template-columns: 1fr 1fr; }
  .happy-fact-strip > div:nth-child(3) { border-left: 1px solid #dfe7e1; }
  .happy-location, .happy-overview-grid, .happy-price, .happy-contact { grid-template-columns: 1fr; }
  .happy-location { gap: 28px; }
  .happy-price, .happy-contact { padding: 32px; }
  .happy-progress-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .happy-hero { padding: 105px 20px 38px; }
  .happy-wordmark { font-size: clamp(40px,12vw,62px); }
  .happy-hero-intro { font-size: 15px; }
  .happy-hero-actions { display: grid; }
  .happy-fact-strip { padding: 0 12px; }
  .happy-fact-strip > div { padding: 24px 12px; }
  .happy-fact-strip strong { font-size: 14px; }
  .happy-fact-strip small { font-size: 11px; }
  .happy-section, .happy-location, .happy-homes, .happy-price, .happy-checks, .happy-contact, .happy-sources { width: min(100% - 28px, 1180px); }
  .happy-section, .happy-location, .happy-homes, .happy-checks { padding-top: 58px; padding-bottom: 58px; }
  .happy-spec-list > div { grid-template-columns: 1fr; gap: 5px; }
  .happy-map-card { min-height: 330px; }
  .happy-amenity-grid, .happy-home-types, .happy-checks ol { grid-template-columns: 1fr; }
  .happy-amenity-grid article { min-height: 0; }
  .happy-price, .happy-contact { padding: 24px 18px; }
  .happy-price-checklist > div { align-items: flex-start; }
  .happy-price-checklist > div strong { max-width: 56%; }
  .happy-mobile-cta { position: fixed; z-index: 30; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: 1fr auto auto; gap: 9px; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid #dce4de; background: rgba(255,255,255,.96); box-shadow: 0 -5px 22px rgba(17,39,29,.08); }
  .happy-mobile-cta a { display: grid; min-height: 42px; place-items: center; padding: 0 14px; border-radius: 8px; color: #fff; background: var(--happy-green); font-size: 12px; font-weight: 900; text-decoration: none; }
  .happy-mobile-cta a:not(:first-child) { color: var(--happy-green); background: #e6efe8; }
  body.happy-one-page { padding-bottom: 68px; }
}
