:root{
  --navy:#113253; --navy-dark:#081123; --accent:#1fa5e8;
  --text:#4b5563; --bg-soft:#f6f8fb; --border:#e5e9f0;
  --radius:12px; --shadow:0 8px 30px rgba(17,50,83,.08);
}
body{font-family:'Inter',system-ui,sans-serif;color:var(--text);line-height:1.65}
.page-wrapper{max-width:1200px;margin:0 auto;padding:64px 24px}
h1,h2,h3{color:var(--navy);letter-spacing:-.02em;line-height:1.2}
h1{font-size:clamp(2rem,4vw,3rem)}
h2{font-size:clamp(1.5rem,3vw,2.1rem)}

.syn-section{margin-bottom:80px}
.syn-intro{text-align:center}
.syn-intro p{max-width:820px;margin:16px auto 0;font-size:1.15rem}
.syn-row{display:flex;gap:56px;align-items:center;flex-wrap:wrap}
.syn-row>div{flex:1;min-width:300px}
.syn-row img{width:100%;border-radius:var(--radius);box-shadow:var(--shadow);display:block}
.syn-panel{background:var(--bg-soft);padding:48px;border-radius:var(--radius);border:1px solid var(--border)}
.syn-card{background:#fff;padding:28px;border-radius:var(--radius);border:1px solid var(--border);
  box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s}
.syn-card:hover{transform:translateY(-4px);box-shadow:0 14px 40px rgba(17,50,83,.14)}
.syn-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}

.syn-btn{display:inline-block;padding:13px 28px;border-radius:8px;background:var(--navy);
  color:#fff;font-weight:600;text-decoration:none;border:0;cursor:pointer;transition:.2s}
.syn-btn:hover{background:var(--accent);transform:translateY(-1px)}
.syn-btn--light{background:#fff;color:var(--navy)}
.syn-cta{background:linear-gradient(135deg,var(--navy),var(--navy-dark));color:#fff;
  padding:56px 32px;border-radius:var(--radius);text-align:center}
.syn-cta h2{color:#fff}.syn-cta p{color:#cbd5e1;max-width:700px;margin:12px auto 28px}

@media(max-width:768px){.syn-row{flex-direction:column;gap:28px}.syn-panel{padding:28px}}