/* HEADER */

div#body_wrapper header{

min-height:auto;
}

/* TOP BAR */

div#body_wrapper header > div#header_sub{

flex-direction:column;
align-items:center;

gap:10px;

padding:10px 14px;
}

/* ROWS */

div#body_wrapper header > div#header_sub > div{

width:100%;

justify-content:center;
align-items:center;

flex-wrap:wrap;

gap:8px;

text-align:center;
}

div#body_wrapper header > div#header_sub > div:nth-child(2){

padding:0;
}

/* TEXT */

div#body_wrapper header > div#header_sub > div p{

font-size:11px;
line-height:1.5;
}

/* MENU */

div#body_wrapper header > div#header_sub > div ul{

justify-content:center;

flex-wrap:wrap;

gap:8px;
}

div#body_wrapper header > div#header_sub > div ul li a{

font-size:11px;
}

/* CLIENT LOGIN */

div#client_sign{

justify-content:center;
}

div#client_sign a{

font-size:11px;
}

div#client_sign svg{

width:18px;
height:18px;

margin:-1px 0 0 0;
}

/*========================
LOGO / NAV
=========================*/

div#logo_menu_div{

flex-direction:column;
align-items:center;

gap:16px;

padding:18px 14px;
}

/* LOGO */

div#logo_menu_div figure{

width:170px;
margin:0 auto;
}

div#logo_menu_div figure img{

width:100%;
display:block;
}

/* NAV */

div#logo_menu_div nav{

width:100%;

padding:0;
margin:0;
}

div#logo_menu_div nav ul{
width:100%;
justify-content:center;
align-items:center;
flex-wrap:nowrap;
gap:10px;
padding:0;
}

div#logo_menu_div nav ul li a{
font-size:10px;
}

/* GET IN TOUCH */
div#intouch_div{
position:relative;
top:auto;
right:auto;
width:150px;
height:42px;
margin:8px auto 0 auto;
border-radius:6px;
}

div#intouch_div a{
padding:10px 0 0 0;
font-size:12px;
}
/*************************
ACCOUNT HERO
*************************/

#account_hero{

position:relative;

height:760px;

background:
url('../images/account_hero.jpg')
center center/cover
no-repeat;

overflow:hidden;
}

/* OVERLAY */
#account_hero_overlay{
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
background:linear-gradient(90deg,rgba(4,25,19,.90),rgba(4,25,19,.50));
}

/* CONTENT */
#account_hero_content{
position:relative;
z-index:3;
width:88%;
max-width:1350px;
height:100%;
margin:auto;
display:flex;
flex-direction:column;
justify-content:center;
align-items:flex-start;
}

/* TAG */

#account_hero_content span{
display:inline-flex;
padding:10px 18px;
border-radius:40px;
background:rgba(214,180,94,.10);
border:1px solid rgba(214,180,94,.20);
font:12px amplitude_regular;
letter-spacing:1.5px;
color:var(--gold);
margin-bottom:28px;
}

/* TITLE */

#account_hero_content h1{

font:55px PlayfairDisplay;

line-height:1.02;

color:white;

max-width:760px;

margin-bottom:24px;
}

/* TEXT */

#account_hero_content p{

font:18px amplitude_regular;

line-height:1.95;

color:
rgba(255,255,255,.82);

max-width:650px;

margin-bottom:38px;
}

/* ACTIONS */

.account_hero_actions{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:18px;
}

/* BUTTONS */

.account_hero_actions a{

display:flex;
width:100%;
justify-content:center;
align-items:center;

height:58px;

padding:0 34px;

border-radius:40px;

text-decoration:none;

font:14px notosans;

transition:.35s;
}

/* PRIMARY */

.account_primary_btn{

background:var(--gold);

color:var(--base);
}

/* SECONDARY */

.account_secondary_btn{
border:1px solid rgba(255,255,255,.25);
background:rgba(255,255,255,.05);
backdrop-filter:blur(8px);

color:white;
}

/* HOVER */

.account_primary_btn:hover{
background:#e0bf65;
}

.account_secondary_btn:hover{
background:rgba(255,255,255,.12);
}

/*========================
ACCOUNT INTRO
=========================*/

#account_intro{

padding:120px 0;

background:white;
}

/* CONTAINER */

#account_intro_container{

width:88%;
max-width:900px;

margin:auto;

text-align:center;
}

/* LABEL */

#account_intro_container span{
display:inline-flex;
padding:10px 18px;
border-radius:40px;
background:rgba(214,180,94,.10);
border:1px solid rgba(214,180,94,.20);
font:12px amplitude_regular;
letter-spacing:1.5px;
color:var(--gold);
margin-bottom:24px;
}

/* TITLE */

#account_intro_container h2{
font:64px PlayfairDisplay;
line-height:1.08;
color:var(--base);
margin-bottom:28px;
}

