/* ============================================================
   Gladiátor Group Security
   Paletta C — meleg szürke + homok arany
   #1A1917 onyx · #232120 grafit · #C9A227 homok · #F6F3EC krém
   Display: Fraunces (serif) · Body: Inter
   ============================================================ */

/* ---------- betűtípusok: saját tárhelyről (SIL Open Font License, lásd /fonts/) ----------
   A fő fájl a latin karaktereket, a kis "-ext" fájl a magyar ő/ű/Ő/Ű betűket tartalmazza. */
@font-face{font-family:'Inter';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/inter-hu.woff2) format('woff2');unicode-range:U+0020-007E,U+00A0-00FF,U+2010-2027,U+2030-203A,U+20AC,U+2122,U+2190-2193,U+2212}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/inter-hu-ext.woff2) format('woff2');unicode-range:U+0150-0151,U+0170-0171}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/fraunces-hu.woff2) format('woff2');unicode-range:U+0020-007E,U+00A0-00FF,U+2010-2027,U+2030-203A,U+20AC,U+2122,U+2190-2193,U+2212}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/fraunces-hu-ext.woff2) format('woff2');unicode-range:U+0150-0151,U+0170-0171}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:300 700;font-display:swap;src:url(../fonts/fraunces-hu-italic.woff2) format('woff2');unicode-range:U+0020-007E,U+00A0-00FF,U+2010-2027,U+2030-203A,U+20AC,U+2122,U+2190-2193,U+2212}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:300 700;font-display:swap;src:url(../fonts/fraunces-hu-italic-ext.woff2) format('woff2');unicode-range:U+0150-0151,U+0170-0171}

:root{
  --onyx:#1A1917;
  --onyx-2:#141312;
  --graphite:#232120;
  --graphite-2:#2C2A28;
  --sand:#C9A227;
  --sand-2:#E0BE4E;
  --sand-deep:#8A6E12;
  --cream:#F6F3EC;
  --cream-2:#EDE8DD;
  --ink:#211F1C;
  --muted:#6B655C;
  --muted-d:#948E85;
  --hair:rgba(33,31,28,.13);
  --hair-d:rgba(246,243,236,.12);
  --e:cubic-bezier(.22,.9,.3,1);
  --maxw:1300px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{font-family:'Inter',system-ui,sans-serif;font-size:16.5px;line-height:1.68;color:var(--cream);background:var(--onyx);overflow-x:hidden}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;background:none;border:0;color:inherit}
ul{list-style:none}
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 32px}

h1,h2,h3,h4,.slide-title{font-family:'Fraunces','Fraunces 144',Georgia,serif;font-weight:600;line-height:1.1;letter-spacing:-.018em;color:var(--cream)}
.kick{font-size:.68rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--sand);display:inline-flex;align-items:center;gap:12px}
.kick::before{content:"";width:26px;height:1px;background:currentColor}
.kick.c::before{display:none}
.lede{font-size:1.05rem;color:rgba(246,243,236,.66);max-width:64ch;font-weight:300}
.on-dark .lede,.on-deep .lede{color:rgba(246,243,236,.66)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:.73rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;padding:16px 30px;border:1px solid transparent;border-radius:2px;transition:.3s var(--e);white-space:nowrap}
.btn-gold{background:var(--sand);color:var(--onyx)}
.btn-gold:hover{background:var(--sand-2);transform:translateY(-2px);box-shadow:0 14px 30px -16px rgba(201,162,39,.8)}
.btn-out{border-color:rgba(246,243,236,.32);color:var(--cream)}
.btn-out:hover{border-color:var(--sand);color:var(--sand)}
.btn-sm{padding:12px 22px;font-size:.68rem}
.btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;flex:0 0 16px}


.hdr{position:sticky;top:0;z-index:100;background:rgba(26,25,23,.88);backdrop-filter:blur(16px);border-bottom:1px solid rgba(201,162,39,.2);transition:background .35s var(--e)}
.hdr.stuck{background:rgba(20,19,18,.98)}
.hdr .wrap{display:flex;align-items:center;gap:22px;min-height:76px}
.logo{display:flex;align-items:center;gap:13px;margin-right:auto}
.logo img{width:52px;height:52px;object-fit:contain;flex:0 0 52px}
.logo b{display:block;font-family:'Fraunces',serif;font-size:1.16rem;font-weight:600;color:var(--cream);letter-spacing:.015em;line-height:1.25}
.logo i{display:block;font-style:normal;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--sand);font-weight:600;margin-top:2px}
.menu{display:flex;align-items:center;gap:28px}
.menu>a,.drop-t{font-size:.72rem;font-weight:600;letter-spacing:.17em;text-transform:uppercase;color:rgba(246,243,236,.74);padding:8px 0;position:relative;transition:color .25s}
.menu>a::after,.drop-t::after{content:"";position:absolute;left:0;bottom:2px;width:0;height:1px;background:var(--sand);transition:width .3s var(--e)}
.menu>a:hover,.drop-t:hover{color:var(--cream)}
.menu>a:hover::after,.drop:hover .drop-t::after{width:100%}
.menu-cta{display:none}
.burger{display:none;flex-direction:column;justify-content:center;gap:5px;padding:12px 10px;min-height:44px;min-width:44px}
.burger span{width:25px;height:1.5px;background:var(--sand);display:block;transition:.3s var(--e)}
.burger.on span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger.on span:nth-child(2){opacity:0}
.burger.on span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

