/* ── CSS VARIABLES ─────────────────────────────────── */
:root{
  --ink:      #0A1628;
  --ink2:     #0D1F3C;
  --ink3:     #071830;
  --off:      #1f2271;
  --cream:    #0D1F3C;
  --ember:    #CA8A04;
  --ember2:   #FDE047;
  --ember-lt: rgba(234,179,8,0.12);
  --yellow:     #FDE047;
  --gold2:    #CA8A04;
  --gold-lt:  rgba(234,179,8,0.1);
  --stone:    rgba(220,235,255,0.5);
  --gs-navy:  #0F2347;
  --gs-lt:    rgba(234,179,8,0.07);
  --cyan:     #00B4D8;
  --cyan-lt:  rgba(0,180,216,0.1);
  --navy-mid: #0A1E3D;
}

/* ── RESET ─────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
button,a{cursor:pointer;}
img{display:block;max-width:100%}

/* ── SCROLLBAR ─────────────────────────────────────── */
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:#0A1628}
::-webkit-scrollbar-thumb{background:#FDE047;border-radius:3px}
::-webkit-scrollbar-track{background:#0A1628}

/* ── KEYFRAMES ─────────────────────────────────────── */
@keyframes heroFadeUp  {from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}
@keyframes slowFloat   {0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-12px) rotate(1deg)}}
@keyframes orbPulse    {0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.15);opacity:1}}
@keyframes shimmerSlide{0%{background-position:200% center}100%{background-position:-200% center}}
@keyframes ctaPulse    {0%,100%{box-shadow:0 0 0 0 rgba(234,179,8,.5)}60%{box-shadow:0 0 0 16px rgba(234,179,8,0)}}
@keyframes tickerMove  {0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes fadeIn      {from{opacity:0}to{opacity:1}}
@keyframes revealUp    {from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}

/* ── HERO STAGGER ──────────────────────────────────── */
.hero-d1{animation:heroFadeUp .9s cubic-bezier(.22,1,.36,1) .1s both}
.hero-d2{animation:heroFadeUp .9s cubic-bezier(.22,1,.36,1) .28s both}
.hero-d3{animation:heroFadeUp .9s cubic-bezier(.22,1,.36,1) .46s both}
.hero-d4{animation:heroFadeUp .9s cubic-bezier(.22,1,.36,1) .64s both}
.hero-d5{animation:heroFadeUp .9s cubic-bezier(.22,1,.36,1) .82s both}

/* ── REVEAL ON SCROLL ──────────────────────────────── */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .75s ease,transform .75s ease}
.reveal.in{opacity:1;transform:translateY(0)}

/* ── DRIVE TILE ────────────────────────────────────── */
.drive-tile{transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .35s ease}
.drive-tile:hover{transform:translateY(-8px) scale(1.05)}

/* ── PROB CARD ─────────────────────────────────────── */
.prob-card{transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}

/* ── STAT CHIP ─────────────────────────────────────── */
.stat-chip{transition:transform .3s ease,box-shadow .3s ease}
.stat-chip:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,0,0,.2)!important}

/* ── STEP ROW ──────────────────────────────────────── */
.step-row-item{transition:border-color .3s ease,background .3s ease}

/* ── FAQ WRAP ──────────────────────────────────────── */
.faq-wrap{transition:background .3s ease,border-color .3s ease}
.faq-wrap:hover{border-color:rgba(234,179,8,.35)!important}

