/* Tropicana Property Referral Programme — RNR redesign */
/* buyer.html & nonbuyer.html */

.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.btn{
    display:inline-block;font-family:var(--body);font-weight:500;font-size:13px;
    letter-spacing:.14em;text-transform:uppercase;text-decoration:none;
    padding:13px 28px;border:1px solid var(--gold);color:var(--gold);
    background:transparent;transition:all .35s ease;cursor:pointer;
  }
.nav-links a.active{color:var(--gold)}
.burger span{display:block;width:24px;height:2px;background:var(--gold);margin:5px 0}
/* ---------- hero ---------- */
  header{
    position:relative;padding:170px 0 90px;
    background:
      radial-gradient(1000px 520px at 85% -10%, rgba(27,90,77,.65), transparent 60%),
      radial-gradient(800px 460px at -10% 110%, rgba(201,164,92,.14), transparent 55%),
      linear-gradient(160deg, var(--palm) 0%, #0B211D 100%);
    color:var(--ivory);overflow:hidden;text-align:center;
  }
header::after{
    content:"";position:absolute;right:-140px;top:-100px;width:560px;height:560px;
    border:1px solid rgba(201,164,92,.16);border-radius:50%;
  }
.hero-tag{
    font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);
    border:1px solid rgba(201,164,92,.5);padding:8px 18px;display:inline-block;margin-bottom:26px;
  }
header h1{font-size:clamp(34px,4.6vw,60px);color:var(--ivory)}
.hero-amount{
    display:block;font-size:clamp(52px,8vw,104px);color:var(--gold);margin:8px 0 4px;
  }
.hero-amount sup{font-size:.32em;vertical-align:super;color:var(--gold-pale)}
header p.lede{max-width:520px;margin:22px auto 0;color:rgba(247,244,236,.8);font-size:16.5px}
.tnc-note{font-size:12px;color:rgba(247,244,236,.45);margin-top:16px;display:block}
/* ---------- gold thread ---------- */
  .thread{position:relative}
/* ---------- steps ---------- */
  .steps{padding:55px 0 90px;text-align:center}
.steps h2{font-size:clamp(28px,3.4vw,42px);margin:20px 0 60px}
.steps-grid{text-align:left}
  .step{margin-bottom:26px}
.step{
    background:#fff;border:1px solid rgba(20,69,60,.12);padding:36px 28px 32px;
    transition:transform .35s ease, box-shadow .35s ease;
  }
.step img{height:52px;width:auto;margin-bottom:20px;display:block}
.step-num{
    font-family:var(--display);font-size:14px;color:var(--gold);
    letter-spacing:.2em;display:block;margin-bottom:10px;
  }
