@font-face{font-family:"Source Serif 4";src:url("serif-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("sans-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url("sans-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

:root{
  --fenyo:#1F4E4A;--fenyo-sotet:#173C39;--fenyo-halvany:#D9E6E3;
  --grafit:#23302E;--halvany:#5E6B68;--vaszon:#F6F1E9;--vonal:#D8CFC1;
  --tegla:#B5532F;--feher:#FFFFFF;
  --serif:"Source Serif 4",Georgia,"Times New Roman",serif;
  --sans:"Source Sans 3","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --keret:min(1120px,100% - 40px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);font-size:1.0625rem;line-height:1.6;color:var(--grafit);background:var(--feher)}
img{max-width:100%;height:auto;display:block}
a{color:var(--fenyo);text-underline-offset:.18em}
a:hover{color:var(--fenyo-sotet)}
:focus-visible{outline:3px solid var(--tegla);outline-offset:3px;border-radius:3px}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.15;margin:0 0 .5em;color:var(--fenyo)}
h1{font-size:clamp(2.2rem,4.6vw,3.6rem);letter-spacing:-.01em}
h2{font-size:clamp(1.6rem,3vw,2.2rem)}
h3{font-size:1.25rem}
p{margin:0 0 1em}
.keret{width:var(--keret);margin-inline:auto}
.szoveg{max-width:40rem}

/* fejléc */
.fejlec{background:var(--fenyo)}
.fejlec .keret{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.logo{display:inline-flex;align-items:center;gap:10px;color:var(--feher);text-decoration:none;font-family:var(--serif);font-weight:600;font-size:1.3rem}
.logo:hover{color:var(--feher)}
.logo svg{width:26px;height:26px}
.fejlec .megjegyzes{color:var(--fenyo-halvany);font-size:.95rem}

/* hero */
.hero{background:var(--fenyo);color:var(--feher);padding:28px 0 0}
main{overflow-x:clip}
.hero .keret{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:48px;align-items:start}
.hero h1{color:var(--feher)}
.hero .bevezeto{font-size:1.2rem;color:var(--fenyo-halvany);max-width:34rem}
.hero-szoveg{padding-bottom:56px;align-self:start}
.lap{align-self:end;position:relative;z-index:1;transform:rotate(-1.6deg);transform-origin:bottom left;filter:drop-shadow(0 24px 30px rgba(0,0,0,.28));margin-bottom:-150px;width:122%;max-width:none}
.lap img{border-radius:3px;background:var(--feher)}

/* űrlap */
.urlap{background:var(--feher);color:var(--grafit);border-radius:10px;padding:24px;max-width:30rem;margin-top:28px}
.urlap h2{font-size:1.35rem;margin-bottom:.35em}
.urlap .apro{font-size:.9rem;color:var(--halvany);margin:.9em 0 0}
.urlap-hely{min-height:120px}

/* szekciók */
.szekcio{padding:clamp(56px,8vw,96px) 0}
.szekcio.elso{padding-top:clamp(170px,16vw,210px)}
.ket-hasab{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.pipalista{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.pipalista li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:start}
.pipalista svg{width:24px;height:24px;margin-top:3px}
.pipalista strong{color:var(--fenyo)}
.kep-keret{border:1px solid var(--vonal);border-radius:6px;overflow:hidden;box-shadow:0 12px 30px rgba(31,78,74,.12)}
.kepfelirat{font-size:.9rem;color:var(--halvany);margin-top:10px}

.helyzetek{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 48px;margin-top:28px;max-width:58rem}
.helyzetek p{margin:0;padding-top:14px;border-top:2px solid var(--fenyo)}
.helyzetek strong{display:block;font-family:var(--serif);font-weight:600;font-size:1.2rem;color:var(--fenyo);margin-bottom:4px}

.vaszon{background:var(--vaszon)}
.figyelmeztetes{border-left:4px solid var(--tegla);padding:4px 0 4px 16px;color:var(--grafit);max-width:40rem}

.gomb{display:inline-block;background:var(--fenyo);color:var(--feher);text-decoration:none;font-weight:600;font-size:1.1rem;padding:14px 26px;border-radius:8px;border:0;cursor:pointer}
.gomb:hover{background:var(--fenyo-sotet);color:var(--feher)}
.zaro{text-align:left}

/* lábléc */
.lablec{background:var(--fenyo-sotet);color:var(--fenyo-halvany);font-size:.95rem;padding:36px 0}
.lablec a{color:var(--feher)}
.lablec p{margin:.3em 0}

/* aloldalak */
.aloldal{padding:clamp(40px,6vw,72px) 0 clamp(56px,8vw,96px)}
.aloldal h1{font-size:clamp(2rem,4vw,3rem)}
.aloldal h2{font-size:1.5rem;margin-top:1.6em}
.aloldal h3{margin-top:1.3em}
.adat-tabla{width:100%;border-collapse:collapse;margin:0 0 1.2em;font-size:1rem}
.adat-tabla th,.adat-tabla td{text-align:left;vertical-align:top;padding:9px 12px;border-bottom:1px solid var(--vonal)}
.adat-tabla th{width:34%;color:var(--fenyo);font-weight:600}
.tabla-gorgeto{overflow-x:auto}
.roviden{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:24px 0 8px}
.roviden div{background:var(--vaszon);border-radius:8px;padding:16px 18px}
.roviden strong{display:block;color:var(--fenyo);font-family:var(--serif);font-size:1.1rem}

@media (max-width:860px){
  .hero .keret,.ket-hasab{grid-template-columns:1fr;gap:32px}
  .hero-szoveg{padding-bottom:0}
  .lap{margin-bottom:-70px;transform:rotate(-1deg);width:100%}
  .szekcio.elso{padding-top:100px}
  .helyzetek,.roviden{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{.fejlec,.hero,.lablec{background:none;color:#000}}

/* BlueFox űrlap igazítása a kártyához */
.urlap .signupFormCol{min-height:0!important;height:auto!important;max-height:none!important}
.urlap .signupFormContainer{height:auto!important;max-height:none!important;align-items:stretch!important}
.urlap .signupForm{padding:0!important;max-width:none!important;border-radius:0!important;box-shadow:none!important}
.urlap .signupFormDiv{padding:0!important;align-items:stretch!important}
.urlap .formInput{width:100%!important;border:1px solid var(--vonal)!important;box-shadow:none!important;border-radius:8px!important;font-size:1rem!important;padding:12px 14px!important;background:var(--feher)!important;color:var(--grafit)!important}
.urlap .formInput:focus{outline:3px solid var(--tegla);outline-offset:1px}
.urlap button,.urlap input[type=submit]{border-radius:8px!important;padding:13px 20px!important;font-weight:600!important;font-size:1.05rem!important;width:100%;cursor:pointer}
.urlap label,.urlap .checkbox-label-text{font-size:.95rem;line-height:1.45;color:var(--grafit)}
.urlap .successMessageText,.urlap .errorMessageText{text-align:left!important;font-size:1rem!important;line-height:1.5}
