/* =========================================================
   DELTAMANI — Inner page components
   ========================================================= */

/* ---------- Page banner (business / member / contact) ---------- */
.page-banner{
  background: var(--navy-950);
  color: var(--paper);
  padding-block: clamp(64px, 10vw, 108px) clamp(48px, 7vw, 80px);
  position:relative;
  overflow:hidden;
}
.page-banner::before{
  content:"";
  position:absolute;
  inset: -30% -10% auto auto;
  width: 50vw; height:50vw;
  background: radial-gradient(circle, rgba(184,149,90,.15), transparent 65%);
}
.page-banner .eyebrow{ color: var(--gold-400); margin-bottom:18px; }
.page-banner .eyebrow::before{ background: var(--gold-400); }
.page-banner h1{
  color: var(--paper);
  font-size: clamp(2.1rem, 4.4vw, 3.4rem);
  max-width: 18ch;
}
.page-banner .lede{
  color: rgba(248,245,239,.72);
  max-width: 56ch;
  font-size: 1.05rem;
  margin-top: .6em;
}
.breadcrumb{
  display:flex; align-items:center; gap:.5em;
  font-size: .84rem;
  color: rgba(248,245,239,.55);
  margin-bottom: 22px;
}
.breadcrumb a:hover{ color: var(--gold-400); }

/* ---------- Venture category groups ---------- */
.venture-group{ padding-block: clamp(20px, 4vw, 20px) 0; }
.venture-group + .venture-group{ margin-top: clamp(40px, 6vw, 64px); }
.venture-group-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
  border-bottom: 1px solid var(--line);
  padding-bottom: 18px;
  margin-bottom: 30px;
}
.venture-group-head h2{ font-size: clamp(1.5rem, 2.4vw, 1.9rem); margin:0; }
.venture-group-head .tag{
  font-size: .78rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-weight:600;
  color: var(--navy-900);
  background: var(--cream-100);
  border: 1px solid var(--line);
  padding: .45em 1em;
  border-radius: 999px;
}

.venture-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.venture-card{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 26px 26px 28px;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.venture-card:hover{
  transform: translateY(-5px);
  box-shadow: var(--shadow-md);
  border-color: transparent;
}
.venture-card .mark{
  width: 42px; height:42px;
  border-radius: 10px;
  background: var(--navy-900);
  color: var(--gold-400);
  font-family: var(--font-display);
  font-weight:600;
  display:flex; align-items:center; justify-content:center;
  margin-bottom: 18px;
  font-size: 1.05rem;
}
.venture-card h3{ font-size: 1.15rem; margin-bottom: .4em; }
.venture-card p{ color: var(--ink-500); font-size: .93rem; margin:0; }

@media (max-width: 980px){
  .venture-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 620px){
  .venture-grid{ grid-template-columns: 1fr; }
}

/* ---------- Legal-structure intro strip ---------- */
.structure-strip{
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap: 1px;
  background: var(--line);
  border:1px solid var(--line);
  border-radius: var(--radius-md);
  overflow:hidden;
  margin-bottom: clamp(44px, 6vw, 70px);
}
.structure-strip div{
  background: var(--paper);
  padding: 22px 24px;
}
.structure-strip .n{
  font-family: var(--font-display);
  font-size: 1.8rem;
  color: var(--gold-600);
  font-weight:600;
  display:block;
}
.structure-strip .l{ font-size: .86rem; color: var(--ink-500); }

@media (max-width: 720px){
  .structure-strip{ grid-template-columns: 1fr; }
}

/* ---------- Member portfolio ---------- */
.member-hero{
  background: var(--navy-950);
  color: var(--paper);
  position:relative;
  overflow:hidden;
}
.member-hero::before{
  content:"";
  position:absolute;
  inset: -20% auto auto -10%;
  width: 50vw; height:50vw;
  background: radial-gradient(circle, rgba(184,149,90,.14), transparent 65%);
}
.member-hero-grid{
  position:relative;
  display:grid;
  grid-template-columns: .8fr 1.2fr;
  gap: clamp(32px, 5vw, 64px);
  align-items:center;
  padding-block: clamp(56px, 8vw, 96px);
}
.member-portrait{
  border-radius: var(--radius-lg);
  overflow:hidden;
  box-shadow: var(--shadow-lg);
  aspect-ratio: 900/1152;
  max-width: 340px;
}
.member-portrait img{ width:100%; height:100%; object-fit:cover; }
.member-hero-copy h1{ color:var(--paper); font-size: clamp(2rem, 4vw, 3rem); }
.role-badges{ display:flex; flex-wrap:wrap; gap:10px; margin: 18px 0 22px; }
.role-badge{
  display:inline-flex; align-items:center; gap:.5em;
  font-size: .82rem;
  font-weight:600;
  color: var(--gold-400);
  border: 1px solid var(--line-dark);
  padding: .5em 1em;
  border-radius: 999px;
}
.member-hero-copy .lede{ color: rgba(248,245,239,.72); max-width: 56ch; }

.member-org-section{ padding-block: clamp(56px, 8vw, 96px); }
.org-block{
  display:grid;
  grid-template-columns: .85fr 1.15fr;
  gap: clamp(30px, 5vw, 64px);
  align-items:center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: clamp(28px, 4vw, 48px);
}
.org-block + .org-block{ margin-top: 28px; }
.org-logo-panel{
  background: var(--cream-100);
  border-radius: var(--radius-md);
  padding: clamp(28px, 4vw, 40px);
  display:flex;
  align-items:center;
  justify-content:center;
  min-height: 160px;
}
.org-logo-panel img{ width: 100%; max-width: 260px; }
.org-copy .kicker{
  font-size: .74rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold-600);
  font-weight:600;
  margin-bottom: 10px;
  display:block;
}
.org-copy h3{ font-size: clamp(1.3rem, 2vw, 1.7rem); }
.org-copy p{ color: var(--ink-500); }
.org-copy .role-line{
  display:inline-flex;
  align-items:center;
  gap: .6em;
  margin-top: 6px;
  font-weight:600;
  color: var(--navy-900);
  font-size: .95rem;
}
.org-copy .role-line svg{ width:16px; height:16px; color: var(--gold-600); flex-shrink:0; }

