/* Antenna Realty demo: design refresh (2026-10-08). Linked LAST on every demo page, after the
   page's own <style>, so it is the one place the current look is set: one modern sans
   (Manrope), glass and frost surfaces over a warm ground, rounded controls in sentence case,
   quieter labels. The brokerage keeps its own palette (forest, cream, clay, brass); the demo
   banner wears Pollinator's plum so it reads as the platform talking, not the brokerage. */
:root{
  --serif:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --sans:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --forest:#173f3a;--forest-2:#1f5049;--ink:#22262a;--paper:#f8f4ec;--oat:#efe7d9;
  --clay:#e5604c;--clay-ink:#b4452f;--brass:#8a6420;--sage:#5fb3ad;--sage-soft:#bfe2de;
  --g1:rgba(255,255,255,.62);--g2:rgba(255,255,255,.34);--gline:rgba(23,63,58,.10);--gedge:rgba(255,255,255,.95);
  --gshadow:0 22px 48px -30px rgba(23,63,58,.45);
}
body{background:var(--paper);font-size:17px;line-height:1.65;color:var(--ink);position:relative;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(50vmax 38vmax at 100% 0%,rgba(229,96,76,.22),transparent 62%),
  radial-gradient(48vmax 40vmax at 0% 65%,rgba(95,179,173,.30),transparent 62%),
  radial-gradient(40vmax 30vmax at 60% 105%,rgba(184,138,46,.16),transparent 65%),var(--paper)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.32;background:url(topo.svg) center/cover no-repeat}