/* ---------- hero ---------- */
.hero{position:relative;height:min(88vh,780px);min-height:560px;overflow:hidden;background:var(--onyx)}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.2s var(--e);pointer-events:none}
.slide.on{opacity:1;pointer-events:auto}
.slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.07);transition:transform 9s linear}
.slide.on img{transform:scale(1)}
.slide::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(26,25,23,.72) 0%,rgba(26,25,23,.42) 38%,rgba(26,25,23,.08) 70%,transparent 100%)}
.slide-c{position:absolute;inset:0;z-index:3;display:flex;align-items:center}
.slide-c .wrap{width:100%}
.slide-c .inner{max-width:660px;opacity:0;transform:translateY(26px);transition:opacity .9s .3s var(--e),transform .9s .3s var(--e)}
.slide.on .slide-c .inner{opacity:1;transform:none}
.slide .slide-title{font-size:clamp(2.5rem,5.6vw,4.5rem);color:var(--cream);margin:22px 0 0;font-weight:600}
.slide .slide-title em{font-style:italic;font-weight:400;color:var(--sand);display:block}
.slide p{color:rgba(246,243,236,.72);font-size:1.05rem;margin:22px 0 34px;max-width:52ch;font-weight:300}
.slide-btns{display:flex;flex-wrap:wrap;gap:12px}

.dots{position:absolute;left:0;right:0;bottom:34px;z-index:6;display:flex;justify-content:center;gap:10px}
.dots button{width:34px;height:2px;background:rgba(246,243,236,.3);transition:.35s var(--e)}
.dots button.on{background:var(--sand);width:58px}
.arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:6;width:52px;height:52px;border:1px solid rgba(246,243,236,.26);border-radius:50%;display:grid;place-items:center;transition:.3s var(--e);background:rgba(26,25,23,.32)}
.arrow:hover{border-color:var(--sand);background:var(--sand)}
.arrow svg{width:19px;height:19px;stroke:var(--cream);fill:none;stroke-width:1.6;transition:stroke .3s}
.arrow:hover svg{stroke:var(--onyx)}
.arrow.prev{left:24px}
.arrow.next{right:24px}

/* ---------- value bar ---------- */
.vbar{background:var(--graphite)}
.vbar .wrap{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:rgba(246,243,236,.08);padding:0}
.v{background:var(--graphite);padding:26px 22px;transition:background .3s var(--e)}
.v:hover{background:var(--graphite-2)}
.v svg{width:26px;height:26px;stroke:var(--sand);fill:none;stroke-width:1.3;margin-bottom:13px}
.v b{display:block;font-family:'Fraunces',serif;font-size:1.02rem;font-weight:600;color:var(--cream);margin-bottom:5px}
.v span{font-size:.79rem;color:var(--muted-d);line-height:1.5;display:block}

/* ---------- sections ---------- */
.sec{padding:clamp(72px,8vw,120px) 0}
.on-dark{background:var(--graphite);color:var(--cream)}
.on-deep{background:var(--onyx);color:var(--cream)}
.head{max-width:840px;margin-bottom:clamp(40px,4.6vw,62px)}
.head.c{margin-inline:auto;text-align:center}
.head h2{font-size:clamp(2rem,4.1vw,3.2rem);margin:18px 0 15px}
.on-dark .head h2,.on-deep .head h2{color:var(--cream)}
.head-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:clamp(34px,4vw,52px)}

/* ---------- about (short intro) ---------- */
.intro{display:grid;grid-template-columns:1.35fr .65fr;gap:clamp(34px,5vw,72px);align-items:center;margin-bottom:clamp(48px,6vw,84px);padding-bottom:clamp(44px,5vw,68px);border-bottom:1px solid rgba(246,243,236,.1)}
.intro blockquote{position:relative;padding-left:clamp(22px,3vw,38px);border-left:2px solid var(--sand)}
.intro blockquote p{font-family:'Fraunces',serif;font-size:clamp(1.25rem,2.5vw,1.95rem);line-height:1.4;color:var(--cream);font-weight:400}
.intro-facts{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(246,243,236,.1)}
.intro-facts div{background:var(--onyx);padding:22px 18px;text-align:center}
.intro-facts b{display:block;font-family:'Fraunces',serif;font-size:1.95rem;color:var(--sand);line-height:1;font-weight:600}
.intro-facts span{font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(246,243,236,.55);font-weight:600;margin-top:8px;display:block}

/* ---------- story (long form) ---------- */
.story{max-width:1080px;margin-inline:auto}
.story-head{display:grid;grid-template-columns:1fr auto;gap:clamp(24px,4vw,54px);align-items:center;margin-bottom:30px}
.story-head h3{font-size:clamp(1.8rem,3.4vw,2.7rem);margin-top:14px;color:var(--cream);font-weight:600}
.story-img{border-radius:3px;overflow:hidden;width:clamp(280px,34vw,430px);flex:0 0 auto}
.story-img img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:center center;display:block}
.story .big{font-family:'Fraunces',serif;font-size:clamp(1.1rem,1.9vw,1.3rem);line-height:1.5;color:var(--cream);font-weight:400;max-width:74ch;padding-left:20px;border-left:2px solid var(--sand);margin-bottom:32px}
.story-cols{columns:2;column-gap:clamp(28px,4vw,56px)}
.story-cols p{color:rgba(246,243,236,.62);margin-bottom:15px;font-weight:300;font-size:.97rem;break-inside:avoid}
.story-cols p:last-child{margin-bottom:0}

