
.logo img {
    width: 220px;
}

.dbt-feature-sec{
background:#05070d;
overflow:hidden;
padding:90px 0;
}

.dbt-feature-badge{

display:inline-block;

padding:10px 22px;

border-radius:50px;

background:rgba(223,255,0,.08);

border:1px solid rgba(223,255,0,.25);

color:#dfff00;

font-weight:600;

font-size:14px;

letter-spacing:.5px;

}

.dbt-feature-title{

color:#fff;

font-size:52px;

font-weight:800;

margin-bottom:18px;

}

.dbt-feature-title span{

background:linear-gradient(90deg,#dfff00,#02b452);

-webkit-background-clip:text;

-webkit-text-fill-color:transparent;

}

.dbt-feature-subtitle{

max-width:760px;

margin:auto;

font-size:18px;

line-height:30px;

color:#fff;

}

.dbt-feature-card{

height:100%;

padding:40px 30px;

border-radius:22px;

background:#11151d;

border:1px solid rgba(255,255,255,.05);

transition:.4s;

position:relative;

overflow:hidden;

}

.dbt-feature-card:before{

content:"";

position:absolute;

top:0;

left:0;

width:100%;

height:4px;

background:linear-gradient(90deg,#dfff00,#02b452);

transform:scaleX(0);

transition:.4s;

}

.dbt-feature-card:hover{

transform:translateY(-12px);

border-color:#02b452;

box-shadow:0 25px 60px rgba(2,180,82,.22);

}

.dbt-feature-card:hover:before{

transform:scaleX(1);

}

.dbt-icon-box{

width:78px;

height:78px;

border-radius:22px;

display:flex;

align-items:center;

justify-content:center;

background:linear-gradient(135deg,#dfff00,#02b452);

margin-bottom:28px;

}

.dbt-feature-card h4{

font-size:24px;

font-weight:700;

color:#fff;

margin-bottom:15px;

}

.dbt-feature-card p{

font-size:16px;

line-height:29px;

color:#fff;

margin:0;

}

@media(max-width:991px){

.dbt-feature-title{

font-size:38px;

}

}

@media(max-width:767px){

.dbt-feature-sec{

padding:70px 0;

}

.dbt-feature-title{

font-size:30px;

}

.dbt-feature-subtitle{

font-size:16px;

line-height:28px;

}

.dbt-feature-card{

padding:30px 24px;

}

}


/*==========================
    DREAMS BOAT ABOUT CSS
===========================*/

.dbt-about-section{
    background:
        radial-gradient(circle at top left,rgba(2,180,82,.12),transparent 35%),
        radial-gradient(circle at bottom right,rgba(223,255,0,.08),transparent 30%),
        #070b12;
    position:relative;
    overflow:hidden;
    padding:100px 0;
}

.dbt-about-section::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
    linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
    background-size:60px 60px;
    pointer-events:none;
    opacity:.45;
}

/*=====================
BADGE
======================*/

.dbt-about-badge{

display:inline-flex;

align-items:center;

gap:10px;

padding:12px 24px;

border-radius:50px;

background:rgba(223,255,0,.08);

border:1px solid rgba(223,255,0,.25);

color:#dfff00;

font-size:14px;

font-weight:700;

letter-spacing:.4px;

margin-bottom:28px;

}

.dbt-about-badge svg{

color:#02b452;

}


/*=====================
TITLE
======================*/

.dbt-about-title{

font-size:54px;

font-weight:800;

color:#fff;

line-height:1.15;

margin-bottom:22px;

}

.dbt-about-title span{

display:block;

background:linear-gradient(90deg,#dfff00,#02b452);

-webkit-background-clip:text;

-webkit-text-fill-color:transparent;

}

.dbt-about-desc{

max-width:860px;

margin:auto;

font-size:18px;

line-height:32px;

color:#fff;

}


/*======================
LEFT CONTENT
=======================*/

.dbt-about-left h3{

font-size:40px;

font-weight:800;

color:#fff;

margin-bottom:18px;

}

.dbt-about-left p{

font-size:17px;

line-height:32px;

color:#fff;

margin-bottom:40px;

}


/*=====================
FEATURES
======================*/

.dbt-feature-list{

display:flex;

flex-direction:column;

gap:20px;

}

.dbt-feature-item{

display:flex;

align-items:flex-start;

gap:20px;

padding:22px;

border-radius:18px;

background:#10151d;

border:1px solid rgba(255,255,255,.06);

transition:.35s;

position:relative;

overflow:hidden;

}

.dbt-feature-item::before{

content:"";

position:absolute;

left:0;

top:0;

width:5px;

height:100%;

background:linear-gradient(#dfff00,#02b452);

transform:scaleY(0);

transition:.35s;

}

.dbt-feature-item:hover{

transform:translateY(-8px);

border-color:#02b452;

box-shadow:0 20px 45px rgba(2,180,82,.18);

}

.dbt-feature-item:hover::before{

transform:scaleY(1);

}

.dbt-feature-icon{

width:68px;

height:68px;

min-width:68px;

border-radius:18px;

display:flex;

align-items:center;

justify-content:center;

background:linear-gradient(135deg,#dfff00,#02b452);

}

.dbt-feature-icon svg{

width:32px;

height:32px;

stroke:#fff;

fill:none;

stroke-width:2;

}

.dbt-feature-item h5{

font-size:22px;

font-weight:700;

color:#fff;

margin-bottom:8px;

}

.dbt-feature-item span{

display:block;

font-size:15px;

line-height:28px;

color:#fff;

}


/*=====================
BUTTONS
======================*/

.dbt-about-btns{

display:flex;

gap:18px;

margin-top:45px;

flex-wrap:wrap;

}

.dbt-btn-primary{

display:inline-flex;

align-items:center;

justify-content:center;

padding:16px 36px;

border-radius:50px;

background:linear-gradient(90deg,#dfff00,#02b452);

font-size:16px;

font-weight:700;

text-decoration:none;

color:#071018;

transition:.35s;

}

.dbt-btn-primary:hover{

transform:translateY(-5px);

box-shadow:0 20px 45px rgba(2,180,82,.35);

color:#071018;

}

.dbt-btn-outline{

display:inline-flex;

align-items:center;

justify-content:center;

padding:16px 34px;

border-radius:50px;

border:1px solid rgba(255,255,255,.12);

background:#10151d;

color:#fff;

text-decoration:none;

font-weight:600;

transition:.35s;

}

.dbt-btn-outline:hover{

background:#02b452;

border-color:#02b452;

color:#fff;

transform:translateY(-5px);

}


/*=====================
DASHBOARD
======================*/

.dbt-dashboard-wrap{

position:relative;

}

.dbt-dashboard-card{

padding:35px;

border-radius:26px;

background:rgba(16,21,29,.95);

border:1px solid rgba(255,255,255,.06);

box-shadow:0 30px 80px rgba(0,0,0,.45);

backdrop-filter:blur(16px);

position:relative;

z-index:2;

}

.dbt-dashboard-head{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:30px;

}

.dbt-dashboard-head h4{

font-size:28px;

font-weight:700;

color:#fff;

margin:0;

}

.dbt-dashboard-head span{

padding:8px 14px;

border-radius:30px;

background:rgba(2,180,82,.15);

color:#02b452;

font-size:13px;

font-weight:700;

}

.dbt-dashboard-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:18px;

margin-bottom:30px;

}

.dbt-dashboard-box{

padding:22px;

border-radius:18px;

background:#141b26;

border:1px solid rgba(255,255,255,.05);

}

.dbt-dashboard-box small{

display:block;

font-size:13px;

color:#fff;

margin-bottom:10px;

}

.dbt-dashboard-box strong{

font-size:28px;

color:#dfff00;

font-weight:800;

}

.dbt-chart-area{

height:220px;

border-radius:18px;

background:#0d1219;

border:1px solid rgba(255,255,255,.05);

}


/*=====================
FLOATING CARDS
======================*/

.dbt-floating-card{

position:absolute;

padding:18px 22px;

border-radius:18px;

background:#111821;

border:1px solid rgba(255,255,255,.06);

box-shadow:0 15px 35px rgba(0,0,0,.45);

z-index:5;

animation:dbtFloat 4s ease-in-out infinite;

}

.dbt-floating-card h6{

color:#fff;

font-size:16px;

margin-bottom:6px;

font-weight:700;

}

.dbt-floating-card span{

font-size:13px;

color:#fff;

}

.dbt-float-one{

top:-35px;

right:-20px;

}

.dbt-float-two{

bottom:60px;

left:-35px;

animation-delay:1.2s;

}

.dbt-float-three{

bottom:-28px;

right:40px;

animation-delay:2s;

}

@keyframes dbtFloat{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-12px);

}

}


/*=====================
COUNTERS
======================*/

.dbt-counter-card{

padding:40px 20px;

border-radius:22px;

text-align:center;

background:#10151d;

border:1px solid rgba(255,255,255,.06);

transition:.35s;

height:100%;

}

.dbt-counter-card:hover{

transform:translateY(-10px);

box-shadow:0 20px 45px rgba(2,180,82,.18);

border-color:#02b452;

}

.dbt-counter-card h2{

font-size:52px;

font-weight:800;

margin-bottom:10px;

background:linear-gradient(90deg,#dfff00,#02b452);

-webkit-background-clip:text;

-webkit-text-fill-color:transparent;

}

.dbt-counter-card p{

margin:0;

font-size:16px;

color:#fff;

}


/*=========================================
    PART 4
    Dashboard + Animation + Responsive
=========================================*/


/*=========================
CHART
==========================*/

.dbt-chart-area{
    position:relative;
    overflow:hidden;
}

.dbt-chart-svg{
    width:100%;
    height:100%;
}

.dbt-chart-svg line{
    stroke:rgba(255,255,255,.06);
    stroke-width:1;
}

.dbt-line{
    fill:none;
    stroke:#dfff00;
    stroke-width:4;
    stroke-linecap:round;
    stroke-linejoin:round;
    stroke-dasharray:900;
    stroke-dashoffset:900;
    animation:dbtChartLine 3s ease forwards;
}

.dbt-area{
    fill:url(#dbtGradient);
    opacity:.45;
}

.dbt-chart-svg circle{
    fill:#02b452;
    stroke:#ffffff;
    stroke-width:3;
    animation:dbtPulse 2s infinite;
}


/*=========================
STATUS BAR
==========================*/

.dbt-dashboard-status{

display:flex;

justify-content:space-between;

align-items:center;

margin-top:25px;

padding-top:20px;

border-top:1px solid rgba(255,255,255,.08);

color:#fff;

font-weight:600;

}

.dbt-dashboard-status div{

display:flex;

align-items:center;

gap:10px;

}

.dbt-dot{

width:10px;

height:10px;

border-radius:50%;

background:#02b452;

box-shadow:0 0 15px #02b452;

animation:dbtBlink 1.4s infinite;

}


/*=========================
GLOW EFFECT
==========================*/

.dbt-glow-one{

position:absolute;

width:320px;

height:320px;

background:#02b452;

filter:blur(130px);

opacity:.18;

top:-60px;

right:-80px;

z-index:0;

}

.dbt-glow-two{

position:absolute;

width:250px;

height:250px;

background:#dfff00;

filter:blur(120px);

opacity:.10;

bottom:-50px;

left:-50px;

z-index:0;

}


/*=========================
FLOATING CARD ICON
==========================*/

.dbt-floating-card{

display:flex;

align-items:center;

gap:14px;

}

.dbt-floating-card i{

width:48px;

height:48px;

border-radius:14px;

display:flex;

align-items:center;

justify-content:center;

background:linear-gradient(135deg,#dfff00,#02b452);

font-style:normal;

font-size:20px;

color:#071018;

flex-shrink:0;

}

.dbt-floating-card h6{

margin:0 0 4px;

}

.dbt-floating-card span{

display:block;

}


/*=========================
BUTTON RIPPLE
==========================*/

.dbt-btn-primary{

position:relative;

overflow:hidden;

}

.dbt-btn-primary:before{

content:"";

position:absolute;

width:0;

height:0;

left:50%;

top:50%;

background:rgba(255,255,255,.25);

border-radius:100%;

transform:translate(-50%,-50%);

transition:.6s;

}

.dbt-btn-primary:hover:before{

width:340px;

height:340px;

}


/*=========================
COUNTER HOVER
==========================*/

.dbt-counter-card{

position:relative;

overflow:hidden;

}

.dbt-counter-card:before{

content:"";

position:absolute;

top:-100%;

left:-100%;

width:250%;

height:250%;

background:linear-gradient(45deg,
transparent,
rgba(223,255,0,.08),
transparent);

transform:rotate(25deg);

transition:.8s;

}

.dbt-counter-card:hover:before{

left:100%;

top:100%;

}


/*=========================
FEATURE ICON ROTATE
==========================*/

.dbt-feature-item:hover .dbt-feature-icon{

transform:rotate(-8deg) scale(1.08);

}

.dbt-feature-icon{

transition:.35s;

}


/*=========================
ANIMATIONS
==========================*/

@keyframes dbtChartLine{

to{

stroke-dashoffset:0;

}

}

@keyframes dbtPulse{

0%,100%{

transform:scale(1);

}

50%{

transform:scale(1.25);

}

}

@keyframes dbtBlink{

0%,100%{

opacity:1;

}

50%{

opacity:.35;

}

}


/*=========================
RESPONSIVE
==========================*/

@media (max-width:1199px){

.dbt-about-title{

font-size:46px;

}

.dbt-about-left h3{

font-size:34px;

}

.dbt-dashboard-card{

padding:28px;

}

}


@media (max-width:991px){

.dbt-about-section{

padding:80px 0;

}

.dbt-about-title{

font-size:38px;

}

.dbt-about-desc{

font-size:16px;

line-height:30px;

}

.dbt-about-left{

margin-bottom:35px;

}

.dbt-floating-card{

position:relative;

left:auto;

right:auto;

top:auto;

bottom:auto;

margin-top:20px;

animation:none;

}

.dbt-dashboard-wrap{

display:flex;

flex-direction:column;

gap:20px;

}

.dbt-dashboard-grid{

grid-template-columns:repeat(2,1fr);

}

.dbt-glow-one,

.dbt-glow-two{

display:none;

}

}


@media (max-width:767px){

.dbt-about-section{

padding:60px 0;

}

.dbt-about-badge{

font-size:12px;

padding:10px 18px;

}

.dbt-about-title{

font-size:30px;

line-height:1.25;

}

.dbt-about-left h3{

font-size:26px;

}

.dbt-about-left p{

font-size:15px;

line-height:28px;

}

.dbt-feature-item{

padding:18px;

gap:15px;

}

.dbt-feature-icon{

width:56px;

height:56px;

min-width:56px;

}

.dbt-feature-item h5{

font-size:18px;

}

.dbt-feature-item span{

font-size:14px;

line-height:24px;

}

.dbt-dashboard-head{

flex-direction:column;

align-items:flex-start;

gap:12px;

}

.dbt-dashboard-grid{

grid-template-columns:1fr;

}

.dbt-dashboard-box{

padding:18px;

}

.dbt-dashboard-box strong{

font-size:24px;

}

.dbt-chart-area{

height:180px;

}

.dbt-dashboard-status{

flex-direction:column;

align-items:flex-start;

gap:12px;

}

.dbt-about-btns{

flex-direction:column;

}

.dbt-btn-primary,

.dbt-btn-outline{

width:100%;

justify-content:center;

}

.dbt-counter-card{

padding:30px 20px;

}

.dbt-counter-card h2{

font-size:38px;

}

}


@media (max-width:480px){

.dbt-about-title{

font-size:26px;

}

.dbt-dashboard-card{

padding:20px;

border-radius:18px;

}

.dbt-chart-area{

height:160px;

}

.dbt-floating-card{

padding:15px;

}

.dbt-floating-card i{

width:42px;

height:42px;

font-size:18px;

}

}


/* =========================================
   DREAMS BOAT - TRADING MODES
========================================= */

.dbt-trading-modes {
    position: relative;
    padding: 100px 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 15% 25%, rgb(0 0 0 / 10%), transparent 28%), radial-gradient(circle at 85% 70%, rgb(0 0 0 / 7%), transparent 25%), #000000;
}

.dbt-trading-modes::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .35;
    background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 60px 60px;
}


/* Badge */

.dbt-modes-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 17px;
    border: 1px solid rgba(223,255,0,.35);
    border-radius: 50px;
    background: rgba(223,255,0,.06);
    color: #dfff00;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
}

.dbt-modes-badge-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #dfff00;
    box-shadow: 0 0 12px #dfff00;
}


/* Heading */

.dbt-modes-title {
    margin: 25px 0 18px;
    color: #fff;
    font-size: 48px;
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -1.5px;
}

.dbt-modes-title span {
    display: block;
    background: linear-gradient(
        90deg,
        #dfff00,
        #02b452
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.dbt-modes-description {
    max-width: 760px;
    margin: 0 auto;
    color: #fff;
    font-size: 16px;
    line-height: 29px;
}


/* Cards Row */

.dbt-modes-row {
    position: relative;
    z-index: 2;
    margin-top: 55px;
}


/* Main Card */

.dbt-mode-card {
    height: 100%;
    position: relative;
    overflow: hidden;
    padding: 38px;
    border-radius: 24px;
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.055),
            rgba(255,255,255,.018)
        );
    border: 1px solid rgba(255,255,255,.09);
    transition:
        transform .4s ease,
        border-color .4s ease,
        box-shadow .4s ease;
}

.dbt-mode-card::before {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    top: -130px;
    right: -100px;
    border-radius: 50%;
    background: #02b452;
    filter: blur(100px);
    opacity: .10;
    transition: .5s ease;
}

.dbt-mode-card:hover {
    transform: translateY(-10px);
    border-color: rgba(2,180,82,.45);
    box-shadow:
        0 30px 70px rgba(0,0,0,.35),
        0 0 50px rgba(2,180,82,.08);
}

.dbt-mode-card:hover::before {
    opacity: .20;
}


/* Featured Card */

.dbt-mode-card-featured {
    border-color: rgba(223,255,0,.45);
    background:
        linear-gradient(
            145deg,
            rgba(223,255,0,.055),
            rgba(2,180,82,.025) 45%,
            rgba(255,255,255,.018)
        );
}

.dbt-mode-card-featured::after {
    content: "RECOMMENDED";
    position: absolute;
    top: 20px;
    right: -36px;
    padding: 6px 45px;
    transform: rotate(45deg);
    background: linear-gradient(90deg,#dfff00,#02b452);
    color: #06100a;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .8px;
}


/* Top */

.dbt-mode-card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.dbt-mode-label {
    display: inline-block;
    padding: 8px 13px;
    border-radius: 50px;
    background: rgba(223,255,0,.09);
    color: #dfff00;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .8px;
}

.dbt-mode-number {
    color: rgba(255,255,255,.18);
    font-size: 42px;
    line-height: 1;
    font-weight: 800;
}


/* Icon */

.dbt-mode-icon {
    width: 76px;
    height: 76px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 28px;
    border-radius: 20px;
    color: #dfff00;
    background: rgba(223,255,0,.035);
    border: 1px solid rgba(223,255,0,.25);
    transition: .4s ease;
}

.dbt-mode-icon svg {
    width: 42px;
    height: 42px;
}

.dbt-mode-card:hover .dbt-mode-icon {
    transform: rotate(-5deg) scale(1.08);
    background: linear-gradient(
        135deg,
        rgba(223,255,0,.15),
        rgba(2,180,82,.12)
    );
    box-shadow: 0 0 30px rgba(223,255,0,.10);
}


/* Card Heading */

.dbt-mode-title {
    margin-bottom: 14px;
    color: #fff;
    font-size: 28px;
    line-height: 1.25;
    font-weight: 750;
}

.dbt-mode-text {
    max-width: 560px;
    margin-bottom: 25px;
    color: #fff;
    font-size: 15px;
    line-height: 28px;
}


/* Features */

.dbt-mode-features {
    list-style: none;
    margin: 0 0 30px;
    padding: 0;
}

.dbt-mode-features li {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 15px;
    color: #e2e6eb;
    font-size: 14px;
}

.dbt-check-icon {
    width: 20px;
    height: 20px;
    min-width: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(223,255,0,.09);
    color: #dfff00;
}

.dbt-check-icon svg {
    width: 12px;
    height: 12px;
}


/* Button */

.dbt-mode-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 13px 18px 13px 21px;
    border-radius: 50px;
    background: linear-gradient(
        90deg,
        #dfff00,
        #02b452
    );
    color: #07100a;
    text-decoration: none;
    font-size: 13px;
    font-weight: 800;
    transition: .35s ease;
}

.dbt-mode-btn:hover {
    color: #07100a;
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(2,180,82,.25);
}

.dbt-mode-btn span {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(0,0,0,.15);
}

.dbt-mode-btn svg {
    width: 15px;
    height: 15px;
}


/* Bottom Gradient Line */

.dbt-mode-line {
    position: absolute;
    left: 38px;
    right: 38px;
    bottom: 0;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent,
        #02b452,
        #dfff00,
        transparent
    );
    opacity: .5;
}


/* Bottom Trust Strip */

.dbt-modes-bottom {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 15px;
    margin-top: 28px;
    padding: 20px 24px;
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 18px;
    background: rgba(255,255,255,.025);
}

.dbt-bottom-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #ddd;
    font-size: 15px;
    font-weight: 600;
}