/* ── NAV PILL ──────────────────────────────────────── */
.nav-pill{transition:background .25s ease,color .25s ease;text-decoration:none}
.nav-pill:hover{background:rgba(234,179,8,.12)!important;color:#FDE047!important}

/* ── TICKER ────────────────────────────────────────── */
.ticker-track{display:flex;animation:tickerMove 28s linear infinite;width:max-content}

/* ── EMBER TEXT ────────────────────────────────────── */
.ember-text{
  background:#000;
  background-size:300% auto;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;animation:shimmerSlide 5s linear infinite;
}

/* ── GS BADGE ──────────────────────────────────────── */
.gs-badge{
  background: linear-gradient(180deg, #2B8D93 8.7%, rgba(123, 134, 119, 0) 108.7%), linear-gradient(0deg, rgba(34, 182, 156, 0.66), rgba(34, 182, 156, 0.66)), linear-gradient(0deg, #3F6E2B, #3F6E2B);
  padding:6px 14px;border-radius:4px;
  display:inline-flex;align-items:center;gap:8px;
  backdrop-filter:blur(8px);
}

/* ── RESULT CARD (Island B) ─────────────────────────── */
.result-card{transition:all .3s ease}

.masterclass-modal{
    position:fixed;
    inset:0;

    display:none;

    justify-content:center;

    overflow-y:auto;

    padding:20px;

    background:rgba(0,0,0,.75);
    backdrop-filter:blur(8px);
    z-index:99999;
}

.masterclass-modal.active{
    display:flex;
}

.masterclass-modal__box{
    width:100%;
    max-width:800px;
    max-height:90vh;
    overflow-y:auto;

    background:linear-gradient(
        90deg,
        #031528,
        #08213b
    );

    border-radius:24px;
    padding:32px;
    position:relative;
}

.masterclass-modal__logo{
    color:#fff;
    font-size:18px;
    margin-bottom:25px;
}

.masterclass-modal__title{
    color:#fff;
    font-size:34px;
    font-weight:800;
    line-height:1;
    margin-bottom:15px;
}

.masterclass-modal__subtitle{
    color:#d6d6d6;
    font-size:20px;
    margin-bottom:40px;
}

.masterclass-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    margin-bottom:20px;
}

.masterclass-field{
    display:flex;
    flex-direction:column;
}

.masterclass-field label{
    color:#d7d7d7;
    font-size:17px;
    font-weight:600;
    margin-bottom:10px;
}

.masterclass-field input,
.masterclass-field select{
    height:54px;
    padding:0 18px;
    margin:0;
    font-size:16px;
    border:none;
    border-radius:18px;
    background:#f1f1f1;
}

.masterclass-full{
    margin-bottom:20px;
}

.masterclass-submit{
    width:100%;
    height:50px;
    border:none;
    border-radius:18px;
    background:#f0b400;
    color:#fff;
    font-size:16px;
    font-weight:700;
    cursor:pointer;
}

.masterclass-submit:hover{
    opacity:.95;
}

.masterclass-modal__close{
    position:absolute;
    top:20px;
    right:25px;
    background:none;
    border:none;
    color:#fff;
    font-size:38px;
    cursor:pointer;
}

@media(max-width:768px){

    .masterclass-modal__box{
        padding:30px 20px;
    }

    .masterclass-grid{
        grid-template-columns:1fr;
    }

    .masterclass-modal__title{
        font-size:36px;
    }

    .masterclass-modal__subtitle{
        font-size:16px;
    }

}

/* ── RESPONSIVE ────────────────────────────────────── */
@media(max-width:640px){
  .hero-inner{padding:0 20px}
  section{padding-left:20px!important;padding-right:20px!important}
  nav{padding:12px 20px!important}
  .drive-tiles{gap:8px!important}
  .drive-tile{width:64px!important;height:72px!important}
}

/* ==========================
   RESET LABS APPLICATION FORM
========================== */

.trl-modal{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.85);
    backdrop-filter:blur(8px);
    z-index:999999;
    justify-content:center;
    align-items:center;
    padding:20px;
}

.trl-modal.active{
    display:flex;
}

.trl-modal-box{
    width:100%;
    max-width:920px;
    max-height:92vh;
    overflow-y:auto;
    background:linear-gradient(
        135deg,
        #031528 0%,
        #08213b 100%
    );
    border:1px solid rgba(253,224,71,.15);
    border-radius:28px;
    padding:40px;
    position:relative;
    box-shadow:
        0 20px 60px rgba(0,0,0,.45),
        0 0 40px rgba(253,224,71,.05);
}

/* Scrollbar */

.trl-modal-box::-webkit-scrollbar{
    width:8px;
}