/* type: one family, weight does the work */
h1,h2,h3,h4{font-family:var(--sans);color:var(--forest);font-weight:800;letter-spacing:-.03em}
h1{font-size:clamp(2.6rem,6vw,4.6rem);line-height:1.02;letter-spacing:-.04em}
h2{font-size:clamp(1.9rem,3.8vw,2.8rem);line-height:1.08}
h3{font-size:1.2rem;font-weight:700;letter-spacing:-.015em}
.script,.statement,.quote{font-family:var(--sans);font-style:normal}
.quote p,.statement p,blockquote{font-family:var(--sans);font-style:normal;font-weight:600;letter-spacing:-.02em}
.eyebrow,.flabel{font-family:var(--sans);font-weight:700;font-size:.74rem;letter-spacing:.14em;color:var(--brass)}
.bg-forest .eyebrow,.hero .eyebrow{color:#f2c9a8!important;opacity:1!important}
.lead{font-size:1.2rem}
.muted{color:#5e605f}
a{color:var(--clay-ink)}
a:hover{color:var(--forest)}

/* buttons: rounded, sentence case, one primary */
.btn{border-radius:999px;text-transform:none;letter-spacing:0;font-family:var(--sans);font-weight:700;font-size:.95rem;padding:13px 24px;
  transition:transform .15s,filter .15s,background .15s,border-color .15s}
.btn-primary{background:linear-gradient(180deg,#ec7a66,#d9543f);color:#fff;border-color:rgba(180,69,47,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 12px 26px -14px rgba(217,84,63,.9)}
.btn-primary:hover{filter:brightness(1.05);transform:translateY(-1px);background:linear-gradient(180deg,#ec7a66,#d9543f);color:#fff}
.btn-forest{background:var(--forest);color:#fff;border-radius:999px}
.btn-ghost{background:var(--g1);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-color:var(--gline);color:var(--forest)}
.btn-ghost:hover{background:#fff;color:var(--forest);border-color:rgba(229,96,76,.5)}
.hero .btn-ghost,.bg-forest .btn-ghost{background:rgba(255,255,255,.12)!important;border-color:rgba(255,255,255,.45)!important;color:#fff!important}
.tlink,.listing-cta{text-transform:none;letter-spacing:0;font-weight:700;font-size:.95rem;color:var(--clay-ink)}

/* demo banner: the platform talking, in Pollinator's plum */
.demo-banner{background:#2A2546!important;color:#ece9f4!important;padding:10px 20px!important;font:500 13.5px/1.4 'Manrope',system-ui,sans-serif!important;box-shadow:none!important;border:0!important}
.demo-banner span:first-child{background:#F29900!important;color:#2A2546!important;border-radius:999px!important;letter-spacing:.1em!important;font-size:.68rem!important;padding:3px 10px!important}
.demo-banner a{color:#F29900!important;text-decoration:none!important}
.demo-banner a:hover{text-decoration:underline!important}

/* header: frosted, sentence-case links */
.nav{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--paper) 74%,transparent)!important;-webkit-backdrop-filter:blur(16px) saturate(150%);backdrop-filter:blur(16px) saturate(150%);
  border-bottom:1px solid var(--gline)!important;box-shadow:none!important}
.nav .brand{font-family:var(--sans);font-weight:800;letter-spacing:-.025em;color:var(--forest)}
.nav .brand small{font-family:var(--sans);font-weight:600;letter-spacing:.08em;color:var(--brass)}
.nav nav a{text-transform:none;letter-spacing:0;font-weight:600;font-size:.95rem;color:var(--forest);border-radius:10px}
.nav nav a:hover{background:rgba(23,63,58,.07);color:var(--forest)}
.nav nav a.cta{background:linear-gradient(180deg,#ec7a66,#d9543f);color:#fff!important;border-radius:999px;padding:8px 16px}

/* hero: the photo, a soft shade on the text side, no stray marks */
.hero-mark{display:none!important}
.hero .ph-fill::after,.listings-hero .ph-fill::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(14,34,31,.78) 0%,rgba(14,34,31,.45) 45%,rgba(14,34,31,.1) 100%)}
.hero h1,.hero .lead{text-shadow:none}

/* surfaces: glass cards, rounded media */
.card,.tile,.listing,.journal-card,.feature,.stat,.step,.ws-card,.hood,.creds,.article,.tt,.stat-strip .s,.controls{
  border-radius:18px!important;border:1px solid var(--gline)!important;
  background:linear-gradient(180deg,var(--g1),var(--g2))!important;-webkit-backdrop-filter:blur(16px) saturate(150%);backdrop-filter:blur(16px) saturate(150%);
  box-shadow:inset 0 1px 0 var(--gedge),var(--gshadow)!important}
.listing,.journal-card{overflow:hidden}
.ph,.listing-img,.img-wrap,.jc-img,.agent-photo{border-radius:16px;overflow:hidden}
.ph:has(img.photo) .lbl{display:none}
.bg-oat{background:linear-gradient(180deg,rgba(239,231,217,.75),rgba(239,231,217,.45))!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.bg-forest{background:radial-gradient(60% 80% at 100% 0%,rgba(229,96,76,.22),transparent 60%),radial-gradient(50% 70% at 0% 100%,rgba(95,179,173,.22),transparent 60%),var(--forest)!important}
.bg-forest h1,.bg-forest h2,.bg-forest h3{color:#fff}
.listing-status,.tag,.pill-cat{border-radius:999px;letter-spacing:.08em}
.listing-price{font-family:var(--sans);font-weight:800;letter-spacing:-.02em}

/* the AI-image label stays (it's the compliance feature), just quieter */
.ai-badge{font:600 10px/1 'Manrope',system-ui,sans-serif!important;letter-spacing:.06em!important;padding:5px 9px!important;border-radius:999px!important;
  background:rgba(20,24,28,.55)!important;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.18)!important;color:#fff!important}

/* forms */
input,select,textarea{border-radius:12px!important;font-family:var(--sans)}

/* footer */
.foot{background:radial-gradient(50% 70% at 100% 0%,rgba(229,96,76,.16),transparent 60%),var(--forest)!important}
.foot .brand-mark{display:none}

@media (prefers-reduced-transparency:reduce){
  .card,.tile,.listing,.journal-card,.feature,.stat,.step,.ws-card,.tt,.controls,.nav{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff!important}
}

/* card titles carry weight; wide comparison tables scroll inside their box */
.tile h3,.card h3,.listing h3,.journal-card h3,.feature h3,.step h3,.listing-addr{font-weight:700!important;letter-spacing:-.015em}
.vs-table{display:block;max-width:100%;overflow-x:auto}

/* Antenna's own mark is the agency's, not the brokerage's: keep it out of the demo brokerage */
img[src*="antenna-mark"]{display:none!important}

/* one family everywhere, upright headings at full weight, including pages with their own styles */
body *:not(code):not(pre):not(kbd):not(samp){font-family:var(--sans)!important}
h1,h2,h3,h4{font-weight:800!important;font-style:normal!important}
h3,h4,.tt h4{font-weight:700!important}
.stat-strip .s .n,.ws-num,.step-num,[class*="-num"]{font-weight:800;font-style:normal!important;letter-spacing:-.02em}

/* agent tool tiles: glass like everything else, the accent moves from a side bar to the icon */
.tt::before{display:none}
.tt:hover{transform:translateY(-2px);border-color:rgba(229,96,76,.45)!important}
.tt .tt-btn{font-size:.85rem;letter-spacing:0}

/* calculator panel and listing search: rounded, and the search wraps cleanly on phones */
.controls{padding:26px 28px}
.search-bar{border-radius:18px!important;box-shadow:var(--gshadow)}
.search-bar input,.search-bar select,.search-bar button{border-radius:12px!important}
@media(max-width:640px){.search-bar{grid-template-columns:minmax(0,1fr)!important}.search-bar>*{min-width:0;width:100%}}

/* the glass needs something behind it: bands are a thin frost over the backdrop, not solid fills */
section{background-color:transparent}
.bg-oat{background:linear-gradient(180deg,rgba(239,231,217,.42),rgba(239,231,217,.18))!important;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.card,.tile,.listing,.journal-card,.feature,.stat,.step,.ws-card,.hood,.creds,.article,.tt,.stat-strip .s,.controls{
  -webkit-backdrop-filter:blur(22px) saturate(165%)!important;backdrop-filter:blur(22px) saturate(165%)!important}

/* home hero: fits the screen, text on a frosted panel over the photo */
.hero,.hero.hero-tall{min-height:calc(100svh - 126px)!important;align-items:center!important;padding:0!important}
.hero .wrap,.hero.hero-tall .wrap{padding-top:40px!important;padding-bottom:40px!important}
.hero .ph-fill::after{background:linear-gradient(90deg,rgba(14,34,31,.35),rgba(14,34,31,.05) 70%)!important}
.hero-panel{max-width:600px;padding:34px 36px 32px;border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.20),rgba(255,255,255,.07));
  -webkit-backdrop-filter:blur(22px) saturate(160%);backdrop-filter:blur(22px) saturate(160%);
  border:1px solid rgba(255,255,255,.30);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 30px 60px -30px rgba(0,0,0,.6)}
.hero-panel h1{font-size:clamp(2.3rem,4.2vw,3.6rem);max-width:none}
.hero-panel .lead{font-size:1.1rem;color:#fff}
.hero-panel .btn-row{margin-top:24px}
@media(max-width:640px){.hero-panel{padding:24px 22px}.hero,.hero.hero-tall{min-height:0!important}}