.dbt-bottom-icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    color: #dfff00;
    background: rgba(223,255,0,.07);
}

.dbt-bottom-icon svg {
    width: 17px;
    height: 17px;
}


/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 1199px) {

    .dbt-modes-title {
        font-size: 43px;
    }

    .dbt-mode-card {
        padding: 32px;
    }

    .dbt-mode-title {
        font-size: 25px;
    }

}


@media (max-width: 991px) {

    .dbt-trading-modes {
        padding: 80px 0;
    }

    .dbt-modes-title {
        font-size: 38px;
    }

    .dbt-modes-row {
        margin-top: 40px;
    }

    .dbt-mode-card {
        padding: 30px;
    }

    .dbt-modes-bottom {
        grid-template-columns: repeat(2,1fr);
    }

}


@media (max-width: 767px) {

    .dbt-trading-modes {
        padding: 65px 0;
    }

    .dbt-modes-title {
        font-size: 31px;
        letter-spacing: -.5px;
    }

    .dbt-modes-description {
        font-size: 14px;
        line-height: 25px;
    }

    .dbt-mode-card {
        padding: 25px;
        border-radius: 20px;
    }

    .dbt-mode-card-top {
        margin-bottom: 25px;
    }

    .dbt-mode-number {
        font-size: 32px;
    }

    .dbt-mode-icon {
        width: 65px;
        height: 65px;
        border-radius: 17px;
    }

    .dbt-mode-icon svg {
        width: 36px;
        height: 36px;
    }

    .dbt-mode-title {
        font-size: 23px;
    }

    .dbt-mode-text {
        font-size: 14px;
        line-height: 25px;
    }

    .dbt-mode-features li {
        font-size: 13px;
        line-height: 20px;
    }

    .dbt-mode-card-featured::after {
        font-size: 8px;
    }

    .dbt-mode-line {
        left: 25px;
        right: 25px;
    }

    .dbt-modes-bottom {
        grid-template-columns: 1fr;
        padding: 18px;
    }

    .dbt-bottom-item {
        justify-content: flex-start;
    }

}


