/* Homepage composition. Theme colors remain sourced from the design controls. */
.cartao-landing {
    --cartao-landing-gold: color-mix(in srgb, #efbe58 82%, var(--cartao-accent));
    --cartao-landing-navy: color-mix(in srgb, #071c36 82%, var(--cartao-nav));
    --cartao-landing-width: 1320px;
}

.cartao-landing .container.app-main.cartao-home {
    max-width: none;
    padding: 0 0 28px !important;
}

.cartao-landing .cartao-home > .row,
.cartao-landing .cartao-steps,
.cartao-landing .app-perguntas {
    width: min(calc(100% - clamp(28px, 6vw, 88px)), var(--cartao-landing-width));
    margin-inline: auto;
}

.cartao-landing .cartao-hero {
    display: flex;
    align-items: center;
    min-height: clamp(420px, 40vw, 565px);
    margin: 0 0 clamp(14px, 2.6vw, 32px);
    padding: clamp(40px, 5vw, 80px) max(clamp(22px, 8vw, 144px), calc((100% - 1300px) / 2));
    border: 0;
    border-radius: 0;
    color: #fff;
    background-color: var(--cartao-landing-navy);
    background-image:
        linear-gradient(90deg, var(--cartao-landing-navy) 0%, #071c36ed 28%, #071c3635 54%, transparent 73%),
        url("/assets/img/cartao-landing-hero.webp");
    background-position: center, center 53%;
    background-size: cover;
}

.cartao-landing .cartao-hero-copy { max-width: min(51%, 660px); }

.cartao-landing .cartao-hero-kicker {
    margin-bottom: 13px;
    color: var(--cartao-landing-gold);
    letter-spacing: .14em;
}

.cartao-landing .cartao-hero h1 {
    max-width: none;
    color: #fff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.45rem, 5.25vw, 5rem);
    line-height: .99;
    letter-spacing: -.035em;
    text-wrap: balance;
}

.cartao-landing .cartao-hero h1 span { color: var(--cartao-landing-gold); }

.cartao-landing .cartao-hero-description {
    max-width: 38ch;
    margin: 16px 0 24px;
    color: #f0f4fa;
    font-size: clamp(.95rem, 1.4vw, 1.15rem);
    line-height: 1.55;
}

.cartao-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.cartao-hero-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 44px;
    padding: 8px 20px;
    border: 1px solid transparent;
    border-radius: 100vw;
    font-weight: 750;
    text-decoration: none;
}

.cartao-hero-actions .cartao-hero-primary {
    border-color: #ffe5a8;
    background: linear-gradient(180deg, #ffe5ab, var(--cartao-landing-gold));
    color: #17140c;
    box-shadow: 0 8px 20px #060f1f57;
}

.cartao-hero-actions .cartao-hero-secondary {
    border-color: #d7e1ef;
    color: #fff;
    background: #061b38a0;
}

.cartao-hero-actions a:hover { filter: brightness(1.12); }

.cartao-landing .cartao-home .cartao-steps {
    gap: 12px;
    padding: clamp(16px, 3vw, 30px);
    border: 1px solid var(--cartao-line);
    border-radius: 22px;
    background: color-mix(in srgb, var(--cartao-surface) 96%, var(--cartao-accent));
    box-shadow: var(--cartao-shadow);
}

.cartao-landing :is(#como-funciona, #perguntas-frequentes) { scroll-margin-top: 110px; }

.cartao-landing .cartao-steps > h2 {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(10px, 3vw, 24px);
    margin: 0 0 6px;
    color: var(--cartao-ink);
    font-size: clamp(1.35rem, 3vw, 2rem);
    font-weight: 800;
    text-align: center;
}

.cartao-landing .cartao-steps > h2::before,
.cartao-landing .cartao-steps > h2::after {
    content: "";
    width: clamp(20px, 8vw, 100px);
    height: 1px;
    background: var(--cartao-landing-gold);
}

.cartao-landing .cartao-steps .action-card {
    grid-template-columns: 42px minmax(0, 1fr);
    padding: 16px;
}

.cartao-landing .cartao-steps .action-number {
    position: relative;
    width: 42px;
    height: 42px;
    color: #805306;
    background: #faefd5;
    font-size: 1.3rem;
}

.cartao-landing .cartao-steps .action-number span {
    position: absolute;
    top: -6px;
    right: -6px;
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--cartao-landing-navy);
    color: #fff;
    font-size: .65rem;
}

.cartao-landing .cartao-home .app-perguntas {
    margin-top: 18px;
    padding: clamp(16px, 3vw, 30px);
    border: 1px solid var(--cartao-line);
    border-radius: 22px;
    background: var(--cartao-surface);
    box-shadow: var(--cartao-shadow);
}

.cartao-landing .app-perguntas .app-title { margin-top: 0; }

@media (max-width: 849px) {
    .cartao-landing .cartao-hero {
        align-items: start;
        min-height: clamp(530px, 100vw, 620px);
        padding: 32px clamp(18px, 6vw, 50px) clamp(260px, 45vw, 340px);
        background-image:
            linear-gradient(180deg, var(--cartao-landing-navy) 0%, #071c36f0 26%, #071c3640 59%, transparent 76%),
            url("/assets/img/cartao-landing-hero.webp");
        background-position: center, 87% bottom;
        background-size: cover, auto 73%;
        background-repeat: no-repeat;
    }

    .cartao-landing .cartao-hero-copy { max-width: 100%; }
    .cartao-landing .cartao-hero h1 { text-wrap: initial; }
}

/* Home reference layout */
.home-reference{font-family:"Inter",system-ui,sans-serif;color:#091c43;background:#edf3fb;padding-bottom:32px}.how-icon svg,.cause-pillars svg{width:42px;height:42px;fill:none;stroke:#b86c00;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.cause-pillars svg{width:30px;height:30px;flex:none;stroke-width:1.7}
.home-hero{min-height:500px;background:linear-gradient(90deg,#041b3b 0%,#072b56d9 42%,#072b5633 76%,#071c3600),url('/assets/img/cartao-landing-hero.webp') center/cover no-repeat;display:flex;align-items:center;padding:55px max(7vw,28px);position:relative;overflow:hidden}
.home-hero-copy{max-width:620px;margin-left:max(0px,calc((100vw - 1320px)/2));color:#fff;position:relative;z-index:1}
.home-reference{font-family:"Inter",system-ui,sans-serif;color:#091c43;background:#edf3fb;padding-bottom:32px}
.home-hero h1{font-family:"Playfair Display",Georgia,serif;font-size:clamp(2.5rem,5vw,4.55rem);line-height:1.03;margin:0 0 14px;letter-spacing:-.045em}.home-hero h1 span{color:#ffd15b}.home-hero p{font-size:clamp(1rem,1.55vw,1.27rem);line-height:1.3;margin:0 0 18px}.home-price{display:inline-flex;flex-direction:column;background:linear-gradient(#ffe79b,#efb936);color:#111;line-height:1;padding:12px 24px;border-radius:16px;font-size:1.85rem;font-weight:800;box-shadow:0 4px 12px #0005}.home-price small{font-size:1rem;text-align:center;margin-top:4px}.home-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px}.home-btn{min-height:44px;padding:10px 22px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;font-weight:600}.home-btn-gold{background:linear-gradient(#ffe58b,#eeb52c);color:#111;border:1px solid #fff0b1}.home-btn-outline{border:2px solid #fff;color:#fff;background:#071c3680}.home-panel{width:min(1320px,calc(100% - 48px));margin:16px auto 0;background:#ffffffde;border:1px solid #dce3ef;border-radius:24px;padding:16px 28px 24px;box-shadow:0 12px 32px #18335a22}.home-heading{display:flex;align-items:center;justify-content:center;gap:22px;margin-bottom:14px}.home-heading i{height:2px;width:130px;background:#d68b0b}.home-heading h2{font-family:"Plus Jakarta Sans",Arial,sans-serif;font-size:clamp(1.65rem,3vw,2.2rem);margin:0;font-weight:800}.campaign-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.campaign-card{background:#fff;border:1px solid #d8dee8;border-radius:17px;overflow:hidden;box-shadow:0 5px 12px #152c5120;display:flex;flex-direction:column}.campaign-image-wrap{height:138px;display:block;position:relative;overflow:hidden}.campaign-image-wrap img{width:100%;height:100%;object-fit:cover}.campaign-badge{position:absolute;left:12px;top:10px;background:#ffe386;color:#111;padding:5px 11px;border-radius:999px;font-weight:800;font-size:.82rem;z-index:1}.campaign-card-body{padding:12px 14px 14px;display:flex;flex:1;flex-direction:column}.campaign-card h3{font-family:"Plus Jakarta Sans",Arial,sans-serif;font-size:1.25rem;margin:0 0 4px}.campaign-card p{margin:0 0 10px;line-height:1.25;color:#1b2b4e}.campaign-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:auto;margin-bottom:10px}.campaign-meta span{background:#fff4df;border-radius:9px;padding:6px 8px;font-size:.73rem;font-weight:700}.campaign-join{display:flex;align-items:center;justify-content:center;gap:9px;background:linear-gradient(#ffe084,#efb52e);color:#111;border-radius:999px;padding:7px;text-decoration:none;font-weight:600}.campaign-join b{font-size:1.1rem}.home-empty{text-align:center;grid-column:1/-1;padding:30px}.faq-panel{padding-bottom:18px}.faq-list{display:grid;gap:8px}.faq-row{border:1px solid #d2d8e4;border-radius:13px;background:#fff;padding:0 18px;box-shadow:0 2px 8px #14294c12}.faq-row summary{list-style:none;cursor:pointer;padding:11px 0;font-weight:800;font-size:1rem;display:flex;justify-content:space-between}.faq-row summary::-webkit-details-marker{display:none}.faq-row summary span{color:#cf7e00;font-size:1.4rem;line-height:1}.faq-row p{margin:0 0 12px;color:#31415f}.faq-row[open] summary span{transform:rotate(45deg)}
@media(max-width:900px){.campaign-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-hero{min-height:540px;padding:34px 24px;align-items:flex-start}.home-hero-copy{margin:0}.home-hero h1{font-size:clamp(2.3rem,8vw,4rem)}}
@media(max-width:560px){.campaign-grid{grid-template-columns:1fr}.home-panel{width:calc(100% - 24px);padding:14px}.home-heading{gap:9px}.home-heading i{width:38px}.home-hero{min-height:555px;background-position:center}.home-hero p br{display:none}.home-actions{flex-direction:column;align-items:stretch}.home-btn{width:100%}}
.how-panel{padding-bottom:18px}.how-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.how-card{min-height:125px;padding:15px 16px;display:grid;grid-template-columns:44px 1fr;gap:10px;border:1px solid #e0e3e9;border-radius:15px;background:linear-gradient(145deg,#fff,#f9fafc);box-shadow:0 5px 14px #12294c15}.how-icon{font-size:2.25rem;line-height:1;color:#b66b00}.how-number{display:inline-grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#0b3568;color:#fff;font-size:.83rem;font-weight:800;vertical-align:top;margin:-4px 5px 0 0}.how-card h3{display:inline;color:#0b234d;font-size:1rem;line-height:1.1;font-weight:800}.how-card p{margin:8px 0 0;font-size:.83rem;line-height:1.25;color:#132446}.cause-panel{display:grid;grid-template-columns:245px minmax(0,1.25fr) minmax(210px,.85fr);align-items:center;gap:24px;padding:18px 28px}.cause-image{height:124px;border-radius:15px;overflow:hidden}.cause-image img{width:100%;height:100%;object-fit:cover}.cause-copy{padding-right:24px;border-right:1px solid #d79b4b}.cause-copy h2{margin:0 0 4px;font-size:1.65rem;font-weight:800}.cause-copy h3{margin:0 0 5px;font-size:1.03rem}.cause-copy p{margin:0;font-size:.9rem;line-height:1.3;color:#17284a}.cause-pillars{display:grid;gap:8px;color:#b86c00;font-size:1.65rem}.cause-pillars div{display:flex;align-items:center;gap:12px}.cause-pillars span{font-size:.86rem;line-height:1.12;color:#18294a;font-weight:700}@media(max-width:900px){.how-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cause-panel{grid-template-columns:190px 1fr}.cause-pillars{grid-column:1/-1;grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.how-grid{grid-template-columns:1fr}.cause-panel{display:flex;flex-direction:column;align-items:stretch;gap:14px}.cause-image{height:150px}.cause-copy{border-right:0;border-bottom:1px solid #d79b4b;padding:0 0 14px}.cause-pillars{grid-template-columns:1fr 1fr}}