.trl-modal-box::-webkit-scrollbar-thumb{
    background:#FDE047;
    border-radius:20px;
}

.trl-modal-box::-webkit-scrollbar-track{
    background:#071830;
}

/* Close Button */

.trl-close{
    position:absolute;
    top:18px;
    right:22px;
    width:45px;
    height:45px;
    border:none;
    background:none;
    color:#fff;
    font-size:42px;
    cursor:pointer;
    line-height:1;
}

/* Heading */

.trl-modal h2{
    color:#fff;
    font-size:34px;
    font-weight:800;
    line-height:1.05;
    margin-bottom:18px;
    max-width:700px;
}

.subtitle{
    color:#ffffff;
    font-size:20px;
    margin-bottom:45px;
}

/* Form Layout */

.grid-2{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:22px;
    margin-bottom:25px;
}

.grid-3{
    margin-bottom:25px !important;
}

.master-section{
    margin-top:40px;
    margin-bottom:35px;
}

/* Labels */

.trl-modal label{
    color:#d7dbe5;
    font-size:16px;
    font-weight:600;
    margin-bottom:10px;
}

/* Inputs */

.trl-modal input[type="text"],
.trl-modal input[type="email"],
.trl-modal input[type="tel"],
.trl-modal select,
.trl-modal textarea{
    width:100%;
        height: 54px;
    padding: 0 18px;
    margin: 0;
    font-size: 16px;
    border: none;
    border-radius: 18px;
    background: #f1f1f1;
}

.trl-modal input:focus,
.trl-modal textarea:focus{
    box-shadow:
    0 0 0 3px rgba(253,224,71,.25);
}

.trl-modal textarea{
    min-height:180px;
    resize:vertical;
}

.trl-modal select{
    appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%230A1628' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 15px center;
    padding-right:50px;
}

/* Section Titles */

.form-heading{
    color:#ffffff;
    font-size:34px;
    font-weight:700;
    margin-bottom:25px;
}

.form-question{
    color:#d7dbe5;
    font-size:18px;
    font-weight:700;
    margin-bottom:18px;
}

/* Option Cards */

.option-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:16px;
    margin-bottom:35px;
}

.option-card{
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 54px;
    padding: 14px;
    border: 1px solid var(--rlv-border);
    border-radius: 14px;
    background: #3b82f61f;
    color: #fff;
    cursor: pointer;
}

.option-card:hover{
    border-color:#FDE047;
    background:#1b4478;
}

.option-card input{
    width:18px;
    height:18px;
}

/* Income Box */

.income-box{
    border:1px solid rgba(253,224,71,.25);
    border-radius:24px;
    padding:28px;
    margin-top:20px;
    margin-bottom:40px;
    background:rgba(255,255,255,.02);
}

/* Submit */

.submit-btn{
        width: 100%;
    height: 50px;
    border: none;
    border-radius: 18px;
    background: #f0b400;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
}

.submit-btn:hover{
    transform:translateY(-2px);
    filter:brightness(1.05);
}

/* Success Message */

.success-message{
    display:none;
    margin-top:20px;
    padding:15px 20px;
    border-radius:12px;
    background:#16a34a;
    color:#fff;
    font-size:16px;
    font-weight:600;
    text-align:center;
}

/* Mobile */

@media(max-width:768px){

    .trl-modal{
        padding:10px;
    }

    .trl-modal-box{
        padding:25px;
        border-radius:20px;
    }

    .trl-modal h2{
        font-size:40px;
    }

    .subtitle{
        font-size:16px;
        margin-bottom:30px;
    }

    .grid-2{
        grid-template-columns:1fr;
    }

    .option-grid{
        grid-template-columns:1fr;
    }

    .option-card{
        min-height:auto;
        padding:18px;
    }

    .submit-btn{
        height:58px;
        font-size:18px;
    }
}

@media(max-width:480px){

    .trl-modal h2{
        font-size:32px;
    }

    .form-question{
        font-size:17px;
    }

    .trl-modal input,
    .trl-modal select,
    .trl-modal textarea{
        font-size:16px;
    }
}