@media (max-width: 480px) {

    .dbt-modes-title {
        font-size: 27px;
    }

    .dbt-mode-card {
        padding: 22px;
    }

    .dbt-mode-label {
        font-size: 9px;
        padding: 7px 10px;
    }

    .dbt-mode-number {
        font-size: 28px;
    }

    .dbt-mode-title {
        font-size: 21px;
    }

    .dbt-mode-btn {
        width: 100%;
        justify-content: center;
    }

    .dbt-mode-card-featured::after {
        right: -42px;
    }

}



/* =========================================
   DREAMS BOAT - WHY CHOOSE SECTION
========================================= */

.dbt-why-section {
    position: relative;
    overflow: hidden;
    padding: 105px 0;
    background:
        radial-gradient(
            circle at 5% 15%,
            rgba(2,180,82,.11),
            transparent 28%
        ),
        radial-gradient(
            circle at 95% 80%,
            rgba(223,255,0,.07),
            transparent 27%
        ),
        #070a0e;
}

.dbt-why-section::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .3;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 70px 70px;
}


/* Badge */

.dbt-why-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 17px;
    border: 1px solid rgba(223,255,0,.3);
    border-radius: 50px;
    color: #dfff00;
    background: rgba(223,255,0,.055);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}

.dbt-why-badge-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #dfff00;
    box-shadow: 0 0 12px #dfff00;
}


/* Heading */

.dbt-why-heading {
    margin: 25px 0 18px;
    color: #fff;
    font-size: 49px;
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -1.5px;
}