/* ---------- services ---------- */
.filters{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:32px}
.filters button{font-size:.69rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:11px 20px;border:1px solid rgba(246,243,236,.2);border-radius:2px;color:rgba(246,243,236,.7);transition:.28s var(--e)}
.filters button:hover{border-color:var(--sand);color:var(--cream)}
.filters button.on{background:var(--sand);border-color:var(--sand);color:var(--onyx)}

.sgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.scard{position:relative;border-radius:3px;overflow:hidden;background:var(--onyx);min-height:360px;display:flex;align-items:flex-end;transition:transform .45s var(--e),box-shadow .45s var(--e)}
.scard.hide{display:none}
.scard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;transition:transform .9s var(--e)}
.scard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 38%,rgba(26,25,23,.45) 62%,rgba(26,25,23,.92) 88%)}
.scard:hover{transform:translateY(-5px);box-shadow:0 28px 52px -30px rgba(0,0,0,.75)}
.scard:hover img{transform:scale(1.06)}
.scard .c{position:relative;z-index:2;padding:26px 24px;width:100%}
.scard .cat{font-size:.6rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--sand)}
.scard h3{font-size:1.34rem;color:var(--cream);margin:10px 0 0;line-height:1.2;font-weight:600}
.scard p{font-size:.88rem;color:rgba(246,243,236,.68);margin-top:9px;max-height:0;opacity:0;overflow:hidden;transition:max-height .45s var(--e),opacity .35s;font-weight:300}
.scard:hover p{max-height:110px;opacity:1}
.scard .go{display:inline-flex;align-items:center;gap:8px;font-size:.65rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--sand);margin-top:14px;transition:gap .3s var(--e)}
.scard:hover .go{gap:14px}
.scard .bar{position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--sand);z-index:3;transition:width .5s var(--e)}
.scard:hover .bar{width:100%}

/* ---------- reception feature ---------- */
.feat{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,4.5vw,66px);align-items:center}
.feat-img{position:relative;border-radius:3px;overflow:hidden}
.feat-img img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 28%}
.feat-img .ribbon{position:absolute;left:0;bottom:0;right:0;background:linear-gradient(transparent,rgba(26,25,23,.95));padding:34px 26px 26px;color:var(--cream)}
.feat-img .ribbon b{font-family:'Fraunces',serif;font-size:1.24rem;display:block;font-weight:600}
.feat-img .ribbon span{font-size:.86rem;color:rgba(246,243,236,.68);font-weight:300}
.tasks{display:grid;grid-template-columns:repeat(2,1fr);gap:0 24px;margin-top:26px}
.tasks li{display:flex;gap:11px;align-items:flex-start;padding:9px 0;font-size:.92rem;color:rgba(246,243,236,.82);font-weight:300}
.tasks svg{width:14px;height:14px;stroke:var(--sand);fill:none;stroke-width:2.6;flex:0 0 14px;margin-top:6px}

/* ---------- method ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(246,243,236,.1)}
.stp{background:var(--graphite);padding:34px 26px;position:relative;transition:background .35s var(--e)}
.stp:hover{background:var(--graphite-2)}
.stp .n{font-family:'Fraunces',serif;font-size:2.7rem;font-weight:600;color:var(--sand);line-height:1;display:block;margin-bottom:14px}
.stp h3{font-size:1.2rem;color:var(--cream);margin-bottom:10px;font-weight:600}
.stp p{font-size:.91rem;color:rgba(246,243,236,.6);font-weight:300}
.stp::after{content:"";position:absolute;left:0;top:0;width:0;height:2px;background:var(--sand);transition:width .5s var(--e)}
.stp:hover::after{width:100%}

/* ---------- audience ---------- */
.aud{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ac{position:relative;border-radius:3px;overflow:hidden;min-height:400px;display:flex;align-items:flex-end;background:var(--graphite)}
.ac img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;transition:transform .9s var(--e)}
.ac::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 38%,rgba(26,25,23,.6) 62%,rgba(26,25,23,.95))}
.ac:hover img{transform:scale(1.05)}
.ac .c{position:relative;z-index:2;padding:28px 26px}
.ac .cat{font-size:.6rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--sand)}
.ac h3{font-size:1.44rem;color:var(--cream);margin:10px 0 7px;font-weight:600}
.ac p{font-size:.9rem;color:rgba(246,243,236,.7);font-weight:300}

/* ---------- band ---------- */
.band{position:relative;overflow:hidden;color:var(--cream);padding:clamp(58px,7vw,96px) 0;background:var(--onyx)}
.band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.34}
.band::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(26,25,23,.95),rgba(26,25,23,.68))}
.band .wrap{position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px}
.band h2{font-size:clamp(1.8rem,3.3vw,2.7rem);max-width:22ch;color:var(--cream)}
.band p{color:rgba(246,243,236,.7);margin-top:13px;max-width:48ch;font-weight:300}

