/* Color system */
:root {
  --brand-primary:  #00ddb4;
  --brand-secondary:#55dfd7;
  --brand-dark:     #007a6a;
  --brand-light:    #a6f4ec;
  --accent-cta:     #ff7a59;

  --neutral-100:    #f9fbfb;
  --neutral-200:    #e6ecec;
  --neutral-700:    #1f2933;

  --maxw: 1100px;
}
html { scroll-behavior: smooth; }
*, *::before, *::after { box-sizing: border-box; }
body { margin:0; font-family: 'Inter', sans-serif; color: var(--neutral-700); background: var(--neutral-100); line-height:1.6; }
h1, h2, h3 { font-family: 'Poppins', sans-serif; margin: 0 0 .5em; color: var(--brand-dark); }
h1 { font-size: clamp(2rem, 5vw, 3rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); }
h3 { font-size: 1.25rem; }
p { margin: 0 0 1em; }
a { color: var(--brand-dark); }
a:hover { color: var(--brand-primary); }
header { background: var(--neutral-100); position: sticky; top:0; z-index:100; box-shadow:0 1px 3px rgba(0,0,0,.08); }
nav { max-width: var(--maxw); margin: 0 auto; padding: .8rem 1rem; display:flex; justify-content:space-between; align-items:center; }
nav a.logo { display:flex; align-items:center; text-decoration:none; }
nav a.logo img { height:40px; }
nav ul { list-style:none; margin:0; padding:0; display:flex; gap:1rem; align-items:center; }
nav li a { text-decoration:none; color: var(--neutral-700); font-weight:500; }
nav li a.active { color: var(--brand-primary); }
nav li.phone a { color: var(--brand-dark); font-weight:600; }
.hero { background: linear-gradient(180deg, var(--brand-light) 0%, var(--neutral-100) 100%); color: var(--neutral-700); padding: 5rem 1rem 4rem; text-align:center; }
.hero p { max-width: 650px; margin: 0 auto 1.5rem; }
.hero-home { background: linear-gradient(180deg, var(--brand-light) 0%, var(--neutral-100) 100%); }
.btn { display:inline-block; padding:.9rem 1.4rem; border-radius:6px; text-decoration:none; font-weight:600; transition: filter .3s; }
.btn:hover { filter: brightness(0.9); }
.btn-primary { background:var(--brand-primary); color:#fff; }
.btn-primary:hover { background: var(--brand-secondary); }
.btn-outline { border:2px solid var(--brand-dark); color:var(--brand-dark); background:transparent; }
.btn-accent { background:var(--accent-cta); color:#fff; }
.contact-cta { background: linear-gradient(180deg, var(--neutral-100) 0%, var(--brand-light) 100%); color:var(--neutral-700); }
.contact-cta .inner { max-width: var(--maxw); margin:0 auto; padding:4rem 1rem; text-align:center; }
.contact-cta .contact-options { margin-top:1.5rem; display:flex; flex-wrap:wrap; justify-content:center; gap:1rem; }
.contact-cta .btn { min-width:200px; }
.contact-cta .sub { margin-top:1rem; font-size:.9rem; opacity:.85; }
.section { max-width: var(--maxw); margin: 0 auto; padding: 4rem 1rem; }
.section-alt { background:var(--neutral-200); border:1px solid var(--neutral-200); border-radius:8px; box-shadow:0 2px 6px rgba(0,0,0,.06); padding:4rem 1rem; }
.section-alt h2 { text-align:center; margin-top:0; margin-bottom:1rem; padding-bottom:.5rem; border-bottom:1px solid var(--neutral-200); }
.grid { display:grid; gap:1.5rem; }
.services-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.hero .btn-primary{margin-right:1rem;}
.card { background:#fff; border:1px solid var(--neutral-200); padding:1.5rem; border-radius:8px; box-shadow:0 2px 6px rgba(0,0,0,.06); }
.about { display:grid; grid-template-columns: 1fr 1fr; gap:2rem; align-items:center; }
.about img { width:240px; height:240px; object-fit:cover; border-radius:50%; justify-self:center; background:#ccc; }
@media(max-width:800px){ .about { grid-template-columns:1fr; text-align:center; } .about img{ margin:0 auto 1rem; } }
.process { display:flex; gap:1.5rem; flex-wrap:wrap; }
.step { flex:1 1 220px; background:#fff; border:1px solid var(--neutral-200); border-radius:8px; padding:1.5rem; box-shadow:0 2px 6px rgba(0,0,0,.06); }
form { max-width:600px; margin:0 auto; display:grid; gap:1rem; }
input, textarea { width:100%; padding:.8rem; border:1px solid #ccc; border-radius:6px; font-size:1rem; }
footer { background: var(--neutral-700); color:white; padding:2rem 1rem; font-size:.9rem; }
footer .inner { max-width: var(--maxw); margin:0 auto; display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; }
small { opacity:.8; }

