﻿/* Terevia final visual system layer.
   Purpose: one predictable last stylesheet for final production polish.
   Do not change copy, URLs, forms, pricing or compliance wording here. */

:root {
  --tf-paper: #f3eddf;
  --tf-paper-soft: #f8f4ea;
  --tf-ink: #1a1814;
  --tf-text: #3c4a42;
  --tf-muted: #56645c;
  --tf-green: #1d4d3a;
  --tf-deep: #143528;
  --tf-line: rgba(220, 211, 192, .9);
  --tf-line-soft: rgba(220, 211, 192, .62);
  --tf-cream: #fdfcf8;
  --tf-cream-soft: #f3eddf;
  --tf-shadow: 0 18px 44px rgba(20, 53, 40, .055);
}

html, body { overflow-x: clip; }
body, .tv-page, main { background: var(--tf-paper) !important; }

/* Section rhythm: calm, but no accidental dead zones. */
.figma-home > section:not(.figma-hero):not(.figma-quote),
.sec,
.product-section,
.founder-section,
.closer {
  padding-top: clamp(62px, 6.4vw, 96px) !important;
  padding-bottom: clamp(62px, 6.4vw, 96px) !important;
}

.figma-section--participation,
.figma-section--clarity,
.figma-section--faq,
.figma-section--contact {
  padding-top: clamp(54px, 5.3vw, 82px) !important;
  padding-bottom: clamp(54px, 5.3vw, 82px) !important;
}

.home-return-wrap {
  min-height: 0 !important;
  padding: 0 0 clamp(34px, 4vw, 56px) !important;
}

main > .sec:has(+ .home-return-wrap),
main > .founder-section:has(+ .home-return-wrap),
main > .closer:has(+ .home-return-wrap) {
  padding-bottom: clamp(30px, 3.4vw, 48px) !important;
}

/* Pricing cards: dark cards must be fully readable. The top block matches the bullet text. */
.figma-section--participation .figma-pricing-grid .figma-price-card--featured,
.figma-section--participation .figma-pricing-grid .figma-price-card--dark {
  background: var(--tf-deep) !important;
  border-color: rgba(253, 252, 248, .24) !important;
  color: var(--tf-cream) !important;
}

.figma-section--participation .figma-pricing-grid .figma-price-card--featured *,
.figma-section--participation .figma-pricing-grid .figma-price-card--dark * {
  color: var(--tf-cream) !important;
  -webkit-text-fill-color: var(--tf-cream) !important;
  opacity: 1 !important;
  filter: none !important;
}

.figma-section--participation .figma-pricing-grid .figma-price-card--featured > div,
.figma-section--participation .figma-pricing-grid .figma-price-card--dark > div,
.figma-section--participation .figma-pricing-grid .figma-price-card--featured > p,
.figma-section--participation .figma-pricing-grid .figma-price-card--dark > p,
.figma-section--participation .figma-pricing-grid .figma-price-card--featured ul,
.figma-section--participation .figma-pricing-grid .figma-price-card--dark ul {
  opacity: 1 !important;
  filter: none !important;
}

.figma-section--participation .figma-pricing-grid .figma-price-card--featured ul,
.figma-section--participation .figma-pricing-grid .figma-price-card--dark ul {
  border-top-color: rgba(253, 252, 248, .34) !important;
}

.figma-section--participation .figma-pricing-grid .figma-price-card--featured li::before,
.figma-section--participation .figma-pricing-grid .figma-price-card--dark li::before {
  background: var(--tf-cream) !important;
}

.figma-section--participation .figma-pricing-grid .figma-price-card--featured .figma-button,
.figma-section--participation .figma-pricing-grid .figma-price-card--dark .figma-button {
  background: var(--tf-cream-soft) !important;
  border-color: var(--tf-cream-soft) !important;
  color: var(--tf-deep) !important;
  -webkit-text-fill-color: var(--tf-deep) !important;
}

.figma-section--participation .figma-pricing-grid .figma-price-card--featured .figma-button *,
.figma-section--participation .figma-pricing-grid .figma-price-card--dark .figma-button * {
  color: var(--tf-deep) !important;
  -webkit-text-fill-color: var(--tf-deep) !important;
}

/* Homepage four component cards: equal visual completeness. */
.figma-section--receive .figma-product-card {
  min-height: 360px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}

.figma-section--receive .figma-product-card .figma-mini-list {
  margin-top: 18px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--tf-line-soft) !important;
}

.figma-section--receive .figma-product-card a {
  margin-top: auto !important;
  padding-top: 22px !important;
}

/* What You Receive usage boxes: six-card layout must win over older two-card rules. */
.wyr-content--usage {
  max-width: 1120px !important;
}

.wyr-content--usage .usage-grid--expanded {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(18px, 2vw, 26px) !important;
  max-width: 1120px !important;
  margin-top: clamp(34px, 4vw, 54px) !important;
}

.wyr-content--usage .usage-card--compact {
  min-height: clamp(172px, 14vw, 220px) !important;
  padding: clamp(26px, 2.4vw, 34px) !important;
}

.wyr-content--usage .usage-card__type {
  color: var(--tf-green) !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
}

.wyr-content--usage .usage-card--compact h3 {
  color: var(--tf-ink) !important;
  font-size: clamp(17px, 1.25vw, 20px) !important;
  line-height: 1.28 !important;
}