.step p{font-size:14.5px;color:#4C5A55}
/* ---------- projects ---------- */
  .projects{background:var(--emerald);color:var(--ivory);padding:100px 0;position:relative;overflow:hidden}
.projects::after{
    content:"";position:absolute;left:-160px;bottom:-160px;width:460px;height:460px;
    border:1px solid rgba(201,164,92,.14);border-radius:50%;
  }
.proj-head{text-align:center;margin-bottom:44px}
.proj-head h2{font-size:clamp(28px,3.4vw,42px);color:var(--ivory);margin-top:20px}
.filter-tabs{display:flex;justify-content:center;gap:0;margin-bottom:52px;position:relative;z-index:2}
.filter-tabs button{
    font-family:var(--body);font-weight:500;font-size:13px;letter-spacing:.16em;
    text-transform:uppercase;padding:13px 32px;background:transparent;
    border:1px solid rgba(201,164,92,.5);color:var(--gold-pale);cursor:pointer;
    transition:all .3s ease;
  }
.filter-tabs button + button{border-left:none}
.filter-tabs button.active{background:var(--gold);color:var(--palm);border-color:var(--gold)}
.proj-grid{position:relative;z-index:2}
  .card{margin-bottom:30px}
.card{
    background:rgba(11,33,29,.45);border:1px solid rgba(201,164,92,.3);
    display:flex;flex-direction:column;overflow:hidden;
    transition:transform .35s ease, border-color .35s ease;
  }
.card:hover{transform:translateY(-5px);border-color:var(--gold)}

.card-img{position:relative;aspect-ratio:16/10;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.card:hover .card-img img{transform:scale(1.05)}
.fee-badge{
    position:absolute;z-index:2;top:14px;left:14px;background:var(--gold);color:var(--palm);
    font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
    padding:7px 14px;
  }
.card-body{padding:26px 24px 24px;display:flex;flex-direction:column;flex:1}
.card-body h3{font-size:20px;color:var(--ivory);margin-bottom:6px;line-height:1.3}
.card-tag{font-size:13.5px;color:rgba(247,244,236,.65);margin-bottom:18px}
.card-meta{
    display:flex;flex-direction:column;gap:8px;font-size:13px;color:var(--gold-pale);
    border-top:1px solid rgba(201,164,92,.25);border-bottom:1px solid rgba(201,164,92,.25);
    padding:14px 0;margin-bottom:16px;
  }
.card-meta span{display:flex;align-items:center;gap:9px}
.card-meta span::before{
    content:"";width:15px;height:15px;flex-shrink:0;
    background-repeat:no-repeat;background-position:center;background-size:contain;
  }
.card-meta span:nth-child(1)::before{
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9A45C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/><circle cx='12' cy='10' r='3'/></svg>");
  }
.card-meta span:nth-child(2)::before{
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9A45C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><polyline points='15 3 21 3 21 9'/><polyline points='9 21 3 21 3 15'/><line x1='21' y1='3' x2='14' y2='10'/><line x1='3' y1='21' x2='10' y2='14'/></svg>");
  }
.card-price{font-size:14px;color:rgba(247,244,236,.75);margin-bottom:20px}
.card-price b{font-family:var(--display);font-weight:400;font-size:19px;color:var(--gold);letter-spacing:.02em}
.card-links{display:flex;gap:10px;margin-top:auto;flex-wrap:wrap}
.card-links .btn{padding:10px 18px;font-size:11.5px}
/* ---------- form ---------- */
  .register{padding:50px 0;text-align:center}
.register h2{font-size:clamp(28px,3.4vw,44px);margin:22px 0 14px}
.register > .wrap > p{max-width:520px;margin:0 auto 54px;color:#4C5A55}
.form-shell{
    background:#fff;border:1px solid rgba(20,69,60,.14);padding:56px 54px;
    text-align:left;box-shadow:0 30px 60px rgba(14,43,38,.08);
  }
.form-col{padding-left:24px;padding-right:24px}
.form-col h3{
    font-size:22px;color:var(--emerald);margin-bottom:6px;
  }
.form-col .role-note{font-size:13px;color:#7A8783;margin-bottom:26px;display:block}
.field{margin-bottom:20px}
.field label{
    display:block;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;
    color:var(--emerald);font-weight:500;margin-bottom:8px;
  }
.field input,.field select{
    width:100%;font-family:var(--body);font-size:15px;font-weight:300;color:var(--ink);
    padding:13px 14px;border:1px solid rgba(20,69,60,.25);background:var(--ivory);
    transition:border-color .3s;appearance:none;border-radius:0;
  }
.field select{
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23C9A45C' stroke-width='1.5'/></svg>");
    background-repeat:no-repeat;background-position:right 14px center;padding-right:38px;
  }
.field input:focus,.field select:focus{outline:none;border-color:var(--gold)}
.field-note{
  display:block;margin-top:7px;
  font-size:12px;color:#9AA6A2;line-height:1.5;
  font-style:italic;
}
/* Select2 — match .field select styling */
.field .select2-container{width:100%!important}
.field .select2-container--default .select2-selection--single{
  height:auto;min-height:0;
  border:1px solid rgba(20,69,60,.25);border-radius:0;
  background:var(--ivory);
  padding:13px 38px 13px 14px;
  font-family:var(--body);font-size:15px;font-weight:300;color:var(--ink);
  transition:border-color .3s;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23C9A45C' stroke-width='1.5'/></svg>");
  background-repeat:no-repeat;background-position:right 14px center;
}
.field .select2-container--default .select2-selection--single .select2-selection__rendered{
  padding:0;margin:0;color:var(--ink);font-weight:300;line-height:1.4;
}
.field .select2-container--default .select2-selection--single .select2-selection__placeholder{color:#8A9490}
.field .select2-container--default .select2-selection--single .select2-selection__arrow{display:none}
.field .select2-container--default .select2-selection--single .select2-selection__clear{
  font-weight:400;color:#8A9490;margin-right:22px;font-size:15px;
}
.field .select2-container--default.select2-container--open .select2-selection--single,
.field .select2-container--default .select2-selection--single:focus,
.field .select2-container--default .select2-selection--single:hover{
  border-color:var(--gold);outline:none;
}
.select2-container--default.select2-container--open .select2-dropdown{
  border:1px solid rgba(20,69,60,.25);background:var(--ivory);border-radius:0;
  font-family:var(--body);font-size:15px;font-weight:300;color:var(--ink);
}
.select2-container--default.select2-container--open .select2-results__option{padding:10px 14px}
.select2-container--default.select2-container--open .select2-results__option--highlighted.select2-results__option--selectable{
  background-color:rgba(20,69,60,.08);color:var(--ink);
}
.select2-container--default.select2-container--open .select2-results__option--selected{
  background-color:rgba(20,69,60,.14);color:var(--ink);
}
.select2-container--default .select2-search--dropdown .select2-search__field{
  border:1px solid rgba(20,69,60,.25);padding:10px 12px;
  font-family:var(--body);font-size:14px;outline:none;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus{border-color:var(--gold)}
.pdpa{
    display:flex;gap:14px;align-items:flex-start;margin:34px 0 30px;
    font-size:12.5px;color:#7A8783;line-height:1.65;
  }
.pdpa input{margin-top:4px;accent-color:var(--emerald);width:16px;height:16px;flex-shrink:0}
.form-submit{text-align:center}
.form-submit .btn{padding:16px 52px;font-size:14px}
footer{background:var(--palm);color:rgba(247,244,236,.6);padding:35px 0;font-size:13px}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease, transform .8s ease}

@media (max-width: 767px){
    
    
    
    .form-shell{padding:40px 26px}
    .nav-links{
      position:fixed;top:66px;right:0;flex-direction:column;align-items:flex-end;
      background:rgba(14,43,38,.97);width:100%;padding:28px 24px;gap:24px;
      transform:translateY(-140%);transition:transform .4s ease;
    }
    .nav-links.open{transform:none}
    .burger{display:block}
  }


/* ---------- video lightbox (Magnific Popup) ---------- */
.mfp-fade.mfp-bg{opacity:0;transition:opacity .3s ease}
.mfp-fade.mfp-bg.mfp-ready{opacity:.92;background:#0B211D}
.mfp-fade.mfp-bg.mfp-removing{opacity:0}
.mfp-fade.mfp-wrap .mfp-content{opacity:0;transition:opacity .3s ease}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content{opacity:1}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content{opacity:0}
.mfp-iframe-holder .mfp-close{color:#C9A45C;font-family:inherit}
.mfp-iframe-scaler iframe{box-shadow:0 30px 80px rgba(0,0,0,.6);background:#000;border:1px solid rgba(201,164,92,.4)}
