/* Integration Page Styles */

/* HERO */
.hero { position:relative; height:480px; overflow:hidden; background:#1a0f08; }
.hero-img { width:100%; height:100%; object-fit:cover; object-position:center 30%; display:block; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(to bottom, rgba(20,10,5,0.15) 0%, rgba(20,10,5,0.75) 100%); }
.hero-content { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end; padding:3rem 3.5rem; }
.hero-breadcrumb { font-size:0.6rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--warm); margin-bottom:1rem; }
.hero-title { font-family:'Cormorant Garamond',serif; font-size:3.2rem; font-weight:400; color:#f5ede0; line-height:1.1; margin-bottom:0.8rem; }
.hero-sub { font-size:0.82rem; color:rgba(245,237,224,0.65); letter-spacing:0.05em; }

/* INTRO */
.intro { padding:0 2.5rem 3rem; display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start; }
.intro-lead { font-family:'Cormorant Garamond',serif; font-size:1.45rem; font-weight:400; font-style:italic; line-height:1.55; color:var(--bark); border-left:1.5px solid var(--clay); padding-left:1.2rem; }
.intro-body { font-size:0.85rem; line-height:1.8; color:var(--smoke); }
.intro-body p + p { margin-top:1rem; }

/* THREE TIERS */
.tiers { padding:0 2.5rem 3rem; }
.tiers-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1px; background:var(--warm); border:0.5px solid var(--warm); }
.tier { background:var(--cream); padding:2rem 1.5rem; }
.tier.featured { background:var(--sand); }
.tier-badge { font-size:0.58rem; letter-spacing:0.16em; text-transform:uppercase; padding:0.25rem 0.6rem; display:inline-block; margin-bottom:1rem; }
.tier-badge.free { background:#dcebd6; color:#3a5a2e; }
.tier-badge.guided { background:var(--pale); color:var(--smoke); }
.tier-badge.inperson { background:#e8ddd0; color:#6b4a2e; }
.tier-name { font-family:'Cormorant Garamond',serif; font-size:1.2rem; font-weight:500; margin-bottom:0.6rem; }
.tier-desc { font-size:0.82rem; line-height:1.75; color:var(--smoke); margin-bottom:1.2rem; }
.tier-note { font-size:0.72rem; color:var(--warm); letter-spacing:0.05em; }

/* GRANDEUR WARNING */
.grandeur { padding:3rem 2.5rem; background:var(--bark); }
.grandeur-inner { border:0.5px solid rgba(201,180,138,0.3); padding:2rem; }
.grandeur-label { font-size:0.6rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--warm); margin-bottom:1rem; }
.grandeur-title { font-family:'Cormorant Garamond',serif; font-size:1.6rem; font-weight:400; color:#f5ede0; margin-bottom:1rem; line-height:1.3; }
.grandeur-body { font-size:0.84rem; line-height:1.8; color:rgba(245,237,224,0.6); }

/* FAQ NOTE */
.faq { padding:0 2.5rem 3rem; }
.faq-inner { border:0.5px solid var(--warm); padding:2rem; display:grid; grid-template-columns:2fr 1fr; gap:2rem; align-items:center; }
.faq-title { font-family:'Cormorant Garamond',serif; font-size:1.2rem; font-weight:500; margin-bottom:0.6rem; }
.faq-desc { font-size:0.83rem; line-height:1.75; color:var(--smoke); }
.faq-btn { font-size:0.68rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--clay); border:0.5px solid var(--clay); padding:0.65rem 1.4rem; background:none; cursor:pointer; white-space:nowrap; transition:background 0.2s; }
.faq-btn:hover { background:rgba(168,82,46,0.06); }

/* REFERRALS */
.referrals { padding:0 2.5rem 3rem; background:var(--sand); }
.referrals-inner { padding-top:2rem; }
.referrals-body { font-size:0.84rem; line-height:1.8; color:var(--smoke); max-width:600px; margin-bottom:1.5rem; }
.referral-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--warm); border:0.5px solid var(--warm); }
.referral-card { background:var(--sand); padding:1.4rem 1.2rem; }
.referral-card:nth-child(even) { background:var(--cream); }
.referral-label { font-size:0.6rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--smoke); margin-bottom:0.4rem; }
.referral-name { font-family:'Cormorant Garamond',serif; font-size:1rem; font-weight:500; margin-bottom:0.3rem; }
.referral-note { font-size:0.78rem; line-height:1.6; color:var(--smoke); }

.cta-section { padding:3rem 2.5rem; background:var(--bark); display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.cta-text { font-family:'Cormorant Garamond',serif; font-size:1.4rem; font-style:italic; color:#f5ede0; max-width:420px; line-height:1.4; }
.cta-btn { font-size:0.7rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--warm); border:0.5px solid rgba(201,180,138,0.5); padding:0.85rem 2rem; background:none; cursor:pointer; transition:background 0.2s; white-space:nowrap; text-decoration:none; }
.cta-btn:hover { background:rgba(201,180,138,0.1); }

@media (max-width:600px) {
  .hero { height:320px; }
  .hero-content { padding:2rem 1.2rem; }
  .intro { padding:1.8rem 1.2rem; grid-template-columns:1fr; gap:1.5rem; }
  .tiers { padding:0 1.2rem 2rem; }
  .tiers-grid { grid-template-columns:1fr; }
  .grandeur { padding:2rem 1.2rem; }
  .faq { padding:0 1.2rem 2rem; }
  .faq-inner { grid-template-columns:1fr; gap:1rem; }
  .referrals { padding:0 1.2rem 2rem; }
  .referral-grid { grid-template-columns:1fr; }
  .cta-section { flex-direction:column; gap:1rem; padding:2rem 1.2rem; text-align:center; }
  .cta-text { max-width:100%; }
}