/* Tropicana Property Referral Programme — RNR redesign */
/* index.html only */

/* ---------- utility ---------- */
  .wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.btn{
    display:inline-block;font-family:var(--body);font-weight:500;font-size:14px;
    letter-spacing:.14em;text-transform:uppercase;text-decoration:none;
    padding:16px 38px;border:1px solid var(--gold);color:var(--gold);
    background:transparent;transition:all .35s ease;cursor:pointer;
  }
.burger span{display:block;width:24px;height:2px;background:var(--gold);margin:5px 0;transition:.3s}
/* ---------- hero ---------- */
  header{
    position:relative;min-height:100svh;display:flex;align-items:center;
    background:
      radial-gradient(1200px 600px at 80% -10%, rgba(27,90,77,.65), transparent 60%),
      radial-gradient(900px 500px at -10% 110%, rgba(201,164,92,.14), transparent 55%),
      linear-gradient(160deg, var(--palm) 0%, #0B211D 100%);
    color:var(--ivory);overflow:hidden;
  }
/* palm frond line-art */
  header::after{
    content:"";position:absolute;right:-120px;top:-80px;width:640px;height:640px;
    border:1px solid rgba(201,164,92,.18);border-radius:50%;
  }
header::before{
    content:"";position:absolute;right:40px;top:120px;width:340px;height:340px;
    border:1px solid rgba(201,164,92,.12);border-radius:50%;
  }
.hero-grid{position:relative;z-index:2;width:100%;padding-top:140px;padding-bottom:80px}
  .hero-grid .row{display:flex;flex-wrap:wrap;align-items:center}
  @media (max-width:991px){.hero-grid .row{display:block}}
.hero-copy h1{font-size:clamp(40px,5.2vw,68px);color:var(--ivory);margin:26px 0 8px}
.hero-copy h1 em{font-style:normal;color:var(--gold)}
.hero-sub{
    font-size:17px;color:rgba(247,244,236,.82);max-width:520px;margin:22px 0 38px;
  }
.hero-actions{display:flex;gap:18px;flex-wrap:wrap}
.hero-visual{position:relative;text-align:center}
.hero-visual img{max-width:78%;height:auto;filter:drop-shadow(0 40px 60px rgba(0,0,0,.45))}
.hero-visual .ring{
    position:absolute;inset:0;margin:auto;width:110%;aspect-ratio:1;
    border:1px solid rgba(201,164,92,.35);border-radius:50%;pointer-events:none;
  }
.locations-bar{
    position:absolute;bottom:0;left:0;right:0;z-index:3;
    border-top:1px solid rgba(201,164,92,.25);
    background:rgba(11,33,29,.6);backdrop-filter:blur(6px);
  }
.locations-inner{
    max-width:1180px;margin:0 auto;padding:18px 24px;display:flex;
    justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  }
.locations-inner span{
    font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-pale);
  }
.locations-inner i{width:5px;height:5px;background:var(--gold);transform:rotate(45deg);display:inline-block}
/* ---------- gold thread signature ---------- */
  .thread{position:relative}
/* ---------- how it works ---------- */
  .steps{padding:55px 0 90px;text-align:center}
.steps h2{font-size:clamp(30px,3.6vw,44px);margin:20px 0 64px}
.steps-grid{text-align:left}
  .step{margin-bottom:30px}
.step{
    background:#fff;border:1px solid rgba(20,69,60,.12);padding:42px 34px 38px;
    position:relative;transition:transform .35s ease, box-shadow .35s ease;
  }
.step-num{
    font-family:var(--display);font-size:15px;color:var(--gold);
    letter-spacing:.2em;display:block;margin-bottom:18px;
  }
.step h3{font-size:23px;margin-bottom:12px;color:var(--emerald)}
.step p{font-size:15px;color:#4C5A55}
/* ---------- category split ---------- */
  .categories{background:var(--emerald);color:var(--ivory);padding:90px 0;position:relative;overflow:hidden}
.categories::after{
    content:"";position:absolute;left:-160px;bottom:-160px;width:480px;height:480px;
    border:1px solid rgba(201,164,92,.15);border-radius:50%;
  }
.cat-head{text-align:center;margin-bottom:64px}
.cat-head h2{font-size:clamp(30px,3.6vw,44px);color:var(--ivory);margin-top:20px}
.cat-head p{color:rgba(247,244,236,.75);margin-top:14px}
.cat-grid{position:relative;z-index:2}
  .cat-card{margin-bottom:30px}
.cat-card{
    border:1px solid rgba(201,164,92,.4);padding:56px 46px;
    background:rgba(11,33,29,.35);transition:background .35s ease, transform .35s ease;
    display:flex;flex-direction:column;align-items:flex-start;gap:0;
  }
.cat-card:hover{background:rgba(201,164,92,.08);transform:translateY(-4px)}
.cat-tag{
    font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);
    border:1px solid rgba(201,164,92,.5);padding:7px 16px;margin-bottom:26px;
  }
.cat-card h3{font-size:30px;color:var(--ivory);margin-bottom:14px}
.cat-card p{color:rgba(247,244,236,.78);font-size:15.5px;margin-bottom:34px;flex:1}
.cat-card .btn{align-self:flex-start}
/* ---------- register ---------- */
.register{padding:90px 0;text-align:center}
.register h2{font-size:clamp(30px,3.6vw,46px);margin:22px 0 16px}
.register p{max-width:520px;margin:0 auto 42px;color:#4C5A55}
/* ---------- footer ---------- */
  footer{background:var(--palm);color:rgba(247,244,236,.6);padding:35px 0;font-size:13px}
/* ---------- reveal ---------- */
  .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease, transform .8s ease}
/* ---------- responsive ---------- */
  @media (max-width: 991px){
    .hero-grid{text-align:center;padding-top:120px}
    .hero-copy .eyebrow{justify-content:center}
    .hero-sub{margin-left:auto;margin-right:auto}
    .hero-actions{justify-content:center}
    .hero-visual{margin-top:10px;margin-bottom:26px}
    .hero-visual img{max-width:46%}
    
    
    .nav-links{
      position:fixed;top:66px;right:0;flex-direction:column;align-items:center;
      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}
    .locations-inner{justify-content:center}
    .locations-inner i{display:none}
    .locations-inner span{font-size:10.5px;letter-spacing:.18em}
  }