/* ---------- contact ---------- */
.cont{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(30px,4vw,58px)}
.cform{background:var(--graphite-2);border-radius:3px;padding:clamp(26px,3.2vw,44px);border-top:3px solid var(--sand);box-shadow:0 26px 60px -38px rgba(0,0,0,.6)}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:17px}
.fld{margin-bottom:17px}
.fld label{display:block;font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--sand);margin-bottom:8px}
.fld input,.fld select,.fld textarea{width:100%;padding:13px 15px;border:1px solid rgba(246,243,236,.16);border-radius:2px;font:inherit;font-size:.95rem;background:rgba(246,243,236,.05);color:var(--cream);transition:.25s}
.fld textarea{min-height:126px;resize:vertical}
.fld select option{background:var(--graphite-2);color:var(--cream)}
.fld input::placeholder,.fld textarea::placeholder{color:rgba(246,243,236,.35)}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:0;border-color:var(--sand);box-shadow:0 0 0 3px rgba(201,162,39,.18)}
.agree{display:flex;gap:11px;align-items:flex-start;font-size:.86rem;color:rgba(246,243,236,.62);margin-bottom:20px}
.agree input{margin-top:5px;accent-color:var(--sand)}
.agree a{color:var(--sand);text-decoration:underline}

.side{display:flex;flex-direction:column;gap:2px}
.sb{background:var(--graphite-2);padding:24px 26px;border-left:2px solid var(--sand)}
.sb h4,.sb .sbh{line-height:1.68;letter-spacing:.2em;font-family:'Inter',sans-serif;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--sand);font-weight:700;margin-bottom:12px}
.sb p{font-size:.95rem;color:rgba(246,243,236,.66);font-weight:300}
.sb strong{color:var(--cream);font-weight:600}
.sb a{display:inline-flex;align-items:center;gap:10px;color:var(--cream);font-weight:500;padding:4px 0;transition:color .25s}
.sb a:hover{color:var(--sand)}
.sb svg{width:16px;height:16px;stroke:var(--sand);fill:none;stroke-width:1.8;flex:0 0 16px}
.socs{display:flex;gap:10px;margin-top:6px}
.socs a{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(246,243,236,.18);border-radius:2px;transition:.28s var(--e)}
.socs a:hover{background:var(--sand);border-color:var(--sand)}
.socs svg{width:18px;height:18px;stroke:var(--sand);transition:stroke .28s}
.socs a:hover svg{stroke:var(--onyx)}

.cert{background:var(--graphite);padding:52px 0;border-top:1px solid rgba(246,243,236,.08)}
.cert .wrap{display:flex;justify-content:center;align-items:stretch;gap:18px;flex-wrap:wrap}
.plaque{background:#fff;border-radius:3px;padding:16px 26px;display:flex;align-items:center;justify-content:center;transition:.3s var(--e)}
a.plaque:hover{transform:translateY(-3px);box-shadow:0 16px 34px -20px rgba(0,0,0,.7)}
.plaque img{height:78px;width:auto;display:block}

/* ---------- references ---------- */
.logos{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:118px;gap:14px}
.lg{background:#fff;border:1px solid rgba(246,243,236,.1);border-radius:3px;height:100%;display:flex;align-items:center;justify-content:center;padding:14px 18px;overflow:hidden;transition:.32s var(--e)}
.lg:hover{border-color:var(--sand);transform:translateY(-4px);box-shadow:0 16px 34px -20px rgba(0,0,0,.7)}
.lg img{max-height:100%;max-width:100%;width:auto;height:auto;object-fit:contain}
.more-refs{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin-top:36px}
.more-refs a,.more-refs span{font-size:.83rem;padding:9px 17px;background:rgba(246,243,236,.05);border:1px solid rgba(246,243,236,.14);border-radius:2px;color:rgba(246,243,236,.72);transition:.28s var(--e)}
.more-refs a:hover,.more-refs span:hover{border-color:var(--sand);color:var(--sand);background:rgba(201,162,39,.08);transform:translateY(-2px)}

/* ---------- footer ---------- */
.ftr{background:var(--onyx-2);color:rgba(246,243,236,.58);padding:clamp(54px,6vw,80px) 0 0}
.fg{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:38px;padding-bottom:46px}
.ftr h5,.ftr .fh{line-height:1.68;font-family:'Inter',sans-serif;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--sand);font-weight:700;margin-bottom:17px}
.ftr ul{display:flex;flex-direction:column;gap:9px}
.ftr a{font-size:.9rem;transition:color .25s}
.ftr a:hover{color:var(--sand)}
.fb p{font-size:.9rem;margin-top:15px;max-width:36ch;font-weight:300}
.fct li{display:flex;gap:10px;font-size:.9rem;align-items:flex-start}
.fct svg{width:15px;height:15px;stroke:var(--sand);fill:none;stroke-width:1.8;flex:0 0 15px;margin-top:5px}
.fbot{border-top:1px solid rgba(246,243,236,.09);padding:21px 0;font-size:.81rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px}
.fbot nav{display:flex;gap:18px;flex-wrap:wrap}

.rv{opacity:0;transform:translateY(22px);transition:opacity .75s var(--e),transform .75s var(--e)}
.rv.in{opacity:1;transform:none}

/* ==================== SZOLGÁLTATÁS-ALOLDAL ==================== */
.phero{position:relative;overflow:hidden;background:var(--onyx);color:var(--cream);padding:clamp(64px,8vw,116px) 0 clamp(52px,6vw,84px)}
.phero>img,.phero>picture>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 32%;opacity:.42}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(26,25,23,.96) 12%,rgba(26,25,23,.72) 62%,rgba(26,25,23,.5))}
.phero .wrap{position:relative;z-index:2;max-width:var(--maxw)}
.crumb{display:flex;flex-wrap:wrap;align-items:center;gap:9px;font-size:.72rem;letter-spacing:.06em;margin-bottom:26px;color:rgba(246,243,236,.55)}
.crumb a{color:rgba(246,243,236,.66);transition:color .25s}
.crumb a:hover{color:var(--sand)}
.crumb span{color:rgba(246,243,236,.3)}
.crumb em{font-style:normal;color:var(--sand)}
.phero h1{font-size:clamp(2.3rem,4.6vw,3.6rem);font-weight:600;color:var(--cream);margin:18px 0 0;line-height:1.08}
.phero .lede{margin-top:20px;max-width:60ch}
.phero-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}