/* Nature partner image: larger landscape treatment. */
.figma-photo-break__image,
.figma-photo-break__image img {
  min-height: clamp(720px, 66vw, 1000px) !important;
}

/* About page: founder stats-to-card gap reduced. */
.founder-section .stats-strip {
  margin-bottom: clamp(16px, 2vw, 27px) !important;
}

.founder-section .founder-grid,
.founder-grid {
  margin-top: clamp(13px, 1.5vw, 21px) !important;
}

/* Footer: one column system, no oversized inline category words. */
.site-foot,
.tv-footer,
.site-footer {
  background: #103225 !important;
  color: rgba(248, 241, 226, .78) !important;
}

.site-foot .foot-top {
  display: grid !important;
  grid-template-columns: minmax(260px, 1.35fr) repeat(4, minmax(130px, .75fr)) !important;
  gap: clamp(28px, 4vw, 58px) !important;
  align-items: start !important;
}

.site-foot .foot-nav {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  align-content: start !important;
}

.site-foot .foot-nav strong,
.tv-footer__heading {
  display: block !important;
  margin: 0 0 8px !important;
  color: #f8f1e2 !important;
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

.site-foot .foot-nav a,
.tv-footer__link,
.footer-nav a {
  display: block !important;
  color: rgba(248, 241, 226, .78) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}

.site-foot .foot-brand,
.site-foot .legal,
.tv-footer__meta,
.tv-footer__brand p,
.footer-line,
.footer-compliance {
  color: rgba(248, 241, 226, .78) !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}

.site-foot .legal {
  max-width: 980px !important;
  margin-top: 24px !important;
}

@media (max-width: 1100px) {
  .figma-photo-break__image,
  .figma-photo-break__image img {
    min-height: 560px !important;
  }
}

@media (max-width: 1023px) {
  .site-foot .foot-top {
    grid-template-columns: 1fr 1fr !important;
  }
  .wyr-content--usage .usage-grid--expanded {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .figma-home > section:not(.figma-hero):not(.figma-quote),
  .sec,
  .product-section,
  .founder-section,
  .closer,
  .figma-section--participation,
  .figma-section--clarity,
  .figma-section--faq,
  .figma-section--contact {
    padding-top: 52px !important;
    padding-bottom: 52px !important;
  }

  .figma-section--receive .figma-product-card {
    min-height: 0 !important;
  }

  .figma-photo-break__image,
  .figma-photo-break__image img {
    min-height: 360px !important;
  }
}

@media (max-width: 700px) {
  .site-foot .foot-top,
  .site-foot .foot-nav,
  .wyr-content--usage .usage-grid--expanded {
    grid-template-columns: 1fr !important;
  }
  .site-foot .foot-nav {
    padding-top: 18px !important;
    border-top: 1px solid rgba(248,241,226,.12) !important;
  }
  .wyr-content--usage .usage-card--compact {
    min-height: 0 !important;
  }
}

/* Reference image panels: restrained image moments from the approved visual system. */
.subhero .wrap:has(.subhero-image-panel) {
  display: grid !important;
  grid-template-columns: minmax(0, .95fr) minmax(360px, .82fr) !important;
  gap: clamp(34px, 5vw, 72px) !important;
  align-items: center !important;
}

.subhero .wrap:has(.subhero-image-panel) > .eyebrow,
.subhero .wrap:has(.subhero-image-panel) > h1,
.subhero .wrap:has(.subhero-image-panel) > p,
.subhero .wrap:has(.subhero-image-panel) > .subhero-cta {
  grid-column: 1 !important;
}

.subhero-image-panel {
  grid-column: 2 !important;
  grid-row: 1 / span 8 !important;
  align-self: stretch !important;
  min-height: clamp(360px, 34vw, 520px) !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(220, 211, 192, .86) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.58) !important;
  box-shadow: 0 26px 70px rgba(20, 53, 40, .09) !important;
}

.subhero-image-panel img {
  width: 100% !important;
  height: 100% !important;
  min-height: inherit !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center !important;
  filter: saturate(.86) sepia(.08) brightness(1.02) contrast(.96) !important;
}

.subhero-image-panel--product {
  background: radial-gradient(circle at 50% 26%, rgba(255,255,255,.78), transparent 44%), rgba(236,229,214,.78) !important;
  display: grid !important;
  place-items: center !important;
  padding: clamp(22px, 3vw, 42px) !important;
}

.subhero-image-panel--product img {
  height: auto !important;
  min-height: 0 !important;
  max-height: clamp(260px, 30vw, 440px) !important;
  object-fit: contain !important;
  filter: saturate(.9) sepia(.04) !important;
  box-shadow: 0 18px 42px rgba(20,53,40,.12) !important;
}

@media (max-width: 900px) {
  .subhero .wrap:has(.subhero-image-panel) {
    grid-template-columns: 1fr !important;
  }
  .subhero-image-panel {
    grid-column: 1 !important;
    grid-row: auto !important;
    min-height: 300px !important;
    margin-top: 18px !important;
  }
}

@media (max-width: 620px) {
  .subhero-image-panel {
    min-height: 230px !important;
  }
}
/* End reference image panels. */
