/* ========================================================= fintechstartup.hu – stíluslap Világos és sötét téma. A téma a attribútumon múlik. ========================================================= */ :root{ --papir:#FFFFFF; --felulet:#F5F6F8; --melyseg:#0B1B33; --melyseg-2:#16294A; --kiemel:#B07A32; --kiemel-vilagos:#C08A3E; --szoveg:#161A1F; --halvany:#5C636D; --vonal:#E1E5EA; --melyseg-szoveg:#EDEFF3; --melyseg-halvany:#9AA4B4; /* másodlagos színek – kategóriákhoz, kiemelésekhez */ --zold:#1F7A6B; --zold-halvany:#E6F2EF; --kek:#2A5EA8; --kek-halvany:#E6EDF8; --lila:#6B4E9B; --lila-halvany:#EFEAF6; --terra:#B5502F; --terra-halvany:#FAEBE6; --borostyan:#B07A32;--borostyan-halvany:#FAF1E2; --tenger:#1B6B8C; --tenger-halvany:#E4F0F5; --sav:1180px; --r:4px; --arnyek:0 1px 2px rgba(11,27,51,.06), 0 8px 24px rgba(11,27,51,.06); --fej:'Source Serif 4', Georgia, serif; --torzs:'Inter', system-ui, -apple-system, sans-serif; } html[data-tema="sotet"]{ --zold-halvany:#132520; --kek-halvany:#121E2F; --lila-halvany:#1C1729; --terra-halvany:#2A1A15; --borostyan-halvany:#2A2216; --tenger-halvany:#122530; --zold:#4BB39E; --kek:#6B9BE0; --lila:#A88BD6; --terra:#E08A6A; --borostyan:#D9A44C; --tenger:#5AAECF; --papir:#0E1319; --felulet:#161C24; --melyseg:#070B10; --melyseg-2:#161C24; --kiemel:#D9A44C; --kiemel-vilagos:#E4B665; --szoveg:#E5E8ED; --halvany:#98A1AE; --vonal:#242C36; --melyseg-szoveg:#E5E8ED; --melyseg-halvany:#98A1AE; --arnyek:0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.35); } *,*::before,*::after{box-sizing:border-box} html{-webkit-text-size-adjust:100%;scroll-behavior:smooth} @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}} body{ margin:0; background:var(--papir); color:var(--szoveg); font-family:var(--torzs); font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased; } h1,h2,h3{font-family:var(--fej);font-weight:600;line-height:1.2;letter-spacing:-.01em;margin:0 0 .5em} h1{font-size:clamp(2rem,1.4rem + 2.6vw,3.25rem)} h2{font-size:clamp(1.5rem,1.2rem + 1.3vw,2.1rem)} h3{font-size:1.2rem} p{margin:0 0 1.1em} a{color:inherit} img{max-width:100%;height:auto} .sav{width:min(100% - 2.5rem, var(--sav));margin-inline:auto} .ugras{position:absolute;left:-9999px;top:0;background:var(--melyseg);color:#fff;padding:.7rem 1.1rem;z-index:200} .ugras:focus{left:.5rem;top:.5rem} :focus-visible{outline:2px solid var(--kiemel);outline-offset:2px} /* ---------- Fejléc ---------- */ .fej{position:sticky;top:0;z-index:100;background:color-mix(in srgb, var(--papir) 92%, transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--vonal)} .fej__sav{display:flex;align-items:center;gap:1.5rem;min-height:68px} .logo{text-decoration:none;font-family:var(--fej);font-size:1.15rem;font-weight:700;letter-spacing:-.02em;white-space:nowrap} .logo__hu{color:var(--halvany);font-weight:400} .menu{flex:1;min-width:0} .menu__lista{display:flex;gap:1.35rem;list-style:none;margin:0;padding:0} .menu__elem{position:relative} .menu__elem > a{ text-decoration:none;font-size:.94rem;font-weight:500;color:var(--halvany); padding:.4rem 0;display:inline-block;border-bottom:2px solid transparent;transition:color .15s,border-color .15s; } .menu__elem > a:hover,.menu__elem > a[aria-current]{color:var(--szoveg);border-bottom-color:var(--kiemel)} .menu__elem--al > a::after{content:"›";margin-left:.3rem;display:inline-block;transform:rotate(90deg);font-size:.85em} .almenu{ position:absolute;left:-1rem;top:100%;min-width:250px; background:var(--papir);border:1px solid var(--vonal);border-radius:var(--r);box-shadow:var(--arnyek); list-style:none;margin:0;padding:.4rem; opacity:0;visibility:hidden;transform:translateY(-4px);transition:.16s; } .menu__elem--al:hover .almenu,.menu__elem--al:focus-within .almenu{opacity:1;visibility:visible;transform:none} .almenu a{display:block;padding:.5rem .8rem;text-decoration:none;font-size:.92rem;border-radius:2px;color:var(--halvany)} .almenu a:hover{background:var(--felulet);color:var(--szoveg)} .fej__jobb{display:flex;align-items:center;gap:.7rem} .tema{ background:none;border:1px solid var(--vonal);border-radius:var(--r);color:var(--halvany); cursor:pointer;font:inherit;font-size:.82rem;padding:.42rem .7rem;display:flex;align-items:center;gap:.35rem; } .tema:hover{color:var(--szoveg);border-color:var(--halvany)} .tema__szoveg{display:none} .hamburger{display:none;background:none;border:0;cursor:pointer;padding:.5rem;flex-direction:column;gap:5px} .hamburger span{display:block;width:22px;height:2px;background:var(--szoveg);transition:.2s} .hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)} .hamburger[aria-expanded="true"] span:nth-child(2){opacity:0} .hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)} /* ---------- Gombok ---------- */ .gomb{ display:inline-block;text-decoration:none;font-family:var(--torzs);font-size:.94rem;font-weight:500; padding:.72rem 1.3rem;border-radius:var(--r);border:1px solid transparent;cursor:pointer;transition:.16s; } .gomb--fo{background:var(--kiemel);color:#fff;border-color:var(--kiemel)} .gomb--fo:hover{background:var(--kiemel-vilagos);border-color:var(--kiemel-vilagos)} .gomb--korvonal{border-color:var(--vonal);color:inherit;background:none} .gomb--korvonal:hover{border-color:var(--kiemel);color:var(--kiemel)} .gomb--szoveg{padding:.72rem 0;color:var(--kiemel);background:none} .gomb--szoveg:hover{text-decoration:underline} /* ---------- Hirdetés ---------- */ .hirdetes{text-align:center;padding:1.1rem 1rem;background:var(--felulet);border-bottom:1px solid var(--vonal)} .hirdetes--also{border-bottom:0;border-top:1px solid var(--vonal)} .hirdetes__cimke{display:block;font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;color:var(--halvany);margin-bottom:.5rem} .hirdetes__keret{display:inline-block;max-width:100%;line-height:0} .hirdetes__keret img{max-width:100%;height:auto} /* ---------- Szekciók ---------- */ .szekcio{padding:clamp(3rem,7vw,5.5rem) 0} .szekcio--felulet{background:var(--felulet)} .szekcio--melyseg{background:var(--melyseg);color:var(--melyseg-szoveg)} .szekcio--melyseg h1,.szekcio--melyseg h2{color:#fff} .szekcio--melyseg .halvany{color:var(--melyseg-halvany)} .szekcio__fej{max-width:56ch;margin-bottom:2.5rem} .halvany{color:var(--halvany)} .kicsi{font-size:.86rem;line-height:1.6} .hero{padding:clamp(3.5rem,9vw,7rem) 0} .hero__cim{max-width:20ch} .hero__alcim{font-size:clamp(1.05rem,.95rem + .5vw,1.3rem);max-width:56ch;color:var(--melyseg-halvany)} .hero__gombok{display:flex;flex-wrap:wrap;gap:.9rem;margin:2rem 0 1.4rem} .racs{display:grid;gap:1.5rem} .racs--2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))} .racs--3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))} .racs--4{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))} .kartya{ background:var(--papir);border:1px solid var(--vonal);border-radius:var(--r); padding:1.6rem;display:flex;flex-direction:column;transition:.18s; } .szekcio--felulet .kartya{background:var(--papir)} .kartya:hover{border-color:var(--kiemel);transform:translateY(-2px);box-shadow:var(--arnyek)} .kartya h3{margin-bottom:.6rem} .kartya p{color:var(--halvany);font-size:.95rem;flex:1} .kartya__link{margin-top:.8rem;color:var(--kiemel);font-size:.92rem;font-weight:500;text-decoration:none} .kartya__link:hover{text-decoration:underline} .lepes__szam{font-family:var(--fej);font-size:2.4rem;color:var(--kiemel);line-height:1;margin-bottom:.5rem;display:block} .szam{font-family:var(--fej);font-size:2.6rem;line-height:1;color:#fff;display:block} .szam + span{font-size:.88rem;color:var(--melyseg-halvany)} .lista{list-style:none;margin:0 0 1.4rem;padding:0} .lista li{position:relative;padding-left:1.5rem;margin-bottom:.55rem} .lista li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--kiemel)} .gyik details{border-bottom:1px solid var(--vonal);padding:1.1rem 0} .gyik summary{cursor:pointer;font-family:var(--fej);font-size:1.08rem;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:1rem} .gyik summary::-webkit-details-marker{display:none} .gyik summary::after{content:"+";color:var(--kiemel);font-family:var(--torzs);font-size:1.4rem;line-height:1} .gyik details[open] summary::after{content:"–"} .gyik details p{margin:.9rem 0 0;color:var(--halvany)} .jogi{max-width:78ch} .jogi h2{margin-top:2.4rem;font-size:1.35rem} .jogi h3{margin-top:1.6rem;font-size:1.05rem} .jogi p,.jogi li{font-size:.97rem} .adatsor{display:grid;grid-template-columns:minmax(160px,auto) 1fr;gap:.35rem 1.5rem;margin-bottom:1.5rem;font-size:.95rem} .adatsor dt{color:var(--halvany)} .adatsor dd{margin:0} /* ---------- Lábléc ---------- */ .lab{background:var(--melyseg);color:var(--melyseg-szoveg);padding-top:3.5rem;margin-top:0} .lab__racs{display:grid;gap:2.2rem;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));padding-bottom:2.5rem} .lab__cim{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--melyseg-halvany);font-family:var(--torzs);font-weight:600;margin-bottom:1rem} .lab__lista{list-style:none;margin:0;padding:0;font-size:.92rem} .lab__lista li{margin-bottom:.5rem} .lab__lista a{color:var(--melyseg-halvany);text-decoration:none} .lab__lista a:hover{color:#fff} .lab__leiras,.lab__ceg{font-size:.9rem;color:var(--melyseg-halvany)} .lab .logo{color:#fff;margin-bottom:.9rem;display:inline-block} .lab__cta{margin-top:1rem;border-color:rgba(255,255,255,.22);color:#fff} .lab__zaro{border-top:1px solid rgba(255,255,255,.1);padding:1.5rem 0 2rem;font-size:.8rem;color:var(--melyseg-halvany)} .lab__zaro p{margin:0 0 .5rem;max-width:100ch} .lab__copy{opacity:.75} /* ---------- Süti sáv ---------- */ .suti{position:fixed;inset:auto 0 0 0;z-index:150;padding:1rem;background:var(--papir);border-top:1px solid var(--vonal);box-shadow:0 -6px 28px rgba(0,0,0,.12)} .suti__doboz{width:min(100% - 1rem,var(--sav));margin-inline:auto;display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap} .suti__szoveg{margin:0;flex:1;min-width:260px;font-size:.88rem;color:var(--halvany)} .suti__gombok{display:flex;gap:.6rem;flex-wrap:wrap} /* ---------- Űrlap ---------- */ .urlap{display:grid;gap:1.1rem;max-width:640px} .mezo label{display:block;font-size:.88rem;font-weight:500;margin-bottom:.35rem} .mezo input,.mezo select,.mezo textarea{ width:100%;padding:.72rem .85rem;font:inherit;font-size:.95rem; background:var(--papir);color:var(--szoveg); border:1px solid var(--vonal);border-radius:var(--r); } .mezo input:focus,.mezo select:focus,.mezo textarea:focus{border-color:var(--kiemel);outline:none} .mezo textarea{min-height:130px;resize:vertical} .mezo__sugo{font-size:.82rem;color:var(--halvany);margin:.3rem 0 0} .pipa{display:flex;gap:.65rem;align-items:flex-start;font-size:.88rem;line-height:1.5} .pipa input{width:auto;margin-top:.22rem;flex:0 0 auto} .valasztok{display:grid;gap:.5rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))} .mezo--rejtett{position:absolute;left:-9999px} .uzenet{padding:.9rem 1.1rem;border-radius:var(--r);font-size:.92rem;margin-bottom:1.4rem} .uzenet--hiba{background:#FDF0EF;border:1px solid #E9C6C2;color:#8C2B22} .uzenet--ok{background:#EFF6F1;border:1px solid #C6DFCE;color:#255C3B} html[data-tema="sotet"] .uzenet--hiba{background:#2A1614;border-color:#5A2A24;color:#F0B5AE} html[data-tema="sotet"] .uzenet--ok{background:#122019;border-color:#2A4A36;color:#A9D8BC} /* ---------- Mobil ---------- */ @media (max-width:980px){ .menu{ position:fixed;inset:68px 0 auto 0;background:var(--papir);border-bottom:1px solid var(--vonal); padding:1rem 1.25rem 1.6rem;display:none;max-height:calc(100vh - 68px);overflow-y:auto; } .menu.nyitva{display:block} .menu__lista{flex-direction:column;gap:0} .menu__elem{border-bottom:1px solid var(--vonal)} .menu__elem > a{display:block;padding:.85rem 0;font-size:1rem;border-bottom:0} .almenu{position:static;opacity:1;visibility:visible;transform:none;border:0;box-shadow:none;padding:0 0 .7rem .9rem;min-width:0;background:none} .almenu a{padding:.45rem 0} .hamburger{display:flex} .fej__cta{display:none} .menu .fej__cta{display:inline-block} } @media (min-width:640px){ .tema__szoveg{display:inline} } /* ---------- Startup ötletek ---------- */ .szurok{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2.2rem} .szuro{ text-decoration:none;font-size:.88rem;padding:.42rem .85rem; border:1px solid var(--vonal);border-radius:100px;color:var(--halvany);transition:.15s; } .szuro:hover{border-color:var(--kiemel);color:var(--kiemel)} .szuro--aktiv{background:var(--melyseg);border-color:var(--melyseg);color:#fff} .szuro span{opacity:.6;margin-left:.25rem;font-size:.82em} html[data-tema="sotet"] .szuro--aktiv{background:var(--kiemel);border-color:var(--kiemel);color:#0E1319} .otlet__szurocim{font-size:1.15rem;margin-bottom:1.4rem;color:var(--halvany)} .otletkartya h3{font-size:1.12rem;margin-bottom:.5rem} .otletkartya h3 a{text-decoration:none} .otletkartya h3 a:hover{color:var(--kiemel)} .cimke{ align-self:flex-start;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase; color:var(--kiemel);border:1px solid currentColor;border-radius:2px;padding:.15rem .45rem;margin-bottom:.8rem; } .jellemzok{display:flex;gap:1.4rem;margin:.9rem 0 0;flex-wrap:wrap} .jellemzok div{min-width:0} .jellemzok dt{font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;color:var(--halvany)} .jellemzok dd{margin:0;font-size:.88rem;font-weight:500} .morzsa{font-size:.85rem;color:var(--halvany);margin-bottom:1rem;display:flex;gap:.45rem;flex-wrap:wrap} .morzsa a{text-decoration:none} .morzsa a:hover{color:var(--kiemel)} .bevezeto{font-size:1.12rem;color:var(--halvany);max-width:62ch} .tenyek{ display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.1rem; background:var(--felulet);border:1px solid var(--vonal);border-radius:var(--r); padding:1.3rem;margin:1.8rem 0 2.4rem; } .tenyek dt{font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;color:var(--halvany);margin-bottom:.2rem} .tenyek dd{margin:0;font-weight:500;font-size:.95rem} .kiemelt-doboz{ background:var(--felulet);border:1px solid var(--vonal);border-left:3px solid var(--kiemel); border-radius:var(--r);padding:1.8rem;margin:2.8rem 0 2rem; } .kiemelt-doboz h2{margin-top:0;font-size:1.25rem} /* ---------- Tudástár ---------- */ .kiemelt-idezet{ margin:1.8rem 0;padding:1.1rem 1.4rem; border-left:3px solid var(--kiemel);background:var(--felulet); border-radius:0 var(--r) var(--r) 0; font-size:1.06rem;line-height:1.6;color:var(--szoveg); } .jogi .kiemelt-idezet p{margin:0} /* ========================================================= SZÍNESEBB MEGJELENÉS ========================================================= */ /* --- Hero: mélység és fény --- */ .hero, .szekcio--melyseg{ position:relative; background: radial-gradient(1200px 500px at 15% -10%, rgba(192,138,62,.20), transparent 60%), radial-gradient(900px 420px at 85% 110%, rgba(31,122,107,.22), transparent 62%), linear-gradient(160deg, #0D2140 0%, var(--melyseg) 55%, #081426 100%); overflow:hidden; } .hero::after, .szekcio--melyseg::after{ content:"";position:absolute;inset:0;pointer-events:none; background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size:52px 52px; -webkit-mask-image:radial-gradient(70% 60% at 50% 40%, #000 0%, transparent 75%); mask-image:radial-gradient(70% 60% at 50% 40%, #000 0%, transparent 75%); } .hero > .sav, .szekcio--melyseg > .sav{position:relative;z-index:1} .hero__cim{ background:linear-gradient(92deg, #FFFFFF 0%, #FFE9C6 55%, #F0C88A 100%); -webkit-background-clip:text;background-clip:text;color:transparent; } /* --- Kártyák: felső színcsík --- */ .kartya{position:relative;overflow:hidden} .kartya::before{ content:"";position:absolute;inset:0 0 auto 0;height:3px; background:linear-gradient(90deg, var(--kiemel), var(--zold)); opacity:0;transition:opacity .2s; } .kartya:hover::before{opacity:1} /* --- Szolgáltatáskártyák: soronként váltakozó szín --- */ .szekcio--felulet .racs--3 .kartya:nth-child(6n+1)::before{background:linear-gradient(90deg,var(--kiemel),var(--borostyan));opacity:1} .szekcio--felulet .racs--3 .kartya:nth-child(6n+2)::before{background:linear-gradient(90deg,var(--zold),#3FA890);opacity:1} .szekcio--felulet .racs--3 .kartya:nth-child(6n+3)::before{background:linear-gradient(90deg,var(--kek),#4E86D4);opacity:1} .szekcio--felulet .racs--3 .kartya:nth-child(6n+4)::before{background:linear-gradient(90deg,var(--lila),#8E71C4);opacity:1} .szekcio--felulet .racs--3 .kartya:nth-child(6n+5)::before{background:linear-gradient(90deg,var(--terra),#D2795A);opacity:1} .szekcio--felulet .racs--3 .kartya:nth-child(6n+6)::before{background:linear-gradient(90deg,var(--tenger),#3E97BC);opacity:1} /* --- Kategóriacímkék színenként --- */ .cimke{border:0;font-weight:600;padding:.22rem .6rem;border-radius:100px} .cimke--1{background:var(--zold-halvany);color:var(--zold)} .cimke--2{background:var(--kek-halvany);color:var(--kek)} .cimke--3{background:var(--lila-halvany);color:var(--lila)} .cimke--4{background:var(--terra-halvany);color:var(--terra)} .cimke--5{background:var(--borostyan-halvany);color:var(--borostyan)} .cimke--6{background:var(--tenger-halvany);color:var(--tenger)} /* --- Lépésszámok színesen --- */ .lepes__szam{ background:linear-gradient(135deg, var(--kiemel), var(--zold)); -webkit-background-clip:text;background-clip:text;color:transparent; } /* --- Szekciócím alatt színes vonal --- */ .szekcio__fej h2::after{ content:"";display:block;width:54px;height:3px;border-radius:2px;margin-top:.7rem; background:linear-gradient(90deg, var(--kiemel), var(--zold)); } .szekcio--melyseg .szekcio__fej h2::after{ background:linear-gradient(90deg, #E3B877, var(--kiemel)); } /* --- Kiemelt mondat a problémafelvetés után --- */ .kiemelt-mondat{ margin:2.6rem auto 0;max-width:62ch;text-align:center; font-family:var(--fej);font-size:clamp(1.15rem,1rem + .7vw,1.45rem);line-height:1.5; padding:1.6rem 1.8rem;border-radius:var(--r); background:linear-gradient(135deg, var(--borostyan-halvany), var(--zold-halvany)); border:1px solid var(--vonal); } /* --- Szűrő gombok --- */ .szuro--aktiv{background:linear-gradient(135deg,var(--melyseg),#1B3A63);border-color:transparent} /* --- Elsődleges gomb --- */ .gomb--fo{ background:linear-gradient(135deg, var(--kiemel), #A86F2C); border:0;box-shadow:0 2px 10px rgba(176,122,50,.28); } .gomb--fo:hover{background:linear-gradient(135deg,#CE9548,#B47F35);box-shadow:0 4px 16px rgba(176,122,50,.36)} /* --- Tények doboz és kiemelt doboz --- */ .tenyek{background:linear-gradient(135deg, var(--felulet), var(--tenger-halvany));border-color:transparent} .kiemelt-doboz{ background:linear-gradient(135deg, var(--borostyan-halvany), var(--felulet)); border-color:transparent;border-left:4px solid var(--kiemel); } .kiemelt-idezet{background:linear-gradient(135deg,var(--zold-halvany),var(--felulet));border-left-color:var(--zold)} /* --- Lábléc: színes felső szegély --- */ .lab{border-top:4px solid transparent; border-image:linear-gradient(90deg,var(--kiemel),var(--zold),var(--kek)) 1} /* --- GYIK nyitott elem --- */ .gyik details[open]{background:var(--felulet);border-radius:var(--r);padding-inline:1rem} /* --- Második kör: több szín a felületeken --- */ /* Világosszürke szekció helyett finom színárnyalat */ .szekcio--felulet{ background:linear-gradient(170deg, #F4F8F7 0%, #F7F5F1 100%); border-block:1px solid var(--vonal); } html[data-tema="sotet"] .szekcio--felulet{ background:linear-gradient(170deg,#121A20 0%,#171A16 100%); } /* A problémafelvetés oszlopai: színes bal szegély */ .szekcio .racs--3 > div:not(.kartya){padding-left:1.1rem;border-left:3px solid var(--vonal)} .szekcio .racs--3 > div:nth-child(1){border-left-color:var(--terra)} .szekcio .racs--3 > div:nth-child(2){border-left-color:var(--kek)} .szekcio .racs--3 > div:nth-child(3){border-left-color:var(--lila)} /* Lépésszámok külön színnel */ .racs--4 > div:nth-child(1) .lepes__szam{background:linear-gradient(135deg,var(--kiemel),#D9A44C);-webkit-background-clip:text;background-clip:text;color:transparent} .racs--4 > div:nth-child(2) .lepes__szam{background:linear-gradient(135deg,var(--zold),#3FA890);-webkit-background-clip:text;background-clip:text;color:transparent} .racs--4 > div:nth-child(3) .lepes__szam{background:linear-gradient(135deg,var(--kek),#5C8FD6);-webkit-background-clip:text;background-clip:text;color:transparent} .racs--4 > div:nth-child(4) .lepes__szam{background:linear-gradient(135deg,var(--lila),#9277C9);-webkit-background-clip:text;background-clip:text;color:transparent} .racs--4 > div{padding-top:.4rem;border-top:3px solid var(--vonal)} .racs--4 > div:nth-child(1){border-top-color:var(--kiemel)} .racs--4 > div:nth-child(2){border-top-color:var(--zold)} .racs--4 > div:nth-child(3){border-top-color:var(--kek)} .racs--4 > div:nth-child(4){border-top-color:var(--lila)} /* Kiemelt mondat erősebben */ .kiemelt-mondat{ background:linear-gradient(135deg,#0D2140,#164A5F); color:#fff;border:0;box-shadow:0 8px 28px rgba(11,27,51,.18); } html[data-tema="sotet"] .kiemelt-mondat{background:linear-gradient(135deg,#132A45,#123A48)} /* Lista pöttyök váltakozó színnel */ .lista li:nth-child(4n+1)::before{background:var(--kiemel)} .lista li:nth-child(4n+2)::before{background:var(--zold)} .lista li:nth-child(4n+3)::before{background:var(--kek)} .lista li:nth-child(4n+4)::before{background:var(--lila)} /* Kártyák: állandó felső csík, ne csak hoverre */ .kartya::before{opacity:1} .kartya:hover{border-color:var(--vonal)} /* Szolgáltatás-kártyák bármely rácsban színesek */ .racs--2 .kartya:nth-child(6n+1)::before,.racs--3 .kartya:nth-child(6n+1)::before{background:linear-gradient(90deg,var(--kiemel),#D9A44C)} .racs--2 .kartya:nth-child(6n+2)::before,.racs--3 .kartya:nth-child(6n+2)::before{background:linear-gradient(90deg,var(--zold),#3FA890)} .racs--2 .kartya:nth-child(6n+3)::before,.racs--3 .kartya:nth-child(6n+3)::before{background:linear-gradient(90deg,var(--kek),#5C8FD6)} .racs--2 .kartya:nth-child(6n+4)::before,.racs--3 .kartya:nth-child(6n+4)::before{background:linear-gradient(90deg,var(--lila),#9277C9)} .racs--2 .kartya:nth-child(6n+5)::before,.racs--3 .kartya:nth-child(6n+5)::before{background:linear-gradient(90deg,var(--terra),#D2795A)} .racs--2 .kartya:nth-child(6n+6)::before,.racs--3 .kartya:nth-child(6n+6)::before{background:linear-gradient(90deg,var(--tenger),#3E97BC)} /* Kártya link szín a csíkhoz igazítva */ .racs--2 .kartya:nth-child(6n+2) .kartya__link,.racs--3 .kartya:nth-child(6n+2) .kartya__link{color:var(--zold)} .racs--2 .kartya:nth-child(6n+3) .kartya__link,.racs--3 .kartya:nth-child(6n+3) .kartya__link{color:var(--kek)} .racs--2 .kartya:nth-child(6n+4) .kartya__link,.racs--3 .kartya:nth-child(6n+4) .kartya__link{color:var(--lila)} .racs--2 .kartya:nth-child(6n+5) .kartya__link,.racs--3 .kartya:nth-child(6n+5) .kartya__link{color:var(--terra)} .racs--2 .kartya:nth-child(6n+6) .kartya__link,.racs--3 .kartya:nth-child(6n+6) .kartya__link{color:var(--tenger)} /* Fejléc: vékony színes vonal alul */ .fej{border-bottom:0;box-shadow:inset 0 -3px 0 0 transparent} .fej::after{content:"";display:block;height:3px; background:linear-gradient(90deg,var(--kiemel),var(--zold),var(--kek),var(--lila))}