/* Flagship flower pages (Protea, Dahlia). Scoped to .flower-page; consumes
   the same documented tokens as the systems page. */

.flower-page {
  --fl-green: #394d45;
  --fl-teal: #637a77;
  --fl-baby: #a9c8e0;
  --fl-baby-70: rgba(169, 200, 224, .72);
  --fl-ink: #040404;
  --fl-panel: #0d0d0d;
  --fl-text-80: rgba(255, 255, 255, .8);
  --fl-text-65: rgba(255, 255, 255, .65);
  --fl-line: rgba(255, 255, 255, .16);
  background: var(--fl-ink);
  color: #fff;
  font-family: var(--font-sans);
  font-weight: 300;
}

.flower-page h1,
.flower-page h2,
.flower-page h3 {
  font-family: var(--font-sans);
  font-weight: 300;
  letter-spacing: 0;
}

.flower-eyebrow {
  display: block;
  margin-bottom: 1.1rem;
  color: var(--fl-baby-70);
  font-size: .8125rem;
  font-weight: 400;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.flower-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 48px;
  padding: 15px 21px;
  border: 1px solid rgba(169, 200, 224, .55);
  background: transparent;
  color: #fff;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: .1em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  transition: background .25s, border-color .25s;
}

.flower-button--solid {
  border-color: var(--fl-green);
  background: var(--fl-green);
}

.flower-button--solid:hover {
  border-color: var(--fl-teal);
  background: var(--fl-teal);
}

.flower-button:not(.flower-button--solid):hover {
  border-color: var(--fl-baby);
  background: rgba(169, 200, 224, .16);
}

.flower-button:focus-visible {
  outline: 2px solid var(--fl-baby);
  outline-offset: 2px;
}

.flower-button span {
  font-size: .9rem;
}

/* -- Hero ------------------------------------------------------------ */

.flower-hero {
  position: relative;
  padding: 200px 7vw 96px;
  border-bottom: 1px solid var(--fl-line);
  background:
    radial-gradient(120% 90% at 80% 12%, rgba(99, 122, 119, .42), transparent 55%),
    radial-gradient(90% 70% at 12% 90%, rgba(57, 77, 69, .55), transparent 60%),
    linear-gradient(160deg, #0b100e, var(--fl-ink));
}

.flower-hero__inner {
  max-width: 980px;
}

.flower-hero h1 {
  margin: 0;
  font-size: clamp(2.4rem, 3.6vw, 3.5rem);
  line-height: 1.1;
}

.flower-hero p {
  max-width: 62ch;
  margin: 1.5rem 0 2.4rem;
  color: var(--fl-text-80);
  font-size: 1.05rem;
  line-height: 1.75;
}

.flower-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}

/* -- Metrics strip ------------------------------------------------------ */

.flower-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--fl-line);
}

.flower-metrics__item {
  padding: 2.4rem 2rem;
  border-right: 1px solid var(--fl-line);
}

.flower-metrics__item:last-child {
  border-right: 0;
}

.flower-metrics__item b {
  display: block;
  color: var(--fl-baby);
  font-size: clamp(1.5rem, 2.2vw, 2.1rem);
  font-weight: 300;
  line-height: 1.15;
}

.flower-metrics__item span {
  display: block;
  margin-top: .8rem;
  color: var(--fl-text-65);
  font-size: .85rem;
  line-height: 1.6;
}

/* -- Problem / solution --------------------------------------------------- */

.flower-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid var(--fl-line);
}

.flower-split__cell {
  padding: clamp(3rem, 5vw, 4.5rem) 7vw;
}

.flower-split__cell:first-child {
  border-right: 1px solid var(--fl-line);
  background: var(--fl-panel);
}

.flower-split__cell h2 {
  margin: 0 0 1.4rem;
  font-size: clamp(1.7rem, 2.2vw, 2.1rem);
}

.flower-split__cell p {
  margin: 0;
  color: var(--fl-text-65);
  font-size: 1rem;
  line-height: 1.85;
}

/* -- Highlights (Dahlia flow) ---------------------------------------------- */

.flower-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-bottom: 1px solid var(--fl-line);
}

.flower-flow__col {
  padding: 2.6rem 2.2rem;
  border-right: 1px solid var(--fl-line);
}

