@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Cormorant+Garamond:ital,wght@0,600;0,700;1,500;1,600&family=Nunito+Sans:wght@400;600;700;800&family=Poppins:wght@600;700;800&display=swap');

body.checkout-page.checkout-magna-ca {
    margin: 0;
    padding: 0;
    background: #f3f4f5 !important;
    color: #2b2f36;
    font-family: 'Nunito Sans', Arial, sans-serif;
}
.checkout-magna-ca .magna33-stage {
    width: 100%; max-width: 660px; margin: 0 auto; padding: 24px 20px 0;
}
.checkout-magna-ca .checkout-shell {
    width: 100%; max-width: 660px !important;
    margin: 0 auto !important; padding: 0 20px 40px !important;
}
.checkout-magna-ca [class*="magna33-"] { letter-spacing: 0; box-sizing: border-box; }
.checkout-magna-ca .magna33-masthead {
    min-height: 42px; padding: 11px 20px;
    border: 1px solid #b38e4970; border-bottom: 1px solid #d8ab5c36;
    border-radius: 8px 8px 0 0; background: #101a23;
    color: #ccb98f; text-align: center; font-size: 12px; font-weight: 600;
}
.checkout-magna-ca .magna33-hero {
    position: relative; isolation: isolate; overflow: hidden;
    padding: 30px 30px 24px; background: #131e28;
    border: 1px solid #b38e4970; border-top: 0;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 18px 38px #10192326;
}
.checkout-magna-ca .magna33-hero-photo {
    position: absolute; z-index: -3; top: -12%; left: -4%;
    display: block; width: 108%; height: 124%; object-fit: cover;
    object-position: 82% center; will-change: transform; opacity: 1;
}
.checkout-magna-ca .magna33-hero::before {
    position: absolute; inset: 0; z-index: -2;
    background: linear-gradient(90deg, #111820ed, #11182080 58%, #11182015), linear-gradient(0deg, #111820f5, transparent 80%);
    content: '';
}
.checkout-magna-ca .magna33-hero::after {
    position: absolute; left: 0; right: 0; top: 0; height: 2px;
    background: linear-gradient(90deg, transparent 10%, #e6ca88 50%, transparent 90%);
    background-size: 240% 100%;
    animation: magna33-gold-pass 6s ease-in-out infinite;
    content: ''; pointer-events: none;
}
.checkout-magna-ca .magna33-hero-content {
    width: min(100%, 620px); margin: 0 auto;
    display: block; text-align: left;
}
.checkout-magna-ca .magna33-hero-content > * {
    animation: magna33-reveal .7s ease both;
}
.checkout-magna-ca .magna33-hero-content > :nth-child(2) { animation-delay: .07s; }
.checkout-magna-ca .magna33-hero-content > :nth-child(3) { animation-delay: .14s; }
.checkout-magna-ca .magna33-hero-content > :nth-child(4) { animation-delay: .21s; }
.checkout-magna-ca .magna33-hero-content > :nth-child(5) { animation-delay: .28s; }
.checkout-magna-ca .magna33-hero-content > :nth-child(6) { animation-delay: .35s; }
.checkout-magna-ca .magna33-hero-content > :nth-child(7) { animation-delay: .42s; }
.checkout-magna-ca .magna33-hero-content > :nth-child(8) { animation-delay: .49s; }
.checkout-magna-ca .magna33-emblem path,
.checkout-magna-ca .magna33-emblem circle { animation: magna33-symbol-light 5s ease-in-out infinite; }
.checkout-magna-ca .magna33-emblem {
    display: block;
    width: 42px; height: 42px; margin: 0 auto;
    color: #d8b66b;
}
.checkout-magna-ca .magna33-hero h1 {
    position: relative; z-index: 2;
    margin: 24px 0 28px; color: #fff4d9; text-align: center;
    font: 600 56px/1.04 'Cinzel', Georgia, serif;
    letter-spacing: 0; text-transform: uppercase;
    text-shadow: 0 3px 2px #080d14, 0 8px 24px #000, 0 0 36px #d3ac4933;
}
.checkout-magna-ca .magna33-hero h1 span { display: block; font-size: 23px; margin-bottom: 8px; }
.checkout-magna-ca .magna33-hero h1 em {
    display: inline-block; color: #f1c764; font-style: normal;
    animation: magna33-title-glow 4s ease-in-out infinite;
}
.checkout-magna-ca .magna33-hero-lead {
    max-width: 345px;
    margin: 0 auto 18px; padding: 0;
    color: #f2e8d2; text-align: center; text-shadow: 0 3px 12px #000;
    font: 600 27px/1.2 'Cormorant Garamond', Georgia, serif;
}
.checkout-magna-ca .magna33-hero-copy {
    max-width: 390px; margin: 0 auto 28px; text-align: center;
    color: #c8c3b9; font: 400 14px/1.65 'Nunito Sans', Arial, sans-serif;
}
.checkout-magna-ca .magna33-hero-copy strong { color: #eed799; font-weight: 600; }
.checkout-magna-ca .magna33-values {
    grid-column: 1 / -1; width: 100%;
    display: grid; grid-template-columns: repeat(3,1fr);
    max-width: none; margin: 0 auto 10px; padding: 16px 0 8px; text-align: center;
    border-top: 1px solid #d8ab5c36;
}
.checkout-magna-ca .magna33-values span {
    padding: 0 10px; color: #d7c7a7;
    font: 600 11px/1.5 'Nunito Sans', Arial, sans-serif;
}
.checkout-magna-ca .magna33-values span + span { border-left: 1px solid #d8ab5c36; }
.checkout-magna-ca .magna33-continue {
    width: max-content; margin: 0 auto;
    display: flex; align-items: center; justify-content: center; gap: 14px;
    min-height: 44px; padding: 8px 18px; color: #d8bb7e;
    font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 5px;
}
.checkout-magna-ca .magna33-continue { transition: color .2s, text-underline-offset .2s; }
.checkout-magna-ca .magna33-continue:hover { color: #fff0ca; text-underline-offset: 8px; }
.checkout-magna-ca .magna33-continue span { display: inline-block; font-size: 20px; animation: magna33-arrow 2s ease-in-out infinite; }
.checkout-magna-ca .magna33-checkout-intro { max-width: 660px; margin: auto; padding: 30px 24px 22px; text-align: center; }
.checkout-magna-ca .magna33-section-label { font-size: 11px; color: #81704b; font-weight: 700; }
.checkout-magna-ca .magna33-checkout-intro h2 { margin: 8px 0; color: #4c6079; font: 700 24px/1.25 'Nunito Sans', sans-serif; }
.checkout-magna-ca .magna33-checkout-intro p { color: #6b7280; font-size: 13px; margin: 0; }
.checkout-magna-ca .magna33-form-card {
    scroll-margin-top: 20px; border: 1px solid #e4e7e4 !important; border-radius: 8px !important;
    background: #fff !important; box-shadow: 0 8px 28px #17231906 !important;
}
.checkout-magna-ca .magna33-hero a:focus-visible { outline: 2px solid #eed799; outline-offset: 4px; }

.checkout-magna-ca .magna33-form-card {
    padding: 26px 24px !important;
    margin-bottom: 32px !important;
}

.checkout-magna-ca .magna33-form-heading {
    margin: 0 0 22px;
    color: #4c6079;
    font-family: 'Poppins', Arial, sans-serif;
    font-size: 20px;
    font-weight: 800;
    text-align: center;
}

.checkout-magna-ca .magna33-form-card .card,
.checkout-magna-ca .magna33-form-card .metodos,
.checkout-magna-ca .magna33-form-card .box-form {
    background: transparent !important;
    box-shadow: none !important;
}

.checkout-magna-ca .magna33-form-card .form-control,
.checkout-magna-ca .magna33-form-card .form-select {
    min-height: 55px;
    border: 1px solid #e7e7ea !important;
    border-radius: 12px !important;
    color: #2b2f36;
    box-shadow: none !important;
    background: #fafafa !important;
}

.checkout-magna-ca .magna33-form-card .form-control:focus,
.checkout-magna-ca .magna33-form-card .form-select:focus {
    border-color: #cfa54a !important;
    box-shadow: 0 0 0 3px rgba(207, 165, 74, .14) !important;
}

.checkout-magna-ca .magna33-form-card #box-selecao-metodo .row {
    margin: 0 !important;
}

.checkout-magna-ca .magna33-form-card #box-selecao-metodo .col-md-3,
.checkout-magna-ca .magna33-form-card #box-selecao-metodo .col-sm-3,
.checkout-magna-ca .magna33-form-card #box-selecao-metodo .col-3 {
    max-width: 100%;
    width: 100%;
    padding: 0;
}

.checkout-magna-ca .magna33-form-card #box-selecao-metodo a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    padding: 13px;
    border: 1px solid #e6c56a;
    border-radius: 12px;
    color: #4a3a0a !important;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    background: #f6d989;
}

.checkout-magna-ca .magna33-benefits {
    display: grid;
    gap: 10px;
    padding: 2px 0 20px;
}

.checkout-magna-ca .magna33-benefit {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #2b2f36;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
}

.checkout-magna-ca .magna33-benefit-mark {
    display: grid;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    place-items: center;
    border-radius: 50%;
    color: #2f7d3c;
    font-size: 11px;
    background: rgba(47, 125, 60, .1);
}

.checkout-magna-ca .magna33-form-card #comprabt {
    width: 100% !important;
    padding: 18px 12px !important;
    margin: 2px 0 0 !important;
    border: 0 !important;
    border-radius: 12px !important;
    color: #fff !important;
    font-family: 'Poppins', Arial, sans-serif;
    font-size: 15px !important;
    font-weight: 800 !important;
    letter-spacing: 0;
    background: linear-gradient(180deg, #2f7d3c, #256330) !important;
    box-shadow: 0 6px 16px rgba(47, 125, 60, .28) !important;
}

.checkout-magna-ca .magna33-submit-note {
    margin: 14px 0 0;
    color: #6b7280;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.45;
    text-align: center;
}



@keyframes magna33-reveal { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes magna33-arrow { 0%,100% { transform: translateY(0); } 50% { transform: translateY(3px); } }
@keyframes magna33-gold-pass { 0%,100% { background-position: 110% 0; } 50% { background-position: -10% 0; } }
@keyframes magna33-symbol-light { 0%,100% { opacity: .75; } 50% { opacity: 1; } }
@keyframes magna33-title-glow {
    0%,100% { text-shadow: 0 3px 2px #080d14, 0 8px 24px #000, 0 0 14px #e4b95126; }
    50% { text-shadow: 0 3px 2px #080d14, 0 8px 24px #000, 0 0 28px #e4b95170; }
}
.checkout-magna-ca .magna33-hero[data-motion-visible="false"] *,
.checkout-magna-ca .magna33-hero[data-motion-visible="false"]::after { animation-play-state: paused; }
@media (max-width: 576px) {
    .checkout-magna-ca .magna33-stage { padding: 14px 12px 0; }
    .checkout-magna-ca .magna33-masthead { font-size: 11px; min-height: 40px; }
    .checkout-magna-ca .magna33-hero { padding: 22px 18px 24px; }
    .checkout-magna-ca .magna33-hero-photo { object-position: 78% center; }
    .checkout-magna-ca .magna33-emblem { width: 32px; height: 32px; }
    .checkout-magna-ca .magna33-hero h1 { font-size: 42px; margin-top: 30px; }
    .checkout-magna-ca .magna33-hero h1 span { font-size: 17px; margin-bottom: 6px; }
    .checkout-magna-ca .magna33-hero-lead { font-size: 23px; max-width: 275px; }
    .checkout-magna-ca .magna33-hero-copy { font-size: 13px; max-width: 370px; }
    .checkout-magna-ca .magna33-values span { padding: 0 5px; font-size: 10px; }
    .checkout-magna-ca .magna33-checkout-intro { padding: 25px 20px 20px; }
    .checkout-magna-ca .magna33-checkout-intro h2 { font-size: 22px; }
    .checkout-magna-ca .magna33-form-card { padding: 22px 18px !important; }
    .checkout-magna-ca .magna33-form-heading { font-size: 16px; }
}
@media (max-width: 360px) {
    .checkout-magna-ca .magna33-hero h1 { font-size: 36px; }
    .checkout-magna-ca .magna33-values span { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
    .checkout-magna-ca *, .checkout-magna-ca *::before, .checkout-magna-ca *::after {
        animation: none !important; transition: none !important; scroll-behavior: auto !important;
    }
}