.dbt-why-heading span {
    display: block;
    background: linear-gradient(
        90deg,
        #dfff00,
        #02b452
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.dbt-why-intro {
    max-width: 780px;
    margin: auto;
    color: #fff;
    font-size: 17px;
    line-height: 29px;
}


/* =========================================
   FEATURED MAIN BLOCK
========================================= */

.dbt-why-main {
    position: relative;
    z-index: 2;
    overflow: hidden;
    margin-top: 55px;
    padding: 45px;
    border: 1px solid rgba(223,255,0,.17);
    border-radius: 28px;
    background:
        linear-gradient(
            120deg,
            rgba(255,255,255,.045),
            rgba(2,180,82,.025)
        );
}

.dbt-why-main-glow {
    position: absolute;
    width: 450px;
    height: 450px;
    top: -230px;
    right: -150px;
    border-radius: 50%;
    background: #02b452;
    filter: blur(150px);
    opacity: .09;
}


/* Visual */

.dbt-why-visual {
    min-height: 360px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dbt-why-core {
    position: relative;
    z-index: 3;
    width: 190px;
    height: 190px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background:
        radial-gradient(
            circle at 35% 30%,
            rgba(223,255,0,.17),
            rgba(2,180,82,.04) 60%,
            rgba(0,0,0,.25)
        );
    border: 1px solid rgba(223,255,0,.45);
    box-shadow:
        0 0 70px rgba(2,180,82,.15),
        inset 0 0 40px rgba(223,255,0,.05);
}

.dbt-core-icon {
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
    border-radius: 20px;
    color: #07100a;
    background: linear-gradient(
        135deg,
        #dfff00,
        #02b452
    );
}

.dbt-core-icon svg {
    width: 42px;
    height: 42px;
}

.dbt-why-core strong {
    color: #fff;
    font-size: 19px;
    letter-spacing: 1px;
}

.dbt-why-core > span {
    margin-top: 3px;
    color: #fff;
    font-size: 12px;
    letter-spacing: 2px;
}


/* Orbits */

.dbt-why-orbit {
    position: absolute;
    border: 1px solid rgba(223,255,0,.15);
    border-radius: 50%;
}

.dbt-orbit-one {
    width: 280px;
    height: 280px;
    animation: dbtWhyRotate 18s linear infinite;
}

.dbt-orbit-two {
    width: 360px;
    height: 360px;
    border-color: rgba(2,180,82,.12);
    animation: dbtWhyRotateReverse 25s linear infinite;
}

.dbt-orbit-one::after,
.dbt-orbit-two::after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    top: 12%;
    right: 9%;
    border-radius: 50%;
    background: #dfff00;
    box-shadow: 0 0 15px #dfff00;
}

.dbt-orbit-two::after {
    top: auto;
    right: auto;
    bottom: 10%;
    left: 8%;
    background: #02b452;
    box-shadow: 0 0 15px #02b452;
}


/* Floating Chips */

.dbt-visual-chip {
    position: absolute;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 12px 16px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 14px;
    background: rgba(13,18,24,.9);
    color: #fff;
    font-size: 14px;
    box-shadow: 0 15px 35px rgba(0,0,0,.35);
    backdrop-filter: blur(12px);
}

.dbt-visual-chip span {
    color: #dfff00;
    font-weight: 800;
}

.dbt-chip-top {
    top: 22px;
    right: 5%;
}

.dbt-chip-bottom {
    bottom: 25px;
    left: 4%;
}

@keyframes dbtWhyRotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes dbtWhyRotateReverse {
    from {
        transform: rotate(360deg);
    }
    to {
        transform: rotate(0deg);
    }
}


/* Main Content */

.dbt-why-main-content {
    position: relative;
    z-index: 2;
}

.dbt-featured-label {
    display: inline-block;
    margin-bottom: 16px;
    padding: 7px 13px;
    border-radius: 50px;
    color: #dfff00;
    background: rgba(223,255,0,.08);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
}

.dbt-why-main-content h3 {
    max-width: 650px;
    margin-bottom: 17px;
    color: #fff;
    font-size: 36px;
    line-height: 1.2;
    font-weight: 800;
}

.dbt-why-main-content h3 span {
    color: #dfff00;
}

.dbt-why-main-content > p {
    max-width: 680px;
    margin-bottom: 28px;
    color: #fff;
    font-size: 16px;
    line-height: 28px;
}


/* Points */

.dbt-why-points {
    display: grid;
    gap: 13px;
}

.dbt-why-point {
    display: flex;
    align-items: center;
    gap: 14px;
}

.dbt-point-icon {
    width: 36px;
    height: 36px;
    min-width: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    color: #dfff00;
    background: rgba(223,255,0,.07);
    border: 1px solid rgba(223,255,0,.13);
}

.dbt-point-icon svg {
    width: 18px;
    height: 18px;
}

.dbt-why-point strong {
    display: block;
    margin-bottom: 3px;
    color: #fff;
    font-size: 16px;
}

.dbt-why-point small {
    display: block;
    color: #fff;
    font-size: 14px;
}


/* =========================================
   ADVANTAGE CARDS
========================================= */

.dbt-why-grid {
    position: relative;
    z-index: 2;
    margin-top: 22px;
}

.dbt-why-card {
    position: relative;
    height: 100%;
    overflow: hidden;
    padding: 30px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 22px;
    background: rgba(255,255,255,.025);
    transition: .4s ease;
}

.dbt-why-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(
        90deg,
        #dfff00,
        #02b452
    );
    transition: .4s ease;
}

.dbt-why-card:hover,
.dbt-why-card-active {
    border-color: rgba(2,180,82,.3);
    transform: translateY(-7px);
    background: rgba(255,255,255,.035);
    box-shadow: 0 25px 50px rgba(0,0,0,.25);
}

.dbt-why-card:hover::before {
    width: 100%;
}

.dbt-why-card-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 25px;
}

.dbt-why-icon {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(223,255,0,.22);
    border-radius: 17px;
    color: #dfff00;
    background: rgba(223,255,0,.04);
    transition: .4s ease;
}

.dbt-why-icon svg {
    width: 32px;
    height: 32px;
}

.dbt-why-card:hover .dbt-why-icon {
    color: #07100a;
    background: linear-gradient(
        135deg,
        #dfff00,
        #02b452
    );
    transform: scale(1.08);
}

.dbt-why-card-head > span {
    color: rgba(255,255,255,.18);
    font-size: 24px;
    font-weight: 800;
}

.dbt-why-card h4 {
    margin-bottom: 11px;
    color: #fff;
    font-size: 20px;
    font-weight: 750;
}

.dbt-why-card p {
    min-height: 75px;
    margin-bottom: 20px;
    color: #fff;
    font-size: 16px;
    line-height: 24px;
}

.dbt-card-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 16px;
    border-top: 1px solid rgba(255,255,255,.06);
    color: #dfff00;
    font-size: 11px;
    font-weight: 700;
}

.dbt-card-link span {
    font-size: 18px;
    transition: .3s ease;
}

.dbt-why-card:hover .dbt-card-link span {
    transform: translateX(5px);
}


/* =========================================
   CTA
========================================= */

.dbt-why-cta {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 28px;
    padding: 28px 32px;
    border: 1px solid rgba(223,255,0,.12);
    border-radius: 20px;
    background:
        linear-gradient(
            90deg,
            rgba(223,255,0,.045),
            rgba(2,180,82,.045)
        );
}

.dbt-why-cta > div span {
    color: #02b452;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.3px;
}

.dbt-why-cta h3 {
    margin: 7px 0 0;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
}

.dbt-why-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 13px 20px;
    border-radius: 50px;
    background: linear-gradient(
        90deg,
        #dfff00,
        #02b452
    );
    color: #06100a;
    text-decoration: none;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    transition: .35s ease;
}

.dbt-why-cta-btn:hover {
    color: #06100a;
    transform: translateY(-3px);
    box-shadow: 0 15px 30px rgba(2,180,82,.25);
}

.dbt-why-cta-btn span {
    font-size: 17px;
}


/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 1199px) {

    .dbt-why-heading {
        font-size: 43px;
    }

    .dbt-why-main {
        padding: 35px;
    }

    .dbt-why-main-content h3 {
        font-size: 31px;
    }

}


@media (max-width: 991px) {

    .dbt-why-section {
        padding: 80px 0;
    }

    .dbt-why-heading {
        font-size: 38px;
    }

    .dbt-why-main {
        padding: 30px;
    }

    .dbt-why-visual {
        min-height: 330px;
    }

    .dbt-why-main-content {
        padding-top: 10px;
    }

    .dbt-why-card p {
        min-height: auto;
    }

}


@media (max-width: 767px) {

    .dbt-why-section {
        padding: 65px 0;
    }

    .dbt-why-heading {
        font-size: 30px;
        letter-spacing: -.5px;
    }

    .dbt-why-intro {
        font-size: 14px;
        line-height: 25px;
    }

    .dbt-why-main {
        margin-top: 40px;
        padding: 25px;
        border-radius: 22px;
    }

    .dbt-why-visual {
        min-height: 290px;
    }

    .dbt-why-core {
        width: 155px;
        height: 155px;
    }

    .dbt-core-icon {
        width: 58px;
        height: 58px;
    }

    .dbt-core-icon svg {
        width: 34px;
        height: 34px;
    }

    .dbt-orbit-one {
        width: 230px;
        height: 230px;
    }

    .dbt-orbit-two {
        width: 285px;
        height: 285px;
    }

    .dbt-chip-top {
        top: 5px;
        right: 0;
    }

    .dbt-chip-bottom {
        bottom: 5px;
        left: 0;
    }

    .dbt-why-main-content h3 {
        font-size: 27px;
    }

    .dbt-why-main-content > p {
        font-size: 14px;
        line-height: 25px;
    }

    .dbt-why-card {
        padding: 25px;
    }

    .dbt-why-cta {
        flex-direction: column;
        align-items: flex-start;
        padding: 25px;
    }

}


