@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;0,700;1,400;1,700&family=Figtree:wght@300;400;500;600;700&family=Source+Serif+4:ital,wght@0,300;0,400;0,600;1,300;1,400&family=Radio+Canada+Big:wght@400;700&display=swap');

/* TOKENS */

:root {
    --ch-ink:     #141414;
    --ch-soft:    #3a3a3a;
    --ch-muted:   #6f6f6f;
    --ch-bg:      #f5f3ef;
    --ch-white:   #ffffff;
    --ch-accent:  #5a4a35;
    --ch-alight:  #f0ebe3;
    --ch-aborder: #d8cfc4;
    --ch-mint:    #c9a96e;
    --ch-rule:    #e0ddd7;
}

/* LAYOUT RESETS */

body.ch-active {
    background: var(--ch-bg) !important;
    overflow-x: hidden;
}
body.ch-active main {
    padding: 0 !important;
    margin:  0 !important;
    min-height: 0 !important;
    flex: none !important;
}
body.ch-active main > .container {
    max-width: 100% !important;
    width:     100% !important;
    padding:   0    !important;
    margin:    0    !important;
}
body.ch-active > footer { display: none !important; }
#chWrapper { width: 100%; overflow-x: hidden; background: var(--ch-bg); }

/* HERO */

.hero-section {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    min-height: 20vh;
    background-image: url('/img/homepage-background.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding-top: 6rem;
    padding-bottom: 8rem;
    border: none; border-radius: 0;
    overflow: hidden; margin-bottom: 0;
    position: relative;
}
/* Dark overlay for text readability */

.hero-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.35);
    pointer-events: none;
    z-index: 1;
}
.hero-main {
    min-height: 85vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
    z-index: 2;
    padding: 0 5vw;
}
.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    background: rgba(255,255,255,0.72);
    color: #5a4a35;
    border: 1px solid rgba(200,165,100,.4);
    border-radius: 100px;
    padding: 0.35rem 1rem;
    margin-bottom: 1.5rem;
    backdrop-filter: blur(8px);
}
.hero-badge::before {
    content: '';
    width: 7px; height: 7px;
    border-radius: 50%;
    background: #5a4a35;
    animation: badgepulse 2.4s ease-in-out infinite;
}
@keyframes badgepulse {
    0%,100% { opacity:1; transform:scale(1); }
    50%      { opacity:.4; transform:scale(.65); }
}
.hero-headline {
    font-family: 'Source Serif 4', serif;
    color: #fff;
    font-size: clamp(3.5rem, 7vw, 6rem);
    line-height: 0.92;
    letter-spacing: -0.04em;
    margin-bottom: 0;
    text-shadow: 0 2px 20px rgba(0,0,0,.45), 0 1px 4px rgba(0,0,0,.3);
}
.headline-second-line {
    font-family: 'Radio Canada Big', sans-serif;
    color: #fff;
    display: block;
    margin-top: -0.1em;
    margin-bottom: 0.5em;
    text-shadow: 0 2px 20px rgba(0,0,0,.45), 0 1px 4px rgba(0,0,0,.3);
}
.hero-lead {
    font-family: 'Source Serif 4', serif;
    font-size: 1.1rem;
    color: rgba(255,255,255,.92);
    line-height: 1.75;
    max-width: 600px;
    margin: 0 auto 2.5rem;
    text-align: center;
    font-weight: 400;
    text-shadow: 0 1px 8px rgba(0,0,0,.4);
}

/* ── Hero buttons ── */
.hero-btns {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: center;
    margin-bottom: 18rem;
}

/* ── Reasons strip ── */

.ch-hero { position: relative; }
.ch-reasons {
    position: relative; z-index: 2;
    display: flex; flex-wrap: wrap; align-items: center;
    justify-content: center;
    gap: .6rem 0;
    padding: 1.1rem 5vw;
    background: rgba(10,10,10,.58);
    backdrop-filter: blur(14px);
    border-top: 1px solid rgba(255,255,255,.1);
}
.ch-reason {
    display: flex; align-items: center; gap: .55rem;
    font-size: .84rem; font-weight: 500;
    color: rgba(255,255,255,.92);
    padding: 0 1.4rem;
}
.ch-reason:first-child { padding-left: 1.4rem; }
.ch-check {
    width: 19px; height: 19px; border-radius: 50%;
    background: rgba(200,165,100,.2); color: #c9a96e;
    display: flex; align-items: center; justify-content: center;
    font-size: .62rem; flex-shrink: 0;
}
.ch-sep { width:1px; height:16px; background:rgba(255,255,255,.18); flex-shrink:0; }
.ch-scrollcue { position:absolute; bottom:5.5rem; right:4vw; z-index:3; }
.ch-scrollline {
    width:1px; height:52px;
    background: linear-gradient(to bottom, transparent, rgba(255,255,255,.5));
    animation: chcue 2s ease-in-out infinite;
}
@keyframes chcue {
    0%   { transform:scaleY(0); transform-origin:top;    opacity:0; }
    45%  { transform:scaleY(1); transform-origin:top;    opacity:1; }
    80%  { transform:scaleY(1); transform-origin:bottom; opacity:1; }
    100% { transform:scaleY(0); transform-origin:bottom; opacity:0; }
}