.art-wrap{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(32px,4vw,64px);align-items:start}
.art h2{font-size:clamp(1.35rem,2.1vw,1.72rem);color:var(--cream);font-weight:600;margin:42px 0 14px;line-height:1.25}
.art h2:first-child{margin-top:0}
.art h3{font-family:'Fraunces',serif;font-size:1.1rem;font-weight:600;color:var(--sand);margin:26px 0 8px;line-height:1.3}
.art p{font-size:1rem;line-height:1.75;color:rgba(246,243,236,.74);font-weight:300;margin-bottom:16px;max-width:70ch}
.art strong,.art b{color:var(--cream);font-weight:600}
.art a{color:var(--sand);border-bottom:1px solid rgba(201,162,39,.4);transition:.25s var(--e)}
.art a.btn{border-bottom:0}
.art a.btn-gold{color:var(--onyx)}
.art a.btn-out{color:var(--cream)}
.art a.btn-gold:hover{color:var(--onyx)}
.art a:hover{color:var(--sand-2);border-bottom-color:var(--sand-2)}
.art-list{list-style:none;margin:20px 0 24px;display:grid;gap:12px;max-width:70ch}
.art-list li{position:relative;padding-left:32px;font-size:.97rem;line-height:1.65;color:rgba(246,243,236,.74);font-weight:300}
.art-list li::before{content:"";position:absolute;left:0;top:11px;width:16px;height:1px;background:var(--sand)}
.art-quote{margin:34px 0;padding:22px 0 22px 26px;border-left:2px solid var(--sand);font-family:'Fraunces',serif;font-style:italic;font-size:1.18rem;line-height:1.5;color:var(--cream);max-width:60ch}

.art-side{display:grid;gap:18px;position:sticky;top:104px}
.side-box{background:var(--graphite);border:1px solid rgba(246,243,236,.08);border-top:2px solid var(--sand);padding:26px 24px}
.side-box h3{font-family:'Fraunces',serif;font-size:1.22rem;font-weight:600;color:var(--cream);margin:12px 0 10px;line-height:1.25}
.side-box .kick+h3{margin-top:14px}
.side-box p{font-size:.9rem;line-height:1.6;color:rgba(246,243,236,.66);font-weight:300;margin-bottom:18px}
.side-box .btn{width:100%;margin-top:8px}
.side-list{list-style:none;display:grid;gap:11px;margin-top:4px}
.side-list li{position:relative;padding-left:24px;font-size:.89rem;line-height:1.55;color:rgba(246,243,236,.7);font-weight:300}
.side-list li::before{content:"";position:absolute;left:0;top:9px;width:11px;height:1px;background:var(--sand)}

.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.rel-card{position:relative;border-radius:3px;overflow:hidden;background:var(--onyx);min-height:230px;display:flex;align-items:flex-end;transition:transform .45s var(--e),box-shadow .45s var(--e)}
.rel-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;transition:transform .9s var(--e)}
.rel-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 34%,rgba(26,25,23,.5) 60%,rgba(26,25,23,.94) 90%)}
.rel-card:hover{transform:translateY(-5px);box-shadow:0 28px 52px -30px rgba(0,0,0,.75)}
.rel-card:hover img{transform:scale(1.06)}
.rel-card .c{position:relative;z-index:2;padding:22px 22px;width:100%}
.rel-card h3{font-size:1.16rem;color:var(--cream);margin:0;line-height:1.22;font-weight:600}
.rel-card .go{display:inline-flex;align-items:center;gap:8px;font-size:.63rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--sand);margin-top:12px;transition:gap .3s var(--e)}
.rel-card:hover .go{gap:14px}
.rel-card .bar{position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--sand);z-index:3;transition:width .5s var(--e)}
.rel-card:hover .bar{width:100%}

/* a fooldali feladatlista a cikk-oszlopban (keskenyebb hasab) */
.art-tasks{margin:22px 0 8px;gap:0 20px}
.art-tasks li{font-size:.9rem}
@media(max-width:900px){ .art-tasks{grid-template-columns:1fr} }