.flower-flow__col:last-child {
  border-right: 0;
}

.flower-flow__col h3 {
  margin: 0 0 1.4rem;
  font-size: 1.15rem;
}

.flower-flow__col ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.flower-flow__col li {
  padding: .65rem 0;
  border-top: 1px solid var(--fl-line);
  color: var(--fl-text-65);
  font-size: .92rem;
}

/* -- Capabilities ------------------------------------------------------------ */

.flower-caps {
  padding: 96px 7vw;
  border-bottom: 1px solid var(--fl-line);
}

.flower-caps__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 3rem;
}

.flower-cap {
  padding: 2.4rem 2.2rem;
  border: 1px solid var(--fl-line);
  background: var(--fl-panel);
}

.flower-cap__index {
  display: block;
  margin-bottom: 1.3rem;
  color: var(--fl-baby-70);
  font-size: .8125rem;
  letter-spacing: .14em;
}

.flower-cap h3 {
  margin: 0 0 1rem;
  font-size: 1.3rem;
}

.flower-cap p {
  margin: 0;
  color: var(--fl-text-65);
  font-size: .95rem;
  line-height: 1.75;
}

/* -- Architecture diagram ----------------------------------------------------- */

.flower-arch {
  padding: 96px 7vw;
  border-bottom: 1px solid var(--fl-line);
}

.flower-arch h2 {
  max-width: 24ch;
  margin: 0 0 3rem;
  font-size: clamp(1.9rem, 2.6vw, 2.375rem);
}

.flower-arch h2 em {
  color: var(--fl-baby);
  font-style: normal;
}

.flower-arch__tier {
  border: 1px solid var(--fl-line);
  background: var(--fl-panel);
}

.flower-arch__tier + .flower-arch__tier {
  margin-top: 12px;
}

.flower-arch__tier-label {
  padding: .85rem 1.4rem;
  border-bottom: 1px solid var(--fl-line);
  color: var(--fl-baby-70);
  font-size: .75rem;
  font-weight: 400;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.flower-arch__row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.flower-arch__row--two {
  grid-template-columns: 1fr 1fr;
}

.flower-arch__node {
  padding: 1.3rem 1.4rem;
  border-right: 1px solid var(--fl-line);
}

.flower-arch__node:last-child {
  border-right: 0;
}

.flower-arch__node b {
  display: block;
  font-weight: 400;
  font-size: .95rem;
}

.flower-arch__node span {
  display: block;
  margin-top: .35rem;
  color: var(--fl-text-65);
  font-size: .78rem;
  line-height: 1.55;
}

.flower-arch__governance {
  padding: 1rem 1.4rem;
  color: var(--fl-text-80);
  font-size: .85rem;
  letter-spacing: .06em;
}

.flower-arch__governance span {
  color: var(--fl-baby-70);
}

.flower-arch__copy {
  display: block;
  padding: 1.3rem 1.4rem;
  color: var(--fl-text-65);
  font-size: .92rem;
  line-height: 1.75;
}

.flower-arch__prose {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 3rem;
}

.flower-arch__prose h3 {
  margin: 0 0 .9rem;
  font-size: 1.1rem;
}

.flower-arch__prose p {
  margin: 0;
  color: var(--fl-text-65);
  font-size: .92rem;
  line-height: 1.75;
}

/* -- Enterprise deck ------------------------------------------------------------ */

.flower-enterprise {
  padding: 96px 7vw;
  background: var(--fl-green);
}

.flower-enterprise h2 {
  max-width: 24ch;
  margin: 0;
  font-size: clamp(1.9rem, 2.6vw, 2.375rem);
}

.flower-enterprise__copy {
  max-width: 72ch;
  margin: 1.5rem 0 3rem;
  color: rgba(255, 255, 255, .85);
  font-size: 1rem;
  line-height: 1.8;
}

.flower-enterprise__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.flower-enterprise__item {
  padding: 2rem 1.8rem;
  border: 1px solid rgba(255, 255, 255, .28);
}

.flower-enterprise__item h3 {
  margin: 0 0 .9rem;
  font-size: 1.1rem;
}

.flower-enterprise__item p {
  margin: 0;
  color: rgba(255, 255, 255, .75);
  font-size: .92rem;
  line-height: 1.75;
}

.flower-enterprise .flower-eyebrow {
  color: rgba(255, 255, 255, .7);
}

/* -- Yarrow / FloraCare ----------------------------------------------------- */

.flower-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 3rem;
}

