/* How It Works page specific styles */
/* Full-page background handled by body.bg-light-laire class (added in template) */
.hiw-hero{background:var(--laire-light-bg);} 
.hiw-hero h1{font-family:var(--font-serif); font-size:60px; line-height:1.3;}
.hiw-hero h1 em{color:var(--laire-primary); font-style:italic;}
.hiw-sub{font-size:28px;}

/* Centered 3-step journey layout - cards span full row width */
.step-cards{display:flex; justify-content:center; gap:30px; flex-wrap:wrap;}
.step-card{flex:1 1 0; min-width:280px; border:1px solid var(--laire-grey-2); border-radius:20px; padding:40px 30px; background:#fff; display:flex; flex-direction:column; gap:20px;}
.step-icon{background:var(--laire-primary); border-radius:10px; width:84px; height:84px; display:flex; align-items:center; justify-content:center;}
.step-icon img{width:60px; height:60px; object-fit:contain;}
.step-card h3{font-size:32px; font-weight:600; font-family:var(--font-sans);}
.step-card p{font-size:22px; font-family:var(--font-sans);}

/* Journey step layout - full row with icon and content */
.journey-step{padding:40px 0; border-bottom:1px solid var(--laire-grey-2);}
.journey-step:last-child{border-bottom:none;}
.journey-step h3{font-size:36px; font-weight:600; font-family:var(--font-sans); color:var(--laire-text);}
.journey-step p{font-size:22px; font-family:var(--font-sans); color:#6D6E71; line-height:1.6;}
.step-icon-large{display:flex; align-items:center; justify-content:center;}

/* 2-column (2 rows total) value cards layout - cards span full row width */
.value-cards{display:grid; grid-template-columns:repeat(2,1fr); gap:30px;}
.value-card{border:1px solid #9d9ea0; border-radius:20px; padding:30px; background:#fff; display:flex; flex-direction:column; gap:20px;}
.value-card .num{background:var(--laire-primary); color:#fff; width:60px; height:60px; border-radius:100px; display:flex; align-items:center; justify-content:center; font-size:32px; font-weight:600;}
.value-card h4{font-size:32px; font-weight:600; font-family:var(--font-sans);}
.value-card p{font-size:22px;}

/* Quiz banner styles moved to global style.css */

/* Enhanced quiz CTA button (high contrast on orange banner) - fixed hover color */
.btn-quiz{background:#fff; color:var(--laire-primary); border:0; box-shadow:0 6px 18px rgba(0,0,0,.18); transition:.2s ease;}
.btn-quiz:hover{transform:translateY(-1px); box-shadow:0 10px 24px rgba(0,0,0,.22); color:var(--laire-primary)!important; background:#fff;}

.video-wrapper img{border-radius:8px;}

@media(max-width:991.98px){
  .step-card, .value-card{padding:30px 24px;}
  .step-card h3, .value-card h4{font-size:28px;}
  .journey-step h3{font-size:30px;}
  .journey-step p{font-size:20px;}
}
@media(max-width:575.98px){
  .step-cards{flex-direction:column; align-items:center;}
  .value-cards{grid-template-columns:1fr;}
  .hiw-hero h1{font-size:44px;}
  .journey-step{padding:30px 0;}
  .journey-step h3{font-size:26px;}
  .journey-step p{font-size:18px;}
  .step-icon-large img{max-width:150px!important;}
}