.hr-badge-mark{
  width: 84px; height:84px;
  border-radius:50%;
  border: 2px solid var(--navy-800);
  display:flex; align-items:center; justify-content:center;
  color: var(--navy-800);
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight:600;
}

@media (max-width: 900px){
  .member-hero-grid{ grid-template-columns: 1fr; }
  .member-portrait{ order:-1; max-width: 260px; }
  .org-block{ grid-template-columns: 1fr; }
}

/* ---------- Leadership triptych ---------- */
.triptych{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow:hidden;
}
.triptych-item{
  background: var(--cream-50);
  padding: clamp(28px, 3.4vw, 40px);
}
.triptych-item:nth-child(2){ background: var(--navy-950); color: var(--paper); }
.triptych-item:nth-child(2) h3{ color: var(--paper); }
.triptych-item:nth-child(2) p{ color: rgba(248,245,239,.7); }
.triptych-item:nth-child(2) .kicker{ color: var(--gold-400); }
.triptych-item .kicker{
  font-size: .74rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold-600);
  font-weight:600;
  display:block;
  margin-bottom: 12px;
}
.triptych-item h3{ font-size: 1.2rem; margin-bottom: .5em; }
.triptych-item p{ color: var(--ink-500); margin:0; font-size:.94rem; }

@media (max-width: 860px){
  .triptych{ grid-template-columns: 1fr; }
}

/* ---------- Closing quote band ---------- */
.quote-band{
  background: var(--cream-100);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding-block: clamp(56px,8vw,90px);
  text-align:center;
}
.quote-band blockquote{
  font-family: var(--font-script);
  font-style: italic;
  font-size: clamp(1.6rem, 3.6vw, 2.6rem);
  color: var(--navy-900);
  max-width: 20ch;
  margin: 0 auto 18px;
  line-height:1.25;
}
.quote-band cite{
  font-style:normal;
  font-size: .85rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color: var(--ink-500);
  font-weight:600;
}

/* ---------- Contact page ---------- */
.contact-grid{
  display:grid;
  grid-template-columns: 1fr 1.15fr;
  gap: clamp(32px, 5vw, 60px);
  align-items:flex-start;
}
.contact-info{
  display:flex;
  flex-direction:column;
  gap: 26px;
}
.contact-card{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 22px 24px;
  display:flex;
  gap: 16px;
  align-items:flex-start;
}
.contact-card .ic{
  width: 42px; height:42px;
  border-radius: 10px;
  background: var(--navy-900);
  color: var(--gold-400);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.contact-card .ic svg{ width:19px; height:19px; }
.contact-card h3{ font-size: 1rem; margin-bottom:.25em; }
.contact-card p{ color: var(--ink-500); margin:0; font-size:.92rem; word-break:break-word; }
.contact-card a{ color: var(--navy-900); font-weight:600; }
.contact-card a:hover{ color: var(--gold-600); }

.contact-form-wrap{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: clamp(26px, 4vw, 42px);
  box-shadow: var(--shadow-sm);
}
.contact-form-wrap h2{ font-size: 1.5rem; margin-bottom:.3em; }
.contact-form-wrap .lede{ color: var(--ink-500); margin-bottom: 1.6em; }

.field{ margin-bottom: 20px; }
.field label{
  display:block;
  font-size: .82rem;
  font-weight:600;
  color: var(--navy-900);
  margin-bottom: 8px;
}
.field input, .field textarea, .field select{
  width:100%;
  border: 1px solid var(--line);
  background: var(--cream-50);
  border-radius: 10px;
  padding: 12px 14px;
  font-family: var(--font-body);
  font-size: .96rem;
  color: var(--ink-900);
  transition: border-color .25s var(--ease), background .25s var(--ease);
}
.field input:focus, .field textarea:focus, .field select:focus{
  border-color: var(--gold-500);
  background: var(--paper);
  outline: none;
}
.field textarea{ resize: vertical; min-height: 130px; }
.field-row{ display:grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-note{ font-size: .8rem; color: var(--ink-500); margin-top: 14px; }

@media (max-width: 860px){
  .contact-grid{ grid-template-columns: 1fr; }
}
@media (max-width: 520px){
  .field-row{ grid-template-columns: 1fr; }
}