@media (max-width: 480px) {

    .dbt-why-heading {
        font-size: 27px;
    }

    .dbt-why-main {
        padding: 20px;
    }

    .dbt-why-visual {
        min-height: 250px;
    }

    .dbt-why-core {
        width: 135px;
        height: 135px;
    }

    .dbt-core-icon {
        width: 50px;
        height: 50px;
        border-radius: 15px;
    }

    .dbt-core-icon svg {
        width: 30px;
        height: 30px;
    }

    .dbt-why-core strong {
        font-size: 16px;
    }

    .dbt-orbit-one {
        width: 195px;
        height: 195px;
    }

    .dbt-orbit-two {
        width: 240px;
        height: 240px;
    }

    .dbt-visual-chip {
        padding: 9px 11px;
        font-size: 9px;
    }

    .dbt-why-point small {
        font-size: 10px;
    }

    .dbt-why-card h4 {
        font-size: 19px;
    }

    .dbt-why-cta h3 {
        font-size: 18px;
    }

    .dbt-why-cta-btn {
        width: 100%;
        justify-content: center;
    }

}



/* ==========================================
   DREAMS BOAT - API BRIDGE PAGE
========================================== */

.dbt-api-bridge-section {
    position: relative;
    overflow: hidden;
    padding: 70px 0;
	padding-top: 0;
    background:
       radial-gradient(circle at 10% 10%, rgb(0 0 0 / 10%), transparent 27%), radial-gradient(circle at 90% 60%, rgb(0 0 0 / 6%), transparent 25%), #07090c;
    color: #fff;
}

.dbt-api-bridge-section::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .25;
    background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 65px 65px;
}


/* ==========================================
   HERO
========================================== */

.dbt-api-hero {
    position: relative;
    z-index: 2;
    min-height: 650px;
}

.dbt-api-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 15px;
    border: 1px solid rgba(223,255,0,.3);
    border-radius: 50px;
    color: #dfff00;
    background: rgba(223,255,0,.055);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
}

.dbt-api-live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #dfff00;
    box-shadow: 0 0 14px #dfff00;
}

.dbt-api-hero-title {
    max-width: 720px;
    margin: 24px 0 20px;
    color: #fff;
    font-size: 48px;
    line-height: 1.08;
    font-weight: 700;
    letter-spacing: -1.8px;
}

.dbt-api-hero-title span {
    display: block;
    background: linear-gradient(
        90deg,
        #dfff00,
        #02b452
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.dbt-api-hero-text {
    max-width: 650px;
    margin-bottom: 30px;
    color: #fff;
    font-size: 17px;
    line-height: 28px;
}

.dbt-api-hero-actions {
    display: flex;
    align-items: center;
    gap: 13px;
}

.dbt-api-primary-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 13px 18px 13px 21px;
    border-radius: 50px;
    background: linear-gradient(
        90deg,
        #dfff00,
        #02b452
    );
    color: #343434;
    text-decoration: none;
    font-size: 16px;
    font-weight: 800;
    transition: .35s ease;
}

.dbt-api-primary-btn:hover {
    color: #07100a;
    transform: translateY(-3px);
    box-shadow: 0 14px 35px rgba(2,180,82,.25);
}

.dbt-api-primary-btn span {
    width: 27px;
    height: 27px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(0,0,0,.14);
}

.dbt-api-primary-btn svg {
    width: 14px;
    height: 14px;
}

.dbt-api-secondary-btn {
    padding: 12px 20px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 50px;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    font-weight: 700;
    transition: .3s ease;
}

.dbt-api-secondary-btn:hover {
    border-color: rgba(223,255,0,.4);
    color: #dfff00;
}

.dbt-api-mini-stats {
    display: flex;
    gap: 0;
    max-width: 650px;
    margin-top: 45px;
}

.dbt-api-mini-stats > div {
    min-width: 145px;
    padding-right: 28px;
    margin-right: 28px;
    border-right: 1px solid rgba(255,255,255,.08);
}

.dbt-api-mini-stats > div:last-child {
    border-right: 0;
}

.dbt-api-mini-stats strong {
    display: block;
    margin-bottom: 4px;
    color: #dfff00;
    font-size: 25px;
    font-weight: 800;
}

.dbt-api-mini-stats span {
    color: #fff;
    font-size: 14px;
}


/* ==========================================
   NETWORK VISUAL
========================================== */

.dbt-api-network {
    position: relative;
    width: 100%;
    height: 570px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dbt-api-network-glow {
    position: absolute;
    width: 330px;
    height: 330px;
    border-radius: 50%;
    background: #02b452;
    filter: blur(130px);
    opacity: .10;
}

.dbt-api-line {
    position: absolute;
    height: 1px;
    transform-origin: left center;
    background: linear-gradient(
        90deg,
        rgba(223,255,0,.05),
        #dfff00,
        rgba(2,180,82,.1)
    );
}

.dbt-api-line-one {
    width: 190px;
    top: 42%;
    left: 8%;
    transform: rotate(-22deg);
}

.dbt-api-line-two {
    width: 190px;
    top: 50%;
    left: 20%;
    transform: rotate(0deg);
}

.dbt-api-line-three {
    width: 190px;
    top: 56%;
    left: 20%;
    transform: rotate(24deg);
}

.dbt-api-node {
    position: absolute;
    z-index: 3;
    width: 135px;
    min-height: 125px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 15px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 20px;
    background: rgba(13,17,21,.92);
    box-shadow: 0 20px 50px rgba(0,0,0,.4);
    backdrop-filter: blur(15px);
    text-align: center;
}

.dbt-api-node-broker {
    left: 0;
    top: 26%;
}

.dbt-api-node-algo {
    right: 0;
    top: 26%;
}

.dbt-api-node-execution {
    right: 4%;
    bottom: 17%;
}

.dbt-api-node-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 9px;
    border-radius: 14px;
    color: #dfff00;
    background: rgba(223,255,0,.05);
    border: 1px solid rgba(223,255,0,.2);
}

.dbt-api-node-icon svg {
    width: 28px;
    height: 28px;
}

.dbt-api-node strong {
    color: #fff;
    font-size: 16px;
    letter-spacing: .5px;
}

.dbt-api-node small {
    margin-top: 4px;
    color: #fff;
    font-size: 14px;
}

.dbt-api-core-node {
    position: relative;
    z-index: 5;
    width: 190px;
    height: 190px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background:
        radial-gradient(
            circle at 35% 30%,
            rgba(223,255,0,.18),
            rgba(2,180,82,.05) 50%,
            #0a0e11 75%
        );
    border: 1px solid rgba(223,255,0,.5);
    box-shadow:
        0 0 70px rgba(2,180,82,.15),
        inset 0 0 35px rgba(223,255,0,.05);
}

.dbt-api-core-icon {
    width: 68px;
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
    border-radius: 20px;
    color: #07100a;
    background: linear-gradient(
        135deg,
        #dfff00,
        #02b452
    );
}

.dbt-api-core-icon svg {
    width: 38px;
    height: 38px;
}

.dbt-api-core-node strong {
    color: #fff;
    font-size: 17px;
    letter-spacing: 1px;
}

.dbt-api-core-node span {
    margin-top: 5px;
    color: #fff;
    font-size: 14px;
    letter-spacing: 1.5px;
}


/* ==========================================
   INTRO
========================================== */

.dbt-api-intro {
    position: relative;
    z-index: 2;
    padding: 85px 0;
    border-top: 1px solid rgba(255,255,255,.06);
}

.dbt-api-section-label {
    display: inline-block;
    margin-bottom: 15px;
    padding: 7px 12px;
    border-radius: 50px;
    color: #dfff00;
    background: rgba(223,255,0,.07);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 1px;
}

.dbt-api-section-title {
    margin-bottom: 17px;
    color: #fff;
    font-size: 38px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -.8px;
}

.dbt-api-section-title span {
    display: block;
    color: #dfff00;
}

.dbt-api-section-text {
    max-width: 570px;
    margin-bottom: 25px;
    color: #fff;
    font-size: 17px;
    line-height: 27px;
}

.dbt-api-centered-text {
    max-width: 650px;
    margin-left: auto;
    margin-right: auto;
}

.dbt-api-security-line {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
}

.dbt-api-security-line span {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    color: #dfff00;
    background: rgba(223,255,0,.06);
    border: 1px solid rgba(223,255,0,.15);
}

.dbt-api-security-line svg {
    width: 17px;
    height: 17px;
}

.dbt-api-flow-grid {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 13px;
}

.dbt-api-flow-card {
    display: flex;
    gap: 14px;
    padding: 20px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 16px;
    background: rgba(255,255,255,.025);
    transition: .3s ease;
}

.dbt-api-flow-card:hover {
    border-color: rgba(2,180,82,.3);
    transform: translateY(-4px);
}

.dbt-api-flow-icon {
    width: 38px;
    height: 38px;
    min-width: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    color: #dfff00;
    background: rgba(223,255,0,.06);
}

.dbt-api-flow-icon svg {
    width: 18px;
    height: 18px;
}

.dbt-api-flow-card strong {
    display: block;
    margin-bottom: 4px;
    color: #fff;
    font-size: 18px;
}

.dbt-api-flow-card p {
    margin: 0;
    color: #fff;
    font-size: 15px;
    line-height: 18px;
}


/* ==========================================
   FEATURES
========================================== */

.dbt-api-features {
    position: relative;
    z-index: 2;
    padding: 85px 0;
    border-top: 1px solid rgba(255,255,255,.06);
}

.dbt-api-feature-card {
    position: relative;
    height: 100%;
    padding: 28px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 20px;
    background: rgba(255,255,255,.025);
    transition: .35s ease;
}

.dbt-api-feature-card:hover {
    transform: translateY(-7px);
    border-color: rgba(223,255,0,.25);
    box-shadow: 0 20px 45px rgba(0,0,0,.25);
}

.dbt-api-feature-card > span {
    position: absolute;
    top: 25px;
    right: 25px;
    color: rgba(255,255,255,.15);
    font-size: 18px;
    font-weight: 800;
}

.dbt-api-feature-icon {
    width: 58px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    border: 1px solid rgba(223,255,0,.2);
    border-radius: 16px;
    color: #dfff00;
    background: rgba(223,255,0,.04);
}

.dbt-api-feature-icon svg {
    width: 31px;
    height: 31px;
}

.dbt-api-feature-card h3 {
    margin-bottom: 10px;
    color: #fff;
    font-size: 17px;
    font-weight: 750;
}

.dbt-api-feature-card p {
    margin: 0;
    color: #fff;
    font-size: 16px;
    line-height: 21px;
}


/* ==========================================
   PROCESS
========================================== */

.dbt-api-process {
    position: relative;
    z-index: 2;
    padding: 85px 0;
    border-top: 1px solid rgba(255,255,255,.06);
}

.dbt-api-process-row {
    margin-top: 40px;
}

.dbt-api-step {
    position: relative;
    height: 100%;
    padding: 27px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 20px;
    background: rgba(255,255,255,.025);
    transition: .35s ease;
}

.dbt-api-step:hover {
    border-color: rgba(2,180,82,.3);
    transform: translateY(-5px);
}

.dbt-api-step-number {
    position: absolute;
    top: 20px;
    right: 20px;
    color: rgba(255,255,255,.14);
    font-size: 19px;
    font-weight: 800;
}

.dbt-api-step-icon {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
    border-radius: 15px;
    color: #dfff00;
    border: 1px solid rgba(223,255,0,.18);
    background: rgba(223,255,0,.04);
}

.dbt-api-step-icon svg {
    width: 25px;
    height: 25px;
}

.dbt-api-step h3 {
    margin-bottom: 9px;
    color: #fff;
    font-size: 17px;
    font-weight: 750;
}

.dbt-api-step p {
    margin: 0;
    color: #fff;
    font-size: 16px;
    line-height: 21px;
}


/* ==========================================
   FINAL CTA
========================================== */

.dbt-api-final-cta {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 34px 40px;
    border: 1px solid rgba(223,255,0,.14);
    border-radius: 24px;
    background:
        linear-gradient(
            100deg,
            rgba(223,255,0,.045),
            rgba(2,180,82,.045)
        );
}

.dbt-api-final-cta > div > span {
    color: #02b452;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.2px;
}

.dbt-api-final-cta h2 {
    margin: 7px 0 0;
    color: #fff;
    font-size: 23px;
    font-weight: 700;
}

.dbt-api-final-cta h2 strong {
    color: #dfff00;
}


/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 1199px) {

    .dbt-api-hero-title {
        font-size: 48px;
    }

    .dbt-api-network {
        transform: scale(.9);
    }

}