/* PAGE BODY */

.ch-body { position: relative; z-index: 10; background: var(--ch-bg); overflow: hidden; }

/* SCROLL REVEAL */

.reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .72s cubic-bezier(.22,1,.36,1), transform .72s cubic-bezier(.22,1,.36,1);
}
.reveal.is-visible { opacity:1; transform:none; }

/* SHARED TYPOGRAPHY */

.ch-eyebrow { font-size:.68rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ch-accent); margin-bottom:.45rem; }
.ch-title { font-family: 'Radio Canada Big', sans-serif; font-size:clamp(1.9rem,3vw,2.65rem); font-weight:700; color:var(--ch-ink); margin-bottom:.5rem; line-height:1.1; }
.ch-sub { color:var(--ch-muted); font-size:.95rem; font-weight:300; line-height:1.65; margin-bottom:0; }

/* HOW IT WORKS */

.ch-how { background: var(--ch-white); padding: 5rem 5vw 4.5rem; }
.ch-how-label { margin-bottom: 3rem; text-align: left; }
.ch-how-steps { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 0; }
.ch-step {
    background: var(--ch-bg); border: 1px solid var(--ch-rule);
    border-radius: 1.25rem; padding: 2rem 1.75rem;
    transition: box-shadow .3s, transform .3s; height: 100%;
}
.ch-step:hover { box-shadow: 0 12px 36px rgba(0,0,0,.07); transform: translateY(-3px); }
.ch-step-num-wrap { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.25rem; }
.ch-step-n { font-family: 'Radio Canada Big', sans-serif; font-size: 2.5rem; font-weight: 700; color: #111; opacity: .55; line-height: 1; }
.ch-step-icon { width: 40px; height: 40px; border-radius: .65rem; background: var(--ch-alight); border: 1px solid var(--ch-aborder); display: flex; align-items: center; justify-content: center; font-size: 1.15rem; }
.ch-step-title { font-size: 1rem; font-weight: 700; color: var(--ch-ink); margin-bottom: .5rem; }
.ch-step-desc  { font-size: 1rem; font-family: 'Source Serif 4', serif; color: var(--ch-muted); line-height: 1.72; margin: 0; }
.ch-arrow { display: flex; align-items: center; justify-content: center; padding: 0 1rem; color: #111; opacity: .4; font-size: 1.5rem; flex-shrink: 0; margin-bottom: 1.5rem; }

/* STATS */

.ch-stats { background:#1e1c1a; padding:3.5rem 5vw; position:relative; overflow:hidden; }
.ch-stats-glow { position:absolute; inset:0; background:radial-gradient(ellipse 55% 90% at 85% 50%, rgba(120,90,60,.18) 0%, transparent 68%); pointer-events:none; }
.ch-stats-grid { display:flex; align-items:center; justify-content:space-around; flex-wrap:wrap; gap:2rem; position:relative; z-index:1; }
.ch-stat { text-align:center; flex:1; min-width:110px; }
.ch-stat-n { font-family:'Cormorant Garamond',serif; font-size:clamp(2.8rem,4.5vw,4rem); font-weight:700; color:#fff; line-height:1; margin-bottom:.4rem; }
.ch-stat-l { font-size:.7rem; color:rgba(255,255,255,.38); font-weight:600; letter-spacing:.09em; text-transform:uppercase; }
.ch-stat-div { width:1px; height:50px; background:rgba(255,255,255,.1); flex-shrink:0; }

/* SERVICES */

.ch-services { background: var(--ch-bg); padding: 5rem 5vw 4.5rem; }
.ch-sec-hdr  { margin-bottom: 2.75rem; }
.ch-svc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }
.ch-svc-card {
    background: var(--ch-white); border: 1px solid var(--ch-rule); border-radius: 1.25rem;
    padding: 2rem 1.75rem 1.75rem; display: flex; flex-direction: column; gap: .75rem;
    transition: box-shadow .3s, transform .3s; position: relative; overflow: hidden;
}
.ch-svc-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--ch-rule); transition: background .3s; }
.ch-svc-card:hover { box-shadow: 0 12px 40px rgba(0,0,0,.08); transform: translateY(-4px); }
.ch-svc-card:hover::before { background: var(--ch-accent); }
.ch-svc-card--featured { background: var(--ch-white); border-color: var(--ch-rule); }
.ch-svc-card--featured::before { background: var(--ch-rule); }
.ch-svc-card--featured .ch-svc-pill { background: var(--ch-alight); color: var(--ch-accent); border-color: var(--ch-aborder); }
.ch-svc-card--featured .ch-svc-link { color: var(--ch-accent); }
.ch-svc-card--featured .ch-svc-link:hover { color: var(--ch-ink); }
.ch-svc-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; }
.ch-svc-card-icon { font-size: 2rem; }
.ch-svc-card-name { font-size: 1.05rem; font-weight: 700; color: var(--ch-ink); line-height: 1.2; }
.ch-svc-card-desc { font-size: 1rem; font-family: 'Source Serif 4', serif; color: var(--ch-muted); line-height: 1.7; margin: 0; flex: 1; }
.ch-svc-link { font-size: .82rem; font-weight: 700; color: var(--ch-accent); text-decoration: none; letter-spacing: .02em; transition: color .2s; margin-top: .5rem; display: inline-block; }
.ch-svc-link:hover { color: var(--ch-ink); }
.ch-svc-pill { font-size: .6rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ch-accent); background: var(--ch-alight); border: 1px solid var(--ch-aborder); border-radius: 100px; padding: .22rem .7rem; white-space: nowrap; flex-shrink: 0; }

