/* === Homepage Hero Variant === */
/* (hero base styles are in base.css — this file is for homepage-specific overrides if needed) */

/* === About === */
.about { padding:0 2.5rem 3rem; }
.about-lead { font-family:'Cormorant Garamond',serif; font-size:1.5rem; font-weight:400; font-style:italic; line-height:1.5; color:var(--bark); margin-bottom:2.5rem; max-width:640px; border-left:1.5px solid var(--clay); padding-left:1.2rem; }
.profiles { display:grid; grid-template-columns:1fr 1fr; gap:2rem; }
.profile-name { font-family:'Cormorant Garamond',serif; font-size:1.15rem; font-weight:500; margin-bottom:0.3rem; }
.profile-role { font-size:0.65rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--clay); margin-bottom:0.8rem; }
.profile-bio { font-size:0.84rem; line-height:1.75; color:var(--smoke); }

/* === Beach Banner === */
.beach-banner { position:relative; height:260px; overflow:hidden; margin:1rem 0; }
.beach-banner img { width:100%; height:100%; object-fit:cover; object-position:center 40%; display:block; }
.beach-overlay { position:absolute; inset:0; background:linear-gradient(to bottom, rgba(20,10,5,0.05) 0%, rgba(20,10,5,0.45) 100%); }
.beach-text { position:absolute; bottom:2rem; left:3rem; right:3rem; }
.beach-text p { font-family:'Cormorant Garamond',serif; font-size:1.2rem; font-style:italic; color:#f5ede0; max-width:460px; }

/* === Ceremonies === */
.ceremonies { padding:0 2.5rem 3rem; }
.ceremony-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--warm); border:0.5px solid var(--warm); }
.ceremony-card { background:var(--cream); padding:1.8rem 1.5rem; cursor:pointer; transition:background 0.2s; text-decoration:none; color:inherit; display:block; }
.ceremony-card:hover, .ceremony-card.featured { background:var(--sand); }
.ceremony-num { font-family:'Cormorant Garamond',serif; font-size:2rem; color:var(--warm); margin-bottom:0.7rem; }
.ceremony-name { font-family:'Cormorant Garamond',serif; font-size:1.2rem; font-weight:500; margin-bottom:0.5rem; }
.ceremony-desc { font-size:0.82rem; line-height:1.7; color:var(--smoke); margin-bottom:0.8rem; }
.ceremony-more { font-size:0.68rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--clay); border-bottom:0.5px solid var(--clay); padding-bottom:1px; }

/* === Instruments === */
.instruments { padding:0 2.5rem 3rem; background:var(--sand); }
.instr-inner { padding-top:2rem; }
.instr-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.instr-card { border:0.5px solid var(--warm); padding:1.5rem; background:var(--cream); }
.instr-name { font-family:'Cormorant Garamond',serif; font-size:1.1rem; font-weight:500; margin-bottom:0.5rem; }
.instr-desc { font-size:0.82rem; line-height:1.7; color:var(--smoke); margin-bottom:0.8rem; }
.instr-more { font-size:0.68rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--clay); border-bottom:0.5px solid var(--clay); padding-bottom:1px; cursor:pointer; }

/* === Testimonial === */
.testimonial { padding:3rem 2.5rem; text-align:center; border-top:0.5px solid var(--warm); border-bottom:0.5px solid var(--warm); }
.testimonial blockquote { font-family:'Cormorant Garamond',serif; font-size:1.3rem; font-style:italic; line-height:1.6; color:var(--bark); max-width:600px; margin:0 auto 1rem; }
.testimonial cite { font-size:0.7rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--smoke); }

/* === Integration === */
.integration { padding:0 2.5rem 3rem; }
.integration-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1px; background:var(--warm); border:0.5px solid var(--warm); }
.integ-card { background:var(--cream); padding:1.5rem; }
.integ-badge { font-size:0.6rem; letter-spacing:0.15em; text-transform:uppercase; background:var(--pale); color:var(--smoke); padding:0.25rem 0.6rem; display:inline-block; margin-bottom:0.8rem; }
.integ-badge.free { background:#dcebd6; color:var(--moss); }
.integ-title { font-family:'Cormorant Garamond',serif; font-size:1.05rem; font-weight:500; margin-bottom:0.5rem; }
.integ-desc { font-size:0.8rem; line-height:1.7; color:var(--smoke); }

/* === Membership === */
.membership { padding:0 2.5rem 0; background:var(--bark); }
.membership .divider span { color:rgba(255,255,255,0.4); }
.membership .divider-line { background:rgba(255,255,255,0.15); }
.membership .divider { padding-left:0; padding-right:0; }
.member-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(255,255,255,0.1); border:0.5px solid rgba(255,255,255,0.1); margin-bottom:2.5rem; }
.member-card { background:var(--bark); padding:2rem 1.5rem; }
.member-tier { font-size:0.6rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--warm); margin-bottom:0.8rem; }
.member-name { font-family:'Cormorant Garamond',serif; font-size:1.2rem; color:#f5ede0; margin-bottom:0.5rem; }
.member-desc { font-size:0.82rem; line-height:1.7; color:rgba(245,237,224,0.55); margin-bottom:1rem; }
.member-btn { font-size:0.68rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--warm); border:0.5px solid rgba(201,180,138,0.4); padding:0.55rem 1.2rem; background:none; cursor:pointer; transition:background 0.2s; }
.member-btn:hover { background:rgba(201,180,138,0.1); }

@media (max-width:600px) {
  .about { padding:0 1.2rem 2rem; }
  .about-lead { font-size:1.2rem; }
  .profiles { grid-template-columns:1fr; gap:1.5rem; }

  .beach-banner { height:200px; }
  .beach-text { left:1.2rem; right:1.2rem; bottom:1.2rem; }
  .beach-text p { font-size:1rem; }

  .ceremonies { padding:0 1.2rem 2rem; }
  .ceremony-grid { grid-template-columns:1fr; }

  .instruments { padding:0 1.2rem 2rem; }
  .instr-grid { grid-template-columns:1fr; }

  .testimonial { padding:2rem 1.2rem; }
  .testimonial blockquote { font-size:1.1rem; }

  .integration { padding:0 1.2rem 2rem; }
  .integration-grid { grid-template-columns:1fr; }

  .membership { padding:0 1.2rem 0; }
  .member-grid { grid-template-columns:1fr; }
}