@media (max-width: 991px) {

    .dbt-api-bridge-section {
        padding: 75px 0;
    }

    .dbt-api-hero {
        min-height: auto;
    }

    .dbt-api-hero-title {
        font-size: 43px;
    }

    .dbt-api-network {
        height: 520px;
        margin-top: 40px;
    }

    .dbt-api-intro,
    .dbt-api-features,
    .dbt-api-process {
        padding: 70px 0;
    }

    .dbt-api-section-title {
        font-size: 34px;
    }

}


@media (max-width: 767px) {

    .dbt-api-bridge-section {
        padding: 60px 0;
    }

    .dbt-api-hero-title {
        font-size: 34px;
        letter-spacing: -.8px;
    }

    .dbt-api-hero-text {
        font-size: 14px;
        line-height: 25px;
    }

    .dbt-api-hero-actions {
        flex-wrap: wrap;
    }

    .dbt-api-mini-stats {
        margin-top: 35px;
    }

    .dbt-api-mini-stats > div {
        min-width: auto;
        padding-right: 15px;
        margin-right: 15px;
    }

    .dbt-api-mini-stats strong {
        font-size: 20px;
    }

    .dbt-api-mini-stats span {
        font-size: 8px;
    }

    .dbt-api-network {
        height: 440px;
        transform: none;
    }

    .dbt-api-core-node {
        width: 145px;
        height: 145px;
    }

    .dbt-api-core-icon {
        width: 53px;
        height: 53px;
        margin-bottom: 8px;
    }

    .dbt-api-core-icon svg {
        width: 30px;
        height: 30px;
    }

    .dbt-api-node {
        width: 105px;
        min-height: 105px;
        padding: 10px;
    }

    .dbt-api-node-icon {
        width: 40px;
        height: 40px;
    }

    .dbt-api-node-icon svg {
        width: 23px;
        height: 23px;
    }

    .dbt-api-node strong {
        font-size: 9px;
    }

    .dbt-api-node small {
        font-size: 7px;
    }

    .dbt-api-node-broker {
        left: 0;
    }

    .dbt-api-node-algo {
        right: 0;
    }

    .dbt-api-node-execution {
        right: 5%;
        bottom: 5%;
    }

    .dbt-api-line-one {
        width: 130px;
        left: 10%;
    }

    .dbt-api-line-two {
        width: 125px;
        left: 20%;
    }

    .dbt-api-line-three {
        width: 130px;
        left: 20%;
    }

    .dbt-api-flow-grid {
        grid-template-columns: 1fr;
    }

    .dbt-api-section-title {
        font-size: 29px;
    }

    .dbt-api-final-cta {
        flex-direction: column;
        align-items: flex-start;
        padding: 27px;
    }

}


@media (max-width: 480px) {

    .dbt-api-hero-title {
        font-size: 29px;
    }

    .dbt-api-hero-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .dbt-api-primary-btn,
    .dbt-api-secondary-btn {
        justify-content: center;
        text-align: center;
    }

    .dbt-api-mini-stats {
        justify-content: space-between;
    }

    .dbt-api-mini-stats > div {
        padding-right: 9px;
        margin-right: 9px;
    }

    .dbt-api-network {
        height: 390px;
    }

    .dbt-api-core-node {
        width: 125px;
        height: 125px;
    }

    .dbt-api-node {
        width: 90px;
        min-height: 92px;
    }

    .dbt-api-node-icon {
        width: 34px;
        height: 34px;
        margin-bottom: 5px;
    }

    .dbt-api-node-icon svg {
        width: 19px;
        height: 19px;
    }

    .dbt-api-node strong {
        font-size: 8px;
    }

    .dbt-api-node small {
        font-size: 6px;
    }

    .dbt-api-final-cta h2 {
        font-size: 19px;
    }

}



/* =========================================
   DREAMS BOAT TECHNOLOGY
   PAYMENT INFORMATION SECTION
   Minimum Font Size: 16px
   No :root
========================================= */

.dbt-payinfo-section {
    position: relative;
    overflow: hidden;
    padding: 100px 0;
    background:
        radial-gradient(
            circle at 15% 20%,
            rgba(223, 255, 0, 0.06),
            transparent 28%
        ),
        radial-gradient(
            circle at 85% 75%,
            rgba(2, 180, 82, 0.07),
            transparent 30%
        ),
        #0b0d10;
    color: #ffffff;
    font-size: 16px;
}

