/* Institutional editorial direction: Nubank benchmark + supplied prototype, 2026-09-13. */
:root {
  --mc-site-hero-title: clamp(3rem, 4.35vw, 4.35rem);
  --mc-site-photo-radius: 1.75rem;
  --mc-site-scene-surface: #edeae5;
  --mc-site-scene-time: 650ms;
}
.header-inner { min-height: 96px; }
.home-hero { display: grid; grid-template-columns: 1.04fr 1fr; align-items: center; gap: 3.5rem; padding-block: 2.25rem 4rem; }
.home-hero-copy { min-width: 0; padding-block: 2rem; }
.home-hero h1 { font-size: var(--mc-site-hero-title); line-height: 1.07; letter-spacing: -.045em; }
.home-hero h1 em { display: inline; }
.home-hero .eyebrow { margin-bottom: 1.5rem; }
.home-hero .lead { max-width: 30rem; margin-block: 1.8rem 2rem; }
.home-hero .actions { gap: .65rem 1.25rem; align-items: flex-start; flex-direction: column; }
.home-hero-visual { position: relative; min-width: 0; align-self: stretch; min-height: 600px; }
.lifestyle-photo { height: 100%; position: relative; overflow: hidden; border-radius: var(--mc-site-photo-radius); background: var(--mc-site-scene-surface); }
.lifestyle-photo > img { height: 100%; width: 100%; object-fit: cover; object-position: 58% 42%; animation: photo-settle 800ms var(--mc-ease) both; }
.lifestyle-photo figcaption { position: absolute; right: 1rem; top: 1rem; background: var(--mc-bg); color: var(--mc-text-2); padding: 4px 9px; border-radius: 4px; font-size: .6875rem; }
.hero-product-note { position: absolute; display: flex; align-items: center; gap: 1rem; bottom: 1.75rem; left: -2rem; width: calc(100% - 1.5rem); max-width: 450px; padding: .65rem 1.25rem .65rem .4rem; background: var(--mc-bg); border: 1px solid var(--mc-border); border-radius: 1rem; box-shadow: 0 14px 40px #1a191815; color: var(--mc-brand-navy); animation: note-arrive 750ms 150ms var(--mc-ease) both; }
.hero-product-note img { width: 34%; height: auto; flex-shrink: 0; mix-blend-mode: normal; border-radius: .5rem; }
.hero-product-note small { display: block; font-size: .75rem; margin-bottom: .25rem; color: var(--mc-text-2); }
.hero-product-note strong { font-size: 1.2rem; line-height: 1.2; font-weight: 500; display: block; }
.hero-product-note > span:last-child { margin-left: auto; font-size: 1.5rem; transition: transform 200ms var(--mc-ease); }
.hero-product-note:hover > span:last-child { transform: translateX(3px); }
.home-hero + .intent { margin-bottom: 1rem; }
.digital { background: var(--mc-site-scene-surface); }
.digital-heading { max-width: 780px; margin-bottom: 3.5rem; }
.digital-heading h2 { font-size: clamp(2.5rem,4.3vw,4.35rem); }
.digital-heading .section-description { margin-top: 1.3rem; max-width: 38rem; }
.digital-grid { grid-template-columns: .9fr 1.1fr; gap: 4rem; align-items: center; }
.experience-controls { display: flex; padding: 0; border: 0; border-bottom: 1px solid var(--mc-border-str); border-radius: 0; gap: 1.25rem; margin: 0; background: none; }
.experience-controls button { display: flex; flex-direction: column; align-items: flex-start; gap: .4rem; flex: 1; padding: 0 0 1rem; border-radius: 0; border-bottom: 2px solid transparent; color: var(--mc-text-2); font-size: .75rem; min-height: 64px; }
.experience-controls button span { font-size: 1rem; text-align: left; }
.experience-controls button[aria-pressed=true] { background: none; color: var(--mc-brand-navy); border-bottom-color: var(--mc-brand-navy); }
.experience-controls button:hover { color: var(--mc-brand-wine); }
.experience-detail { min-height: 290px; padding-top: 2.5rem; }
.experience-detail .eyebrow { font-size: .75rem; margin-bottom: 1.2rem; }
.experience-detail h3 { font-size: clamp(1.85rem,2.6vw,2.65rem); max-width: 450px; }
.experience-caption { min-height: 0; margin-block: 1.2rem .8rem; font-size: 1.0625rem; }
.experience-detail .mc-button { text-align: left; justify-content: flex-start; }
.experience-detail [data-experience-link-label] { font-size: 1rem; line-height: 1.5; }
.experience-stage { padding: 2rem 0 1.5rem; display: block; width: 100%; min-width: 0; }
.experience-card { width: 76%; transform: translate(-4%,0) rotate(-5deg); transition: transform var(--mc-site-scene-time) var(--mc-ease); }
.experience-card img { mix-blend-mode: multiply; border-radius: 1rem; }
.experience-card figcaption { text-align: left; margin-left: 12%; font-size: .6875rem; }
.app-concept { margin: -15% 0 0 21%; padding: 2rem; border-radius: 1.25rem; background: var(--mc-surface); box-shadow: 0 12px 40px #27295c0a; transition: transform var(--mc-site-scene-time) var(--mc-ease); }
.app-concept h3 { font-size: 1.65rem; }
.app-concept-top { margin-bottom: 1.65rem; }
.app-concept-top img { width: 145px; }
.app-concept .eyebrow { font-size: .625rem; }
.experience-stage[data-stage=app] .experience-card { transform: translate(-7%,-2%) rotate(-8deg); }
.experience-stage[data-stage=app] .app-concept { transform: translate(-3%,-12px); }
.experience-stage[data-stage=next] .experience-card { transform: translate(0,0) rotate(-2deg); }
.experience-stage[data-stage=next] .app-concept { transform: translate(-2%,0); }
.moncard-hero { padding-block: 4.5rem; }
.moncard-hero h1 { font-size: var(--mc-site-hero-title); }
.moncard-hero .hero-art { border-radius: var(--mc-site-photo-radius); background: var(--mc-site-scene-surface); aspect-ratio: 1; overflow: hidden; padding: 1.5rem; }
.moncard-hero .hero-art img { width: 92%; max-width: 92%; height: auto; mix-blend-mode: normal; border-radius: 4% / 6.3%; filter: drop-shadow(0 24px 20px #27295c26); }
.moncard-hero .hero-art figcaption { align-self: center; }
@keyframes photo-settle { from { transform: scale(1.045); } to { transform: scale(1); } }
@keyframes note-arrive { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media(max-width:1100px) {
  .home-hero { gap: 2.5rem; }
  .home-hero-visual { min-height: 570px; }
  .hero-product-note { left: -1rem; width: calc(100% + .25rem); gap: .7rem; }
  .hero-product-note strong { font-size: 1.1rem; }
  .digital-grid { gap: 2.5rem; }
  .app-concept { padding: 1.5rem; margin-left: 12%; }
}
@media(max-width:800px) {
  .header-inner { min-height: 80px; }
  .home-hero { grid-template-columns: 1fr; gap: 1.75rem; padding-block: 2.5rem 2.5rem; }
  .home-hero-copy { padding: 0; max-width: 620px; }
  .home-hero h1 { font-size: clamp(2.5rem,6.4vw,3.75rem); }
  .home-hero .actions { flex-direction: row; align-items: center; }
  .home-hero-visual { min-height: 0; height: 460px; }
  .lifestyle-photo > img { object-position: 58% 40%; }
  .hero-product-note { left: 1.25rem; bottom: 1.25rem; width: calc(100% - 2.5rem); }
  .home-hero + .intent { margin-bottom: 3rem; }
  .digital-heading { margin-bottom: 2.5rem; }
  .digital-grid { grid-template-columns: 1fr; gap: 1rem; }
  .digital-copy { max-width: none; }
  .experience-detail { min-height: 250px; padding-top: 2rem; }
  .experience-stage { max-width: 600px; margin-inline: auto; padding-top: 0; }
  .experience-card { width: 68%; }
  .app-concept { margin: -15% 0 0 20%; padding: 1.75rem; }
  .moncard-hero { padding-block: 3rem; }
  .moncard-hero .hero-art { aspect-ratio: 1.4; }
}
@media(max-width:520px) {
  .home-hero { padding-top: 1.8rem; gap: 1.5rem; }
  .home-hero h1 { font-size: clamp(2rem,8.8vw,2.85rem); line-height: 1.1; letter-spacing: -.035em; }
  .home-hero .eyebrow { font-size: .6875rem; margin-bottom: 1rem; }
  .home-hero .lead { font-size: 1rem; line-height: 1.55; margin-block: 1.2rem 1.25rem; }
  .home-hero .actions { gap: .3rem; flex-direction: column; align-items: flex-start; }
  .home-hero .mc-button { min-height: 46px; padding-block: 10px; }
  .home-hero-visual { height: 350px; }
  .lifestyle-photo { border-radius: 1.1rem; }
  .hero-product-note { left: .75rem; bottom: .75rem; width: calc(100% - 1.5rem); gap: .5rem; padding: .4rem .8rem .4rem .2rem; border-radius: .7rem; }
  .hero-product-note img { width: 31%; }
  .hero-product-note small { font-size: .625rem; }
  .hero-product-note strong { font-size: .95rem; }
  .hero-product-note > span:last-child { font-size: 1.2rem; }
  .digital-heading h2 { font-size: 2.5rem; }
  .experience-controls { gap: .7rem; }
  .experience-controls button { min-width: 0; }
  .experience-controls button span { font-size: .875rem; }
  .experience-detail { min-height: 295px; }
  .experience-detail h3 { font-size: 1.9rem; }
  .experience-stage { padding-bottom: 0; }
  .experience-card { width: 83%; }
  .app-concept { margin-left: 6%; margin-top: -8%; padding: 1.5rem; }
  .app-concept h3 { font-size: 1.5rem; }
  .app-concept-top img { width: 140px; }
}
.text-200 .home-hero { grid-template-columns: minmax(0,1fr); }
.text-200 .home-hero-copy { max-width: none; }
.text-200 .home-hero-visual { min-height: 0; height: auto; display: flex; flex-direction: column; }
.text-200 .lifestyle-photo { height: 480px; }
.text-200 .hero-product-note { position: static; width: 100%; max-width: none; flex-wrap: wrap; margin-top: 1rem; }
.text-200 .hero-product-note > span { flex: 1; }
.text-200 .hero-product-note > span:last-child { flex: 0; }
.text-200 .digital-grid { grid-template-columns: minmax(0,1fr); }
.text-200 .experience-controls { flex-direction: row; flex-wrap: wrap; }
.text-200 .experience-controls button { min-width: min(100%,180px); }
.text-200 .experience-detail { min-height: 0; }
.text-200 .experience-stage { max-width: 850px; }
.text-200 .app-concept { margin: 1rem 0 0; padding-top: 1.5rem; }
.text-200 .experience-card { width: 100%; transform: none!important; }
@media(prefers-reduced-motion:reduce) {
  .lifestyle-photo > img,.hero-product-note { animation: none; }
  .experience-card,.app-concept { transform: none!important; transition: none; }
}
/* Keep the complete interface header clear of the overlapping product image. */
.app-concept { padding-top: calc(2rem + 15%); }
@media(max-width:520px) { .app-concept { padding-top: calc(1.5rem + 8%); } }
.text-200 .app-concept { padding-top: 1.5rem; }
/* One editorial chapter: title and controls share the left column. */
.digital { padding-block: clamp(4rem,6vw,6rem); }
.digital-heading { margin-bottom: 2.5rem; }
.digital-heading h2 { font-size: clamp(2.5rem,3.8vw,3.65rem); }
.digital-heading .section-description { max-width: 27rem; font-size: 1.0625rem; }
.experience-card { width: 62%; }
.app-concept-top { margin-bottom: 1.3rem; }
.app-concept h3 { font-size: 1.45rem; }
@media(max-width:800px) {
  .digital-heading { max-width: 620px; }
  .digital-heading .section-description { max-width: 38rem; }
  .experience-stage { margin-top: 1.5rem; }
  .experience-card { width: 68%; }
}
@media(max-width:520px) { .experience-card { width: 83%; } }
.text-200 .experience-card { width: 100%; }

/* Motion refinement: finite entrances, short feedback and bounded depth. */
.home-hero-copy h1,.hero-copy h1 { animation: mc-copy-arrive 650ms var(--mc-ease) both; }
.home-hero-copy .lead,.hero-copy .lead { animation: mc-copy-arrive 650ms 80ms var(--mc-ease) both; }
.home-hero-copy .actions,.hero-copy .actions { animation: mc-copy-arrive 650ms 140ms var(--mc-ease) both; }
.hero-product-note { translate: var(--mc-motion-x,0px) var(--mc-motion-y,0px); transition: translate 350ms var(--mc-ease); }
.hero-product-note:focus-visible { translate: none; }
.reveal { animation: mc-section-arrive 450ms var(--mc-ease) both; }
.reveal:focus-within { animation: none; }
.mc-button > span[aria-hidden] { transition: transform 200ms var(--mc-ease); }
@media(hover:hover) and (pointer:fine) {
  .mc-button:hover > span[aria-hidden] { transform: translateX(3px); }
}
@keyframes mc-copy-arrive { from { opacity:.7; transform:translateY(9px); } to { opacity:1; transform:none; } }
@keyframes mc-section-arrive { from { opacity:.5; transform:translateY(8px); } to { opacity:1; transform:none; } }
.reduce-motion .hero-product-note { translate:none!important; }
@media(prefers-reduced-motion:reduce) { .hero-product-note { translate:none!important; } }

/* Official contact channels and corporate documents. */
.contact-channels { min-width: 0; padding: 2.5rem; border: 1px solid var(--mc-border); border-radius: var(--mc-site-radius); background: var(--mc-surface); }
.contact-channels > h2 { font-size: 2rem; }
.contact-subject { margin-block: 2rem; }
.contact-channel { padding-block: 1.6rem; border-top: 1px solid var(--mc-border); }
.contact-channel h3 { font-size: 1.4rem; }
.contact-channel p { margin-block: .6rem 1.2rem; overflow-wrap: anywhere; }
.contact-channel .mc-button { width: 100%; white-space: normal; }
.contact-note { font-size: .875rem; margin-top: 1rem; }
.contact-note a { text-decoration: underline; text-underline-offset: 3px; }
.footer-identity { display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; padding-block: 1.5rem; border-top: 1px solid var(--mc-border-inv, #ffffff30); font-size: .875rem; }
.footer-identity p { flex-basis: 100%; }
.footer-identity a { overflow-wrap: anywhere; }
.legal-layout a, .legal-pending a { overflow-wrap: anywhere; }
.legal-document .mc-button { margin-top: 1.6rem; white-space: normal; }
.legal-document .document-format { font-size: .875rem; margin-top: .8rem; }
@media(max-width:520px) { .contact-channels { padding: 1.5rem; } .contact-channels > h2 { font-size: 1.75rem; } }

.corporate-documents { padding-top: 4rem; }
.corporate-documents > h2 { margin-bottom: 2rem; }
.corporate-documents .documents-list h3 { font-size: 1.4rem; }
