/* =====================================================
   ROOT VARIABLES
===================================================== */
:root{
  --accent:#30687c;
  --accent-grad:linear-gradient(135deg,#30687c,#60a5fa);

  --text-dark:#0f172a;
  --text-muted:#475569;

  --glass-bg:rgba(255,255,255,.82);
  --glass-border:rgba(255,255,255,.45);

  --shadow-soft:0 24px 60px rgba(0,0,0,.12);
  --shadow-deep:0 50px 120px rgba(0,0,0,.18);
}

/* =====================================================
   BASE RESET
===================================================== */


/* =====================================================
   HERO
===================================================== */
.hero-apple{
  position:relative;
  padding:70px 0 40px;
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.97),
      rgba(255,255,255,.9)
    ),
    url("https://sastitaxi.com/public/IMG_20250922_102734_296.jpg")
    center / cover no-repeat;
}

.hero-light-overlay{
  display:none;
}

.hero-content{
  position:relative;
  z-index:2;
}

.hero-intro{
  max-width:760px;
  margin:0 auto;
  text-align:center;
}

.hero-intro h1{
  font-size:32px;
  font-weight:800;
  letter-spacing:-.4px;
  margin-bottom:10px;
}

.hero-intro h1 span{
  color:var(--accent);
}

.hero-intro p{
  font-size:15px;
  color:var(--text-muted);
}

/* =====================================================
   TERMS SECTION
===================================================== */
.terms-section{
  padding:90px 0;
}

/* MAIN CARD */
.terms-card{
  position:relative;
  max-width:920px;
  margin:0 auto;

  background:var(--glass-bg);
  backdrop-filter:blur(26px) saturate(160%);
  -webkit-backdrop-filter:blur(26px) saturate(160%);

  border-radius:32px;
  padding:44px;

  border:1px solid var(--glass-border);
  box-shadow:var(--shadow-deep);
  overflow:hidden;
}

/* PREMIUM EDGE */
.terms-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:1px;

  background:linear-gradient(
    135deg,
    rgba(48,104,124,.45),
    rgba(96,165,250,.25),
    transparent 70%
  );

  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  pointer-events:none;
}

/* =====================================================
   LEGAL NOTICE BLOCKS
===================================================== */
.terms-note{
  font-size:13px;
  color:#334155;

  background:rgba(48,104,124,.08);
  border-left:4px solid var(--accent);
  padding:14px 18px;
  border-radius:14px;
  margin-bottom:16px;
}

.terms-warning{
  font-size:14px;
  font-weight:700;
  color:#991b1b;

  background:rgba(185,28,28,.08);
  border-left:4px solid #b91c1c;
  padding:14px 18px;
  border-radius:14px;
  margin-bottom:32px;
}

/* =====================================================
   TERMS BLOCKS
===================================================== */
.terms-block{
  position:relative;
  padding-left:26px;
  margin-bottom:30px;
}

/* Vertical guide */
.terms-block::before{
  content:"";
  position:absolute;
  left:6px;
  top:8px;
  bottom:8px;
  width:2px;
  background:linear-gradient(
    180deg,
    rgba(48,104,124,.35),
    transparent
  );
}

/* Heading */
.terms-block h3{
  position:relative;
  font-size:18px;
  font-weight:800;
  letter-spacing:-.2px;
  margin-bottom:10px;
}

/* Dot marker */
.terms-block h3::before{
  content:"";
  position:absolute;
  left:-26px;
  top:6px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--accent);
}

/* Paragraph */
.terms-block p{
  font-size:14px;
  color:var(--text-muted);
  line-height:1.75;
  margin-bottom:10px;
}

/* =====================================================
   LIST STYLE
===================================================== */
.terms-list{
  list-style:none;
  padding:0;
  margin:12px 0 14px;
}

.terms-list li{
  position:relative;
  padding-left:20px;
  font-size:14px;
  color:var(--text-muted);
  line-height:1.7;
  margin-bottom:6px;
}

.terms-list li::before{
  content:"•";
  position:absolute;
  left:0;
  top:0;
  color:var(--accent);
  font-size:20px;
  line-height:1;
}

/* =====================================================
   FOOTER LEGAL NOTE
===================================================== */
.legal-footer{
  margin-top:44px;
  padding-top:22px;
  border-top:1px dashed rgba(0,0,0,.15);

  font-size:13px;
  color:#64748b;
}

/* =====================================================
   OPTIONAL BADGE
===================================================== */
.legal-badge{
  display:inline-block;
  margin-bottom:18px;
  padding:6px 14px;
  border-radius:999px;

  font-size:12px;
  font-weight:700;
  background:rgba(48,104,124,.12);
  color:var(--accent);
}

/* =====================================================
   RESPONSIVE
===================================================== */
@media(max-width:768px){

  .hero-apple{
    padding:60px 0 36px;
  }

  .hero-intro h1{
    font-size:26px;
  }

  .terms-section{
    padding:70px 0;
  }

  .terms-card{
    padding:28px;
    border-radius:24px;
  }

  .terms-block{
    padding-left:20px;
  }

  .terms-block::before{
    left:4px;
  }

  .terms-block h3::before{
    left:-22px;
  }

}

@media(max-width:420px){

  .hero-intro h1{
    font-size:24px;
  }

}
