/* ========== Base ========== */
:root{
  --bg:#F5F2FD;           /* lavender */
  --primary:#6941D3;      /* blue violet */
  --accent:#F7D077;       /* goldenrod */
  --ink:#2C1D4F;          /* dark navy */
  --sky:#6EC6FF;          /* sky blue */
  --card:#FFFFFF;
  --muted:#6b6b80;
  --radius:22px;
  --shadow:0 10px 30px rgba(41,26,96,.12);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Arial;
  background: radial-gradient(1200px 800px at -10% -10%, #FFF 0%, var(--bg) 70%);
  color:var(--ink);
  line-height:1.6;
}

/* ===== Layout ===== */
.container{width:min(1100px, 92%); margin-inline:auto}
.section{padding:64px 0}
.card{background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow); padding:36px}

/* ===== nav ===== */
.nav{display:flex; align-items:center; justify-content:space-between; padding:18px 0}
.brand{display:flex; align-items:center; gap:12px}
.logo{background:linear-gradient(135deg,var(--primary),var(--sky)); color:#fff; font-weight:700; padding:10px 14px; border-radius:16px}
.brand-text{font-weight:600}

/* ===== hero ===== */
.hero{display:grid; grid-template-columns:1.3fr 1fr; gap:36px; align-items:center; padding-top:24px}
h1{font-size:clamp(28px, 4vw, 48px); line-height:1.2; margin:0 0 12px}
.highlight{color:#D64571}
.sub{color:var(--muted); margin:0 0 16px}
.cta-group{display:flex; gap:12px; margin:10px 0 12px}
.btn{display:inline-block; padding:12px 18px; border-radius:999px; font-weight:600; text-decoration:none; border:2px solid transparent}
.btn-primary{background:var(--accent); color:#3a2a00}
.btn-ghost{border-color:var(--primary); color:var(--primary); background:#fff}
.trust-points{display:flex; gap:16px; list-style:none; padding:0; margin:8px 0 0; color:var(--muted); font-size:14px}

.hero-visual{position:relative}
.photo-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:12px}
.photo-grid img{width:100%; height:220px; object-fit:cover; border-radius:18px; box-shadow:var(--shadow)}
.photo-grid img:nth-child(1){grid-column:1/3; height:300px}

/* ===== sections ===== */
h2{font-size:clamp(22px,3vw,34px); margin:0 0 14px}
.list{line-height:1.8}
.grid-two{display:grid; grid-template-columns:1.1fr 1fr; gap:28px; align-items:center}
.feature-card img{width:100%; border-radius:var(--radius); box-shadow:var(--shadow)}

.pill-row{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:14px}
.pill{background:#f7f6ff; border:1px dashed var(--primary); color:var(--primary); padding:8px 14px; border-radius:999px; font-weight:600}
.icon-list{list-style:none; padding:0; margin:0}
.icon-list li{display:flex; align-items:flex-start; gap:10px; padding:8px 0}
.ic{font-size:20px; margin-top:2px}

.cards{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.mini-card{background:#fff; border-radius:20px; box-shadow:var(--shadow); padding:18px; text-align:center}
.mini-icon{font-size:28px; line-height:1; margin-bottom:8px}

/* ===== CTA/contact ===== */
.cta{display:grid; grid-template-columns:1.2fr .8fr; gap:24px; align-items:center}
.cta-inner{}
.form-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin:14px 0}
input, textarea{width:100%; padding:12px 14px; border-radius:14px; border:1px solid #e0def1; outline:none; font:inherit}
textarea{resize:vertical}
.cta-image img{width:100%; border-radius:24px; box-shadow:var(--shadow)}

/* Added Contact Info and Map Styles */
.contact-card{background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow); padding:24px; margin-top:24px}
.contact-card h3{font-size:20px; margin:0 0 12px}
.contact-card p{margin:8px 0}
.contact-card a{color:var(--primary); text-decoration:none}
.contact-card a:hover{text-decoration:underline}
.map-container{width:100%; max-width:500px; margin-top:16px}
.map-container iframe{border-radius:14px; box-shadow:var(--shadow)}

/* ===== footer ===== */
.footer{margin-top:40px; background:linear-gradient(180deg, rgba(105,65,211,.05), rgba(105,65,211,.12)); padding:30px 0}
.foot-inner{display:grid; grid-template-columns:1fr 1fr 1fr; align-items:center}
.foot-links{display:flex; gap:16px; justify-content:center}
.foot-copy{text-align:right; color:var(--muted)}

/* ===== decorative shapes ===== */
.shape{position:fixed; z-index:-1; opacity:.15; filter:blur(2px)}
.shape-1{width:160px;height:160px; background:radial-gradient(circle at 30% 30%, var(--accent), transparent 60%); top:20px; left:-40px; border-radius:50%}
.shape-2{width:200px;height:200px; background:conic-gradient(from 0deg, var(--sky), var(--primary), var(--accent)); bottom:20%; right:-60px; border-radius:50%}
.shape-3{width:110px;height:110px; background:radial-gradient(circle at 50% 50%, #ff8aa4, transparent 70%); top:50%; left:10%}
.shape-4{width:120px;height:120px; background:radial-gradient(circle at 50% 50%, #6EC6FF, transparent 70%); top:70%; left:70%}

/* ===== responsive ===== */
@media (max-width: 980px){
  .hero, .grid-two, .cta{grid-template-columns:1fr}
  .photo-grid img:nth-child(1){height:220px}
  .cards{grid-template-columns:repeat(2,1fr)}
  .foot-inner{grid-template-columns:1fr; gap:10px}
  .foot-copy{text-align:center}
  .foot-links{justify-content:center}
}
@media (max-width: 520px){
  .form-grid{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .map-container{max-width:100%}
}