/* Trinathen Business Capital — warmth + two-door layer.
   Sits on top of styles.css / capital.css; tokens inherited, warm accents added. */
:root{
  --honey:#c08d52;
  --clay:#a8714f;
  --warm:#f5efe3;
  --warmer:#ece3d2;
  --dusk:#111c18;
}

/* ---------- front-door split ---------- */
.hero .hero-copy{max-width:1260px;padding-top:6vh;padding-bottom:6vh}
.hero h1{font-size:clamp(46px,5.4vw,94px);margin:22px 0 24px}
.hero-copy>p:not(.eyebrow):not(.g-body):not(.gateway-fine){font-size:19px;margin-bottom:0}
.gateway-two{
  display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background:#ffffff2e;border:1px solid #ffffff2e;margin-top:46px;max-width:1020px
}
.gateway-two a{
  padding:36px 34px 40px;background:rgba(10,17,14,.66);color:#fff;text-decoration:none;
  display:flex;flex-direction:column;gap:14px;transition:background .3s,transform .3s
}
.gateway-two a:hover{background:rgba(10,17,14,.84);transform:translateY(-3px)}
.gateway-two .g-eyebrow{
  text-transform:uppercase;letter-spacing:.2em;font-size:9px;font-weight:500;color:var(--honey)
}
.gateway-two .g-title{font:400 clamp(32px,3.4vw,46px)/1 'Newsreader',serif;letter-spacing:-.03em}
.gateway-two .g-body{font:400 16px/1.6 'DM Sans',sans-serif;color:#dfe4df;margin:0;max-width:34ch}
.gateway-two .g-go{
  margin-top:auto;text-transform:uppercase;letter-spacing:.14em;font-size:10px;
  border-bottom:1px solid #ffffff66;padding-bottom:4px;align-self:flex-start
}
.gateway-fine{margin:24px 0 0}
.gateway-fine a{
  color:#efe6d4;font:400 15px/1.5 'Newsreader',serif;
  text-shadow:0 1px 14px rgba(0,0,0,.9);border-bottom:1px solid rgba(239,230,212,.45);padding-bottom:2px
}
.gateway-fine a:hover{border-bottom-color:#efe6d4}

/* the hero slide layer is a child, so re-lay the darkening above it and lift the copy */
.hero{isolation:isolate}
.hero .veil{z-index:1}
.hero-copy,.hero .place{position:relative;z-index:2}

/* ---------- page hero for the two inner pages ---------- */
.dream-hero{
  min-height:70vh;display:flex;flex-direction:column;justify-content:flex-end;
  align-items:flex-start;position:relative;
  color:#fff;padding:0 8vw 6vw;isolation:isolate;background-position:center;background-size:cover
}
.dream-hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,#0b1410a8,#0b141066 32%,#0b1410c4 82%,#0b1410ee)
}
.dream-hero > *{position:relative;z-index:2}
.dream-hero .eyebrow{color:var(--honey);margin-bottom:22px;display:block}
.dream-hero h1{
  font-size:clamp(50px,7vw,108px);letter-spacing:-.05em;margin:0 0 26px;max-width:19ch
}
.dream-hero h1 em{font-style:italic;color:#f3e7d4}
.dream-hero p{font:400 21px/1.55 'Newsreader',serif;max-width:60ch;margin:0;color:#e9ece8}

/* ---------- a plain spoken statement ---------- */
.statement{padding:9vw 8vw;background:var(--warm)}
.statement p{
  font:400 clamp(30px,3.9vw,58px)/1.16 'Newsreader',serif;
  letter-spacing:-.032em;max-width:26ch;margin:0
}
.statement p em{font-style:italic;color:var(--clay)}
.statement .after{
  font:400 19px/1.7 'DM Sans',sans-serif;letter-spacing:0;color:#55605a;
  max-width:62ch;margin:36px 0 0
}

/* ---------- who we serve ---------- */
.folks{padding:9vw 8vw;background:var(--paper)}
.folks-head{display:grid;grid-template-columns:1.05fr .95fr;gap:5vw;align-items:end}
.folks-head h2,.shelf-head h2,.dream-steps .head h2{
  margin:0;max-width:20ch;font-size:clamp(40px,4.8vw,76px)}
.folks-head p{font:400 19px/1.7 'DM Sans',sans-serif;color:#55605a;margin:0;max-width:52ch}
.folks-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:64px
}
.folks-grid figure{margin:0;position:relative;overflow:hidden;background:var(--cream)}
.folks-grid img{
  display:block;width:100%;height:230px;object-fit:cover;
  transition:transform .8s cubic-bezier(.2,.7,.2,1)
}
.folks-grid figure:hover img{transform:scale(1.05)}
.folks-grid figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:18px 18px 16px;color:#fff;
  font:500 10px/1.4 'DM Sans',sans-serif;text-transform:uppercase;letter-spacing:.16em;
  background:linear-gradient(180deg,transparent,#0b1410d9)
}


/* the eighth cell: an invitation rather than a weak photograph */
.folks-cta{
  display:flex;flex-direction:column;gap:12px;justify-content:center;
  background:var(--dusk);color:#fff;padding:26px 24px;min-height:230px;transition:background .3s
}
.folks-cta:hover{background:#1a2a24}
.folks-cta b{font:500 10px 'DM Sans',sans-serif;text-transform:uppercase;letter-spacing:.16em;color:var(--honey)}
.folks-cta span{font:400 17px/1.45 'Newsreader',serif;color:#e4e9e5}
.folks-cta em{
  font-style:normal;margin-top:6px;font:500 10px 'DM Sans',sans-serif;
  text-transform:uppercase;letter-spacing:.14em;border-bottom:1px solid #ffffff5c;
  padding-bottom:4px;align-self:flex-start
}

/* ---------- products ---------- */
.shelf{padding:9vw 8vw;background:var(--warmer)}
.shelf-head{display:grid;grid-template-columns:1.05fr .95fr;gap:5vw;align-items:end}
.shelf-head h2{margin:0}
.shelf-head p{font:400 19px/1.7 'DM Sans',sans-serif;color:#55605a;margin:0;max-width:56ch}
.shelf-grid{
  display:grid;grid-template-columns:repeat(3,1fr);margin-top:60px;
  border-top:1px solid var(--line);border-left:1px solid var(--line)
}
.shelf-grid article{
  padding:34px 30px 38px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)
}
.shelf-grid span{font:500 10px 'DM Sans',sans-serif;letter-spacing:.16em;color:var(--clay)}
.shelf-grid h3{font-size:31px;margin:26px 0 14px;letter-spacing:-.02em}
.shelf-grid p{color:#58635d;margin:0;font-size:15px;line-height:1.65}
.shelf-grid .fig{
  display:block;margin-top:16px;font:500 10px 'DM Sans',sans-serif;
  text-transform:uppercase;letter-spacing:.14em;color:#7d8881
}

/* ---------- steps ---------- */
.dream-steps{padding:9vw 8vw;background:var(--dusk);color:#fff}
.dream-steps .head{display:grid;grid-template-columns:1.05fr .95fr;gap:5vw;align-items:end}
.dream-steps h2{margin:0}
.dream-steps .head p{color:#c8d0cb;font:400 19px/1.7 'DM Sans',sans-serif;margin:0;max-width:54ch}
.dream-steps ol{
  list-style:none;padding:0;margin:64px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:3vw
}
.dream-steps li{border-top:1px solid #ffffff3d;padding-top:24px}
.dream-steps li b{
  display:block;font:500 10px 'DM Sans',sans-serif;letter-spacing:.18em;color:var(--honey)
}
.dream-steps li h3{font-size:30px;margin:22px 0 13px;letter-spacing:-.02em}
.dream-steps li p{color:#c3ccc6;margin:0;font-size:15px;line-height:1.65}

/* ---------- split: two lists side by side ---------- */
.dream-split{display:grid;grid-template-columns:1fr 1fr;background:var(--paper)}
.dream-split > div{padding:8vw 6vw}
.dream-split > div + div{background:var(--cream)}
.dream-split h3{font-size:clamp(30px,3vw,42px);margin:22px 0 28px;letter-spacing:-.03em}
.dream-split ul{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.dream-split li{
  padding:19px 0;border-bottom:1px solid var(--line);
  font:400 18px/1.45 'Newsreader',serif;display:flex;gap:16px
}
.dream-split li::before{content:"·";color:var(--clay);font-weight:700}

/* ---------- pull quote ---------- */
.dream-pull{padding:10vw 8vw;background:var(--sage);color:#fff;text-align:center}
.dream-pull blockquote{
  margin:0 auto;max-width:24ch;font:400 clamp(32px,4.4vw,66px)/1.12 'Newsreader',serif;
  letter-spacing:-.035em
}
.dream-pull cite{
  display:block;margin-top:34px;font:500 10px 'DM Sans',sans-serif;font-style:normal;
  text-transform:uppercase;letter-spacing:.2em;color:#e2e8e2
}

/* ---------- faq ---------- */
.dream-faq{padding:9vw 8vw 5vw;background:var(--paper)}
.dream-faq h2{margin:0 0 56px;max-width:20ch}
.dream-faq details{border-top:1px solid var(--line);padding:24px 0}
.dream-faq details:last-of-type{border-bottom:1px solid var(--line)}
.dream-faq summary{
  cursor:pointer;font:400 23px/1.35 'Newsreader',serif;letter-spacing:-.015em;
  list-style:none;display:flex;justify-content:space-between;gap:24px
}
.dream-faq summary::-webkit-details-marker{display:none}
.dream-faq summary::after{content:"+";color:var(--clay);font-size:23px;line-height:1}
.dream-faq details[open] summary::after{content:"–"}
.dream-faq details p{
  margin:18px 0 0;max-width:72ch;color:#55605a;font-size:16px;line-height:1.72
}

/* ---------- closing invite ---------- */
.dream-invite{padding:10vw 8vw;background:var(--dusk);color:#fff}
.dream-invite h2{margin:0 0 26px;max-width:22ch}
.dream-invite p{color:#c8d0cb;font:400 20px/1.6 'Newsreader',serif;max-width:56ch;margin:0 0 40px}

/* ---------- sibling companies ---------- */
.dream-siblings{padding:7vw 8vw;background:var(--warm);display:grid;gap:26px}
.dream-siblings h2{font-size:clamp(30px,3vw,44px);margin:0}
.dream-sib-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
.dream-sib-grid a{
  background:var(--paper);padding:30px 28px;display:flex;flex-direction:column;gap:11px;
  transition:background .25s
}
.dream-sib-grid a:hover{background:#fff}
.dream-sib-grid b{
  font:500 9px 'DM Sans',sans-serif;text-transform:uppercase;letter-spacing:.18em;color:var(--clay)
}
.dream-sib-grid strong{font:400 25px/1.15 'Newsreader',serif;letter-spacing:-.02em}
.dream-sib-grid span{font-size:14px;color:#5b655f;line-height:1.6}

/* ---------- fine print ---------- */
.dream-fine{padding:6vw 8vw 8vw;background:var(--paper);border-top:1px solid var(--line)}
.dream-fine h2{font-size:clamp(24px,2.2vw,32px);margin:0 0 26px}
.dream-fine p{font-size:13px;line-height:1.8;color:#6a746e;max-width:92ch;margin:0 0 15px}

@media(max-width:980px){
  .folks-grid{grid-template-columns:1fr 1fr}
  .shelf-grid{grid-template-columns:1fr 1fr}
  .dream-steps ol{grid-template-columns:1fr 1fr}
  .dream-sib-grid{grid-template-columns:1fr}
}
@media(max-width:850px){
  /* the corner label overlapped the first door once the doors stacked */
  .hero .place{display:none}
  .gateway-two{grid-template-columns:1fr;margin-top:34px}
  .folks-head,.shelf-head,.dream-steps .head{grid-template-columns:1fr;gap:26px}
  .dream-split{grid-template-columns:1fr}
  .dream-hero{padding:0 24px 80px;min-height:62vh}
  .statement,.folks,.shelf,.dream-steps,.dream-pull,.dream-faq,.dream-invite,
  .dream-siblings,.dream-fine{padding-left:24px;padding-right:24px}
  .statement,.folks,.shelf,.dream-steps,.dream-faq,.dream-invite{padding-top:90px;padding-bottom:90px}
  .dream-split > div{padding:80px 24px}
}
@media(max-width:560px){
  .folks-grid,.shelf-grid{grid-template-columns:1fr}
  .dream-steps ol{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  .folks-grid img,.gateway-two a{transition:none}
  .folks-grid figure:hover img{transform:none}
}