/* =========================================================
   MobiFin — responsive.css
   Breakpoints: 1440 / 1280 / 1024 / 860 / 640 / 400
   Layouts are re-composed per range, not just scaled down.
   ========================================================= */

/* ---------- Large desktop ---------- */
@media (min-width:1600px){
  :root{
    --container:1775px;
    --gutter:40px;
    --section-y:120px;
    --fs-h1:114px;
    --fs-h2:52px;
    --fs-h2-xl:82px;
    --fs-h3:52px;
    --fs-lead:30px;
    --fs-body:18px;
    --fs-sm:22px;
    --fs-xs:16px;
  }

  .site-header{padding:68px 0 0}
  .header__inner{max-width:var(--container)}
  .brand img{width:197.694px}
  .nav__list{gap:42px}
  .nav__list a{font-size:18px}
  .header__cta{min-width:210px;height:55px;justify-content:center;border-radius:20px;font-size:18px;font-weight:500;letter-spacing:0}

  .hero{min-height:1042px;padding:248px 0 74px}
  .hero__title{font-size:114px;line-height:142px;letter-spacing:0;margin-bottom:50px}
  .hero__lead{max-width:930px;font-size:30px;line-height:1.55}
  .hero__actions{margin-top:34px;gap:23px}
  .hero .btn{height:55px;justify-content:center;border-radius:20px;font-size:18px;font-weight:500;letter-spacing:0}
  .hero .btn--primary{width:210px}
  .hero .btn--ghost{width:244px}
  .hero .btn .ico,.header__cta .ico{width:18px;height:10px}

  .trusted{padding:58px 0 54px}
  .trusted__inner{gap:48px}
  .trusted__label{font-size:18px}
  .trusted__marquee{--logo-gap:29px;padding:7px 0}
  .logo-chip{flex-basis:257px;height:88px;border-radius:24px;padding-inline:28px}
  .logo-chip img{width:200px;max-width:200px;height:82px}

  .split{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:72px}
  .rule{margin:54px 0}

  .about{min-height:1128px;padding-top:74px}
  .about__dots{background-size:1920px 1080px;background-position:center top}
  .about .h2{font-size:52px;line-height:62px;font-weight:700;letter-spacing:0;color:#07274D}
  .about .split>.lead{padding-top:0}
  .about .xd-break{display:block}
  .stats{gap:64px;margin-top:74px}
  .stat{min-height:170px;padding:30px 36px;border-radius:25px}
  .stat__num{font-size:48px;line-height:58px;font-weight:700;letter-spacing:0;color:#07274D}
  .stat__label{font-size:16px;line-height:24px;font-weight:500;letter-spacing:0;color:#758394}
  .globe{height:547px;margin-top:44px}

  .anchor{min-height:747px}
  .moves{gap:72px}
  .move__title{font-size:32px}
  .move__text{font-size:18px;line-height:1.55}

  .problem{min-height:941px}
  .problems{gap:56px}
  .pcard{padding:38px;border-radius:14px;min-height:296px}
  .pcard__kicker{font-size:16px}
  .pcard__title{font-size:32px}
  .pcard__text{font-size:18px}

  .deploy{min-height:1183px}
  .deploy__row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:180px}
  .deploy__text{font-size:30px;line-height:1.5}
  .deploy__meta{font-size:16px}
  .link-arrow{font-size:16px}

  .solutions{min-height:1057px}
  .solutions__body{grid-template-columns:640px 752px;gap:248px;margin-top:62px}
  .sol-item{padding:14px 0}
  .sol-item__num{width:42px;height:42px;font-size:16px}
  .sol-item__name{font-size:22px}
  .sol-list::before{left:21px}
  .sol-panel{border-radius:14px;min-height:618px;display:flex;flex-direction:column}
  .sol-panel__body{padding:42px}
  .sol-panel__title{font-size:38px}
  .sol-panel__sub{font-size:16px}
  .sol-panel__text{font-size:18px}
  .chips li{font-size:13px;padding:7px 14px}
  .sol-panel__foot{padding:24px 42px;margin-top:auto}

  .tapestry{min-height:913px}
  .tapestry__grid{gap:90px}
  .h3--sm{font-size:38px}
  .tslide__text{font-size:18px}
  .composer{width:616.5px;max-width:100%}

  .serve{min-height:688px;padding:95px 0 45px}
  .serve__track-wrap{margin-top:52px}
  .serve__list{gap:118px}
  .serve-card{flex-basis:300px}
  .serve-card__num{font-size:76px}
  .serve-card__title{font-size:32px}
  .serve-card__text{font-size:20px;line-height:1.55}

  .recognition{min-height:776px;padding:95px 0}
  .recognition__grid{grid-template-columns:600px minmax(0,1fr);gap:64px}
  .awards{max-width:844px}
  .award{padding:34px}
  .award__year{font-size:16px}
  .award__title{font-size:32px}
  .award__text{font-size:18px}

  .testimonials{min-height:772px;padding:80px 0}
  .quote{min-height:410px}
  .quote__text{font-size:38px}
  .quote__logo{width:317.714px}

  .news{min-height:1138px}
  .news__track{gap:34px}
  .post{padding:30px}
  .post__top{font-size:16px}
  .post__title{font-size:24px}
  .post__text{font-size:16px}

  .cta{min-height:480px;padding:80px 0 50px}
  .cta__inner .lead{max-width:780px;font-size:24px;line-height:36px}
  .closing{min-height:970px}
  .closing .cta__actions{gap:18px;margin-top:52px}
  .closing .cta .btn{height:55px;padding:0;justify-content:center;border-radius:20px;font-size:18px;font-weight:500;letter-spacing:0}
  .closing .cta .btn--primary{width:210px}
  .closing .cta .btn--ghost{width:264px}
  .footer{min-height:414px}
  .closing .footer>.container>.rule:first-child{margin:10px 0 68px}
  .closing .footer>.container>.rule:nth-of-type(2){margin:72px 0 46px}
}

/* ---------- Standard desktop / small laptop ---------- */
@media (max-width:1280px){
  :root{--container:1100px}
  .deploy__row{gap:36px}
  .quote__logo{right:30px;width:clamp(100px,13vw,150px)}
}

/* ---------- Laptop ---------- */
@media (max-width:1120px){
  .stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .stats .stat:nth-child(4),
  .stats .stat:nth-child(5){grid-column:span 1}
  .moves{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:34px}
}

/* ---------- Tablet ---------- */
@media (max-width:1023px){
  :root{--section-y:clamp(52px,8vw,84px)}

  /* Header → drawer */
  .header__inner{position:relative}
  .header__cta{display:none}
  .nav-toggle{display:inline-flex;margin-left:auto}
  .site-header.is-open{background:#fff;box-shadow:0 12px 30px -22px rgba(13,43,82,.6)}
  .nav{
    position:absolute;left:0;right:0;top:calc(100% + 10px);
    margin:0;
    background:#fff;
    border:1px solid var(--hairline);
    border-radius:var(--radius);
    box-shadow:0 30px 60px -34px rgba(13,43,82,.5);
    padding:18px;
  }
  .nav__list{flex-direction:column;align-items:stretch;gap:0}
  .nav__list li+li{border-top:1px solid var(--hairline)}
  .nav__list a{display:block;padding:13px 6px;font-size:1rem}
  .nav__list a::after{display:none}
  .nav__cta-mobile{display:inline-flex;margin-top:14px;width:100%;justify-content:center}

  .split{grid-template-columns:1fr;gap:18px}
  .split .lead{padding-top:0}

  .deploy__row{grid-template-columns:1fr;gap:34px}
  .deploy__text,.lead{max-width:60ch}

  .solutions__body{grid-template-columns:1fr;gap:28px}
  .solutions{min-height:0}
  .sol-list{
    display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;
    scrollbar-width:none;-ms-overflow-style:none;
  }
  .sol-list::-webkit-scrollbar{display:none}
  .sol-list::before{display:none}
  .sol-item{
    flex-direction:row;white-space:nowrap;gap:9px;
    border:1px solid var(--hairline);border-radius:999px;
    padding:9px 16px 9px 9px;background:#fff;
  }
  .sol-item.is-active{border-color:var(--blue);background:var(--blue-tint)}
  .sol-item__num{width:24px;height:24px;font-size:.66rem}
  .sol-item__name{font-size:.9rem}

  .tapestry__grid{grid-template-columns:1fr;gap:32px}
  .tapestry__stage{padding-left:0}
  .tapestry__stage::before{display:none}
  .tslider__dots{justify-content:flex-start}

  .recognition__grid{grid-template-columns:1fr;gap:30px}

  .news__track{grid-template-columns:repeat(3,minmax(0,1fr));width:200%;transition:transform .8s var(--ease-out)}
  .news__viewport{overflow:hidden}
}

/* ---------- Small tablet / large phone ---------- */
@media (max-width:860px){
  .hero{min-height:650px;padding-top:126px;padding-bottom:62px}
  .hero__title{max-width:760px;letter-spacing:-.027em}
  .hero__aurora{background-position:-60px -1px;background-size:1100px auto}

  .trusted__inner{gap:14px}
  .logo-chip{flex-basis:145px;height:50px}

  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stats .stat:last-child{grid-column:1/-1}

  .problems{grid-template-columns:1fr}
  .pcard__text{max-width:52ch}

  .moves{grid-template-columns:1fr;row-gap:28px}
  .move__text{max-width:46ch}

  .awards{grid-template-columns:1fr}
  .award--offset{margin-top:0}

  .quote{padding:30px 24px}
  .quote__text{max-width:100%;font-size:1.15rem}
  .quote__logo{position:static;transform:none;margin-top:22px;width:130px}
  .quote__people{display:none}

  .news__track{width:300%;grid-template-columns:repeat(3,minmax(0,1fr))}

  .footer__grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:30px}
  .footer__brand{grid-column:1/-1}
}

/* ---------- Mobile ---------- */
@media (max-width:640px){
  :root{
    --section-y:clamp(46px,11vw,64px);
    --gutter:20px;
    --fs-h1:clamp(2.15rem,10.4vw,3.1rem);
    --fs-h2:clamp(1.5rem,6.6vw,1.95rem);
    --fs-h2-xl:clamp(1.7rem,8vw,2.3rem);
    --fs-h3:clamp(1.3rem,6.4vw,1.7rem);
    --fs-lead:1rem;
  }

  .hero{min-height:670px;padding-top:112px;padding-bottom:52px}
  .hero__title{line-height:1.055}
  .hero__lead{font-size:.9375rem}
  .hero__actions .btn{flex:1 1 100%;justify-content:center}
  .hero__aurora{background-position:-43px -1px;background-size:780px auto}
  .hero__liquid{filter:url(#heroLiquidGoo) blur(26px)}
  .blob--cursor{display:none}
  .hero__grain{background:linear-gradient(to bottom,rgba(255,255,255,.9),rgba(255,255,255,.06) 25%,rgba(255,255,255,.06) 72%,rgba(255,255,255,.94))}

  .trusted{padding:16px 0}
  .trusted__inner{display:block}
  .trusted__label{margin-bottom:8px}
  .logo-chip{flex-basis:132px;height:46px}

  .about{padding-top:0}
  .about .container{padding-top:var(--section-y)}
  .globe{height:210px;margin-top:16px}
  .globe__pin--bank{top:32px}
  .globe__pin--fintech{left:25%;top:90px}
  .globe__pin--switch{left:75%;top:86px}
  .globe__pin--wallet{display:none}
  .globe__institution-links{display:none}

  .stats{grid-template-columns:1fr 1fr;gap:10px}
  .stat{padding:14px}

  .deploy__meta{margin:16px 0 12px}
  .tabs__nav{width:100%;justify-content:stretch}
  .tab{flex:1;padding:11px 8px;font-size:.625rem;letter-spacing:.06em;text-align:center}

  .composer__cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .composer__foot{flex-direction:column;align-items:flex-start;gap:8px}

  .serve__list{gap:22px;padding-left:20px;padding-right:20px}
  .serve-card{flex:0 0 78vw}
  .serve__caption{display:none}

  .sol-panel__foot,.sol-panel__body{padding-inline:20px}

  .news__dots,.quotes__dots{margin-top:18px}

  .footer__grid{grid-template-columns:1fr;row-gap:26px}
  .footer__bottom{flex-direction:column;align-items:flex-start;gap:8px}
}

/* ---------- Small mobile ---------- */
@media (max-width:400px){
  :root{--gutter:16px}
  .brand__tag{display:none}
  .brand__word{font-size:1.18rem}
  .stats{grid-template-columns:1fr}
  .logo-chip{flex-basis:124px}
  .composer__cards{grid-template-columns:1fr 1fr;gap:7px}
  .quote__text{font-size:1.05rem}
}

/* ---------- Touch: disable hover-only lifts ---------- */
@media (hover:none){
  .pcard:hover,.post:hover,.award:hover,.stat:hover,.logo-chip:hover{transform:none;box-shadow:var(--shadow-card)}
  .post:hover .post__media img{transform:none}
}

/* ---------- Landscape phones: trim vertical rhythm ---------- */
@media (max-height:520px) and (orientation:landscape){
  .hero{min-height:560px;padding-top:96px;padding-bottom:36px}
  .globe{height:180px}
}

/* ---------- Shared XD desktop grid ----------
   Every repeated two-column heading uses two explicit rows:
   eyebrow above, then H2 and the right-side copy aligned together. */
@media (min-width:1024px){
  .split{
    grid-template-rows:auto auto;
    row-gap:0;
    align-items:start;
  }
  .split>div:first-child{display:contents}
  .split>div:first-child>.eyebrow{
    grid-column:1;
    grid-row:1;
  }
  .split>div:first-child>.h2{
    grid-column:1;
    grid-row:2;
  }
  .split>.lead{
    grid-column:2;
    grid-row:2;
    align-self:start;
    padding-top:0!important;
  }

  /* These two sections use dedicated grids rather than .split. */
  .tapestry__stage{padding-top:33px}
  .recognition .awards{margin-top:33px}
}

/* ---------- Print ---------- */
@media print{
  .site-header,.globe,.recognition__canvas,.hero__aurora,.news__dots,.quotes__dots,.tslider__dots{display:none}
  body{background:#fff;color:#000}
  .section--navy,.news{background:#fff !important;color:#000 !important}
}
