.contact-body { isolation: isolate; }
.contact-form-component { --services-text: #fff; --services-muted: rgba(255,255,255,.68); --services-soft: rgba(255,255,255,.42); --services-line: rgba(255,255,255,.1); --services-surface: rgba(255,255,255,.045); --services-surface-strong: rgba(255,255,255,.075); position: relative; z-index: 2; isolation: isolate; background: rgba(10,12,20,.94); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.contact-main { position: relative; z-index: 1; overflow: hidden; }
.contact-hero { min-height: 100svh; padding: 10rem 0 7rem; }
.contact-hero__grid { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(24rem,.92fr); gap: clamp(3rem,8vw,8rem); align-items: center; }
.contact-hero__copy h1 { max-width: 52rem; margin-top: 1.5rem; color: var(--services-text); font-size: clamp(4rem,7.2vw,7.2rem); font-weight: 800; letter-spacing: -.065em; line-height: .92; }
.contact-title-word { color: #1d1b20; }
html[data-theme="dark"] .contact-title-word { color: #fff; }
.contact-hero__copy>p { max-width: 43rem; margin-top: 2rem; color: var(--services-muted); font-size: clamp(1.05rem,1.65vw,1.35rem); line-height: 1.65; }
.contact-hero__copy .services-actions { justify-content: flex-start; }
.contact-conversation { position: relative; overflow: hidden; border: 1px solid rgba(255,105,0,.3); border-radius: 1.5rem; background: var(--services-surface-strong); box-shadow: 0 35px 90px rgba(0,0,0,.22),0 0 60px rgba(255,105,0,.08); transform: rotate(1.2deg); }
.contact-conversation::before { position: absolute; inset: 4rem -8rem auto auto; width: 16rem; height: 16rem; border: 1px solid rgba(255,105,0,.2); border-radius: 50%; content: ""; pointer-events: none; }
.contact-conversation__bar { position: relative; z-index: 1; display: flex; min-height: 4.25rem; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--services-line); padding: 0 1.4rem; color: #ff6900; font: 700 .68rem/1.4 "JetBrains Mono",monospace; letter-spacing: .11em; }
.contact-conversation__bar span { display: inline-flex; align-items: center; gap: .6rem; }
.contact-conversation__bar i { width: .55rem; height: .55rem; border-radius: 50%; background: #ff6900; box-shadow: 0 0 0 .35rem rgba(255,105,0,.12); animation: contact-pulse 2s ease-in-out infinite; }
.contact-conversation__bar small { color: var(--services-soft); font-size: .58rem; text-transform: uppercase; }
.contact-conversation__body { position: relative; z-index: 1; display: grid; min-height: 25rem; align-content: center; gap: 1rem; padding: clamp(1.5rem,4vw,2.5rem); }
.contact-message { max-width: 82%; border: 1px solid var(--services-line); border-radius: 1.1rem 1.1rem 1.1rem .25rem; padding: 1rem 1.15rem; color: var(--services-text); background: var(--services-surface); font-size: 1rem; line-height: 1.55; box-shadow: 0 14px 34px rgba(0,0,0,.08); }
.contact-message--visitor { justify-self: end; border-color: rgba(255,105,0,.38); border-radius: 1.1rem 1.1rem .25rem 1.1rem; color: #fff; background: #ff6900; }
.contact-message--reply { animation: contact-message-in .7s cubic-bezier(.16,1,.3,1) both; animation-delay: .5s; }
.contact-conversation__typing { display: flex; width: max-content; gap: .3rem; border: 1px solid var(--services-line); border-radius: 999px; padding: .55rem .75rem; background: var(--services-surface); }
.contact-conversation__typing span { width: .35rem; height: .35rem; border-radius: 50%; background: #ff6900; animation: contact-typing 1.2s ease-in-out infinite; }
.contact-conversation__typing span:nth-child(2) { animation-delay: .15s; }.contact-conversation__typing span:nth-child(3) { animation-delay: .3s; }
.contact-conversation__status { position: relative; z-index: 1; display: flex; align-items: center; gap: .75rem; border-top: 1px solid var(--services-line); padding: 1rem 1.4rem; color: var(--services-text); background: rgba(255,105,0,.06); }
.contact-conversation__status>.material-symbols-outlined { display: grid; width: 2.5rem; height: 2.5rem; flex: 0 0 auto; place-items: center; border-radius: 50%; color: #ff6900; background: rgba(255,105,0,.12); }
.contact-conversation__status small,.contact-conversation__status strong { display: block; }.contact-conversation__status small { color: #ff6900; font: 700 .55rem "JetBrains Mono",monospace; letter-spacing: .1em; }.contact-conversation__status strong { margin-top: .2rem; font-size: .9rem; }
.contact-section { position: relative; padding: clamp(5rem,9vw,8rem) 0; }
.contact-section::before { position: absolute; inset: 0; z-index: -1; border-block: 1px solid var(--services-line); background: rgba(255,255,255,.018); content: ""; }
.contact-layout { display: grid; grid-template-columns: minmax(19rem,.72fr) minmax(0,1.28fr); gap: clamp(3rem,8vw,7rem); align-items: start; }
/* A főoldali ajánlatkérő blokk két, egyenrangú fókuszpontból áll. */
.contact-home-layout { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(2.5rem,5vw,5rem); align-items: center; }
.contact-aside { min-width: 0; }
.contact-aside .services-lead { margin-top: 1.25rem; }
.contact-details { display: grid; gap: .75rem; margin-top: 2.5rem; }
.contact-detail { display: grid; min-width: 0; grid-template-columns: 3rem minmax(0,1fr) auto; gap: .85rem; align-items: center; border: 1px solid var(--services-line); border-radius: 1rem; padding: 1rem; color: var(--services-text); background: rgba(10,12,20,.88); text-decoration: none; transition: border-color .18s ease,transform .18s ease,background-color .18s ease; }
.contact-detail:hover { border-color: rgba(255,105,0,.5); background: var(--services-surface-strong); transform: translateY(-2px); }
.contact-detail>.material-symbols-outlined:first-child { display: grid; width: 3rem; height: 3rem; place-items: center; border-radius: .8rem; color: #ff6900; background: rgba(255,105,0,.1); }
.contact-detail>.material-symbols-outlined:last-child { color: #ff6900; font-size: 1.1rem; }
.contact-detail small,.contact-detail strong { display: block; min-width: 0; }.contact-detail small { color: #ff6900; font: 700 .55rem "JetBrains Mono",monospace; letter-spacing: .1em; }.contact-detail strong { margin-top: .25rem; overflow-wrap: anywhere; font-size: .92rem; line-height: 1.35; }
.contact-guide { position: relative; z-index: 2; isolation: isolate; margin-top: 2.75rem; border: 1px solid rgba(255,255,255,.1); border-left: 2px solid rgba(255,105,0,.72); border-radius: 1rem; padding: 1.25rem 1.5rem 1.35rem 1.75rem; background: rgba(10,12,20,.84); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.contact-guide__label { color: #ff6900; font: 700 .62rem "JetBrains Mono",monospace; letter-spacing: .12em; }
.contact-guide ol { display: grid; gap: 1.25rem; margin-top: 1.4rem; }
.contact-guide li { display: grid; grid-template-columns: 2rem 1fr; column-gap: .6rem; color: var(--services-text); }
.contact-guide li>span { grid-row: 1/3; color: rgba(255,105,0,.62); font: 700 .6rem "JetBrains Mono",monospace; }
.contact-guide strong { font-size: .96rem; }.contact-guide small { margin-top: .25rem; color: var(--services-muted); font-size: .8rem; line-height: 1.45; }
.contact-form-panel { position: relative; min-width: 0; border: 1px solid rgba(255,105,0,.25); border-radius: 1.5rem; padding: clamp(1.35rem,4vw,2.5rem); background: var(--services-surface-strong); box-shadow: 0 32px 85px rgba(0,0,0,.15); }
.contact-form-panel::after { position: absolute; right: -1px; bottom: -1px; width: 7rem; height: 7rem; border-right: 1px solid #ff6900; border-bottom: 1px solid #ff6900; border-radius: 0 0 1.5rem; content: ""; opacity: .55; pointer-events: none; }
.contact-form-panel__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--services-line); padding-bottom: 1.25rem; color: #ff6900; font: 700 .65rem "JetBrains Mono",monospace; letter-spacing: .12em; }
.contact-form-panel__head small { color: var(--services-soft); font-size: .55rem; letter-spacing: .06em; text-transform: uppercase; }
.contact-status { display: flex; gap: .8rem; margin-top: 1.25rem; border: 1px solid rgba(255,105,0,.35); border-radius: .9rem; padding: 1rem; color: var(--services-text); background: rgba(255,105,0,.08); }
.contact-status>.material-symbols-outlined { color: #ff6900; }.contact-status strong { display: block; }.contact-status p { margin-top: .2rem; color: var(--services-muted); font-size: .85rem; }.contact-status--success { border-color: rgba(55,190,120,.35); background: rgba(55,190,120,.08); }.contact-status--success>.material-symbols-outlined { color: #38bd78; }
.contact-presets { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; margin-top: 1.5rem; }
.contact-presets button { display: flex; min-height: 3.5rem; align-items: center; gap: .65rem; border: 1px solid var(--services-line); border-radius: .8rem; padding: .75rem .9rem; color: var(--services-muted); background: var(--services-surface); font-size: .76rem; font-weight: 700; line-height: 1.3; text-align: left; transition: border-color .18s ease,color .18s ease,background-color .18s ease; }
.contact-presets button:hover,.contact-presets button:focus-visible,.contact-presets button.is-selected { border-color: rgba(255,105,0,.48); color: var(--services-text); background: rgba(255,105,0,.08); outline: none; }.contact-presets .material-symbols-outlined { flex: 0 0 auto; color: #ff6900; font-size: 1.15rem; }
.contact-page-form { position: relative; z-index: 1; display: grid; gap: 1.35rem; margin-top: 1.5rem; }
.contact-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.contact-input { position: relative; display: grid; gap: .55rem; min-width: 0; color: var(--services-muted); font-size: .72rem; font-weight: 700; }
.contact-input>span,.contact-input>label { color: var(--services-muted); font: 700 .62rem "JetBrains Mono",monospace; letter-spacing: .09em; text-transform: uppercase; }
.contact-input input,.contact-input textarea,.contact-native-select,.contact-select-trigger { width: 100%; border: 1px solid var(--services-line); border-radius: .75rem; padding: .9rem 1rem; color: var(--services-text); background: var(--services-surface); font: 500 .94rem/1.5 Inter,sans-serif; outline: none; transition: border-color .18s ease,background-color .18s ease,box-shadow .18s ease; }
.contact-input input { min-height: 3.6rem; }.contact-input textarea { min-height: 10.5rem; resize: vertical; }
.contact-input input:hover,.contact-input textarea:hover,.contact-input input:focus,.contact-input textarea:focus,.contact-select-trigger:hover,.contact-select-trigger:focus-visible { border-color: rgba(255,105,0,.58); background: var(--services-surface-strong); box-shadow: 0 0 0 3px rgba(255,105,0,.08); }
.contact-input input::placeholder,.contact-input textarea::placeholder { color: var(--services-soft); }
.contact-input>small { position: absolute; right: .8rem; bottom: .55rem; color: var(--services-soft); font: .55rem "JetBrains Mono",monospace; }
.contact-select { position: relative; z-index: 2; }.contact-select.is-open { z-index: 20; }
.contact-native-select { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.contact-select-trigger { display: flex; min-height: 3.6rem; align-items: center; justify-content: space-between; text-align: left; }.contact-select-trigger .material-symbols-outlined { color: #ff6900; transition: transform .18s ease; }.contact-select-trigger[aria-expanded="true"] .material-symbols-outlined { transform: rotate(180deg); }
.contact-select-menu { position: absolute; top: calc(100% + .5rem); left: 0; z-index: 30; width: 100%; max-height: 19rem; overflow-y: auto; border: 1px solid rgba(255,105,0,.38); border-radius: .85rem; padding: .45rem; background: rgba(14,16,24,.98); box-shadow: 0 24px 60px rgba(0,0,0,.35); backdrop-filter: blur(18px); }
.contact-select-menu[hidden] { display: none; }
.contact-select-option { display: flex; min-height: 2.8rem; width: 100%; align-items: center; justify-content: space-between; border-radius: .6rem; padding: .65rem .75rem; color: rgba(255,255,255,.72); font-size: .86rem; font-weight: 600; text-align: left; }
.contact-select-option:hover,.contact-select-option:focus-visible,.contact-select-option[aria-selected="true"] { color: #fff; background: rgba(255,105,0,.16); outline: none; }.contact-select-option[aria-selected="true"]::after { color: #ff6900; content: "check"; font-family: "Material Symbols Outlined"; font-size: 1rem; }
.contact-form-submit { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; }
.contact-form-submit p { max-width: 25rem; color: var(--services-soft); font-size: .68rem; line-height: 1.45; }.contact-form-submit p a,.contact-form-disabled a { color: #ff6900; font-weight: 700; }
.contact-form-submit .services-button { flex: 0 0 auto; }
.contact-form-submit button:disabled { border-color: var(--services-line); color: var(--services-soft); background: var(--services-surface); box-shadow: none; cursor: not-allowed; transform: none; }
.contact-form-disabled { display: flex; align-items: flex-start; gap: .5rem; border-top: 1px solid var(--services-line); padding-top: 1rem; color: var(--services-muted); font-size: .75rem; line-height: 1.45; }.contact-form-disabled .material-symbols-outlined { flex: 0 0 auto; color: #ff6900; font-size: 1rem; }
.honeypot-field { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.contact-section--steps::before { background: transparent; }
.contact-next-grid { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(3,1fr); margin-top: 3rem; border: 1px solid var(--services-line); border-radius: 1.25rem; overflow: hidden; background: rgba(10,12,20,.9); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.contact-next-grid article { position: relative; min-height: 18rem; border-right: 1px solid var(--services-line); padding: 1.5rem; }.contact-next-grid article:last-child { border-right: 0; }
.contact-next-grid article>span { color: rgba(255,105,0,.62); font: 700 .65rem "JetBrains Mono",monospace; }
.contact-next-grid article>.material-symbols-outlined { display: grid; width: 3.5rem; height: 3.5rem; margin-top: 2.5rem; place-items: center; border: 1px solid rgba(255,105,0,.25); border-radius: 50%; color: #ff6900; background: rgba(255,105,0,.08); }
.contact-next-grid h3 { margin-top: 1.3rem; color: var(--services-text); font-size: 1.25rem; font-weight: 800; letter-spacing: -.025em; }.contact-next-grid p { max-width: 18rem; margin-top: .6rem; color: var(--services-muted); font-size: .88rem; line-height: 1.55; }
.no-js .contact-select-trigger,.no-js .contact-select-menu { display: none; }.no-js .contact-native-select { position: static; width: 100%; height: auto; opacity: 1; pointer-events: auto; }
html[data-theme="light"] .contact-form-component { --services-text:#1d1b20; --services-muted:rgba(29,27,32,.68); --services-soft:rgba(29,27,32,.45); --services-line:rgba(29,27,32,.1); --services-surface:rgba(255,255,255,.72); --services-surface-strong:rgba(255,255,255,.94); background: rgba(255,255,255,.96); }
html[data-theme="light"] .contact-guide { border-color: rgba(29,27,32,.1); border-left-color: rgba(255,105,0,.72); background: rgba(255,255,255,.88); }
html[data-theme="light"] .contact-conversation,html[data-theme="light"] .contact-form-panel { box-shadow: 0 30px 80px rgba(40,28,18,.12); }
html[data-theme="light"] .contact-detail,html[data-theme="light"] .contact-next-grid { background: rgba(255,255,255,.94); }
.contact-form-component.contact-form-panel { background: rgba(10,12,20,.94); }
html[data-theme="light"] .contact-form-component.contact-form-panel { background: rgba(255,255,255,.96); }
html[data-theme="light"] .contact-select-menu { background: rgba(255,255,255,.98); box-shadow: 0 24px 60px rgba(40,28,18,.16); }.contact-select-option { color: rgba(255,255,255,.72); }html[data-theme="light"] .contact-select-option { color: rgba(29,27,32,.7); }html[data-theme="light"] .contact-select-option:hover,html[data-theme="light"] .contact-select-option:focus-visible,html[data-theme="light"] .contact-select-option[aria-selected="true"] { color: #1d1b20; }
@keyframes contact-pulse { 50% { box-shadow: 0 0 0 .55rem rgba(255,105,0,.05); opacity: .68; } }
@keyframes contact-typing { 0%,60%,100% { transform: translateY(0); opacity: .42; } 30% { transform: translateY(-.2rem); opacity: 1; } }
@keyframes contact-message-in { from { opacity: 0; transform: translateY(.6rem); } to { opacity: 1; transform: none; } }
@media (max-width: 900px) {
  .contact-hero { min-height: auto; padding: 8rem 0 5rem; }.contact-hero__grid,.contact-layout { grid-template-columns: 1fr; }.contact-hero__grid { gap: 3.5rem; }.contact-conversation { width: min(100%,40rem); margin: 0 auto; transform: none; }.contact-layout { gap: 4rem; }.contact-aside { max-width: 42rem; }.contact-next-grid article { min-height: 17rem; }
}
@media (max-width: 640px) {
  .contact-hero { padding-top: 7rem; }.contact-hero__copy h1 { font-size: clamp(3rem,14vw,4.2rem); }.contact-hero__copy .services-actions { align-items: stretch; }.contact-hero__copy .services-button { width: 100%; }.contact-conversation__body { min-height: 23rem; padding: 1.25rem; }.contact-message { max-width: 94%; font-size: .9rem; }.contact-conversation__bar { padding: 0 1rem; }.contact-conversation__bar small { display: none; }.contact-section { padding: 4.5rem 0; }.contact-form-panel { border-radius: 1.1rem; padding: 1.1rem; }.contact-form-panel__head { align-items: flex-start; flex-direction: column; gap: .35rem; }.contact-presets,.contact-form-row { grid-template-columns: 1fr; }.contact-form-submit { align-items: stretch; flex-direction: column; }.contact-form-submit .services-button { width: 100%; }.contact-next-grid { grid-template-columns: 1fr; }.contact-next-grid article { min-height: 0; border-right: 0; border-bottom: 1px solid var(--services-line); padding: 1.5rem; }.contact-next-grid article:last-child { border-bottom: 0; }.contact-next-grid article>.material-symbols-outlined { margin-top: 1.5rem; }
}
@media (prefers-reduced-motion: reduce) { .contact-conversation__bar i,.contact-conversation__typing span,.contact-message--reply { animation: none; } }