/* TEXT */
#account_intro_container p{
font:16px notosans;
line-height:2em;
color:#5E6662;
max-width:760px;
margin:auto;
}

/*========================
ACCOUNT TYPES
=========================*/

#account_types{

padding:120px 0;

background:#F8F6F1;
}

/* HEADER */

#account_types_header{

width:88%;
max-width:900px;

margin:0 auto 70px auto;

text-align:center;
}

#account_types_header span{

display:inline-flex;

padding:10px 18px;

border-radius:40px;

background:
rgba(214,180,94,.10);

border:
1px solid
rgba(214,180,94,.20);

font:12px amplitude_regular;

letter-spacing:1.5px;

color:var(--gold);

margin-bottom:24px;
}

#account_types_header h2{

font:48px PlayfairDisplay;
line-height:1.08;
color:var(--base);
margin-bottom:24px;
}

#account_types_header p{

font:16px amplitude_regular;

line-height:2em;

color:#5E6662;

max-width:760px;

margin:auto;
}

/* GRID */

#account_types_grid{

width:88%;
max-width:1350px;

margin:auto;

display:flex;

gap:28px;
}

/* CARD */

.account_type_card{

flex:1;

padding:40px 36px;

background:white;

border-radius:24px;

box-shadow:
0 12px 40px
rgba(0,0,0,.04);

transition:.35s;
}

.account_type_card:hover{

transform:translateY(-8px);
}

/* ICON */

.account_type_icon{

width:72px;
height:72px;

display:flex;
justify-content:center;
align-items:center;

border-radius:18px;

background:
rgba(214,180,94,.10);

margin-bottom:26px;
}

.account_type_icon svg{

width:30px;
height:30px;

color:var(--gold);
}

/* TITLE */

.account_type_card h3{

font:32px PlayfairDisplay;

line-height:1.15;

color:var(--base);

margin-bottom:16px;
}

/* TEXT */

.account_type_card p{

font:15px amplitude_regular;

line-height:2em;

color:#5E6662;

margin-bottom:24px;
}

/* LINK */

.account_type_card a{

display:inline-flex;

align-items:center;

text-decoration:none;

font:14px amplitude_regular;

color:var(--gold);
}

/*========================
ACCOUNT PROCESS
=========================*/

#account_process{

padding:120px 0;

background:white;
}

/* HEADER */

#account_process_header{

width:88%;
max-width:900px;

margin:0 auto 70px auto;

text-align:center;
}

#account_process_header span{

display:inline-flex;

padding:10px 18px;

border-radius:40px;

background:
rgba(214,180,94,.10);

border:
1px solid
rgba(214,180,94,.20);

font:12px amplitude_regular;

letter-spacing:1.5px;

color:var(--gold);

margin-bottom:24px;
}

#account_process_header h2{

font:64px PlayfairDisplay;

line-height:1.08;

color:var(--base);

margin-bottom:24px;
}

#account_process_header p{

font:16px amplitude_regular;

line-height:2em;

color:#5E6662;

max-width:760px;

margin:auto;
}

/* GRID */

#account_process_grid{

width:88%;
max-width:1350px;

margin:auto;

display:flex;

gap:24px;
}

/* CARD */

.account_process_card{

flex:1;

position:relative;

padding:40px 34px;

background:#F8F6F1;

border-radius:24px;

transition:.35s;
}

.account_process_card:hover{

transform:translateY(-8px);
}

/* STEP NUMBER */

.account_process_card > span{

display:block;

font:14px amplitude_regular;

letter-spacing:2px;

color:var(--gold);

margin-bottom:18px;
}

/* ICON */

.account_process_icon{

width:70px;
height:70px;

display:flex;
justify-content:center;
align-items:center;

background:white;

border-radius:18px;

margin-bottom:22px;
}

.account_process_icon svg{

width:28px;
height:28px;

color:var(--gold);
}

/* TITLE */

.account_process_card h3{

font:30px PlayfairDisplay;

line-height:1.15;

color:var(--base);

margin-bottom:14px;
}

/* TEXT */

.account_process_card p{

font:15px amplitude_regular;

line-height:2em;

color:#5E6662;
}

/*========================
APPLICATION FORM
=========================*/

#application_form{

padding:120px 0;

background:#F8F6F1;
}

/* HEADER */

#application_form_header{

width:88%;
max-width:900px;

margin:0 auto 70px auto;

text-align:center;
}

#application_form_header span{

display:inline-flex;

padding:10px 18px;

border-radius:40px;

background:
rgba(214,180,94,.10);

border:
1px solid
rgba(214,180,94,.20);

font:12px amplitude_regular;

letter-spacing:1.5px;

color:var(--gold);

margin-bottom:24px;
}

