/* unreal agent marketing site: layout fixes and additions on top of the Framer export.
   Copied to public/brand/site.css by scripts/import-marketing-site.py. */

/* Buttons added by site.js, styled like the Framer buttons. */
.ua-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 20px;
  border-radius: 10px;
  font: 600 15px/1 Inter, system-ui, sans-serif;
  letter-spacing: -0.01em;
  text-decoration: none;
  white-space: nowrap;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.ua-btn:hover { transform: translateY(-1px); }
.ua-btn-primary {
  background: #111;
  color: #fff;
  box-shadow: 0 0 0 1px #111, 0 8px 22px rgba(43, 238, 25, 0.28);
}
.ua-btn-ghost {
  background: #fff;
  color: #111;
  box-shadow: inset 0 0 0 1px rgba(17, 17, 17, 0.14);
}

/* Hero call to action, under the subhead. */
.ua-hero-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
  position: relative;
  z-index: 2;
  /* No CSS animation here: a filled animation would pin opacity at 1 and override the
     scroll-out fade that site.js mirrors from the hero subhead. */
}
.ua-hero-cta-row { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }

/* Phones: a call to action stays in reach after the hero. */
.ua-sticky-cta { display: none; }
@media (max-width: 809.98px) {
  .ua-hero-cta-row { flex-direction: column; width: min(320px, calc(100vw - 48px)); }
  .ua-hero-cta-row .ua-btn { width: 100%; }
  .ua-sticky-cta {
    display: block;
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    z-index: 8;
    transform: translateY(140%);
    transition: transform 0.25s ease;
  }
  .ua-sticky-cta.is-on { transform: none; }
  .ua-sticky-cta .ua-btn { width: 100%; min-height: 50px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25); }
}

/* The fan card's status line wrapped off-screen on phones (Framer sets white-space: pre). */
[data-framer-name="Status Text"] { white-space: normal !important; }
[data-framer-name="Status Text"] p { white-space: normal !important; text-align: center; }

/* The fan card's status line: the row is sized for the template's shorter line. */
[data-framer-name="Status"] { max-width: calc(100% - 24px) !important; }
[data-framer-name="Status Text"] { width: auto !important; flex-shrink: 1 !important; min-width: 0 !important; }

/* "Close more deals" is longer than the template's first headline line: keep it on one line. */
[data-framer-name="Headline"] [data-framer-name="Line 1"] { width: auto !important; }
[data-framer-name="Headline"] [data-framer-name="Line 1"] h1 { white-space: nowrap !important; }

/* The crew rows name every agent: show the whole line instead of clamping it. */
[data-framer-name="Service Tile"] [data-framer-name="Tagline"] {
  -webkit-line-clamp: unset !important;
  display: block !important;
  overflow: visible !important;
}
[data-framer-name="Service Tile"] [data-framer-name="Tagline"] p { white-space: normal !important; }

/* Phones stack the plan cards: the real plan (the emphasised middle card) comes first. */
@media (max-width: 809.98px) {
  [data-framer-name="Plans"] > [data-framer-name="Studio Plan"] { order: -1; }
}

/* Template leftovers: project years, and social links that only pointed at /contact. */
[data-framer-name="Project Card"] [data-framer-name="Year"],
footer [data-framer-name="Socials"] { display: none !important; }