/* TESTIMONIALS */

.ch-test { background: #1e1c1a; position: relative; overflow: hidden; }
.ch-test-inner { padding: 5rem 5vw; position: relative; z-index: 1; }
.ch-test::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 70% at 0% 100%, rgba(100,80,50,.2) 0%, transparent 60%), radial-gradient(ellipse 40% 50% at 100% 0%, rgba(180,150,100,.06) 0%, transparent 60%); pointer-events: none; }
.ch-test-hdr { margin-bottom: 2.75rem; }
.ch-test-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 2.5rem; align-items: stretch; }
.ch-test-feat { display: flex; flex-direction: column; justify-content: center; padding: 2rem; border-right: none; }
.ch-bigquote { font-family: 'Cormorant Garamond', serif; font-size: 8rem; line-height: .5; color: rgba(200,165,100,.25); margin-bottom: 1rem; user-select: none; }
.ch-blockquote { font-family: 'Cormorant Garamond', serif; font-size: clamp(1.4rem, 2.2vw, 1.75rem); font-style: italic; line-height: 1.55; color: rgba(255,255,255,.92); margin-bottom: 2rem; border: none; padding: 0; }
.ch-test-author { display: flex; align-items: center; gap: .85rem; }
.ch-stars { color: #fbbf24; font-size: .9rem; margin-left: auto; letter-spacing: .05em; }
.ch-test-cards { display: flex; flex-direction: column; gap: 1rem; }
.ch-tcard--glass { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: 1rem; padding: 1.65rem; display: flex; flex-direction: column; gap: .85rem; flex: 1; backdrop-filter: blur(8px); transition: background .3s, transform .3s; }
.ch-tcard--glass:hover { background: rgba(255,255,255,.1); transform: translateY(-2px); }
.ch-tcard--glass .ch-tcard-q { color: rgba(255,255,255,.82); }
.ch-tcard--mint { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: 1rem; padding: 1.65rem; display: flex; flex-direction: column; gap: .85rem; flex: 1; backdrop-filter: blur(8px); transition: background .3s, transform .3s; }
.ch-tcard--mint:hover { background: rgba(255,255,255,.1); transform: translateY(-2px); }
.ch-tcard--mint .ch-tcard-q { color: rgba(255,255,255,.82) !important; }
.ch-stars-sm { color: #f59e0b; font-size: .8rem; }
.ch-tcard-q { font-family: 'Cormorant Garamond', serif; font-size: 1.05rem; font-style: italic; line-height: 1.65; margin: 0; flex: 1; }
.ch-tcard-author { display: flex; align-items: center; gap: .7rem; }
.ch-avatar { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,.15); color: rgba(255,255,255,.9); display: flex; align-items: center; justify-content: center; font-size: .7rem; font-weight: 700; flex-shrink: 0; }
.ch-test-name  { font-size: .84rem; font-weight: 700; color: var(--ch-ink); }
.ch-test-place { font-size: .72rem; color: var(--ch-muted); }

/* FAQ */

.ch-faq { background: var(--ch-white); padding: 5rem 5vw; position: relative; }
.ch-faq::before { content: ''; position: absolute; top: 0; right: 0; width: 40%; height: 100%; background: var(--ch-bg); clip-path: polygon(8% 0, 100% 0, 100% 100%, 0% 100%); pointer-events: none; }
.ch-faq-inner { display: grid; grid-template-columns: 280px 1fr; gap: 5rem; align-items: start; position: relative; z-index: 1; }
.ch-faq-left { position: sticky; top: 6rem; }
.ch-faq-left .ch-sub { margin-bottom: 1.5rem; }
.ch-faq-cta { display: inline-flex; align-items: center; gap: .5rem; background: var(--ch-ink); color: #fff; font-size: .85rem; font-weight: 700; font-family: 'Figtree', sans-serif; text-decoration: none; padding: .75rem 1.4rem; border-radius: 100px; transition: background .22s, transform .2s; margin-bottom: 2rem; }
.ch-faq-cta:hover { background: #5a4a35; color: #fff; transform: translateY(-2px); }
.ch-faq-badge { display: flex; align-items: center; gap: .85rem; padding: 1rem 1.25rem; background: #f0ebe3; border: 1px solid #d8cfc4; border-radius: .875rem; }
.ch-faq-badge-num { font-family: 'Cormorant Garamond', serif; font-size: 2.25rem; font-weight: 700; color: #5a4a35; line-height: 1; }
.ch-faq-badge-txt { font-size: .75rem; font-weight: 600; color: #5a4a35; line-height: 1.4; }
.ch-faq-list { display: flex; flex-direction: column; }
.ch-faq-item { border-bottom: 1px solid var(--ch-rule); overflow: hidden; }
.ch-faq-item:first-child { border-top: 1px solid var(--ch-rule); }
.ch-faq-q { width: 100%; display: flex; align-items: center; gap: 1rem; padding: 1.35rem 0; background: none; border: none; cursor: pointer; text-align: left; }
.ch-faq-q:hover .ch-faq-qtext { color: #5a4a35; }
.ch-faq-qnum { font-family: 'Cormorant Garamond', serif; font-size: 1.1rem; font-weight: 700; color: var(--ch-muted); flex-shrink: 0; transition: color .2s; min-width: 2rem; }
.ch-faq-item--open .ch-faq-qnum { color: #5a4a35; }
.ch-faq-qtext { font-family: 'Figtree', sans-serif; font-size: .95rem; font-weight: 600; color: var(--ch-ink); flex: 1; transition: color .2s; }
.ch-faq-item--open .ch-faq-qtext { color: #5a4a35; }
.ch-faq-icon { font-size: 1.4rem; font-weight: 300; color: var(--ch-muted); flex-shrink: 0; transition: transform .3s, color .2s; line-height: 1; }
.ch-faq-item--open .ch-faq-icon { transform: rotate(45deg); color: #5a4a35; }
.ch-faq-a { font-size: .9rem; line-height: 1.8; color: var(--ch-soft); max-height: 0; overflow: hidden; transition: max-height .4s cubic-bezier(.22,1,.36,1), padding .4s; padding: 0 0 0 3rem; }
.ch-faq-item--open .ch-faq-a { max-height: 200px; padding-bottom: 1.35rem; }

/* CTA BAND */

.ch-cta { background: linear-gradient(130deg, #1e1c1a 0%, #2e2820 100%); padding: 3rem 5vw; margin: 2rem 3vw; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1.5rem; position: relative; overflow: hidden; border-radius: 1.25rem; }
.ch-cta::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 40% 100% at 88% 50%, rgba(120,90,50,.2) 0%, transparent 65%); pointer-events: none; }
.ch-cta-text strong { font-family: 'Cormorant Garamond', serif; font-size: 1.75rem; font-weight: 700; color: #fff; display: block; margin-bottom: .3rem; }
.ch-cta-text span { font-size: .875rem; color: rgba(255,255,255,.5); }
.ch-cta-btn { background: #fff; color: var(--ch-ink); border-radius: 100px; padding: .9rem 2rem; font-size: .9rem; font-weight: 700; font-family: 'Figtree', sans-serif; text-decoration: none; display: inline-block; position: relative; z-index: 1; transition: background .22s, transform .2s, box-shadow .22s; }
.ch-cta-btn:hover { background: #c9a96e; color: #fff; transform: translateY(-2px); box-shadow: 0 8px 28px rgba(200,165,100,.3); }

/* FOOTER */

.ch-footer { background: #1e1c1a; padding: 4.5rem 5vw 2.25rem; margin-top: 2rem; }
.ch-footer-top { display: flex; gap: 4rem; margin-bottom: 3.5rem; flex-wrap: wrap; }
.ch-footer-brand { flex-shrink: 0; min-width: 190px; }
.ch-footer-logo { font-family: 'Cormorant Garamond', serif; font-size: 1.6rem; font-weight: 700; color: #fff; margin-bottom: .35rem; line-height: 1.15; }
.ch-footer-logo span { color: #c9a96e; }
.ch-footer-tag { font-size: .8rem; color: rgba(255,255,255,.3); font-style: italic; font-family: 'Cormorant Garamond', serif; margin-bottom: 1.75rem; }
.ch-socials { display: flex; gap: .6rem; flex-wrap: wrap; }
.ch-soc { width: 40px; height: 40px; border-radius: .55rem; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.08); color: rgba(255,255,255,.5); display: flex; align-items: center; justify-content: center; text-decoration: none; transition: background .22s, color .22s, border-color .22s, transform .2s; }
.ch-soc svg { width: 17px; height: 17px; }
.ch-soc:hover { background: rgba(200,165,100,.15); border-color: rgba(200,165,100,.35); color: #c9a96e; transform: translateY(-2px); }
.ch-footer-links { display: flex; gap: 3.5rem; flex: 1; flex-wrap: wrap; }
.ch-fcol { display: flex; flex-direction: column; gap: .6rem; min-width: 130px; }
.ch-fcol-title { font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.28); margin-bottom: .35rem; }
.ch-fcol a { font-size: .855rem; color: rgba(255,255,255,.58); text-decoration: none; transition: color .2s; }
.ch-fcol a:hover { color: #fff; }
.ch-avail { font-size: .78rem; color: #c9a96e; font-style: italic; margin-top: .2rem; }
.ch-footer-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,.07); font-size: .78rem; color: rgba(255,255,255,.22); }
.ch-legal { display: flex; gap: 1.5rem; }
.ch-legal a { color: rgba(255,255,255,.22); text-decoration: none; font-size: .78rem; transition: color .2s; }
.ch-legal a:hover { color: rgba(255,255,255,.6); }

/* RESPONSIVE  */

@media (max-width:1024px) {
    .ch-how-steps { grid-template-columns: 1fr; gap: 1rem; }
    .ch-arrow { display: none; }
    .ch-svc-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width:900px) {
    .ch-test-grid { grid-template-columns: 1fr; }
    .ch-test-feat { padding-bottom: 0; }
    .ch-faq-inner { grid-template-columns: 1fr; gap: 2rem; }
    .ch-faq-left  { position: static; }
    .ch-faq::before { display: none; }
}
@media (max-width:768px) {
    .ch-reasons  { padding: 1rem 1.25rem; }
    .ch-reason   { padding: 0 .8rem; font-size: .78rem; }
    .ch-scrollcue{ display: none; }
    .ch-how, .ch-services, .ch-faq { padding: 3.5rem 1.25rem; }
    .ch-test-inner { padding: 3.5rem 1.25rem; }
    .ch-stats    { padding: 2.75rem 1.25rem; }
    .ch-stat-div { display: none; }
    .ch-stat     { min-width: 44%; }
    .ch-cta      { margin: 0; border-radius: 0; padding: 2.5rem 1.25rem; }
    .ch-footer   { padding: 3.5rem 1.25rem 2rem; }
    .ch-footer-top   { flex-direction: column; gap: 2.5rem; }
    .ch-footer-links { gap: 2rem; }
    .ch-footer-bottom{ flex-direction: column; align-items: flex-start; }
    .ch-svc-grid { grid-template-columns: 1fr; }
    .d-flex.flex-wrap.gap-3.justify-content-center { margin-bottom: 10rem; }
}