.ftr .disclaimer{margin-top:38px;padding-top:22px;border-top:1px solid rgba(246,243,236,.08);
  font-size:.76rem;line-height:1.65;color:rgba(246,243,236,.56);font-weight:300;max-width:100%}
@media(max-width:760px){ .ftr .disclaimer{font-size:.72rem} }

/* ---------- egyszerű szöveges oldalak (Rólunk, Impresszum, Adatkezelés, Pályázatok) ---------- */
.phero-plain{padding:clamp(58px,7vw,96px) 0 clamp(34px,4vw,52px);background:var(--onyx)}
.phero-plain::after{background:none}
.art-single{max-width:860px;margin-inline:auto}
.art-single h2{font-size:clamp(1.3rem,2vw,1.62rem)}
.art-note{margin-top:34px;padding-top:20px;border-top:1px solid rgba(246,243,236,.08);
  font-size:.85rem;color:rgba(246,243,236,.5);font-weight:300}
.palyazat-logo{background:var(--cream);padding:18px 22px;border-radius:3px;display:inline-block;margin-bottom:30px}
.palyazat-logo img{max-width:100%;height:auto}
@media(max-width:760px){ .phero-plain{padding:36px 0 26px} }

/* ---------- blog ---------- */
.post-meta{margin-top:16px;font-size:.82rem;color:rgba(246,243,236,.55);font-weight:300;letter-spacing:.02em}
.post-lead{font-size:1.06rem !important;color:rgba(246,243,236,.86) !important}
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.post-card{position:relative;display:block;background:var(--graphite);border:1px solid rgba(246,243,236,.07);
  border-radius:3px;overflow:hidden;transition:transform .45s var(--e),box-shadow .45s var(--e)}
.post-card img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center 30%;transition:transform .9s var(--e)}
.post-card:hover{transform:translateY(-5px);box-shadow:0 28px 52px -30px rgba(0,0,0,.75)}
.post-card:hover img{transform:scale(1.05)}
.post-card .c{padding:22px 22px 26px}
.post-card .cat{display:block;font-size:.63rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--sand);margin-bottom:10px}
.post-card h2{font-size:1.12rem;line-height:1.3;color:var(--cream);margin:0 0 10px;font-weight:600}
.post-card p{font-size:.88rem;line-height:1.55;color:rgba(246,243,236,.6);font-weight:300;margin:0}
.post-card .go{display:inline-block;font-size:.63rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--sand);margin-top:14px}
.post-card .bar{position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--sand);z-index:3;transition:width .5s var(--e)}
.post-card:hover .bar{width:100%}
.post-cta{margin-top:44px;padding:28px 26px;background:var(--graphite);border:1px solid rgba(246,243,236,.08);border-top:2px solid var(--sand)}
.post-cta h3{font-family:'Fraunces',serif;font-size:1.22rem;color:var(--cream);margin:0 0 8px;font-weight:600}
.post-cta p{font-size:.93rem;color:rgba(246,243,236,.66);font-weight:300;margin-bottom:18px}
@media(max-width:900px){ .post-grid{grid-template-columns:1fr 1fr} }
@media(max-width:640px){ .post-grid{grid-template-columns:1fr} }

picture{display:contents}

/* csak képernyőolvasónak látható tartalom (pl. az oldal fő H1-e a slidernél) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- szolgáltatások almenü ---------- */
.drop{position:relative}
.drop-t{display:flex;align-items:center;gap:6px;position:relative}
.drop-t .cv{width:12px;height:12px;fill:none;stroke:var(--sand);stroke-width:2.2;transition:transform .3s var(--e)}
.drop:hover .cv,.drop:focus-within .cv{transform:rotate(180deg)}
.sub{
  position:absolute;top:calc(100% + 26px);left:-24px;z-index:120;width:540px;
  background:rgba(20,19,18,.985);backdrop-filter:blur(18px);
  border:1px solid rgba(201,162,39,.2);border-top:2px solid var(--sand);
  box-shadow:0 34px 70px -28px rgba(0,0,0,.9);padding:14px 16px 16px;
  opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .26s var(--e),transform .26s var(--e),visibility .26s
}
.sub::before{content:"";position:absolute;top:-28px;left:0;right:0;height:28px}
.drop:hover .sub,.drop:focus-within .sub{opacity:1;visibility:visible;transform:none}
.sub-all{display:block;font-size:.66rem;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:var(--sand);padding:6px 10px 12px;border-bottom:1px solid rgba(246,243,236,.1);margin-bottom:8px}
.sub-all:hover{color:var(--sand-2)}
.sub-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px 10px}
.sub-grid a{display:block;font-size:.83rem;font-weight:400;color:rgba(246,243,236,.78);padding:9px 10px;border-left:2px solid transparent;transition:.22s var(--e)}
.sub-grid a:hover{color:var(--cream);background:rgba(201,162,39,.09);border-left-color:var(--sand)}