#application_form_header h2{
font:45px PlayfairDisplay;
line-height:1.08;
color:var(--base);
margin-bottom:24px;
}

#application_form_header p{

font:16px amplitude_regular;

line-height:2em;

color:#5E6662;

max-width:760px;

margin:auto;
}

/* FORM */

#account_form{
width:80%;
max-width:1100px;
margin:auto;
background:white;
padding:20px;
border-radius:28px;
box-shadow:0 18px 60px rgba(0,0,0,.04);
}

/* ROW */
.form_row{
display:flex;
gap:10px;
margin-bottom:24px;
}

/* GROUP */
.form_group{
flex:1;
display:flex;
flex-direction:column;
}

/* LABEL */

.form_group label{

font:13px notosans;

color:var(--base);

margin-bottom:10px;
}

/* INPUTS */

.form_group input,
.form_group select,
.form_group textarea{

height:58px;

padding:0 18px;

border:
1px solid #E4E1D9;

border-radius:14px;

outline:none;

font:14px amplitude_regular;

background:white;
}

/* TEXTAREA */

.form_group textarea{

height:180px;

padding:18px;

resize:none;
}

#account_form > .form_group{

margin-bottom:28px;
}

/* BUTTON */

#account_form button{

display:flex;

justify-content:center;
align-items:center;

height:58px;

padding:0 34px;

border:none;

border-radius:40px;

background:var(--gold);

cursor:pointer;

font:14px amplitude_regular;

color:var(--base);

transition:.35s;
}

#account_form button:hover{

background:#e0bf65;
}

/*========================
REQUIRED DOCUMENTS
=========================*/

#required_documents{

padding:120px 0;

background:white;
}

/* HEADER */

#required_documents_header{

width:88%;
max-width:900px;

margin:0 auto 70px auto;

text-align:center;
}

#required_documents_header span{

display:inline-flex;

padding:10px 18px;

border-radius:40px;

background:
rgba(214,180,94,.10);

border:
1px solid
rgba(214,180,94,.20);

font:12px amplitude_regular;

letter-spacing:1.5px;

color:var(--gold);

margin-bottom:24px;
}

#required_documents_header h2{

font:58px PlayfairDisplay;

line-height:1.08;

color:var(--base);

margin-bottom:24px;
}

#required_documents_header p{

font:16px amplitude_regular;

line-height:2em;

color:#5E6662;

max-width:760px;

margin:auto;
}

/* GRID */

#required_documents_grid{

width:88%;
max-width:1350px;

margin:auto;

display:flex;

gap:28px;
}

/* CARD */

.document_card{

flex:1;

padding:40px 36px;

background:#F8F6F1;

border-radius:24px;

transition:.35s;
}

.document_card:hover{

transform:translateY(-8px);
}

/* ICON */

.document_icon{

width:72px;
height:72px;

display:flex;
justify-content:center;
align-items:center;

background:white;

border-radius:18px;

margin-bottom:24px;
}

.document_icon svg{

width:30px;
height:30px;

color:var(--gold);
}

/* TITLE */

.document_card h3{

font:30px PlayfairDisplay;

line-height:1.15;

color:var(--base);

margin-bottom:20px;
}

/* LIST */

.document_card ul{

list-style:none;

padding:0;
margin:0;
}

.document_card ul li{

position:relative;

padding-left:24px;

font:15px amplitude_regular;

line-height:2em;

color:#5E6662;
}

/* BULLET */

.document_card ul li:before{

content:'';

position:absolute;

left:0;
top:14px;

width:8px;
height:8px;

border-radius:50%;

background:var(--gold);
}

/*========================
ACCOUNT FAQ
=========================*/

#account_faq{

padding:120px 0;

background:#F8F6F1;
}

/* HEADER */

#account_faq_header{

width:88%;
max-width:900px;

margin:0 auto 70px auto;

text-align:center;
}

#account_faq_header span{

display:inline-flex;

padding:10px 18px;

border-radius:40px;

background:
rgba(214,180,94,.10);

border:
1px solid
rgba(214,180,94,.20);

font:12px amplitude_regular;

letter-spacing:1.5px;

color:var(--gold);

margin-bottom:24px;
}

#account_faq_header h2{
font:55px PlayfairDisplay;
line-height:1.08;
color:var(--base);
margin-bottom:24px;
}

#account_faq_header p{

font:16px amplitude_regular;

line-height:2em;

color:#5E6662;

max-width:760px;

margin:auto;
}

/* FAQ CONTAINER */

#account_faq_container{

width:88%;
max-width:1000px;

margin:auto;
}

/* ITEM */

.faq_item{

background:white;

border-radius:20px;

margin-bottom:18px;

overflow:hidden;

box-shadow:
0 12px 40px
rgba(0,0,0,.03);
}

/* QUESTION */

