/*
Theme Name: Astra Child
Theme URI: 
Template: astra
Author: TryCita

Version: 4.12.3.1771598383
Updated: 2026-02-20 14:39:43

*/


/* =========
   CITA HOME
   ========= */
body.page-template-template-cita-landing {}
.cita-home{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* HERO */
.cita-hero{
  position:relative;
  padding:160px 0;
  color:#fff;
  overflow:hidden;

}

.cita-hero {
  position: relative;
  background:
    radial-gradient(circle at 30% 30%, rgb(13 20 175 / 90%), rgba(255,255,255,.2)),
    linear-gradient(135deg, rgba(90,170,255,.6), rgba(150,80,255,.6));
  overflow: hidden;
}

.cita-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("https://trycita.com/wp-content/uploads/2026/02/bg-update-fade-scaled.png")
              center / cover no-repeat;
  opacity: 0.5;   /* 👈 control image opacity here */
  pointer-events: none;
}

.cita-hero__inner{
  width:min(1180px, 92%);
  margin:0 auto;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: clamp(18px, 3vw, 44px);
  align-items:center;
  position:relative;
  z-index:1;
    background-image: url(https://trycita.com/wp-content/uploads/2026/02/CITA-Receptionist-fade.png);
    background-size: 600px;
    background-position: right;
    background-repeat: no-repeat;
    padding: 85px 0;
}

.cita-h1{
  font-size: clamp(38px, 4.2vw, 64px);
  line-height:1.02;
  margin:0 0 14px;
  letter-spacing:-0.02em;
  color:#fff;
}

.cita-subhead{
  font-size: clamp(16px, 1.4vw, 20px);
  opacity:.9;
  margin:0 0 22px;
}

.cita-cta-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

.cita-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  padding:12px 18px;
  font-weight:650;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.18);
  transition: transform .15s ease, background .15s ease, opacity .15s ease;
}
.cita-btn:hover{ transform: translateY(-1px); }

.cita-btn--primary{
  background: linear-gradient(135deg, rgba(150,80,255,.95), rgba(90,170,255,.95));
  color:#fff;
  border-color: rgba(255,255,255,.08);
}
.cita-btn--ghost{
  background: rgba(255,255,255,.08);
  color:#fff;
}

.cita-trust{ display:flex; gap:10px; flex-wrap:wrap; }
.cita-pill{
  font-size:12px;
  padding:8px 10px;
  border-radius:999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
}

/* Right-side mock */
.cita-hero__mock{
  height: clamp(260px, 28vw, 380px);
  border-radius:26px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  position:relative;
  overflow:hidden;
  backdrop-filter: blur(10px);
}
.cita-hero__mock-avatar{
  width:58%;
  aspect-ratio:1/1;
  border-radius:999px;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), rgba(255,255,255,.2)),
    linear-gradient(135deg, rgba(90,170,255,.6), rgba(150,80,255,.6));
  position:absolute;
  right:10%;
  bottom:-10%;
  opacity:.9;
}
.cita-hero__mock-bubble{
  position:absolute;
  width:110px;
  height:70px;
  border-radius:18px;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.20);
  top:18%;
  left:10%;
}
.cita-hero__mock-bubble + .cita-hero__mock-bubble{
  width:140px;
  top:36%;
  left:18%;
  opacity:.85;
}

/* FEATURES */
.cita-features{
 
  padding:0 0 70px;
}
.cita-features__inner{
  width:min(1180px, 92%);
  margin:0 auto;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:18px;
}
.cita-card{
  background:#fff;
  border-radius:18px;
  box-shadow: 0 10px 30px rgba(10,20,60,.10);
  border: 1px solid rgba(10,20,60,.06);
  padding:18px;
  display:flex;
  gap:12px;
  align-items:flex-start;
}
.cita-card__icon{
  width:44px; height:44px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  background: rgba(90,170,255,.18);
  border: 1px solid rgba(90,170,255,.25);
}
.cita-card__title{ margin:2px 0 6px; font-size:16px; }
.cita-card__text{ margin:0; opacity:.78; font-size:14px; line-height:1.35; }
.site-content .ast-container {display:block;}

@media (max-width: 920px){
  .cita-hero__inner{ grid-template-columns: 1fr; }
  .cita-features__inner{ grid-template-columns: 1fr; }
  
}