/* Homepage colors match the existing public site's navy and yellow. */
:root {
  --ink: #103846;
  --ink-dark: #103846;
  --gold: #edb300;
  --cream: #fff;
  --muted: #5a656a;
  --line: #dce3e6;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.landing-hero {position: relative; background: var(--ink)}
.landing-hero picture, .landing-hero img {display: block; width: 100%; height: auto}
.landing-hero img {aspect-ratio: 1672 / 941}
.landing-hero::after {content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(16,56,70,.68) 0%,rgba(16,56,70,.64) 42%,rgba(16,56,70,.30) 75%); pointer-events:none; z-index:1}
.hero-title {position:absolute; top:17%; left:50%; transform:translateX(-50%); width:calc(100% - 80px); max-width:1800px; margin:0; z-index:2; color:#fff; text-align:center; font-family:Georgia,'Times New Roman',serif; font-weight:700; font-size:clamp(38px,5.55vw,112px); line-height:1.1; letter-spacing:-1.5px}
.hero-main, .hero-highlight {display:block; white-space:nowrap}
.hero-highlight {color:var(--gold); margin-top:5px}
.site-header {border-bottom: 0}
.stats-grid {padding-block: 39px}
.stat strong {font-size: 46px}
.stat span {font-size: 12px}
.section {padding-block: 88px}
.eyebrow {color: var(--ink); letter-spacing: 1.8px}
.section-heading {margin-bottom: 38px}
.heading-aside {font-size: 15px; line-height: 1.8}
.text-link {border-color: var(--gold)}
.button-gold:hover {background: #f3c235}
.company-since {font-family: var(--serif); font-size: 23px; color: var(--ink); text-wrap: balance}
.home-company-grid {display: grid; grid-template-columns: 1.05fr 1fr; gap: 85px}
.company-intro p {font-size: 18px; line-height: 1.95; max-width: 600px}
.home-mission {border-left: 3px solid var(--gold); padding-left: 30px}
.home-mission article + article {margin-top: 25px}
.home-mission h3 {font-size: 26px; margin-bottom: 11px}
.home-mission p {font-size: 14px; line-height: 1.8}
.home-mission p + p {margin-top: 9px}
.home-values {display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; margin-top: 49px; padding-top: 29px; border-top: 1px solid var(--line)}
.home-values h3 {font-size: 26px; margin-bottom: 13px}
.home-values p {font-size: 13px; line-height: 1.8}

.home-testimonial {background: var(--ink); color: #fff; padding-block: 48px 43px}
.testimonial-inner {max-width: 860px; position: relative}
.home-testimonial h2.eyebrow {font-family: var(--sans); font-size: 11px; font-weight: 600; color: var(--gold); text-align: left; margin-bottom: 19px; letter-spacing: 2px}
.quote-mark {display: block; color: var(--gold); font: 60px/.75 var(--serif); text-align: left; height: 38px}
.home-testimonial blockquote p {font: 26px/1.65 var(--serif); color: #fff; text-align: left; text-wrap: pretty}
.testimonial-footer {display: flex; justify-content: space-between; align-items: center; gap: 25px; margin-top: 26px}
.investor-name {color: var(--gold); font-size: 14px; font-weight: 600}
.investor-name span {display: inline-block; font-size: 11px; font-weight: 400; color: #fff; border-left: 1px solid #ffffff59; padding-left: 14px; margin-left: 14px}
.testimonial-footer .text-link {color: #fff; font-size: 12px; gap: 19px; border-color: var(--gold)}
.home-team .founder-summary {border-top: 2px solid var(--gold)}
.home-team .founder-summary img {aspect-ratio: .82; object-position: 50% 30%}
.home-team .founder-summary h3 {font-size: 32px}
.home-team .founder-summary p:not(.eyebrow) {font-size: 14px}
.home-strategy, .home-expectations {background: #fff; border-top: 1px solid var(--line)}
.home-process-grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 27px}
.home-process-card {display: grid; grid-template-columns: 54px 1fr; gap: 23px; padding: 30px; border: 1px solid var(--line); border-top: 3px solid var(--gold)}
.step-number {font: 35px/1.2 var(--serif); color: var(--gold); font-variant-numeric: tabular-nums}
.home-process-card h3 {font-size: 28px; margin-bottom: 15px}
.home-process-card p {font-size: 14px; line-height: 1.85}
.home-market-grid, .home-expectations-grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 33px 65px}
.home-market-card {padding-top: 21px; border-top: 1px solid var(--line)}
.card-rule {width: 35px; height: 3px; display: block; background: var(--gold); margin-bottom: 19px}
.home-market-card h3, .home-expectation-card h3 {font-size: 28px; margin-bottom: 16px}
.home-market-card p, .home-expectation-card p {font-size: 14px; line-height: 1.85}
.home-expectation-card {border-left: 3px solid var(--gold); padding-left: 25px}
.home-posts-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px}
.home-post {border: 1px solid var(--line); display: flex; flex-direction: column; min-width: 0}
.post-image {display: block; overflow: hidden; aspect-ratio: 1.65}
.post-image img {width: 100%; height: 100%; object-fit: cover; transition: transform .3s}
.post-image:hover img {transform: scale(1.035)}
.post-content {padding: 27px; display: flex; flex-direction: column; align-items: flex-start; flex: 1}
.post-content h3 {font-size: 26px; line-height: 1.3; min-height: 101px; margin-bottom: 17px}
.post-content p {font-size: 13px; line-height: 1.85; margin-bottom: 26px}
.post-content .text-link {margin-top: auto; font-size: 12px}
.contact-section {background: #fff; color: var(--ink); padding-block: 70px}
.contact-section .eyebrow {color: var(--ink)}
.contact-section p:not(.eyebrow) {color: var(--muted)}
.site-footer {background: var(--ink); border-top: 4px solid var(--gold)}
.footer-bottom {border-top-color: #ffffff40}

@media (max-width: 1100px) {
  .home-company-grid {gap: 45px}
  .company-intro p {font-size: 16px}
  .home-process-card {padding: 25px; grid-template-columns: 38px 1fr; gap: 18px}
  .home-process-card h3 {font-size: 26px}
  .home-process-card p {font-size: 13px}
  .home-values {gap: 24px}
  .home-market-grid, .home-expectations-grid {gap: 30px 40px}
  .home-market-card h3, .home-expectation-card h3 {font-size: 26px}
  .post-content {padding: 22px}
  .post-content h3 {font-size: 23px; min-height: 120px}
  .home-team .founder-summary p:not(.eyebrow) {font-size: 13px}
}

@media (max-width: 900px) {
  .section {padding-block: 65px}
  .home-company-grid {grid-template-columns: 1fr; gap: 29px}
  .company-intro p {max-width: none}
  .home-mission {display: grid; grid-template-columns: 1fr 1fr; gap: 35px; padding-left: 25px}
  .home-mission article + article {margin: 0}
  .home-values {grid-template-columns: repeat(2, 1fr); gap: 26px 40px; margin-top: 35px}
  .home-process-card {grid-template-columns: 1fr; gap: 13px}
  .step-number {font-size: 30px}
  .home-process-card h3 {font-size: 24px}
  .home-market-card h3, .home-expectation-card h3 {font-size: 24px}
  .home-testimonial blockquote p {font-size: 25px}
  .home-team .founder-summary img {aspect-ratio: 1.2}
  .home-posts-grid {gap: 19px}
  .post-content {padding: 19px}
  .post-content h3 {font-size: 21px; min-height: 116px}
}

@media (max-width: 700px) {
  .landing-hero img {aspect-ratio: 941 / 1672}
  .landing-hero::after {background:transparent}
  .hero-title {top:24%; width:calc(100% - 40px); font-size:clamp(26px,8.8vw,56px); line-height:1.16; letter-spacing:-.6px}
  .hero-main>span {display:block}
  .hero-highlight {margin-top:3px}
  .section {padding-block: 49px}
  .section-heading {gap: 19px; margin-bottom: 29px}
  .section-heading h2 {font-size: clamp(29px, 8vw, 37px); line-height: 1.18; letter-spacing: -.8px}
  .company-since {font-size: 19px}
  .stats-grid {padding-block: 29px; gap: 25px 0}
  .stat strong {font-size: 37px}
  .stat span {font-size: 10px}
  .company-intro p {font-size: 15px; line-height: 1.9}
  .home-mission {grid-template-columns: 1fr; gap: 23px; padding-left: 21px}
  .home-mission h3 {font-size: 25px; margin-bottom: 10px}
  .home-mission p {font-size: 14px}
  .home-values {gap: 27px 24px; padding-top: 26px; margin-top: 32px}
  .home-values h3 {font-size: 24px; margin-bottom: 11px}
  .home-values p {font-size: 12px}
  .home-testimonial {padding-block: 39px 35px}
  .home-testimonial h2.eyebrow {font-size: 10px; margin-bottom: 17px}
  .quote-mark {font-size: 53px; height: 33px}
  .home-testimonial blockquote p {font-size: 21px; line-height: 1.65}
  .testimonial-footer {flex-direction: column; align-items: flex-start; gap: 20px; margin-top: 23px}
  .testimonial-footer .text-link {font-size: 11px}
  .home-team .founder-summary {grid-template-columns: 35% 1fr; gap: 20px; padding-top: 24px}
  .home-team .founder-summary img {aspect-ratio: .7; object-position: 50% 28%; height: 100%; max-height: 300px}
  .home-team .founder-summary h3 {font-size: 28px}
  .home-team .founder-summary p:not(.eyebrow) {font-size: 12px}
  .home-process-grid, .home-market-grid, .home-expectations-grid {grid-template-columns: 1fr; gap: 24px}
  .home-process-card {padding: 23px 20px; grid-template-columns: 30px 1fr; gap: 16px}
  .step-number {font-size: 27px}
  .home-process-card h3 {font-size: clamp(20px, 6vw, 25px); margin-bottom: 13px}
  .home-process-card p {font-size: 14px}
  .home-market-card h3, .home-expectation-card h3 {font-size: clamp(19px, 5.6vw, 26px); margin-bottom: 14px}
  .home-market-card p, .home-expectation-card p {font-size: 14px}
  .home-expectation-card {padding-left: 21px}
  .home-posts-grid {grid-template-columns: 1fr; gap: 27px}
  .post-content {padding: 24px}
  .post-content h3 {font-size: 26px; min-height: 0; margin-bottom: 16px}
  .post-content p {font-size: 14px; margin-bottom: 23px}
  .post-content .text-link {font-size: 12px}
  .contact-section {padding-block: 49px}
  .contact-section h2 {font-size: 35px}
}

@media (max-width: 370px) {
  .home-team .founder-summary {grid-template-columns: 32% 1fr; gap: 15px}
  .home-process-card {grid-template-columns: 1fr; gap: 11px}
  .home-process-card h3 {font-size: 23px}
  .post-content h3 {font-size: 23px}
  .home-testimonial blockquote p {font-size: 20px}
}

@media (max-width: 370px) { .section-heading h2 { font-size: 25px; } }

/* Approved section introductions sit directly below their own heading. */
.section-heading-stacked {display:block}
.section-subtitle {font-size:18px; line-height:1.65; color:var(--ink); margin-top:15px; max-width:760px; text-wrap:balance}
@media(max-width:700px) {.section-subtitle{font-size:17px; margin-top:13px}}