/* ---------- mobile sticky call bar ---------- */
.callbar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:95;
  grid-template-columns:1fr 1fr;gap:1px;background:rgba(246,243,236,.14);
  border-top:1px solid rgba(201,162,39,.3);
}
.callbar a{
  display:flex;align-items:center;justify-content:center;gap:9px;
  padding:17px 10px calc(17px + env(safe-area-inset-bottom,0px));
  font-size:.76rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
}
.callbar .c1{background:var(--sand);color:var(--onyx)}
.callbar .c2{background:var(--graphite);color:var(--cream)}
.callbar svg{width:17px;height:17px;fill:none;stroke-width:1.9}
.callbar .c1 svg{stroke:var(--onyx)}
.callbar .c2 svg{stroke:var(--sand)}

/* ---------- responsive ---------- */
@media(max-width:1100px){
  .callbar{display:grid}
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
  .sgrid{grid-template-columns:repeat(2,1fr)}
  .vbar .wrap{grid-template-columns:repeat(3,1fr)}
  .intro,.feat,.cont{grid-template-columns:1fr}
  .story-head{grid-template-columns:1fr}
  .story-img{width:100%}
  .story-img img{aspect-ratio:16/9;object-position:center center}
  .story-cols{columns:1}
  .feat-img{max-width:420px;margin-inline:auto}
  .feat-img img{aspect-ratio:4/5;object-position:center 24%}
  .steps{grid-template-columns:1fr 1fr}
  .aud{grid-template-columns:1fr}
  .ac{min-height:300px}
  .ac img{object-position:center 22%}
  .logos{grid-template-columns:repeat(3,1fr);grid-auto-rows:108px}
  .fg{grid-template-columns:1fr 1fr}
  .art-wrap{grid-template-columns:1fr}
  .art-side{position:static;grid-template-columns:1fr 1fr;gap:20px}
  .rel-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  body{font-size:16px}
  .wrap{padding:0 18px}
  .burger{display:flex}
  .menu{position:fixed;left:0;right:0;top:76px;flex-direction:column;align-items:stretch;gap:0;background:var(--onyx-2);padding:6px 18px 24px;border-bottom:1px solid rgba(201,162,39,.22);transform:translateY(-140%);transition:transform .4s var(--e);max-height:calc(100vh - 76px);overflow-y:auto}
  .menu.open{transform:none}
  .menu>a{padding:15px 0;border-bottom:1px solid rgba(246,243,236,.07)}
  .drop{position:static;border-bottom:1px solid rgba(246,243,236,.07)}
  .drop-t{justify-content:space-between;padding:15px 0}
  .drop-t .cv{width:14px;height:14px}
  .drop.open .cv{transform:rotate(180deg)}
  .sub{position:static;width:auto;opacity:1;visibility:visible;transform:none;display:none;
       background:transparent;backdrop-filter:none;border:0;border-left:2px solid rgba(201,162,39,.4);
       box-shadow:none;padding:2px 0 12px 14px;margin:0 0 8px}
  .sub::before{display:none}
  .drop.open .sub{display:block}
  .sub-all{padding:8px 0 10px;margin-bottom:6px}
  .sub-grid{grid-template-columns:1fr;gap:0}
  .sub-grid a{padding:11px 0;border-left:0;font-size:.9rem}
  .sub-grid a:hover{background:transparent}
  .menu .menu-cta{margin-top:16px;display:flex;justify-content:center;border-bottom:0}
  .menu .menu-cta .btn{width:100%}

  /* ---- hero: text sits BELOW the photo so nothing is cropped or unreadable ---- */
  .hero{height:auto;min-height:0}
  .slide{position:relative;display:none;opacity:1;pointer-events:auto}
  .slide.on{display:block}
  .slide img{height:300px;transform:none}
  .slide::after{inset:0 0 auto 0;height:300px;background:linear-gradient(180deg,rgba(26,25,23,.12) 24%,rgba(26,25,23,.55) 56%,rgba(26,25,23,.88) 80%,var(--onyx) 100%)}
  .slide-c{position:static;display:block;background:var(--onyx);padding:0 0 26px}
  .slide-c .inner{opacity:1;transform:none;max-width:none;margin-top:-96px;position:relative;z-index:4}
  .slide .slide-title{font-size:2rem;margin:14px 0 0}
  .slide p{font-size:.97rem;margin:16px 0 4px}
  .slide-btns{display:none}
  .dots{display:none}
  .arrow{width:40px;height:40px;top:150px}
  .arrow.prev{left:10px}
  .arrow.next{right:10px}

  .sgrid,.steps,.fr,.tasks{grid-template-columns:1fr}
  .scard{min-height:320px}
  .scard img{object-position:center 22%}
  .scard p{max-height:110px;opacity:1;margin-top:9px}
  .vbar .wrap{grid-template-columns:1fr 1fr}
  .logos{grid-template-columns:repeat(2,1fr);grid-auto-rows:96px}
  .fg{grid-template-columns:1fr;gap:30px}
  .intro-facts{grid-template-columns:1fr 1fr}
  .head,.head.c{margin-bottom:32px}
  .cert .wrap{gap:12px}
  .plaque{padding:12px 18px;flex:1 1 100%}
  .plaque img{height:56px;margin:0 auto}
  .band .wrap{flex-direction:column;align-items:flex-start}
  .band .btn{width:100%}
  .filters{gap:7px}
  .filters button{padding:10px 15px;font-size:.65rem}

  /* ---- oldalfej mobilon: a kep felul, a szoveg alatta (mint a hero slidernel) ---- */
  .phero{padding:0 0 38px;background:var(--onyx)}
  .phero>img,.phero>picture>img{position:relative;width:100%;height:300px;opacity:1;object-position:center 30%}
  .phero::after{inset:0 0 auto 0;height:300px;background:linear-gradient(180deg,rgba(26,25,23,.12) 24%,rgba(26,25,23,.55) 56%,rgba(26,25,23,.88) 80%,var(--onyx) 100%)}
  .phero .wrap{margin-top:-108px;position:relative;z-index:4}
  .phero h1{font-size:2rem}
  .phero .lede{margin-top:16px}
  .phero-btns{display:none}
  .crumb{font-size:.68rem;margin-bottom:16px}
  .art-side{grid-template-columns:1fr}
  .rel-grid{grid-template-columns:1fr}
  .art h2{font-size:1.28rem;margin-top:32px}
  .art-quote{font-size:1.05rem;padding-left:18px}

  /* ---- mobile call bar ---- */
  .callbar{display:grid}
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
  .ftr{padding-bottom:8px}
}

