:root{
  --txt:#1f2937; --muted:#6b7280; --bg:#fff; --alt:#f8fafc;
  --border:#e5e7eb; --teal:#14b8a6; --teal-d:#0d9488; --blue:#0ea5e9;
  --shadow:0 18px 48px rgba(2,6,23,.14); --r:16px; --rs:12px; --max:1120px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:Inter,system-ui,Segoe UI,Roboto,Arial;color:var(--txt);background:var(--bg);line-height:1.6}
.container{width:min(calc(100% - 2rem),var(--max));margin-inline:auto}

/* top strip */
.topstrip{background:#0f172a;color:#cbd5e1;font-size:12px}
.strip-inner{display:flex;align-items:center;justify-content:space-between;padding:6px 0}
.brand{display:flex;gap:10px;align-items:center;font-weight:800}
.burst{width:18px;height:18px;border-radius:50%;background:conic-gradient(#22d3ee,#a7f3d0,#22c55e);box-shadow:0 0 0 3px #ecfeff inset;display:inline-block}

/* header */
.page-head{padding:36px 0 8px}
.page-head h1{margin:0 0 6px;font-weight:800;font-size:36px;text-align:center}
.page-head .sub{margin:0 auto;text-align:center;color:var(--muted);max-width:680px}

/* sections */
.section{padding:28px 0}
.grid-2{display:grid;grid-template-columns:1.05fr 1fr;gap:18px}
@media (max-width:980px){.grid-2{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--shadow);padding:16px}

/* map */
.map .map-canvas{
  height:260px;border-radius:12px;border:2px dashed var(--border);
  display:grid;place-items:center;background:repeating-linear-gradient(45deg,#fafafa,#fafafa 10px,#f3f4f6 10px,#f3f4f6 20px);
  color:var(--muted);font-weight:700;letter-spacing:.2px
}
.map small{display:block;color:var(--muted);margin-top:8px}

/* details */
.socials {
  display: flex;
  gap: 10px;
  margin-top: 10px;
}

.sbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #f1f5f9;
  color: #0f172a;
  font-size: 18px;
  text-decoration: none;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  transition: background 0.2s, color 0.2s;
}

.sbtn:hover {
  background: #e0e7ff;
  color: #1d4ed8;
}

/* suggest */
.suggest h3{margin:0 0 4px}
.suggest .muted{color:var(--muted);margin:0 0 12px}
.prefs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:980px){.prefs{grid-template-columns:1fr}}
label{display:grid;gap:6px;font-size:13px;color:var(--muted)}
select,textarea,.input{
  width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:#fff;font-size:14px;outline:0
}
select:focus,textarea:focus,.input:focus{border-color:#99f6e4;box-shadow:0 0 0 4px #ecfdf5}


.contact-options h3 {
  margin-top: 0;
}
.contact-options p {
  color: var(--muted);
  margin-bottom: 12px;
}
.contact-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* form */
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media (max-width:680px){.grid{grid-template-columns:1fr}}
.file input{margin-top:6px}
.consent{display:flex;gap:8px;align-items:flex-start;margin-top:8px}
.actions{display:flex;gap:10px;justify-content:flex-end;margin-top:12px}
.result{margin-top:8px;color:var(--muted)}

      /* FAQ */
    .faq {
      display: grid;
      gap: 8px;
    }
        
      .faq-q {
          width: 100%;
          text-align: left;
          font-weight: 700;
          padding: 12px;
          border-radius: 10px;
          border: 1px solid #e2e8f0;
          background: #fff;
          cursor: pointer;
          position: relative;
      }
        
      .faq-q::after {
          content: '+';
          position: absolute;
          right: 12px;
          transition: transform 0.3s ease;
      }
        
    .faq-q.open::after {
        content: '−';
        transform: rotate(0deg);
      }
        
    .faq-a {
        max-height: 0;
        overflow: hidden;
        border-left: 3px solid #e2e8f0;
        background: #f8fafc;
        border-radius: 0 0 8px 8px;
        padding: 0 12px;
        transition: max-height 0.35s ease, padding 0.35s ease;
        margin-bottom: 4px;
    }
        
    .faq-a.open {
        max-height: 500px; /* Increased to ensure content is visible */
        padding: 12px;
    }
        
        /* Animations */
    .reveal {
        opacity: 0;
        transform: translateY(14px);
        animation: reveal 0.6s ease forwards;
    }
        
    .reveal:nth-child(2) {
        animation-delay: 0.08s;
    }
        
  .reveal:nth-child(3) {
      animation-delay: 0.16s;
  }
        
  @keyframes reveal {
    to {
          opacity: 1;
          transform: none;
        }
    }

/* hotline */
.hotline{background:#e6fbf8;margin-top:8px}
.hotline-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 0}
.hotline h3{margin:0}
.hotline-actions{display:flex;gap:10px;flex-wrap:wrap}

/* footer */
.footer{border-top:1px solid var(--border);background:#fff}
.foot-inner{display:flex;align-items:center;justify-content:space-between;padding:16px 0}
.copy{color:#94a3b8;font-size:12px}

/* buttons */
.btn{appearance:none;border:0;border-radius:999px;padding:12px 18px;font-weight:700;cursor:pointer;transition:transform .06s ease,box-shadow .2s ease}
.btn-xs{padding:6px 10px}
.btn-teal{background:var(--teal);color:#fff}
.btn-teal:hover{background:var(--teal-d)}
.btn-ghost{background:#fff;border:1px solid var(--border)}
.btn-ghost:hover{box-shadow:0 8px 24px rgba(2,6,23,.10)}

/* animations */
/*.reveal{opacity:0;transform:translateY(14px);animation:reveal .6s ease forwards}
.reveal:nth-child(2){animation-delay:.08s}
.reveal:nth-child(3){animation-delay:.16s}
@keyframes reveal{to{opacity:1;transform:none}}*/

.logo-img{display: block; width: auto; height: 60px;}
.mini-text{font-weight:700}
.mini-brand{display:flex; align-items:center; gap:8px}
.logo-text{font-weight:800; letter-spacing:.2px}

.map-embed {
  border: 0;
  background: transparent;
  padding: 0;
  height: 260px;              /* match your design; tweak if you like */
  border-radius: 12px;
  overflow: hidden;
}

/* make the iframe fill the box and keep the rounded corners */
.map-embed iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  border-radius: 12px;
}


/* Stack multiple values in the kv right column */
.kv .stack{
  display:grid;
  gap:4px;           /* vertical spacing between items */
}

.kv .stack a{
  text-decoration:none;
  color:#0f172a;
  word-break:break-word;
}

.kv .stack a:hover{
  text-decoration:underline;
}