.dbt-payinfo-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(
            rgba(255, 255, 255, 0.018) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.018) 1px,
            transparent 1px
        );
    background-size: 65px 65px;
    pointer-events: none;
}

.dbt-payinfo-section .container {
    position: relative;
    z-index: 2;
}


/* =========================================
   SECTION HEADER
========================================= */

.dbt-payinfo-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 9px 18px;
    border: 1px solid rgba(223, 255, 0, 0.45);
    border-radius: 50px;
    color: #dfff00;
    background: rgba(223, 255, 0, 0.045);
    font-size: 16px;
    line-height: 1.4;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.dbt-payinfo-badge span {
    width: 9px;
    height: 9px;
    flex: 0 0 9px;
    border-radius: 50%;
    background: #dfff00;
    box-shadow: 0 0 14px rgba(223, 255, 0, 0.85);
}

.dbt-payinfo-title {
    margin: 24px auto 16px;
    max-width: 850px;
    color: #ffffff;
    font-size: clamp(40px, 5vw, 52px);
    line-height: 1.08;
    font-weight: 700;
    letter-spacing: -2px;
}

.dbt-payinfo-title em {
    color: #dfff00;
    font-style: normal;
}

.dbt-payinfo-subtitle {
    max-width: 720px;
    margin: 0 auto;
    color: #9298a1;
    font-size: 16px;
    line-height: 1.8;
}
figure.image-anime img {
    border-radius: 22px;
}

/* =========================================
   PAYMENT GRID
========================================= */

.dbt-payinfo-grid {
    margin-top: 60px;
}


/* =========================================
   MAIN CARDS
========================================= */

.dbt-payinfo-card {
    position: relative;
    height: 100%;
    overflow: hidden;
    padding: 32px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 22px;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.035),
            rgba(255, 255, 255, 0.012)
        ),
        #111316;
    box-shadow:
        0 25px 70px rgba(0, 0, 0, 0.3);
}

.dbt-payinfo-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 12%;
    right: 12%;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(223, 255, 0, 0.8),
        transparent
    );
}

.dbt-payinfo-card::after {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    right: -100px;
    bottom: -100px;
    border-radius: 50%;
    background: rgba(223, 255, 0, 0.035);
    filter: blur(25px);
    pointer-events: none;
}


/* =========================================
   CARD HEADER
========================================= */

.dbt-payinfo-card-top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 25px;
}

.dbt-payinfo-overline {
    display: block;
    color: #dfff00;
    font-size: 16px;
    line-height: 1.4;
    font-weight: 700;
    letter-spacing: 0.8px;
}

.dbt-payinfo-card h3 {
    margin: 9px 0 7px;
    color: #ffffff;
    font-size: 26px;
    line-height: 1.25;
    font-weight: 700;
}

.dbt-payinfo-card-top p {
    max-width: 500px;
    margin: 0;
    color: #858b94;
    font-size: 16px;
    line-height: 1.7;
}


/* =========================================
   ICON
========================================= */

.dbt-payinfo-icon {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(223, 255, 0, 0.28);
    border-radius: 14px;
    color: #dfff00;
    background: rgba(223, 255, 0, 0.045);
}

.dbt-payinfo-icon svg {
    width: 27px;
    height: 27px;
}


/* =========================================
   QR AREA
========================================= */

.dbt-payinfo-qr-wrap {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 310px;
    margin: 32px 0 22px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 17px;
    background:
        radial-gradient(
            circle,
            rgba(223, 255, 0, 0.09),
            transparent 45%
        ),
        #0b0d0f;
}

.dbt-payinfo-qr {
    width: 220px;
    height: 220px;
    padding: 10px;
    border-radius: 13px;
    background: #ffffff;
    box-shadow:
        0 0 45px rgba(223, 255, 0, 0.08);
}

.dbt-payinfo-qr img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}


/* =========================================
   SCAN BADGE
========================================= */

.dbt-payinfo-scan {
    position: absolute;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 15px;
    border: 1px solid rgba(223, 255, 0, 0.2);
    border-radius: 50px;
    color: #dfff00;
    background: #151819;
    font-size: 16px;
    line-height: 1.4;
    font-weight: 600;
    white-space: nowrap;
}

.dbt-payinfo-scan-icon {
    display: flex;
}

.dbt-payinfo-scan svg {
    width: 18px;
    height: 18px;
}


/* =========================================
   UPI DETAILS
========================================= */

.dbt-payinfo-upi {
    position: relative;
    z-index: 2;
    padding: 17px 18px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 12px;
    background: #0d0f11;
}

.dbt-payinfo-upi > span {
    display: block;
    margin-bottom: 7px;
    color: #737a84;
    font-size: 16px;
    line-height: 1.4;
    font-weight: 700;
}

.dbt-payinfo-copy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.dbt-payinfo-copy strong {
    color: #ffffff;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 600;
    word-break: break-word;
}

.dbt-payinfo-copy button,
.dbt-payinfo-detail-row button {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid rgba(223, 255, 0, 0.15);
    border-radius: 9px;
    color: #dfff00;
    background: rgba(223, 255, 0, 0.04);
    cursor: pointer;
    transition: all 0.25s ease;
}

.dbt-payinfo-copy button:hover,
.dbt-payinfo-detail-row button:hover {
    color: #0b0d0f;
    background: #dfff00;
}

.dbt-payinfo-copy svg,
.dbt-payinfo-detail-row button svg {
    width: 18px;
    height: 18px;
}


/* =========================================
   NOTE
========================================= */

.dbt-payinfo-note {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 16px;
    color: #777e87;
    font-size: 16px;
    line-height: 1.6;
}

.dbt-payinfo-note svg {
    width: 19px;
    height: 19px;
    flex: 0 0 19px;
    color: #dfff00;
}


/* =========================================
   BANK HIGHLIGHT
========================================= */

.dbt-payinfo-bank-highlight {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 32px;
    padding: 18px;
    border: 1px solid rgba(223, 255, 0, 0.14);
    border-radius: 14px;
    background:
        linear-gradient(
            100deg,
            rgba(223, 255, 0, 0.07),
            rgba(2, 180, 82, 0.025)
        );
}

.dbt-payinfo-bank-logo {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    color: #090b0c;
    background: #dfff00;
    font-size: 16px;
    font-weight: 800;
}

.dbt-payinfo-bank-highlight small {
    display: block;
    color: #737983;
    font-size: 16px;
    line-height: 1.4;
    font-weight: 600;
}

.dbt-payinfo-bank-highlight strong {
    display: block;
    margin-top: 4px;
    color: #ffffff;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 700;
}

.dbt-payinfo-verified {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    color: #02b452;
    font-size: 16px;
    line-height: 1.4;
    font-weight: 700;
    white-space: nowrap;
}

.dbt-payinfo-verified svg {
    width: 19px;
    height: 19px;
}


/* =========================================
   BANK DETAILS TABLE
========================================= */

.dbt-payinfo-details {
    position: relative;
    z-index: 2;
    overflow: hidden;
    margin-top: 22px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 13px;
}

.dbt-payinfo-detail-row {
    min-height: 58px;
    display: grid;
    grid-template-columns: 150px 1fr auto;
    align-items: center;
    gap: 15px;
    padding: 10px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.055);
}

.dbt-payinfo-detail-row:last-child {
    border-bottom: 0;
}

.dbt-payinfo-detail-row:nth-child(odd) {
    background: rgba(255, 255, 255, 0.018);
}

.dbt-payinfo-detail-row span {
    color: #737a83;
    font-size: 16px;
    line-height: 1.5;
}

.dbt-payinfo-detail-row strong {
    color: #e5e7ea;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 600;
    word-break: break-word;
}


/* =========================================
   BANK FOOTER
========================================= */

.dbt-payinfo-bank-footer {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 20px;
}

.dbt-payinfo-secure {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #02b452;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 600;
}

.dbt-payinfo-secure svg {
    width: 20px;
    height: 20px;
}

.dbt-payinfo-bank-footer small {
    color: #666d76;
    font-size: 16px;
    line-height: 1.5;
}


/* =========================================
   PAYMENT CONFIRMATION
========================================= */

.dbt-payinfo-confirm {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
    margin-top: 26px;
    padding: 23px 26px;
    border: 1px solid rgba(223, 255, 0, 0.13);
    border-radius: 16px;
    background:
        linear-gradient(
            100deg,
            rgba(223, 255, 0, 0.035),
            rgba(2, 180, 82, 0.018)
        );
}