.faq_question{

width:100%;

display:flex;

justify-content:space-between;
align-items:center;

padding:28px 32px;

background:none;

border:none;

cursor:pointer;

text-align:left;
}

.faq_question span{

font:22px PlayfairDisplay;

line-height:1.3;

color:var(--base);
}

.faq_question svg{

width:22px;
height:22px;

color:var(--gold);

flex-shrink:0;
}

/* ANSWER */

.faq_answer{

display:none;

padding:0 32px 30px 32px;
}

.faq_answer p{

font:15px amplitude_regular;

line-height:2em;

color:#5E6662;
}

/*========================
ACCOUNT CTA
=========================*/

#account_cta{

padding:130px 0;

background:
linear-gradient(
135deg,
#041913,
#0B2A20
);

position:relative;

overflow:hidden;
}

/* CONTAINER */

#account_cta_container{

width:88%;
max-width:900px;

margin:auto;

text-align:center;

position:relative;
z-index:2;
}

/* LABEL */

#account_cta_container span{

display:inline-flex;

padding:10px 18px;

border-radius:40px;

background:
rgba(214,180,94,.10);

border:
1px solid
rgba(214,180,94,.20);

font:12px amplitude_regular;

letter-spacing:1.5px;

color:var(--gold);

margin-bottom:24px;
}

/* TITLE */

#account_cta_container h2{
font:55px PlayfairDisplay;
line-height:1.08;
color:white;
margin-bottom:24px;
}

/* TEXT */

#account_cta_container p{

font:16px amplitude_regular;

line-height:2em;

color:
rgba(255,255,255,.75);

max-width:720px;

margin:0 auto 40px auto;
}

/* ACTIONS */

.account_cta_actions{

display:flex;

justify-content:center;
align-items:center;

gap:18px;
}

/* BUTTONS */

.account_cta_actions a{

display:flex;

justify-content:center;
align-items:center;

height:58px;

padding:0 34px;

border-radius:40px;

text-decoration:none;

font:14px amplitude_regular;

transition:.35s;
}

/* PRIMARY */

.account_cta_primary{

background:var(--gold);

color:var(--base);
}

/* SECONDARY */

.account_cta_secondary{

background:
rgba(255,255,255,.06);

border:
1px solid
rgba(255,255,255,.15);

backdrop-filter:blur(10px);

color:white;
}

/* HOVER */

.account_cta_primary:hover{

background:#e0bf65;
}

.account_cta_secondary:hover{

background:
rgba(255,255,255,.12);
}

#account_cta:before{

content:'';

position:absolute;

width:500px;
height:500px;

border-radius:50%;

background:
rgba(214,180,94,.04);

top:-200px;
left:-150px;
}

#account_cta:after{

content:'';

position:absolute;

width:400px;
height:400px;

border-radius:50%;

background:
rgba(214,180,94,.03);

bottom:-180px;
right:-120px;
}


/**********************************
320px.css
CONFIRM PAGE
**********************************/

#confirm_section{

min-height:100vh;

display:flex;
align-items:center;
justify-content:center;

padding:25px 12px;

box-sizing:border-box;
}

.confirm_card{

width:100%;

max-width:100%;

padding:35px 20px;

border-radius:24px;

box-sizing:border-box;
}

/* LOGO */

.confirm_logo{

margin-bottom:22px;
}

.confirm_logo img{

width:140px;
}

/* SUCCESS ICON */

.confirm_icon{

width:70px;
height:70px;

margin:0 auto 22px;

font-size:32px;
}

/* TAG */

.confirm_tag{

margin-bottom:16px;

font-size:11px;

letter-spacing:2px;
}

/* HEADING */

.confirm_card h1{

font:500 28px PlayfairDisplay;
line-height:1.15;
margin-bottom:16px;
}

/* MESSAGE */

.confirm_message{
max-width:100%;
margin:0 0 28px;

font-size:14px;

line-height:1.8;
}

/* DETAILS */

.confirm_details{

display:flex;

flex-direction:column;

gap:14px;

margin-bottom:28px;
}

.confirm_details div{

width:100%;

padding:16px 18px;

border-radius:16px;

box-sizing:border-box;
}

.confirm_details label{

font-size:11px;

margin-bottom:6px;
}

.confirm_details strong{

font-size:16px;

word-break:break-word;
}

/* NOTE */

.confirm_note{
padding:16px;
margin-bottom:28px;
border-radius:14px;
font-size:13px;
line-height:1.7;
}

/* ACTIONS */

.confirm_actions{
display:flex;

flex-direction:column;

gap:12px;
}

.confirm_actions a{

width:100%;

height:52px;

padding:0 20px;

border-radius:12px;

font-size:14px;

box-sizing:border-box;
}

/* BUTTON HOVER */

.login_btn:hover,
.home_btn:hover{

transform:none;
}