/* Mobilon az ajanlatkero/hivo gombokat a also ragados savra bizzuk,
   igy a szekciokban levo duplikatumok elrejtodnek. */
@media(max-width:760px){
  .head-row .btn{display:none}          /* „Egyedi igény? Beszéljünk” */
  .band .btn{display:none}              /* „Kérjen egyedi ajánlatot”   */
  .art-side .side-box:first-child{display:none}  /* aloldali hívás/ajánlat doboz */
}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
  .slide img{transform:none!important}
}

/* ---------- űrlap: spamcsapda, visszajelzés ---------- */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.form-msg{margin-top:16px;padding:13px 16px;border-radius:2px;font-size:.92rem;line-height:1.5}
.form-msg.ok{background:rgba(201,162,39,.14);border-left:3px solid var(--sand);color:var(--cream)}
.form-msg.err{background:rgba(190,60,50,.16);border-left:3px solid #C2493D;color:var(--cream)}

/* ---------- süti tájékoztató sáv ---------- */
.ckbar{position:fixed;left:16px;right:16px;bottom:16px;z-index:120;max-width:760px;margin:0 auto;display:flex;align-items:center;gap:18px;background:var(--graphite-2);border:1px solid rgba(201,162,39,.35);border-radius:3px;padding:16px 18px;box-shadow:0 20px 50px -20px rgba(0,0,0,.7)}
.ckbar p{font-size:.82rem;line-height:1.5;color:rgba(246,243,236,.82)}
.ckbar a{color:var(--sand);text-decoration:underline}
.ckbar .btn{flex:0 0 auto}
@media(max-width:1100px){ .ckbar{bottom:calc(72px + env(safe-area-inset-bottom,0px))} }
@media(max-width:560px){ .ckbar{flex-direction:column;align-items:stretch;gap:12px} }

/* ---------- mobil finomítások (záró ellenőrzés) ---------- */
@media(max-width:1100px){
  /* a kép nélküli egyszerű oldalaknál (Rólunk, Blog, Impresszum…) nem húzzuk fel a szöveget a fejléc alá */
  .phero-plain .wrap{margin-top:0}
  .phero-plain{padding:36px 0 26px}
  /* lábléc-linkek: nagyobb érintési felület, változatlan elrendezés */
  .ftr ul:not(.fct){gap:0}
  .ftr ul:not(.fct) li a{display:inline-block;padding:7px 0}
  .fct a{display:inline-block;padding:6px 0;margin:-6px 0}
  .fct li{padding:3px 0}
  .fbot nav a{display:inline-block;padding:8px 0}
  /* túl apró feliratok olvashatóbbak */
  .logo i{font-size:.64rem}
  .crumb{font-size:.74rem}
  .crumb a{display:inline-block;padding:6px 0}
  .fld label{font-size:.7rem}
}

/* ---------- tablet (761–1000 px): az asztali menü férjen ki, a lenyíló menü ne lógjon ki ---------- */
@media(min-width:761px) and (max-width:1000px){
  .menu{gap:18px}
  .menu>a,.drop-t{letter-spacing:.11em}
  .sub{position:fixed;top:76px;left:24px;right:24px;width:auto}
  .sub::before{top:-26px;height:26px}
}
@media(min-width:761px) and (max-width:880px){
  .logo span{display:none}
}

/* ---------- biztonsági kód (captcha) ---------- */
.cap-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cap-img{width:190px;height:64px;border-radius:2px;background:var(--cream);flex:0 0 auto}
.cap-new{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(246,243,236,.22);border-radius:2px;flex:0 0 44px;transition:border-color .25s}
.cap-new:hover{border-color:var(--sand)}
.cap-new svg{width:18px;height:18px;fill:none;stroke:var(--sand);stroke-width:2}
.cap-new.spin svg{animation:capspin .6s linear}
@keyframes capspin{to{transform:rotate(360deg)}}
.cap-row input{flex:1 1 140px;min-width:140px;text-transform:uppercase;letter-spacing:.3em;font-weight:600}
.cap-row input::placeholder{letter-spacing:normal;text-transform:none;font-weight:400}

/* lábléc: cégnév a kapcsolati blokk élén */
.fct .fco{font-size:.92rem;color:var(--cream);margin-bottom:2px}