
  :root{
    --ivory:#f3ede3;
    --beige:#e7ddc9;
    --sky:#ecd9d3;
    --khaki:#cbb9a0;
    --olive:#7a5c4a;
    --blue:#6e1f2b;
    --ink:#3a1216;
    --white:#fffdf9;
    --text-soft:#5c4a44;
    --radius-pill:999px;
    --radius:6px;
    --maxw:1180px;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0; background:var(--ivory); color:var(--ink);
    font-family:'Work Sans', system-ui, sans-serif;
    font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,h4{
    font-family:'Playfair Display', Georgia, serif;
    color:var(--ink); margin:0 0 .45em; font-weight:600; letter-spacing:-0.01em;
  }
  a{color:inherit;}
  img{max-width:100%; display:block;}
  .wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px;}
  .skip-link{
    position:absolute; left:-999px; top:0; background:var(--ink); color:var(--ivory);
    padding:10px 16px; z-index:200; font-size:.85rem;
  }
  .skip-link:focus{left:12px; top:12px;}
  :focus-visible{outline:2px solid var(--blue); outline-offset:3px;}

  .eyebrow{
    font-size:.78rem; letter-spacing:.12em; text-transform:uppercase;
    color:var(--olive); font-weight:600; margin-bottom:.9em;
  }

  .btn{
    display:inline-flex; align-items:center; gap:8px;
    font-size:.85rem; font-weight:600; text-decoration:none;
    padding:13px 26px; border-radius:var(--radius-pill);
    border:1.5px solid var(--ink); color:var(--ink);
    transition:background .15s, color .15s, border-color .15s;
  }
  .btn.solid{background:var(--ink); color:var(--ivory);}
  .btn.solid:hover{background:var(--blue); border-color:var(--blue);}
  .btn.outline:hover{background:var(--ink); color:var(--ivory);}
  .btn.on-dark{border-color:var(--ivory); color:var(--ivory);}
  .btn.on-dark:hover{background:var(--ivory); color:var(--ink);}

  /* photo placeholder block */
  .photo{
    position:relative; overflow:hidden; border-radius:var(--radius);
    background:linear-gradient(135deg, var(--khaki), var(--olive) 60%, var(--blue));
    display:flex; align-items:flex-end; padding:16px;
    min-height:200px;
  }
  .photo::before{
    content:""; position:absolute; inset:0;
    background:
      radial-gradient(circle at 30% 20%, rgba(255,255,255,.18), transparent 55%),
      radial-gradient(circle at 80% 80%, rgba(0,0,0,.12), transparent 60%);
  }
  .photo span{
    position:relative; color:var(--ivory); font-family:'Work Sans',sans-serif;
    font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;
    background:rgba(31,53,72,.55); padding:5px 10px; border-radius:4px;
  }
  .photo.tone-sky{background:linear-gradient(135deg, var(--sky), var(--blue) 85%);}
  .photo.tone-beige{background:linear-gradient(135deg, var(--beige), var(--khaki) 60%, var(--olive));}

  .photo.photo-real{background:none; padding:0; display:block;}
  .photo.photo-real::before{display:none;}
  .photo.photo-real img{width:100%; height:100%; object-fit:cover; border-radius:inherit; min-height:inherit;}

  /* header */
  header.site{
    position:sticky; top:0; z-index:100; background:rgba(250,246,238,.92);
    backdrop-filter:blur(6px); border-bottom:1px solid var(--khaki);
  }
  .nav-row{display:flex; align-items:center; justify-content:space-between; padding:16px 28px; max-width:var(--maxw); margin:0 auto;}
  .logo{display:flex; align-items:center; gap:10px; text-decoration:none;}
  .logo svg{width:34px; height:34px;}
  .logo .word{font-family:'Playfair Display',serif; font-weight:700; font-size:1.3rem; color:var(--blue); line-height:1;}
  .logo .sub{font-family:'Work Sans',sans-serif; font-size:.6rem; letter-spacing:.15em; text-transform:uppercase; color:var(--olive);}

  nav.primary{display:flex; align-items:center; gap:28px;}
  nav.primary a{text-decoration:none; font-size:.92rem; color:var(--text-soft);}
  nav.primary a:hover{color:var(--ink);}
  .nav-cta{display:flex; align-items:center; gap:14px;}
  .nav-phone{display:none; font-size:.88rem; color:var(--text-soft); text-decoration:none;}
  @media(min-width:900px){.nav-phone{display:inline-flex;}}

  .menu-toggle{display:none; background:none; border:1.5px solid var(--ink); border-radius:8px; width:40px; height:40px; align-items:center; justify-content:center; cursor:pointer;}
  .menu-toggle span, .menu-toggle span::before, .menu-toggle span::after{content:""; display:block; width:18px; height:1.5px; background:var(--ink); position:relative;}
  .menu-toggle span::before{position:absolute; top:-6px;} .menu-toggle span::after{position:absolute; top:6px;}
  @media(max-width:860px){
    nav.primary{position:absolute; top:100%; left:0; right:0; flex-direction:column; align-items:flex-start; gap:0; background:var(--ivory); border-bottom:1px solid var(--khaki); max-height:0; overflow:hidden; padding:0 28px; transition:max-height .25s ease;}
    nav.primary.open{max-height:320px; padding:14px 28px 20px;}
    nav.primary a{padding:10px 0; width:100%; border-bottom:1px solid var(--beige);}
    .menu-toggle{display:flex;}
  }

  /* hero */
  .hero{padding:64px 0 90px;}
  .hero-grid{display:grid; grid-template-columns:1fr; gap:50px; align-items:center;}
  @media(min-width:960px){.hero-grid{grid-template-columns:1fr 1fr;}}
  .hero h1{font-size:clamp(2.1rem,4.2vw,3.2rem); line-height:1.12; max-width:15ch;}
  .hero .underline{display:inline-block; border-bottom:3px solid var(--olive); padding-bottom:2px;}
  .hero p.lead{font-size:1.08rem; color:var(--text-soft); max-width:46ch; margin:20px 0 30px;}
  .hero-ctas{display:flex; flex-wrap:wrap; gap:14px;}
  .hero .photo{min-height:420px; border-radius:14px;}

  /* section shell */
  section{padding:84px 0;}
  section.tone-beige{background:var(--beige);}
  section.tone-sky{background:var(--sky);}
  section.tone-white{background:var(--white);}
  .section-head{max-width:640px; margin:0 auto 46px; text-align:left;}
  .section-head.center{text-align:center; margin-left:auto; margin-right:auto;}
  .section-head h2{font-size:clamp(1.7rem,2.6vw,2.3rem);}
  .section-head p{color:var(--text-soft); font-size:1.02rem; margin:0;}

  /* services */
  .service-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:28px;}
  .service-card{background:var(--white); border-radius:14px; overflow:hidden; box-shadow:0 10px 30px -18px rgba(31,53,72,.35);}
  .service-card .photo{min-height:150px; border-radius:0;}
  .service-card .body{padding:24px 22px 26px;}
  .service-card h3{font-size:1.12rem; margin-bottom:8px;}
  .service-card p{color:var(--text-soft); font-size:.93rem; margin:0;}

  /* why */
  .why-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:32px;}
  .why-item{display:flex; gap:14px;}
  .why-item .dot{
    flex:none; width:38px; height:38px; border-radius:50%;
    background:var(--sky); display:flex; align-items:center; justify-content:center;
    color:var(--blue); font-family:'Playfair Display',serif; font-weight:700;
  }
  .why-item h3{font-size:1rem; margin-bottom:6px;}
  .why-item p{color:var(--text-soft); font-size:.9rem; margin:0;}

  /* about */
  .about-grid{display:grid; grid-template-columns:1fr; gap:46px; align-items:center;}
  @media(min-width:900px){.about-grid{grid-template-columns:0.85fr 1.15fr;}}
  .about-grid .photo{min-height:440px; border-radius:16px;}
  .about-body p{color:var(--text-soft); margin:0 0 16px;}
  .credential-strip{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:20px; margin-top:28px; padding-top:24px; border-top:1px solid var(--khaki);}
  .credential-strip .num{font-family:'Playfair Display',serif; font-weight:700; font-size:1.7rem; color:var(--blue);}
  .credential-strip .label{font-size:.82rem; color:var(--text-soft); margin-top:4px;}

  /* stat band */
  .stat-band{background:var(--ink); color:var(--ivory); padding:56px 0;}
  .stat-band .grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:30px; text-align:center;}
  .stat-band .num{font-family:'Playfair Display',serif; font-weight:700; font-size:2.1rem; color:var(--sky);}
  .stat-band .label{font-size:.85rem; color:#c9d3da; margin-top:6px;}

  /* service area */
  .chips{display:flex; flex-wrap:wrap; gap:10px; margin-top:14px;}
  .chips-center{justify-content:center; max-width:760px; margin-left:auto; margin-right:auto;}
  .chip{font-size:.82rem; border-radius:var(--radius-pill); padding:8px 16px; background:var(--white); color:var(--text-soft); border:1px solid var(--khaki);}
  .chip.focus{background:var(--blue); color:var(--ivory); border-color:var(--blue);}
  .focus-note{margin-top:24px; max-width:62ch; color:var(--text-soft); font-size:.94rem;}
  .focus-note-center{margin-left:auto; margin-right:auto; text-align:center;}

  /* miért váltanak KK-t */
  .reason-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1px; background:var(--khaki); border:1px solid var(--khaki); border-radius:14px; overflow:hidden;}
  .reason-card{background:var(--white); padding:30px 26px; display:flex; flex-direction:column;}
  .reason-num{font-family:'Playfair Display',serif; font-weight:700; font-size:1.3rem; color:var(--khaki); margin-bottom:10px;}
  .reason-card h3{font-size:1.08rem; margin-bottom:10px;}
  .reason-card p{color:var(--text-soft); font-size:.9rem; margin:0 0 12px;}
  .reason-card .reason-fix{margin-top:auto; padding-top:12px; border-top:1px solid var(--beige); color:var(--ink); font-size:.87rem;}
  .reason-card .reason-fix strong{color:var(--blue);}
  .reason-note{margin-top:22px; font-size:.76rem; color:var(--text-soft); text-align:center;}

  /* szolgálati terület */
  .d{fill:var(--beige); stroke:var(--khaki); stroke-width:1.5;}
  .d.focus{fill:var(--blue); stroke:var(--blue);}
  .d-label{font-family:'Playfair Display',serif; font-size:15px; text-anchor:middle; fill:var(--ink); font-weight:600;}
  .d-label.focus-label{fill:var(--ivory);}
  .map-legend{display:flex; flex-wrap:wrap; gap:20px; margin-top:14px; padding-top:14px; border-top:1px solid var(--beige);}
  .map-legend span{display:flex; align-items:center; gap:8px; font-size:.82rem; color:var(--text-soft);}
  .map-legend .sw{width:14px; height:14px; border-radius:50%; background:var(--beige); border:1.5px solid var(--khaki); display:inline-block;}
  .map-legend .sw.focus{background:var(--blue); border-color:var(--blue);}

  /* blog */
  .blog-head{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:44px;}
  .blog-head h2{font-size:clamp(1.8rem,3vw,2.5rem); max-width:8ch; margin:0;}
  .blog-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:30px;}
  .blog-card{display:block; text-decoration:none; color:inherit; transition:transform .15s;}
  .blog-card:hover{transform:translateY(-4px);}
  .blog-card:hover h3{color:var(--blue);}
  .blog-card .photo{min-height:125px; border-radius:10px; margin-bottom:16px;}
  .blog-card .date{font-size:.78rem; color:var(--olive); font-weight:600; letter-spacing:.04em; text-transform:uppercase;}
  .blog-card h3{font-size:1.08rem; margin:8px 0 0; line-height:1.3; transition:color .15s;}
  .blog-card .read{display:inline-block; margin-top:10px; font-size:.85rem; font-weight:600; color:var(--blue);}
  .pager{display:flex; align-items:center; gap:18px; margin-top:44px;}
  .pager a{font-size:.82rem; font-weight:600; text-decoration:none; color:var(--text-soft);}
  .pager .track{flex:1; height:3px; background:var(--khaki); border-radius:2px; position:relative;}
  .pager .track::before{content:""; position:absolute; left:0; top:0; bottom:0; width:28%; background:var(--olive); border-radius:2px;}
  .pager .count{font-size:.8rem; color:var(--text-soft);}

  /* contact */
  .contact-wrap{display:grid; grid-template-columns:1fr; gap:46px;}
  @media(min-width:900px){.contact-wrap{grid-template-columns:0.85fr 1.15fr;}}
  .contact-info p{color:var(--text-soft); max-width:44ch;}
  .contact-list{list-style:none; padding:0; margin:26px 0 0;}
  .contact-list li{padding:14px 0; border-top:1px solid var(--khaki); display:flex; flex-direction:column; gap:2px;}
  .contact-list .k{font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; color:var(--olive); font-weight:600;}
  .contact-list .v{font-size:1.02rem;}
  .contact-list a{text-decoration:none;}
  .contact-list a:hover{color:var(--blue);}

  form.request{background:var(--white); border-radius:16px; padding:32px; box-shadow:0 20px 50px -30px rgba(31,53,72,.4);}
  form.request .row{display:grid; grid-template-columns:1fr; gap:16px; margin-bottom:16px;}
  @media(min-width:560px){form.request .row.two{grid-template-columns:1fr 1fr;}}
  form.request label{display:block; font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; color:var(--olive); font-weight:600; margin-bottom:6px;}
  form.request input, form.request select, form.request textarea{
    width:100%; border:1.5px solid var(--beige); background:var(--ivory);
    padding:11px 14px; font-family:'Work Sans',sans-serif; font-size:.95rem; color:var(--ink);
    border-radius:8px;
  }
  form.request textarea{resize:vertical; min-height:90px;}
  form.request input:focus, form.request select:focus, form.request textarea:focus{outline:none; border-color:var(--blue);}
  .form-note{font-size:.78rem; color:var(--text-soft); margin-top:12px;}
  .form-alert{padding:12px 16px; border-radius:8px; font-size:.88rem; margin-bottom:18px;}
  .form-alert-success{background:#e5efe0; color:#3d5c2c; border:1px solid #b9d4a8;}
  .form-alert-error{background:#fbe6e3; color:var(--blue); border:1px solid var(--khaki);}

  /* footer */
  footer{background:var(--ink); color:var(--ivory); padding:56px 0 26px;}
  .footer-grid{display:grid; grid-template-columns:1fr; gap:38px;}
  @media(min-width:760px){.footer-grid{grid-template-columns:1.3fr 1fr 1fr;}}
  footer .logo .word{color:var(--ivory);}
  footer .logo .sub{color:var(--sky);}
  footer p.tagline{color:#c9d3da; max-width:36ch; margin-top:14px; font-size:.92rem;}
  footer h4{color:#9fb0bb; font-size:.75rem; text-transform:uppercase; letter-spacing:.07em; margin-bottom:16px; font-weight:600; font-family:'Work Sans',sans-serif;}
  footer ul{list-style:none; padding:0; margin:0;}
  footer li{margin-bottom:10px;}
  footer a{color:#dde4e8; text-decoration:none; font-size:.92rem;}
  footer a:hover{color:var(--sky);}
  .footer-bottom{max-width:var(--maxw); margin:44px auto 0; padding:20px 28px 0; border-top:1px solid #35505f; display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; font-size:.78rem; color:#8fa1ac;}

  @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;} *{transition:none !important;}}

  /* article pages */
  .article-hero-wrap{padding-top:48px;}
  .back-link{display:inline-block; margin-bottom:22px; font-size:.85rem; font-weight:600; color:var(--text-soft); text-decoration:none;}
  .back-link:hover{color:var(--blue);}
  .article-page h1{font-size:clamp(1.8rem,3.6vw,2.5rem); max-width:22ch; margin-bottom:10px;}
  .article-date{font-size:.85rem; color:var(--olive); font-weight:600; margin-bottom:0;}
  .article-hero-img{max-width:var(--maxw); margin:26px auto 0; padding:0 28px;}
  .article-hero-img img{width:100%; max-height:420px; object-fit:cover; border-radius:14px;}
  .article-content{max-width:70ch; margin:44px auto 0; padding-bottom:10px;}
  .article-content h2{font-size:1.4rem; margin-top:2.2em;}
  .article-content h3{font-size:1.12rem; margin-top:1.8em;}
  .article-content p{color:var(--text-soft); margin:0 0 1.1em; line-height:1.7;}
  .article-content ul, .article-content ol{color:var(--text-soft); margin:0 0 1.3em; padding-left:1.3em; line-height:1.7;}
  .article-content li{margin-bottom:.5em;}
  .article-content strong{color:var(--ink);}
  .article-content hr{border:none; border-top:1px solid var(--khaki); margin:2.4em 0;}
  .article-content em{color:var(--text-soft); font-size:.92rem;}
  .article-cta{max-width:70ch; margin:0 auto 70px; padding:30px 30px; background:var(--beige); border-radius:14px; text-align:center;}
  .article-cta h3{margin-bottom:8px; font-size:1.2rem;}
  .article-cta p{color:var(--text-soft); margin:0 0 20px;}
