/* MTP DigiTech UI/UX V7
   Restores the stronger visual hierarchy from the 2026 V5 build while keeping
   the newer readable typography, clean URLs, forms and content structure. */
:root{
  --mtp-navy:#061936;
  --mtp-navy-2:#101154;
  --mtp-ink:#0b1b32;
  --mtp-muted:#5d6a7f;
  --mtp-line:#e4e9f1;
  --mtp-soft:#f7f9fc;
  --mtp-pink:#ed006d;
  --mtp-pink-2:#c90062;
  --mtp-purple:#6b1b91;
  --mtp-shadow:0 18px 48px rgba(7,25,54,.10);
  --mtp-shadow-strong:0 28px 70px rgba(7,25,54,.15);
}

html{scroll-padding-top:110px}
body{font-size:17px;line-height:1.7;background:#fff;color:var(--mtp-ink)}
p{font-size:17px;line-height:1.75}
a,button,input,select,textarea{font-family:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(237,0,109,.22);outline-offset:3px}

/* Header restored closer to the polished V5 layout. */
.topbar{background:#fff;border-bottom:1px solid #edf0f5;color:#526078}
.topbar>.container{min-height:34px}
.topbar a{font-weight:700}
.site-header{box-shadow:0 7px 24px rgba(6,25,54,.055);border-bottom:1px solid rgba(228,233,241,.9)}
.nav-wrap{min-height:76px}
.brand{gap:12px}
.brand img{width:50px;height:50px;border-radius:11px;object-fit:cover;box-shadow:0 8px 20px rgba(102,20,128,.10)}
.brand strong{font-size:15px;font-weight:800;letter-spacing:-.01em}
.brand small{font-size:11px;color:#778397}
.main-nav{gap:22px;font-size:13.5px}
.main-nav>a,.nav-item>button{position:relative;padding:27px 0;font-weight:800}
.main-nav>a:not(.nav-cta):after,.nav-item>button:after{content:"";position:absolute;left:50%;right:50%;bottom:18px;height:2px;background:var(--mtp-pink);border-radius:20px;transition:.18s ease}
.main-nav>a:not(.nav-cta):hover:after,.nav-item>button:hover:after,.nav-item:focus-within>button:after{left:0;right:0}
.nav-cta{min-height:44px!important;padding:0 17px!important;border-radius:9px!important;background:linear-gradient(135deg,var(--mtp-pink),var(--mtp-pink-2))!important;box-shadow:0 10px 24px rgba(237,0,109,.20)!important}
.dropdown{top:66px;border-radius:16px;padding:12px;border:1px solid #e4e9f1;box-shadow:0 25px 70px rgba(6,25,54,.16)}
.dropdown.mega{width:min(680px,90vw);gap:4px}
.dropdown a{padding:11px 12px;border-radius:10px;font-size:13px;transition:.15s ease}
.dropdown a:hover{transform:translateX(2px);background:#fff2f8}
.dropdown b{font-size:13px}
.dropdown small{font-size:11px;line-height:1.4}

/* Generic page system. */
.inner-hero{padding:80px 0 72px;background:radial-gradient(circle at 84% 16%,rgba(237,0,109,.22),transparent 27%),radial-gradient(circle at 70% 78%,rgba(112,61,205,.19),transparent 26%),linear-gradient(120deg,#061936 0%,#0b1f49 55%,#22115f 100%)}
.inner-hero h1{max-width:900px;font-size:clamp(40px,5vw,64px);letter-spacing:-.035em}
.inner-hero p{max-width:820px;font-size:18px;line-height:1.72}
.hero-kicker,.mini-badge,.eyebrow{border:1px solid rgba(237,0,109,.08);font-size:12px;letter-spacing:.055em}
.section{padding:82px 0}
.section-head{margin-bottom:42px}
.section-head h2{margin-bottom:14px}
.grid-3,.grid-2{align-items:stretch}
.card{border-radius:17px;box-shadow:0 9px 28px rgba(8,28,57,.045);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.card:hover{transform:translateY(-3px);border-color:#efc4d7;box-shadow:0 17px 38px rgba(8,28,57,.08)}
.card p{font-size:16px;line-height:1.7}
.btn{min-height:52px;border-radius:10px;font-size:15px;font-weight:850;transition:transform .18s ease,box-shadow .18s ease}
.btn:hover{transform:translateY(-2px)}
.form-shell{border-radius:20px;box-shadow:var(--mtp-shadow)}
.form-field label{font-size:13px}
.form-field input,.form-field select,.form-field textarea{min-height:48px;font-size:15px}
.form-field textarea{min-height:120px}
.blog-grid article{border-radius:17px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.blog-grid article:hover{transform:translateY(-3px);border-color:#efc4d7;box-shadow:0 18px 38px rgba(8,28,57,.08)}
.blog-grid h2{line-height:1.28}
.blog-grid p{font-size:16px;line-height:1.7}
.article-body{font-size:17px;line-height:1.78}
.article-body p,.article-body li{font-size:17px;line-height:1.78}
.article-body h2{scroll-margin-top:120px}
.article-aside .card{box-shadow:0 10px 28px rgba(8,28,57,.06)}
.faq-list summary{font-size:16px}
.faq-list p{font-size:16px;line-height:1.7}

/* Footer restored to the deeper V5 visual finish. */
.final-cta{padding:58px 0;background:linear-gradient(105deg,#ef006f 0%,#8b0a85 48%,#071e4a 100%)}
.final-cta h2{font-size:clamp(28px,3vw,40px)}
.final-cta p{font-size:16px;line-height:1.7}
.site-footer{padding:58px 0 24px;background:radial-gradient(circle at 88% 0%,rgba(108,54,202,.16),transparent 28%),#061936}
.footer-grid{gap:34px}
.site-footer h3{font-size:15px;letter-spacing:.01em}
.site-footer p,.site-footer a{font-size:13.5px;line-height:1.65}
.site-footer a{transition:color .15s ease,transform .15s ease}
.site-footer a:hover{transform:translateX(2px)}
.footer-brand img{width:46px;height:46px}
.footer-bottom{padding-top:20px;font-size:12px}

/* Better mobile and tablet navigation. */
@media(max-width:1060px){
  .main-nav{gap:13px;font-size:13px}
  .footer-grid{grid-template-columns:1.25fr repeat(3,1fr)}
}
@media(max-width:900px){
  body{font-size:16px}
  p{font-size:16px}
  .nav-wrap{min-height:70px}
  .menu-toggle{display:block;flex:0 0 auto}
  .main-nav{top:70px;padding:12px 20px 22px;max-height:calc(100vh - 70px)}
  .main-nav>a,.nav-item>button{padding:13px 0;font-size:15px;text-align:left}
  .main-nav>a:not(.nav-cta):after,.nav-item>button:after{display:none}
  .dropdown,.dropdown.mega{margin-left:0;border-left:2px solid #efc0d5;padding-left:12px}
  .dropdown a{font-size:14px;padding:10px 8px}
  .dropdown small{font-size:12px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .article-body p,.article-body li{font-size:16px}
}
@media(max-width:580px){
  .container{width:min(100% - 28px,var(--container))}
  .topbar>.container{min-height:38px}
  .topbar .container>div{gap:11px;font-size:11px}
  .brand img{width:44px;height:44px}
  .brand strong{font-size:13px}
  .brand small{font-size:10px}
  .inner-hero{padding:58px 0}
  .section{padding:58px 0}
  .footer-grid{grid-template-columns:1fr}
  .site-footer p,.site-footer a{font-size:14px}
}