/* =========================================================
   QUOTRYN LEGAL + SUPPORT DESIGN SYSTEM
   ========================================================= */

.legal-page{
  min-height:100vh;
  background:
    radial-gradient(circle at 78% 8%,rgba(50,255,157,.07),transparent 30%),
    radial-gradient(circle at 15% 45%,rgba(50,255,157,.025),transparent 28%),
    #020d08;
}

.legal-topbar{
  width:min(1440px,calc(100% - 48px));
  margin:auto;
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid rgba(108,255,183,.08);
}

.legal-topnav{
  display:flex;
  align-items:center;
  gap:28px;
  font-size:13px;
}

.legal-topnav a{
  color:var(--muted);
  transition:.2s ease;
}

.legal-topnav a:hover{
  color:#fff;
}

.legal-top-actions{
  display:flex;
  align-items:center;
  gap:10px;
}

.legal-container{
  width:min(1380px,calc(100% - 48px));
  margin:auto;
  padding:64px 0 90px;
}

.legal-hero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 270px;
  gap:60px;
  align-items:center;
  padding-bottom:55px;
  border-bottom:1px solid rgba(108,255,183,.12);
}

.legal-hero-copy{
  max-width:780px;
}

.legal-eyebrow{
  color:var(--green);
  font-size:11px;
  font-weight:800;
  letter-spacing:4px;
  margin-bottom:18px;
}

.legal-hero h1{
  margin:0 0 20px;
  font:800 clamp(44px,6vw,72px)/1 Manrope,sans-serif;
  letter-spacing:-3px;
}

.legal-hero p{
  max-width:720px;
  margin:0;
  color:var(--muted);
  font-size:15px;
  line-height:1.8;
}

.legal-date{
  margin-top:18px;
  color:#82998d;
  font-size:12px;
}

.legal-hero-card{
  position:relative;
  overflow:hidden;
  min-height:180px;
  display:flex;
  align-items:center;
  gap:18px;
  padding:28px;
  border:1px solid rgba(66,255,160,.28);
  border-radius:18px;
  background:
    radial-gradient(circle at 100% 0%,rgba(50,255,157,.14),transparent 60%),
    linear-gradient(145deg,#071c12,#04110b);
  box-shadow:0 25px 80px rgba(0,0,0,.28);
}

.legal-hero-card::after{
  content:"";
  position:absolute;
  width:170px;
  height:170px;
  right:-80px;
  top:-80px;
  border:1px solid rgba(71,255,166,.12);
  border-radius:50%;
}

.legal-hero-icon{
  width:58px;
  height:58px;
  flex:0 0 58px;
  display:grid;
  place-items:center;
  border-radius:14px;
  border:1px solid rgba(69,255,164,.24);
  background:rgba(34,255,143,.07);
  color:var(--green);
  font-size:27px;
}

.legal-hero-card strong{
  display:block;
  margin-bottom:6px;
  font:700 15px Manrope,sans-serif;
}

.legal-hero-card span{
  color:var(--muted);
  font-size:12px;
  line-height:1.6;
}

.legal-layout{
  display:grid;
  grid-template-columns:250px minmax(0,1fr);
  gap:48px;
  align-items:start;
  padding-top:42px;
}

.legal-sidebar{
  position:sticky;
  top:28px;
  border:1px solid rgba(71,255,166,.16);
  border-radius:16px;
  padding:18px;
  background:rgba(5,23,15,.78);
  backdrop-filter:blur(16px);
}

.legal-sidebar-title{
  padding:4px 9px 13px;
  color:#fff;
  font-size:12px;
  font-weight:700;
}

.legal-sidebar a{
  display:flex;
  gap:10px;
  align-items:center;
  padding:9px 10px;
  border-radius:8px;
  color:#81998d;
  font-size:11px;
  line-height:1.35;
  transition:.18s ease;
}

.legal-sidebar a:hover{
  color:#fff;
  background:rgba(44,255,147,.055);
}

.legal-sidebar a.active{
  color:#fff;
  background:rgba(44,255,147,.09);
  border-left:2px solid var(--green);
}

.legal-document{
  min-width:0;
}

.legal-document section{
  scroll-margin-top:30px;
  padding:0 0 36px;
  margin-bottom:36px;
  border-bottom:1px solid rgba(103,255,178,.10);
}

.legal-document section:last-of-type{
  border-bottom:0;
}

.legal-document h2{
  margin:0 0 15px;
  font:750 25px/1.25 Manrope,sans-serif;
  letter-spacing:-.5px;
}

.legal-document h3{
  margin:22px 0 7px;
  font:700 14px Manrope,sans-serif;
}

.legal-document p,
.legal-document li{
  color:#9ab0a5;
  font-size:13px;
  line-height:1.8;
}

.legal-document ul{
  padding-left:20px;
}

.legal-document a{
  color:var(--green);
}

.legal-info-card{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:16px;
  align-items:center;
  margin:10px 0;
  padding:17px;
  border:1px solid rgba(70,255,163,.18);
  border-radius:13px;
  background:linear-gradient(145deg,rgba(7,31,20,.92),rgba(4,18,12,.92));
}

.legal-info-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:rgba(48,255,151,.07);
  border:1px solid rgba(48,255,151,.14);
  color:var(--green);
  font-size:20px;
}

