@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
:root{--primary:#b02a30;--primary-dark:#8f1d22;--primary-light:#d4454b;--orange:#f37022;--orange-light:#f59b56;--navy:#1a3a6b;--cream:#fdf5e6;--tan:#e0b090;--gray-bg:#f4f4f4;--white:#fff;--text-dark:#1a1a2e;--text-gray:#555;--text-light:#888;--gradient:linear-gradient(135deg,var(--primary),var(--orange));--shadow:0 10px 30px rgba(0,0,0,.1);--shadow-lg:0 20px 50px rgba(0,0,0,.15)}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:'Inter',sans-serif;color:var(--text-dark);overflow-x:hidden;line-height:1.6}
.container{max-width:1200px;margin:0 auto;padding:0 24px}
.highlight-text{color:var(--orange)}

/* NAVBAR */
.navbar{position:fixed;top:0;left:0;width:100%;z-index:1000;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);box-shadow:0 2px 20px rgba(0,0,0,.06);transition:all .3s}
.navbar .container{display:flex;align-items:center;justify-content:space-between;height:65px}
.nav-logo{display:flex;align-items:center;gap:10px;font-size:1.4rem;font-weight:800;color:var(--navy);text-decoration:none}
.nav-logo span{color:var(--primary)}
.nav-logo .logo-icon{width:36px;height:36px;background:var(--gradient);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:.9rem}
.nav-links{display:flex;gap:8px;list-style:none;align-items:center}
.nav-links a{text-decoration:none;color:var(--text-dark);font-weight:500;font-size:.82rem;padding:8px 12px;border-radius:8px;transition:all .3s}
.nav-links a:hover{background:var(--cream);color:var(--primary)}
.nav-cta{background:var(--primary)!important;color:#fff!important;padding:10px 24px!important;border-radius:50px!important;font-weight:600!important;transition:all .3s!important}
.nav-cta:hover{background:var(--primary-dark)!important;transform:translateY(-1px)}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none}
.hamburger span{width:24px;height:2.5px;background:var(--text-dark);border-radius:3px;transition:all .3s}
.mobile-menu{display:none;position:fixed;top:65px;left:0;width:100%;background:#fff;padding:20px;box-shadow:var(--shadow);z-index:999}
.mobile-menu.active{display:flex;flex-direction:column;gap:12px}
.mobile-menu a{text-decoration:none;color:var(--text-dark);font-weight:500;padding:10px 0;border-bottom:1px solid #eee}

/* HERO - matches Axis layout exactly */
.hero{min-height:100vh;position:relative;display:flex;align-items:center;padding-top:65px;overflow:hidden;background:#111}
.hero-bg{position:absolute;inset:0;background:linear-gradient(to right,rgba(0,0,0,.85),rgba(0,0,0,.6)),url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="800"><rect fill="%231a1a2e" width="1200" height="800"/><circle cx="900" cy="400" r="300" fill="%238f1d22" opacity="0.15"/><circle cx="200" cy="600" r="200" fill="%23f37022" opacity="0.1"/></svg>');background-size:cover;background-position:center}
.hero .container{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;position:relative;z-index:2;padding-top:40px;padding-bottom:40px}
.hero-content{color:#fff}
.hero-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(243,112,34,.15);border:1px solid rgba(243,112,34,.3);color:var(--orange);padding:6px 18px;border-radius:50px;font-size:.78rem;font-weight:600;margin-bottom:22px}
.hero-content h1{font-size:3.2rem;font-weight:800;line-height:1.15;margin-bottom:18px}
.hero-content h1 .highlight{color:var(--orange);-webkit-text-fill-color:var(--orange)}
.hero-content>p{color:rgba(255,255,255,.7);font-size:.95rem;margin-bottom:28px;max-width:480px;line-height:1.7}
.hero-tags{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:28px;max-width:420px}
.hero-tag{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);padding:10px 16px;border-radius:10px;font-size:.82rem;color:#fff;font-weight:500;backdrop-filter:blur(4px)}
.tag-icon{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.75rem;flex-shrink:0}
.hero-btns{display:flex;gap:12px}
.btn-primary{background:var(--primary);color:#fff;padding:13px 30px;border-radius:8px;font-weight:600;border:none;cursor:pointer;font-size:.9rem;transition:all .3s;font-family:'Inter',sans-serif}
.btn-primary:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 8px 25px rgba(176,42,48,.3)}
.btn-secondary{background:transparent;color:#fff;padding:13px 30px;border-radius:8px;font-weight:600;border:1.5px solid rgba(255,255,255,.3);cursor:pointer;font-size:.9rem;transition:all .3s;font-family:'Inter',sans-serif}
.btn-secondary:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.5)}
/* Hero right side - cards on top, stats below */
.hero-right{display:flex;flex-direction:column;align-items:center;gap:25px}
.hero-visual{display:flex;justify-content:center;align-items:center}
.card-showcase{position:relative;width:360px;height:280px}
.credit-card{width:320px;height:195px;border-radius:16px;padding:22px;position:absolute;color:#fff;box-shadow:0 15px 40px rgba(0,0,0,.35);transition:transform .5s;background:linear-gradient(135deg,#b02a30,#f37022)}
.credit-card.card-back{transform:rotate(-6deg) translate(10px,15px);opacity:.7;background:linear-gradient(135deg,#1a3a6b,#2d5aa0)}
.credit-card.card-front{transform:rotate(3deg);z-index:2}
.card-showcase:hover .card-front{transform:rotate(0) scale(1.03)}
.card-showcase:hover .card-back{transform:rotate(-3deg) translate(10px,20px) scale(.97)}
.card-chip{width:40px;height:30px;background:linear-gradient(135deg,#ffd700,#daa520);border-radius:6px;margin-bottom:18px}
.card-number{font-size:1.1rem;letter-spacing:3px;margin-bottom:12px;font-weight:500}
.card-info{display:flex;justify-content:space-between;align-items:flex-end}
.card-holder{font-size:.65rem;text-transform:uppercase;letter-spacing:1px;opacity:.7}
.card-holder span{display:block;font-size:.82rem;font-weight:600;opacity:1;margin-top:2px}
.card-brand{font-size:1rem;font-weight:800;letter-spacing:1px}
.card-validity{font-size:.65rem;opacity:.7}
.card-validity span{display:block;font-size:.8rem;font-weight:600;opacity:1}
/* Stats row BELOW cards on right side */
.hero-stats{display:flex;gap:12px;width:100%}
.stat-card{flex:1;background:rgba(255,255,255,.1);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.15);border-radius:12px;padding:16px 12px;text-align:center}
.stat-card .stat-number{display:block;font-size:1.5rem;font-weight:800;color:var(--orange)}
.stat-card .stat-label{font-size:.7rem;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.5px}

/* COMMON SECTION */
.section{padding:80px 0}
.section-badge{display:inline-block;background:var(--cream);color:var(--primary);padding:6px 18px;border-radius:50px;font-size:.75rem;font-weight:600;margin-bottom:14px;letter-spacing:.5px;text-transform:uppercase}
.section h2{font-size:2.1rem;font-weight:800;margin-bottom:14px;line-height:1.25}

/* SECTION 2: REWARDS - 2 column layout */
.rewards{background:#fff}
.rewards-layout{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
.rewards-left p{color:var(--text-gray);margin-bottom:20px;line-height:1.7;font-size:.92rem}
.rewards-stats{display:flex;gap:12px;margin-bottom:10px}
.reward-stat-card{background:var(--gray-bg);padding:18px 20px;border-radius:14px;flex:1}
.reward-stat-num{display:block;font-size:1.6rem;font-weight:800;color:var(--primary)}
.reward-stat-label{font-size:.75rem;color:var(--text-gray)}
.rewards-visual{display:flex;flex-direction:column;gap:16px}
.reward-card-item{background:var(--gray-bg);border-radius:16px;padding:22px;display:flex;align-items:center;gap:16px;transition:all .3s;border:1px solid transparent}
.reward-card-item:hover{border-color:var(--primary-light);transform:translateX(5px);box-shadow:var(--shadow)}
.reward-icon{width:50px;height:50px;border-radius:12px;background:var(--cream);display:flex;align-items:center;justify-content:center;font-size:1.4rem;flex-shrink:0}
.reward-card-item h3{font-size:.95rem;font-weight:700;margin-bottom:2px}
.reward-card-item p{color:var(--text-gray);font-size:.82rem;margin:0}

/* SECTION 3: WRONG CHARGE - image left, content right */
.wrong-charge{background:var(--gray-bg)}
.wc-layout{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.wc-image-box{display:flex;justify-content:center}
.wc-image-box .icon-box{width:260px;height:260px;background:var(--gradient);border-radius:28px;display:flex;align-items:center;justify-content:center;font-size:5rem;color:#fff;box-shadow:0 20px 50px rgba(176,42,48,.25);position:relative}
.wc-image-box .icon-box::after{content:'';position:absolute;inset:-12px;border-radius:36px;border:2px dashed rgba(176,42,48,.2)}
.wc-right p{color:var(--text-gray);font-size:.92rem;margin-bottom:18px;line-height:1.7}
.wc-checklist{display:flex;flex-direction:column;gap:14px}
.wc-check-item{display:flex;gap:14px;align-items:flex-start;background:#fff;padding:16px;border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.wc-check-icon{width:28px;height:28px;border-radius:50%;background:var(--cream);color:var(--primary);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.8rem;flex-shrink:0;margin-top:2px}
.wc-check-item strong{font-size:.88rem;display:block;margin-bottom:2px}
.wc-check-item p{color:var(--text-gray);font-size:.8rem;margin:0}

/* SECTION 4: APPLY - dark bg, content left, card right */
.apply-section{background:linear-gradient(135deg,#1a0a0b,#3d1012,#8f1d22);color:#fff;overflow:hidden;position:relative}
.apply-section::before{content:'';position:absolute;top:-200px;right:-200px;width:500px;height:500px;background:radial-gradient(circle,rgba(243,112,34,.12),transparent 70%);border-radius:50%}
.apply-layout{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;position:relative;z-index:2}
.apply-left p{color:rgba(255,255,255,.7);font-size:.92rem;margin-bottom:20px;line-height:1.7}
.apply-steps-flow{display:flex;align-items:center;gap:12px;margin-top:5px}
.flow-step{text-align:center}
.flow-icon{width:50px;height:50px;border-radius:14px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin:0 auto 6px}
.flow-text{font-size:.75rem;color:rgba(255,255,255,.7);font-weight:500}
.flow-arrow{color:rgba(255,255,255,.3);font-size:1.3rem;font-weight:300}
.apply-right{display:flex;justify-content:center}
.apply-card-visual{position:relative}
.apply-card-visual .credit-card{position:relative;box-shadow:0 25px 60px rgba(0,0,0,.5)}

/* SECTION 5: LIMIT - gauge left, content right */
.limit-section{background:#fff}
.limit-layout{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.limit-left{display:flex;justify-content:center}
.limit-gauge{width:240px;height:240px;border-radius:50%;background:var(--cream);display:flex;align-items:center;justify-content:center;font-size:5rem;position:relative}
.limit-gauge::after{content:'';position:absolute;inset:-10px;border-radius:50%;border:2px solid var(--primary-light);opacity:.3}
.limit-right p{color:var(--text-gray);font-size:.92rem;margin-bottom:18px;line-height:1.7}
.limit-stat-cards{display:flex;gap:12px;margin-bottom:18px}
.limit-stat-card{background:var(--gray-bg);padding:16px 18px;border-radius:12px;flex:1}
.limit-stat-num{display:block;font-size:1.3rem;font-weight:800;color:var(--primary)}
.limit-stat-label{font-size:.72rem;color:var(--text-gray)}
.limit-list{list-style:none;display:flex;flex-direction:column;gap:8px}
.limit-list li{color:var(--text-gray);font-size:.85rem}

/* SECTION 6: BLOCK - content left, visual right */
.block-section{background:var(--gray-bg)}
.block-layout{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.block-left h2{margin-bottom:18px}
.block-cards-stack{display:flex;flex-direction:column;gap:12px}
.block-card-item{display:flex;gap:14px;align-items:center;background:#fff;padding:16px 18px;border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,.04);transition:all .3s}
.block-card-item:hover{transform:translateX(5px);box-shadow:var(--shadow)}
.block-card-icon{width:42px;height:42px;border-radius:10px;background:var(--cream);display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0}
.block-card-item strong{font-size:.88rem;display:block;margin-bottom:2px}
.block-card-item p{color:var(--text-gray);font-size:.8rem;margin:0}
.block-right{display:flex;justify-content:center}
.block-visual{display:flex;justify-content:center}
.block-icon-box{width:250px;height:250px;border-radius:28px;background:linear-gradient(135deg,#dc2626,#991b1b);display:flex;align-items:center;justify-content:center;font-size:5rem;color:#fff;box-shadow:0 20px 50px rgba(220,38,38,.25)}

/* SECTION 7: ABOUT */
.about-section{background:#fff}
.about-layout{display:grid;grid-template-columns:1.2fr 0.8fr;gap:50px;align-items:center}
.about-left p{color:var(--text-gray);font-size:.92rem;margin-bottom:18px;line-height:1.7}
.about-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:10px}
.about-stat-item{background:var(--gray-bg);padding:18px;border-radius:12px;text-align:center}
.about-stat-num{display:block;font-size:1.4rem;font-weight:800;color:var(--primary)}
.about-stat-label{font-size:.72rem;color:var(--text-gray)}
.about-right{display:flex;justify-content:center}
.about-visual{width:250px;height:250px;border-radius:50%;background:var(--gradient);display:flex;align-items:center;justify-content:center;font-size:5rem;color:#fff;box-shadow:0 20px 50px rgba(176,42,48,.25)}

/* SECTION 8: REVIEWS */
.reviews-section{background:var(--gray-bg)}
.section-header{text-align:center;margin-bottom:45px}
.section-header h2{font-size:2.1rem;font-weight:800;margin-bottom:10px}
.section-header p{color:var(--text-gray);font-size:.95rem;max-width:500px;margin:0 auto}
.reviews-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.review-card{background:#fff;border-radius:16px;padding:28px;position:relative;border:1px solid rgba(0,0,0,.04)}
.review-card::before{content:'"';position:absolute;top:12px;right:22px;font-size:3.5rem;color:var(--primary);opacity:.12;font-family:serif;line-height:1}
.review-stars{color:var(--orange);font-size:.85rem;margin-bottom:10px;letter-spacing:2px}
.review-card p{color:var(--text-gray);font-size:.85rem;line-height:1.7;margin-bottom:16px}
.review-author{display:flex;align-items:center;gap:10px}
.review-avatar{width:38px;height:38px;border-radius:50%;background:var(--gradient);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.8rem}
.review-name{font-weight:600;font-size:.85rem}
.review-date{font-size:.7rem;color:var(--text-light)}
.review-badge{text-align:center;margin-top:30px}
.review-badge-stars{color:var(--orange);font-size:1.1rem;letter-spacing:2px}
.review-badge-text{display:block;color:var(--text-gray);font-size:.85rem;margin-top:5px}

/* FOOTER */
.footer{background:linear-gradient(135deg,#1a0a0b,#2d1012);color:rgba(255,255,255,.8);padding:50px 0 25px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;margin-bottom:35px}
.footer-brand h3{font-size:1.2rem;font-weight:800;color:#fff;margin-bottom:10px}
.footer-brand p{font-size:.82rem;line-height:1.7;opacity:.6}
.footer-links h4{font-size:.88rem;font-weight:700;color:#fff;margin-bottom:14px}
.footer-links ul{list-style:none}
.footer-links li{margin-bottom:8px}
.footer-links a{text-decoration:none;color:rgba(255,255,255,.5);font-size:.82rem;transition:color .3s}
.footer-links a:hover{color:var(--orange)}
.footer-security{text-align:center;margin-bottom:20px;display:flex;justify-content:center;gap:20px;font-size:.8rem;color:rgba(255,255,255,.6)}
.footer-security span{display:flex;align-items:center;gap:5px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:20px;text-align:center;font-size:.75rem;opacity:.5}

/* MODAL */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:2000;justify-content:center;align-items:center;backdrop-filter:blur(5px)}
.modal-overlay.active{display:flex}
.modal{background:#fff;border-radius:20px;width:92%;max-width:520px;max-height:92vh;overflow-y:auto;box-shadow:0 25px 80px rgba(0,0,0,.3)}
.modal-header{background:var(--gradient);padding:22px 28px;border-radius:20px 20px 0 0;color:#fff;display:flex;justify-content:space-between;align-items:center}
.modal-header h3{font-size:1.1rem;font-weight:700}
.modal-close{background:rgba(255,255,255,.2);border:none;color:#fff;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center}
.modal-close:hover{background:rgba(255,255,255,.3)}
.modal-body{padding:25px 28px}
.step-indicators{display:flex;justify-content:center;gap:6px;margin-bottom:22px}
.step-dot{width:10px;height:10px;border-radius:50%;background:#ddd;transition:all .3s}
.step-dot.active{background:var(--primary);width:28px;border-radius:5px}
.form-step{display:none}.form-step.active{display:block}
.form-group{margin-bottom:14px}
.form-group label{display:block;font-size:.8rem;font-weight:600;margin-bottom:5px}
.form-group input,.form-group select{width:100%;padding:11px 14px;border:1.5px solid #e5e5e5;border-radius:10px;font-size:.85rem;font-family:'Inter',sans-serif;transition:border-color .3s;outline:none}
.form-group input:focus,.form-group select:focus{border-color:var(--primary)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-btn{width:100%;padding:12px;background:var(--gradient);color:#fff;border:none;border-radius:10px;font-size:.92rem;font-weight:600;cursor:pointer;transition:all .3s;font-family:'Inter',sans-serif;margin-top:8px}
.form-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(176,42,48,.3)}
.form-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.form-btn-outline{background:none;color:var(--primary);border:1.5px solid var(--primary)}
.form-btn-outline:hover{background:var(--cream)}
.otp-inputs{display:flex;gap:8px;justify-content:center;margin:18px 0}
.otp-input{width:44px;height:50px;border:1.5px solid #e5e5e5;border-radius:10px;text-align:center;font-size:1.2rem;font-weight:700;font-family:'Inter',sans-serif;outline:none}
.otp-input:focus{border-color:var(--primary)}
.success-msg{display:none;text-align:center;padding:35px 20px}
.success-msg.active{display:block}
.success-icon{width:60px;height:60px;border-radius:50%;background:#dcfce7;color:#16a34a;display:flex;align-items:center;justify-content:center;font-size:1.8rem;margin:0 auto 12px}
.success-msg h3{font-size:1.2rem;font-weight:700;margin-bottom:6px}
.success-msg p{color:var(--text-gray);font-size:.85rem}
.error-text{color:#ef4444;font-size:.72rem;margin-top:3px;display:none}

/* FLOATING BTN */
.floating-btn{position:fixed;bottom:22px;right:22px;z-index:900;background:var(--primary);color:#fff;padding:12px 24px;border-radius:50px;border:none;cursor:pointer;font-weight:600;font-size:.88rem;box-shadow:0 8px 25px rgba(176,42,48,.35);transition:all .3s;display:flex;align-items:center;gap:8px;font-family:'Inter',sans-serif}
.floating-btn:hover{transform:translateY(-2px);box-shadow:0 12px 35px rgba(176,42,48,.5)}
.floating-btn .pulse-ring{position:absolute;inset:-4px;border-radius:50px;border:2px solid var(--primary);animation:pulse-ring 2s infinite}
@keyframes pulse-ring{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.3)}}

/* ANIMATIONS */
.fade-up{opacity:0;transform:translateY(25px);transition:opacity .6s,transform .6s}
.fade-up.visible{opacity:1;transform:translateY(0)}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.float-anim{animation:float 4s ease-in-out infinite}

/* DROPDOWN MENU */
.dropdown {
  position: relative;
}
.dropdown-toggle {
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
}
.dropdown-toggle .arrow {
  font-size: 0.6rem;
  transition: transform 0.3s;
}
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(10px);
  background: #ffffff;
  min-width: 240px;
  border-radius: 12px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
  padding: 8px 0;
  list-style: none;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 1001;
  border: 1px solid rgba(0, 0, 0, 0.05);
}
.dropdown:hover .dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}
.dropdown:hover .dropdown-toggle .arrow {
  transform: rotate(180deg);
}
.dropdown-menu li {
  width: 100%;
}
.dropdown-menu a {
  display: block !important;
  padding: 10px 20px !important;
  font-size: 0.82rem !important;
  color: var(--text-dark) !important;
  border-radius: 0 !important;
  transition: all 0.2s !important;
  text-align: left !important;
  background: none !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.03) !important;
}
.dropdown-menu li:last-child a {
  border-bottom: none !important;
}
.dropdown-menu a:hover {
  background: var(--cream) !important;
  color: var(--primary) !important;
  padding-left: 24px !important;
}

/* RESPONSIVE */
@media(max-width:1024px){
.hero .container{grid-template-columns:1fr;text-align:center}
.hero-content h1{font-size:2.4rem}
.hero-content>p{margin:0 auto 28px}
.hero-tags{max-width:100%;justify-items:center}
.hero-btns{justify-content:center}
.hero-right{margin-top:30px}
.hero-stats{justify-content:center}
.rewards-layout,.wc-layout,.apply-layout,.limit-layout,.block-layout,.about-layout{grid-template-columns:1fr}
.reviews-grid{grid-template-columns:1fr 1fr}
.footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
.nav-links{display:none}.hamburger{display:flex}
.hero-content h1{font-size:1.9rem}
.hero-tags{grid-template-columns:1fr}
.card-showcase{width:280px;height:230px}
.credit-card{width:260px;height:160px;padding:18px}
.section{padding:55px 0}
.reviews-grid{grid-template-columns:1fr}
.footer-grid{grid-template-columns:1fr}
.form-row{grid-template-columns:1fr}
.wc-left,.limit-left,.block-right,.about-right,.apply-right{display:none}
}

/* CUSTOM OTP STYLES TO MATCH SCREENSHOT */
.custom-otp-input {
  width: 100% !important;
  height: 58px !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 12px !important;
  text-align: center !important;
  font-size: 1.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.6rem !important;
  color: #2d3748 !important;
  background: #fff !important;
  transition: all 0.25s ease !important;
  outline: none !important;
  padding: 10px 14px !important;
}
.custom-otp-input::placeholder {
  color: #cbd5e0 !important;
  letter-spacing: 0.6rem !important;
  font-weight: 400 !important;
}
.custom-otp-input:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(176, 42, 48, 0.1) !important;
}
.custom-otp-input.error {
  border-color: #ef4444 !important;
  background-color: rgba(239, 68, 68, 0.02) !important;
}
.resend-container {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  margin: 18px 0 !important;
  font-size: 0.95rem !important;
}
.resend-link {
  color: var(--primary) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: color 0.2s ease !important;
}
.resend-link:hover {
  color: var(--primary-dark) !important;
  text-decoration: underline !important;
}
.resend-timer {
  color: var(--text-gray) !important;
  font-weight: 500 !important;
}
.custom-back-btn {
  background: #ffffff !important;
  color: #2d3748 !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  box-shadow: none !important;
  transition: all 0.25s ease !important;
}
.custom-back-btn:hover {
  background: #f7fafc !important;
  border-color: #cbd5e0 !important;
  transform: translateY(-1px) !important;
}
.custom-verify-btn {
  background: var(--primary) !important;
  background-image: none !important; /* overrides gradients to keep color solid and clean */
  color: #ffffff !important;
  border: none !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 4px 12px rgba(176, 42, 48, 0.15) !important;
}
.custom-verify-btn:hover {
  background: var(--primary-dark) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(176, 42, 48, 0.25) !important;
}