/* ============================================================================ FUTURE BUILDERS, "C" ARCULAT: GRAFIT ES ARANY --------------------------------------------------------------------------- Ez a valasztott vegleges arculat (v2.4). Korabban a themes.css egyik valaszthato valtozata volt, most rogzitett: a elemen data-theme="c". A fejlec az 1-es, ketsoros valtozat, ahhoz nem kell attributum. A design- es fejlecvalaszto sav (themes.js) es a tobbi valtozat (A, B, D) a v2.4-ben kikerult. ========================================================================== */ /* =========================================================================== 1. SZINEK ES ARNYEKOK ========================================================================= */ html[data-theme="c"]{ --paper:#FAFAF9; --paper-2:#F1F0ED; --paper-3:#E3E1DC; --card:#FFFFFF; --ink:#1D1E23; --ink-2:#4A4B52; --muted:#78797F; --line:rgba(29,30,35,.16); --line-2:rgba(29,30,35,.07); --brand:#2E0B57; --brand-2:#48187F; --brand-ink:#2E0B57; --brand-tint:#EDE8F5; --gold:#C9962F; --gold-ink:#8A661B; --gold-tint:#FBF3E2; --shadow:0 1px 2px rgba(29,30,35,.07),0 16px 38px -20px rgba(29,30,35,.4); --shadow-lg:0 1px 2px rgba(29,30,35,.09),0 34px 66px -30px rgba(29,30,35,.55); } /* =========================================================================== 2. NYITOKEP, SOTET GRAFIT SZINPAD ARANY ZAROVONALLAL ========================================================================= */ html[data-theme="c"] .hero{ background:linear-gradient(156deg,#1C1727 0%,#2C2340 52%,#3E3455 100%); border-bottom:none} html[data-theme="c"] .hero::before{content:"";position:absolute;inset:0;pointer-events:none; background:radial-gradient(64% 54% at 82% 2%,rgba(201,150,47,.20),transparent 60%), radial-gradient(72% 62% at 4% 100%,rgba(101,58,175,.34),transparent 64%)} html[data-theme="c"] .hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px; background:linear-gradient(90deg,transparent,#C9962F 22%,#E7C87A 50%,#C9962F 78%,transparent)} html[data-theme="c"] .hero canvas{opacity:.4;mix-blend-mode:screen} html[data-theme="c"] .hero .eyebrow{color:#E0B863} html[data-theme="c"] .hero h1{color:#FFFFFF} html[data-theme="c"] .hero h1 .g{color:#E0B863} html[data-theme="c"] .hero .lede{color:rgba(255,255,255,.82)} html[data-theme="c"] .hero-note{color:rgba(255,255,255,.66)} html[data-theme="c"] .hero-note svg{color:#E0B863} html[data-theme="c"] .hero .btn-brand{background:#6B39C4;color:#FFFFFF;box-shadow:0 14px 32px -14px rgba(0,0,0,.7)} html[data-theme="c"] .hero .btn-brand:hover{background:#7E4FD6} html[data-theme="c"] .hero .btn-ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.34);color:#FFFFFF} html[data-theme="c"] .hero .btn-ghost:hover{background:rgba(255,255,255,.17);border-color:#E0B863;color:#FFFFFF} /* =========================================================================== 3. FELULETEK, KIEMELO DOBOZ, LABLEC ========================================================================= */ html[data-theme="c"] .btn-brand{box-shadow:0 12px 26px -12px rgba(29,30,35,.62)} html[data-theme="c"] .trust{background:#FFFFFF;border-bottom:1px solid rgba(201,150,47,.3)} html[data-theme="c"] .alt{background:linear-gradient(180deg,#F5F4F1 0%,#ECEAE5 100%)} html[data-theme="c"] .uline::after{background:linear-gradient(90deg,#2E0B57,#C9962F)} html[data-theme="c"] .callout:not(.soft){background:linear-gradient(140deg,#241C3A 0%,#3B3253 100%);border:1px solid rgba(201,150,47,.42)} html[data-theme="c"] .callout .btn-brand{background:#C9962F;color:#1D1E23} html[data-theme="c"] footer{background:linear-gradient(180deg,#241C3A 0%,#1D1730 100%);color:rgba(255,255,255,.74);border-top:2px solid #C9962F} html[data-theme="c"] footer h5{color:#E0B863} html[data-theme="c"] footer a{color:rgba(255,255,255,.72)} html[data-theme="c"] footer a:hover{color:#E0B863} html[data-theme="c"] .foot-partner b{color:#FFFFFF} html[data-theme="c"] .foot-bottom{border-top-color:rgba(255,255,255,.16)} html[data-theme="c"] .disc{color:rgba(255,255,255,.58)} /* A .disc alapbol a lablechez keszult. A sotet C lablecen feher, ezert a lapon BELULI jogi kisbetut vissza kell allitani sotetre, kulonben feher szoveg lenne vilagos hatteren. */ html[data-theme="c"] main .disc{color:var(--muted);opacity:1} html[data-theme="c"] main .disc a{color:var(--brand-ink);text-decoration:underline} /* A szines Horizont-logo a sotet lablecen sajat feher alapot kap. Az Alfa ertekesitesi partner logo NEM: ahhoz az atlatszo hatteru, feher (inverz) valtozatot hasznaljuk, az feher doboz nelkul ul a sotet feluleten. */ html[data-theme="c"] .foot-logo{background:#FFFFFF;border-radius:14px;padding:12px 16px;box-sizing:content-box} /* v2.12: az Alfa tarsmarka-blokk a sotet nyitokepen es lablecen */ html[data-theme="c"] .hero .cobrand{border-top-color:rgba(255,255,255,.20)} html[data-theme="c"] .hero .cobrand-txt{color:rgba(255,255,255,.70)} html[data-theme="c"] .hero .cobrand-txt b{color:#FFFFFF} html[data-theme="c"] .foot-endorse{border-top-color:rgba(255,255,255,.16)} html[data-theme="c"] .foot-endorse p b{color:#FFFFFF} /* =========================================================================== 4. A KET IRANY SZINEI A SOTET NYITOKEPEN Vilagos hatteren a lila es az arany jelolne a ket iranyt. A sotet grafit nyitokepen a szoveg feher, a kulonbseget a szinjelolo sav adja. ========================================================================= */ html[data-theme="c"] .hero .h-split .hl-career, html[data-theme="c"] .hero .h-split .hl-client{color:#FFFFFF} html[data-theme="c"] .hero .h-split .hl-career::before{background:#8C6BE0} html[data-theme="c"] .hero .h-split .hl-client::before{background:#E0B863} html[data-theme="c"] .hero .btn-client{background:#D8A63C;border-color:#D8A63C;color:#1D1E23} html[data-theme="c"] .hero .btn-client:hover{background:#E7BC61;border-color:#E7BC61;color:#1D1E23} /* =========================================================================== 5. VEDOVONAL, A VILAGOS KIEMELO DOBOZ MINDIG OLVASHATO A .callout.soft vilagos hatteru, sotet szovegu valtozat. Ez a ket ertek kotelezo, kulonben a szoveg beleolvad a hatterbe. ========================================================================= */ html[data-theme="c"] .callout.soft{background:var(--brand-tint);color:var(--ink); border:1px solid color-mix(in srgb,var(--brand) 26%,var(--line))} html[data-theme="c"] .callout.soft p{color:var(--ink-2)} html[data-theme="c"] .callout.soft > p:first-child{color:var(--ink)}