.legal-info-card strong{
  display:block;
  margin-bottom:3px;
  font-size:12px;
}

.legal-info-card span{
  color:#849b90;
  font-size:11px;
  line-height:1.55;
}

.legal-checklist{
  list-style:none;
  padding:0!important;
}

.legal-checklist li{
  position:relative;
  padding-left:25px;
}

.legal-checklist li::before{
  content:"\2713";
  position:absolute;
  left:0;
  top:0;
  color:var(--green);
  font-weight:800;
}

.legal-callout{
  display:flex;
  align-items:center;
  gap:18px;
  margin-top:20px;
  padding:22px 24px;
  border:1px solid rgba(58,255,157,.30);
  border-radius:14px;
  background:
    radial-gradient(circle at 100% 50%,rgba(47,255,153,.08),transparent 35%),
    #06170f;
}

.legal-callout-icon{
  width:48px;
  height:48px;
  flex:0 0 48px;
  display:grid;
  place-items:center;
  border-radius:12px;
  border:1px solid rgba(61,255,159,.20);
  color:var(--green);
  font-size:21px;
}

.legal-callout strong{
  display:block;
  font:700 13px Manrope,sans-serif;
  margin-bottom:4px;
}

.legal-callout p{
  margin:0;
  color:#849b90;
  font-size:11px;
}


/* =========================================================
   HELP CENTER
   ========================================================= */

.help-modern{
  width:min(1120px,calc(100% - 48px));
  margin:auto;
  padding:75px 0 100px;
}

.help-modern-hero{
  text-align:center;
  max-width:760px;
  margin:0 auto 65px;
}

.help-modern-hero h1{
  margin:18px 0;
  font:800 clamp(44px,6vw,66px)/1 Manrope,sans-serif;
  letter-spacing:-2.5px;
}

.help-modern-hero p{
  color:var(--muted);
  line-height:1.7;
}

.help-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-bottom:42px;
}

.help-card{
  min-height:205px;
  padding:24px;
  border:1px solid rgba(67,255,160,.18);
  border-radius:16px;
  background:linear-gradient(145deg,#071b12,#04110b);
  transition:.2s ease;
}

.help-card:hover{
  transform:translateY(-2px);
  border-color:rgba(67,255,160,.34);
}

.help-card-icon{
  width:43px;
  height:43px;
  display:grid;
  place-items:center;
  margin-bottom:18px;
  border-radius:11px;
  color:var(--green);
  background:rgba(47,255,150,.07);
  border:1px solid rgba(47,255,150,.16);
  font-size:19px;
}

.help-card h3{
  margin:0 0 10px;
  font:700 15px Manrope,sans-serif;
}

.help-card p{
  min-height:65px;
  margin:0 0 16px;
  color:var(--muted);
  font-size:12px;
  line-height:1.7;
}

.help-card a{
  color:var(--green);
  font-size:11px;
  font-weight:700;
}

.help-faq-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:20px;
  padding-top:34px;
  margin-bottom:20px;
  border-top:1px solid rgba(68,255,160,.16);
}

.help-faq-head h2{
  margin:0 0 5px;
  font:750 26px Manrope,sans-serif;
}

.help-faq-head p{
  margin:0;
  color:var(--muted);
  font-size:12px;
}

.help-modern details{
  margin-bottom:9px;
  border:1px solid rgba(66,255,159,.17);
  border-radius:11px;
  background:#06180f;
  overflow:hidden;
}

.help-modern summary{
  cursor:pointer;
  padding:16px 18px;
  color:#fff;
  font:650 13px Manrope,sans-serif;
}

.help-modern details p{
  padding:0 18px 17px;
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.75;
}

.help-contact-banner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  margin-top:35px;
  padding:24px;
  border:1px solid rgba(63,255,158,.30);
  border-radius:15px;
  background:
    radial-gradient(circle at 85% 50%,rgba(48,255,151,.09),transparent 28%),
    #06180f;
}

.help-contact-banner h3{
  margin:0 0 5px;
  font:700 15px Manrope,sans-serif;
}

.help-contact-banner p{
  margin:0;
  color:var(--muted);
  font-size:11px;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:900px){
  .legal-hero{
    grid-template-columns:1fr;
  }

  .legal-hero-card{
    min-height:auto;
  }

  .legal-layout{
    grid-template-columns:1fr;
  }

  .legal-sidebar{
    display:none;
  }

  .help-cards{
    grid-template-columns:1fr;
  }
}

@media(max-width:650px){
  .legal-topbar,
  .legal-container,
  .help-modern{
    width:min(100% - 30px,1380px);
  }

  .legal-topnav{
    display:none;
  }

  .legal-container{
    padding-top:40px;
  }

  .legal-hero{
    gap:30px;
  }

  .legal-hero h1{
    letter-spacing:-2px;
  }

  .legal-layout{
    padding-top:30px;
  }

  .help-modern{
    padding-top:45px;
  }

  .help-contact-banner{
    align-items:flex-start;
    flex-direction:column;
  }
}