.flower-section-head h2 {
  max-width: 20ch;
  margin: 0;
  font-size: clamp(1.9rem, 2.6vw, 2.375rem);
}

.flower-section-head p {
  max-width: 44ch;
  margin: 0;
  color: var(--fl-text-65);
  font-size: 1rem;
  line-height: 1.75;
}

.flower-symptoms {
  display: block;
}

.flower-split__cell--wide {
  grid-column: 1 / -1;
  border-right: 0;
}

.flower-symptoms__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 2.5rem;
}

.flower-symptom {
  padding: 1.8rem 1.6rem;
  border: 1px solid var(--fl-line);
}

.flower-symptom h3 {
  margin: 0 0 .8rem;
  font-size: 1.1rem;
}

.flower-symptom p {
  margin: 0;
  color: var(--fl-text-65);
  font-size: .92rem;
  line-height: 1.7;
}

.flower-symptoms__outro {
  margin: 2.5rem 0 0;
  color: var(--fl-text-80);
  font-size: 1.05rem;
}

.flower-tiers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.flower-tier {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--fl-line);
  background: var(--fl-panel);
}

.flower-tier__head {
  padding: 1.6rem 1.5rem 1.3rem;
  border-bottom: 1px solid var(--fl-line);
}

.flower-tier__head h3 {
  margin: 0 0 .5rem;
  font-size: 1.15rem;
  line-height: 1.35;
}

.flower-tier__head span {
  color: var(--fl-baby-70);
  font-size: .78rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.flower-tier__list {
  margin: 0;
  padding: .4rem 1.5rem 0;
  list-style: none;
  flex: 1;
}

.flower-tier__list li {
  padding: .7rem 0;
  border-top: 1px solid var(--fl-line);
  color: var(--fl-text-65);
  font-size: .88rem;
  line-height: 1.6;
}

.flower-tier__list li:first-child {
  border-top: 0;
}

.flower-tier__profile {
  margin: 1.4rem 1.5rem 1.6rem;
  padding-top: 1rem;
  border-top: 1px solid var(--fl-line);
  color: var(--fl-text-80);
  font-size: .88rem;
  font-style: italic;
  line-height: 1.65;
}

.flower-arch__tap {
  margin: 12px 0;
  padding: .8rem 1.4rem;
  border-left: 1px solid var(--fl-line);
  color: var(--fl-baby-70);
  font-size: .78rem;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.flower-enterprise__grid--spaced {
  margin-top: 3rem;
}

@media (max-width: 900px) {
  .flower-tiers,
  .flower-symptoms__grid,
  .flower-section-head {
    grid-template-columns: 1fr;
    display: grid;
  }

  .flower-section-head {
    gap: 1.5rem;
  }
}

/* -- Responsive ------------------------------------------------------------------- */

@media (max-width: 1000px) {
  .flower-metrics,
  .flower-arch__prose,
  .flower-enterprise__grid {
    grid-template-columns: 1fr 1fr;
  }

  .flower-metrics__item:nth-child(2n) {
    border-right: 0;
  }

  .flower-metrics__item {
    border-bottom: 1px solid var(--fl-line);
  }
}

@media (max-width: 800px) {
  .flower-hero {
    padding: 150px 24px 64px;
  }

  .flower-split,
  .flower-flow,
  .flower-caps__grid,
  .flower-arch__row,
  .flower-arch__row--two,
  .flower-arch__prose,
  .flower-enterprise__grid,
  .flower-metrics {
    grid-template-columns: 1fr;
  }

  .flower-split__cell:first-child,
  .flower-flow__col,
  .flower-arch__node,
  .flower-metrics__item {
    border-right: 0;
    border-bottom: 1px solid var(--fl-line);
  }

  .flower-flow__col:last-child,
  .flower-metrics__item:last-child {
    border-bottom: 0;
  }

  .flower-caps,
  .flower-arch,
  .flower-enterprise {
    padding: 64px 24px;
  }
}