/* The Helston (demo): brand layer on top of the Alpine layout.
   Palette from the Helston logo: navy #192a49, teal #318fae, sky #86d3eb, green #61bd58, blue #4677bb. */
:root {
  --navy: #192a49;
  --navy-2: #24395e;
  --ink: #26354f;
  --muted: #56627a;
  --gold: #318fae;        /* accent lines, borders */
  --gold-ink: #1a6480;    /* accent text (AA on light surfaces) */
  --sky: #86d3eb;
  --green: #61bd58;
  --cream: #eaf4f8;
  --paper: #f6fafb;
  --line: #d3e4eb;
  --serif: "Poppins", "Helvetica Neue", Arial, sans-serif;
  --sans: "Inter", "Helvetica Neue", Arial, sans-serif;
}
h2 { font-style: normal; font-weight: 600; letter-spacing: -.015em; }
.arch-back-title, .ftr-name, .mgmt-logo-name { font-style: normal; font-weight: 600; }
.arch-back-title { color: var(--sky); }
.hero h1 { font-family: var(--serif); font-style: normal; font-weight: 600; letter-spacing: -.01em; }

/* Hovers use sky with navy text (8.5:1) instead of teal */
.pill-outline:hover, .pill-solid:hover, .pill-light:hover { background: var(--sky); border-color: var(--sky); color: var(--navy); }
.ftr a.soc:hover, .soc:hover, .chat-fab:hover { background: var(--sky); color: var(--navy); }
.quick button:hover { background: var(--sky); border-color: var(--sky); }
.sb-tag { background: var(--sky); color: var(--navy); }
.specials-tab { background: var(--sky); color: var(--navy); }
.specials { border-top-color: var(--gold); }
.sp-demo { font-size: .8rem !important; font-style: italic; color: var(--gold-ink) !important; }
.chat-sample { color: #134a5f; background: #dff0f6; }
.mobile-cta { background: rgba(246,250,251,.96); }

/* Logo in the header */
.brand { display: block; padding: 6px 0 2px; }
.brand-logo { height: 96px; width: auto; transition: height .25s; }
.hdr.scrolled .brand-logo { height: 62px; }
@media (max-width: 960px) {
  .brand-logo, .hdr.scrolled .brand-logo { height: 54px; }
}

/* Management company logo placeholder (teal) */
.ftr a.mgmt-logo { border-color: var(--gold); background: repeating-linear-gradient(135deg, #f1f9fc 0 10px, #e1f1f7 10px 20px); color: var(--navy); box-shadow: 0 0 0 4px rgba(49,143,174,.16); animation-name: mgmt-pulse-h; }
.mgmt-logo-kicker, .mgmt-logo-hint { color: var(--gold-ink); }
@keyframes mgmt-pulse-h { 0%, 100% { box-shadow: 0 0 0 4px rgba(49,143,174,.16); } 50% { box-shadow: 0 0 0 8px rgba(49,143,174,.30); } }
.ftr-logo { width: 104px; height: auto; margin-bottom: 14px; }

/* Neighborhood: real map + category list */
.map-embed iframe { display: block; width: 100%; aspect-ratio: 5 / 3.6; border: 0; }
.hood-map .map-filters { position: static; flex-direction: row; flex-wrap: wrap; margin-top: 14px; box-shadow: none; background: transparent; padding: 0; gap: 6px 10px; }
.mf[data-cat="food"] .mf-ico { background: #b4532f; }
.mf[data-cat="shop"] .mf-ico { background: #4677bb; }
.mf[data-cat="play"] .mf-ico { background: #2e7d32; }
.mf[data-cat="comm"] .mf-ico { background: var(--navy); }
.places { list-style: none; margin: 0 0 14px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; }
.places li { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: .92rem; }
.places strong { color: var(--navy); font-weight: 600; }
.places span { color: var(--gold-ink); font-weight: 700; font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.sample-note.left { text-align: left; margin: 0 0 22px; }

/* Reviews as platform links */
.rev-links { grid-template-columns: repeat(4, 1fr); }
.rev-link { display: flex; flex-direction: column; gap: 6px; text-decoration: none; padding: 26px 24px; transition: transform .2s, border-color .2s, box-shadow .2s; }
.rev-link:hover { transform: translateY(-3px); border-color: var(--gold); box-shadow: 0 14px 30px rgba(25,42,73,.08); }
.rev-src { font-family: var(--serif); font-weight: 600; font-size: 1.2rem; color: var(--navy); }
.rev-link span:last-child { font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink); }
@media (max-width: 960px) {
  .rev-links { grid-template-columns: 1fr 1fr; }
  .places { grid-template-columns: 1fr; }
}
@media (max-width: 560px) { .rev-links { grid-template-columns: 1fr; } }

/* Simple inner pages (privacy, accessibility, 404) */
.page-hdr { background: var(--cream); border-bottom: 1px solid var(--line); padding: 14px 24px; }
.page-hdr a { display: inline-block; }
.page-hdr img { height: 64px; width: auto; }
.legal { max-width: 760px; margin: 0 auto; padding: 56px 24px 80px; }
.legal h1 { font-family: var(--serif); font-weight: 600; font-size: clamp(2rem, 4vw, 2.6rem); line-height: 1.15; margin-bottom: 8px; }
.legal h2 { font-size: 1.35rem; margin: 34px 0 10px; }
.legal .draft { background: #dff0f6; color: #134a5f; border-left: 4px solid var(--gold); border-radius: 8px; padding: 12px 16px; font-size: .92rem; margin: 18px 0 28px; }
.legal ul { padding-left: 20px; }
.legal li { margin: 6px 0; }

/* Geometric sans headings to match the logo (no italics) */
.arch-label, .plan h3, .tour-done h3 { font-style: normal; font-weight: 600; }
.arch-label { font-size: 1.15rem; }
.plan h3 { font-size: 1.3rem; }
.hr-copy h2 { font-size: clamp(1.6rem, 2.4vw, 2.1rem); }

/* Real photos (from the previous website, 740px) */
.hero-media img, .banner img, .split-media img, .arch-face img, .hr-arch img, .g-item img { object-fit: cover; }
.sample-banner a { color: var(--navy); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }

/* Floor plan drawings */
.plan-img.plan-photo { background: #fff; padding: 8px; height: 166px; display: flex; align-items: center; justify-content: center; }
.plan-img.plan-photo img { max-width: 100%; max-height: 150px; width: auto; height: auto; object-fit: contain; }
.plan-img.plan-missing { position: relative; height: 166px; display: flex; align-items: center; justify-content: center; }
.plan-img.plan-missing svg { opacity: .35; }
.plan-flag { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); background: var(--navy); color: #fff; font-size: .78rem; font-weight: 600; letter-spacing: .02em; padding: 6px 12px; border-radius: 999px; white-space: nowrap; }
.plan-lease { display: block; font-size: .8rem; font-weight: 400; color: var(--muted); margin-top: 2px; }
.plan-tbc { font-size: .76rem; font-style: italic; color: var(--gold-ink); margin: 4px 0 14px; }

/* Neighborhood photo strip */
.hood-pics { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; max-width: 1280px; margin: 0 auto; padding: 0 24px 72px; }
.hood-pics figure { margin: 0; }
.hood-pics img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 14px; display: block; }
.hood-pics figcaption { font-size: .82rem; color: var(--muted); margin-top: 8px; text-align: center; }
@media (max-width: 960px) { .hood-pics { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .hood-pics { grid-template-columns: repeat(2, 1fr); gap: 10px; padding-bottom: 48px; } }

/* Demo status page */
.status-page { max-width: 920px; margin: 0 auto; padding: 56px 24px 80px; }
.status-page h1 { font-family: var(--serif); font-weight: 600; color: var(--navy); font-size: clamp(1.8rem, 3vw, 2.4rem); margin-bottom: 8px; }
.status-page h2 { font-size: 1.35rem; color: var(--navy); margin: 40px 0 12px; padding-bottom: 6px; border-bottom: 2px solid var(--gold); }
.status-page p, .status-page li { color: var(--ink); line-height: 1.6; }
.status-table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.status-table th { text-align: left; background: var(--cream); color: var(--navy); padding: 10px 12px; border-bottom: 2px solid var(--gold); }
.status-table td { padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: top; color: var(--ink); }
.st { display: inline-block; font-size: .74rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.st-in { background: #e3f3e1; color: #24602a; }
.st-need { background: var(--navy); color: #fff; }
.st-tbc { background: #dff0f6; color: #134a5f; }
.status-back { display: inline-block; margin-top: 28px; }

/* CRM Residential logo (footer) */
.ftr a.mgmt-logo-real { display: inline-block; padding: 4px 0; transition: opacity .2s; }
.ftr a.mgmt-logo-real:hover { opacity: .8; }
.ftr a.mgmt-logo-real img { width: 220px; height: auto; display: block; }
@media (max-width: 560px) { .ftr a.mgmt-logo-real img { width: 180px; } }

/* Seven floor plans: studio + three 1-beds on row one, three 2-beds centered on row two */
.plans.plans-7 { display: flex; flex-wrap: wrap; justify-content: center; gap: 22px; }
.plans.plans-7 .plan { flex: 0 1 calc((100% - 66px) / 4); min-width: 0; }
@media (max-width: 1100px) { .plans.plans-7 .plan { flex-basis: calc((100% - 22px) / 2); } }
@media (max-width: 760px) { .plans.plans-7 { max-width: 520px; margin: 0 auto; } .plans.plans-7 .plan { flex-basis: 100%; } }

/* Resident portal not ready */
.pill-disabled { opacity: .55; cursor: default; pointer-events: none; }
.link-disabled { cursor: default; opacity: .7; }
.link-disabled small { font-size: .72em; font-weight: 500; text-transform: none; letter-spacing: 0; }
/* Single review platform */
.rev-links.rev-one { grid-template-columns: minmax(0, 360px); justify-content: center; }
/* Live: price hidden */
.plan-price.plan-call { font-size: 1rem; font-weight: 600; }
.ts-box { margin: 4px 0 12px; min-height: 0; }