.dbt-payinfo-confirm-icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    color: #dfff00;
    background: rgba(223, 255, 0, 0.08);
}

.dbt-payinfo-confirm-icon svg {
    width: 24px;
    height: 24px;
}

.dbt-payinfo-confirm strong {
    display: block;
    color: #ffffff;
    font-size: 18px;
    line-height: 1.4;
}

.dbt-payinfo-confirm p {
    max-width: 720px;
    margin: 5px 0 0;
    color: #777e87;
    font-size: 16px;
    line-height: 1.7;
}

.dbt-payinfo-support-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    flex: 0 0 auto;
    margin-left: auto;
    padding: 12px 20px;
    border: 1px solid #dfff00;
    border-radius: 10px;
    color: #080a0b;
    background: #dfff00;
    font-size: 16px;
    line-height: 1.4;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: all 0.25s ease;
}

.dbt-payinfo-support-btn:hover {
    color: #ffffff;
    background: #02b452;
    border-color: #02b452;
    transform: translateY(-2px);
}

.dbt-payinfo-support-btn svg {
    width: 18px;
    height: 18px;
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 991.98px) {

    .dbt-payinfo-section {
        padding: 80px 0;
    }

    .dbt-payinfo-grid {
        margin-top: 45px;
    }

    .dbt-payinfo-card {
        padding: 28px;
    }

    .dbt-payinfo-confirm {
        align-items: flex-start;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 767.98px) {

    .dbt-payinfo-section {
        padding: 65px 0;
    }

    .dbt-payinfo-title {
        font-size: 40px;
        letter-spacing: -1px;
    }

    .dbt-payinfo-subtitle {
        font-size: 16px;
    }

    .dbt-payinfo-card {
        padding: 23px;
        border-radius: 18px;
    }

    .dbt-payinfo-card h3 {
        font-size: 24px;
    }

    .dbt-payinfo-card-top p {
        font-size: 16px;
    }

    .dbt-payinfo-qr-wrap {
        min-height: 285px;
    }

    .dbt-payinfo-qr {
        width: 200px;
        height: 200px;
    }

    .dbt-payinfo-bank-highlight {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .dbt-payinfo-verified {
        width: 100%;
        margin-left: 70px;
    }

    .dbt-payinfo-confirm {
        flex-wrap: wrap;
    }

    .dbt-payinfo-support-btn {
        width: 100%;
        margin-left: 0;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 575.98px) {

    .dbt-payinfo-section {
        padding: 55px 0;
    }

    .dbt-payinfo-badge {
        font-size: 16px;
    }

    .dbt-payinfo-title {
        font-size: 34px;
        line-height: 1.12;
    }

    .dbt-payinfo-card {
        padding: 20px;
    }

    .dbt-payinfo-card-top {
        gap: 12px;
    }

    .dbt-payinfo-card h3 {
        font-size: 22px;
    }

    .dbt-payinfo-card-top p {
        font-size: 16px;
    }

    .dbt-payinfo-icon {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
    }

    .dbt-payinfo-qr-wrap {
        min-height: 260px;
    }

    .dbt-payinfo-qr {
        width: 175px;
        height: 175px;
    }

    .dbt-payinfo-scan {
        font-size: 16px;
    }

    .dbt-payinfo-copy {
        align-items: flex-start;
    }

    .dbt-payinfo-copy strong {
        font-size: 16px;
    }

    .dbt-payinfo-bank-highlight {
        gap: 12px;
    }

    .dbt-payinfo-bank-logo {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
    }

    .dbt-payinfo-verified {
        margin-left: 60px;
    }

    .dbt-payinfo-detail-row {
        grid-template-columns: 110px 1fr auto;
        gap: 8px;
        padding: 11px 10px;
    }

    .dbt-payinfo-detail-row span,
    .dbt-payinfo-detail-row strong {
        font-size: 16px;
    }

    .dbt-payinfo-bank-footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .dbt-payinfo-confirm {
        padding: 20px;
    }

    .dbt-payinfo-confirm p {
        font-size: 16px;
    }

    .dbt-payinfo-support-btn {
        font-size: 16px;
    }

}





.dbt-all-services-section {
    position: relative;
    background: #0d1013;
    overflow: hidden;
}

.dbt-all-services-section::before {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    left: -180px;
    top: 50px;
    background: rgba(223, 255, 0, 0.045);
    filter: blur(100px);
    border-radius: 50%;
    pointer-events: none;
}

.dbt-all-services-section::after {
    content: "";
    position: absolute;
    width: 380px;
    height: 380px;
    right: -180px;
    bottom: 20px;
    background: rgba(2, 180, 82, 0.035);
    filter: blur(100px);
    border-radius: 50%;
    pointer-events: none;
}

.dbt-services-heading {
    position: relative;
    z-index: 2;
    max-width: 850px;
}

.dbt-services-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 15px;
    border: 1px solid rgba(223, 255, 0, 0.35);
    border-radius: 50px;
    color: #dfff00;
    background: rgba(223, 255, 0, 0.055);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.4px;
}

.dbt-services-badge-dot {
    width: 8px;
    height: 8px;
    background: #dfff00;
    border-radius: 50%;
    box-shadow: 0 0 12px rgba(223, 255, 0, 0.8);
}

.dbt-services-title {
    color: #ffffff;
    font-size: clamp(32px, 4vw, 54px);
    line-height: 1.12;
    font-weight: 700;
    letter-spacing: -1.5px;
}

.dbt-services-title span {
    color: #dfff00;
}

.dbt-services-description {
    color: #9ca4ad;
    font-size: 16px;
    line-height: 1.8;
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}

.dbt-service-card {
    position: relative;
    z-index: 2;
    padding: 34px;
    background: #15181c;
    border: 1px solid #292e34;
    border-radius: 24px;
    transition: all 0.35s ease;
    overflow: hidden;
}

.dbt-service-card::before {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    right: -90px;
    top: -90px;
    border-radius: 50%;
    background: rgba(223, 255, 0, 0.06);
    transition: all 0.4s ease;
}

.dbt-service-card:hover {
    transform: translateY(-6px);
    border-color: rgba(223, 255, 0, 0.55);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.28);
}

.dbt-service-card:hover::before {
    transform: scale(1.7);
}

.dbt-service-featured {
    border-color: rgba(223, 255, 0, 0.35);
}

.dbt-service-card-top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 25px;
}

.dbt-service-icon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 17px;
    color: #dfff00;
    background: #10140e;
    border: 1px solid rgba(223, 255, 0, 0.35);
}

.dbt-service-number {
    color: #dfff00;
    font-size: 15px;
    font-weight: 700;
}

.dbt-service-title {
    position: relative;
    z-index: 2;
    color: #ffffff;
    font-size: 27px;
    line-height: 1.3;
    font-weight: 700;
    margin-bottom: 14px;
}

.dbt-service-text {
    position: relative;
    z-index: 2;
    color: #9ca4ad;
    font-size: 16px;
    line-height: 1.75;
    margin-bottom: 24px;
}

.dbt-service-list {
    position: relative;
    z-index: 2;
    list-style: none;
    padding: 0;
    margin: 0 0 28px;
}

.dbt-service-list li {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #e1e5e8;
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 13px;
}

.dbt-check-icon {
    width: 21px;
    height: 21px;
    min-width: 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #dfff00;
}

.dbt-service-button {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 8px 9px 8px 19px;
    color: #10120f;
    background: #dfff00;
    border-radius: 50px;
    text-decoration: none;
    font-size: 15px;
    font-weight: 700;
    transition: all 0.3s ease;
}

.dbt-service-button:hover {
    color: #10120f;
    background: #02b452;
    transform: translateX(3px);
}

.dbt-service-arrow {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #10120f;
    color: #dfff00;
    border-radius: 50%;
}

@media (max-width: 991.98px) {

    .dbt-all-services-section {
        padding-top: 70px !important;
        padding-bottom: 70px !important;
    }

    .dbt-services-title {
        font-size: 40px;
    }

    .dbt-service-card {
        padding: 28px;
    }

}

@media (max-width: 575.98px) {

    .dbt-services-title {
        font-size: 31px;
        letter-spacing: -0.5px;
    }

    .dbt-services-description {
        font-size: 16px;
        line-height: 1.65;
    }

    .dbt-service-card {
        padding: 24px;
        border-radius: 20px;
    }

    .dbt-service-icon {
        width: 56px;
        height: 56px;
        border-radius: 15px;
    }

    .dbt-service-title {
        font-size: 23px;
    }

    .dbt-service-text {
        font-size: 16px;
    }

    .dbt-service-list li {
        font-size: 16px;
    }

    .dbt-service-button {
        width: 100%;
        justify-content: space-between;
    }

}