:root { --white: white; --black: black; --other: #D7326E; }
html { user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; font-size: 100%; -webkit-text-size-adjust: 100%; }
body { background-color: var(--white); }
* { margin: 0; padding: 0; font-family: 'Montserrat', sans-serif; color: var(--black); scroll-padding-top: var(--header); text-decoration: none; scroll-behavior: smooth; outline: none; box-sizing: border-box; -webkit-box-sizing: border-box; border: none; }
.bold { font-weight: 700; }
.color-1 { color: var(--white); }
.color-2, .hover-color-1:hover { color: var(--other); }

.background-color-1 { background-color: var(--white); }
.background-color-2 { background-color: var(--black); }
.hover-background-color-1:hover { background-color: var(--other); }
.background-color-3, .hamburger-menu-button:hover .button-line { background-color: var(--other); }
.underline:hover { text-decoration: underline; }
.flex { display: flex; flex-wrap: wrap; }
.items-center { align-items: center; }
.center-3 { justify-content: center; }
.space-between { justify-content: space-between; }
nav, section, form, .auto { margin: 0 auto; }
.pointer:hover { cursor: pointer; }
.block { display: block; }
.transition { transition: 0.25s; -webkit-transition: 0.25s; }
.table { display: table; }
.absolute { position: absolute; }
.relative { position: relative; }
.cover { object-fit: cover; }
.text-center { text-align: center; }
.middle { top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }
.border-radius { border-radius: 32px; -webkit-border-radius: 32px; }
.nowrap { white-space: nowrap; }
.shadow { box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.5); }

/* FEJLÉC */
header { top: 0; left: 0; right: 0; z-index: 2; position: sticky; position: -webkit-sticky; }
nav { padding: 0 16px; }
.logo { width: auto; height: 80px; }
.button-line { width: 21px; height: 3px; }
.button-line-up { margin-bottom: 8px; }
.button-line-down { margin-top: 8px; }
.click .button-line-up { transform: translateY(4px); }
.click .button-line-down { transform: translateY(-4px); }
.mobile-menu { display: none; width: 100%; border-bottom: 1px solid var(--gray); }
.link-desktop, .link-mobile { font-size: 16px; }
@media (max-width: 849px) { 
.desktop-menu { display: none; }
.hamburger-menu-button { display: block; }
.link-mobile { margin: 16px auto; }
}
@media (min-width: 850px) {
.desktop-menu { display: flex; }
.link-desktop { margin-right: 16px; }
.hamburger-menu-button, .mobile-menu { display: none !important; }
}

/* FŐOLDAL */
main, footer { z-index: 1; }
.image-1 { width: 100%; height: calc( var(--screen) - var(--header) ); }
input, textarea { padding: 8px 0; font-size: 16px; }
hr { border: 2px solid var(--other); }
textarea { resize: vertical; display: block; }
.button-1 { padding: 12px 16px; }
footer { padding: 16px 0; font-size: 16px; }

@media (max-width: 573px) {
nav, section, input, textarea, .contact-text, form, iframe { width: 100%; }
.middle, .padding-2 { padding: 32px 16px; }
.main-title-1 { font-size: 32px; }
.subtitle-1 { font-size: 20px; }
.padding-1 { padding-top: 16px; }
.main-text { font-size: 18px; }
.box { padding: 16px; }
.title-1 { font-size: 32px; }
.flexbox-1 { margin: 16px; width: calc( 100% - 32px ); }
.image-2 { width: auto; max-width: 100%; height: 224px; }
.title-2 { font-size: 18px; }
.flexbox-2 { margin: 16px 8px; width: calc( 100% - 16px ); }
.image-3-1, .image-3-2 { width: auto; height: 320px; }
.image-3-1 { margin: auto; }
.image-3-2 { margin: auto; }
.text, .contact-text { font-size: 16px; }
.padding-3 { padding: 16px 0; }
hr { margin-bottom: 24px; }
textarea { height: 128px; }
label, .button-1 { font-size: 18px; }
.padding-4 { padding-top: 16px; }
.padding-5 { padding: 16px 0 0 0; }
iframe { height: 384px; }
}
    
@media (min-width: 574px) { 
nav, section, input, textarea, .contact-text, iframe { width: 100%; }
.middle, .padding-2 { padding: 32px 16px; }
.main-title-1 { font-size: 48px; }
.subtitle-1 { font-size: 24px; }
.padding-1 { padding-top: 16px; }
.main-text { font-size: 20px; }
.box { padding: 32px; }
.title-1 { font-size: 48px; }
.flexbox-1 { margin: 16px; width: calc( 33.33% - 32px ); }
.image-2 { width: auto; max-width: 100%; height: 224px; }
.title-2 { font-size: 20px; }
.flexbox-2 { margin: 16px 8px; width: calc( 50% - 16px ); }
.image-3-1, .image-3-2 { width: auto; height: 288px; }
.image-3-1 { margin-left: auto; }
.image-3-2 { margin-right: auto; }
.text, .contact-text { font-size: 18px; }
.padding-3 { padding: 28px 0; }
form { width: 448px; }
hr { margin-bottom: 28px; }
textarea { height: 128px; }
label, .button-1 { font-size: 18px; }
.padding-4 { padding-top: 28px; }
.padding-5 { padding: 16px 0 28px 0; }
iframe { height: 416px; }
}
    
@media (min-width: 768px) { 
nav, section, input, textarea, iframe { width: 100%; }
.middle, .padding-2 { padding: 48px 16px; }
.main-title-1 { font-size: 56px; }
.subtitle-1 { font-size: 28px; }
.padding-1 { padding-top: 16px; }
.main-text { font-size: 24px; }
.box { padding: 28px; }
.title-1 { font-size: 52px; }
.flexbox-1 { margin: 28px; width: calc( 33.33% - 56px ); }
.image-2 { width: auto; max-width: 100%; height: 256px; }
.title-2 { font-size: 22px; }
.flexbox-2 { margin: 28px 14px; width: calc( 50% - 28px ); }
.image-3-1, .image-3-2 { width: auto; height: 384px; }
.image-3-1 { margin-left: auto; }
.image-3-2 { margin-right: auto; }
.text, .contact-text { font-size: 20px; }
.padding-3 { padding: 28px 0; }
.contact-text { width: 640px; }
form { width: 448px; }
hr { margin-bottom: 28px; }
textarea { height: 128px; }
label, .button-1 { font-size: 20px; }
.padding-4 { padding-top: 28px; }
.padding-5 { padding: 16px 0 28px 0; }
iframe { height: 448px; }
}
    
@media (min-width: 993px) {
nav, section, input, textarea, iframe { width: 100%; }
.middle, .padding-2 { padding: 48px 16px; }
.main-title-1 { font-size: 64px; }
.subtitle-1 { font-size: 32px; }
.padding-1 { padding-top: 16px; }
.main-text { width: 100%; max-width: 1088px; font-size: 28px; }
.box { padding: 28px; }
.title-1 { font-size: 56px; }
.flexbox-1 { margin: 28px; width: calc( 33.33% - 56px ); }
.image-2 { width: auto; max-width: 100%; height: 320px; }
.title-2 { font-size: 24px; }
.flexbox-2 { margin: 28px 14px; width: calc( 50% - 28px ); }
.image-3-1, .image-3-2 { width: auto; height: 416px; }
.image-3-1 { margin-left: auto; }
.image-3-2 { margin-right: auto; }
.text, .contact-text { font-size: 22px; }
.padding-3 { padding: 28px 0; }
.contact-text { width: 720px; }
form { width: 448px; }
hr { margin-bottom: 28px; }
textarea { height: 128px; }
label, .button-1 { font-size: 20px; }
.padding-4 { padding-top: 28px; }
.padding-5 { padding: 16px 0 28px 0; }
iframe { height: 480px; }
}
    
@media (min-width: 1350px) { 
nav, section, input, textarea, iframe { width: 100%; }
.middle, .padding-2 { padding: 64px 16px; }
.main-title-1 { font-size: 72px; }
.subtitle-1 { font-size: 36px; }
.padding-1 { padding-top: 16px; }
.main-text { width: 1216px; max-width: 1216px; font-size: 32px; }
.box { padding: 32px; }
.title-1 { font-size: 64px; }
.flexbox-1 { margin: 32px; width: calc( 33.33% - 64px ); }
.image-2 { width: auto; max-width: 100%; height: 384px; }
.title-2 { font-size: 28px; }
.flexbox-2 { margin: 32px 16px; width: calc( 50% - 32px ); }
.image-3-1, .image-3-2 { width: auto; height: 448px; }
.image-3-1 { margin-left: auto; }
.image-3-2 { margin-right: auto; }
.text, .contact-text { font-size: 24px; }
.padding-3 { padding: 32px 0; }
.contact-text { width: 770px; }
form { width: 448px; }
hr { margin-bottom: 32px; }
textarea { height: 128px; }
label, .button-1 { font-size: 22px; }
.padding-4 { padding-top: 32px; }
.padding-5 { padding: 16px 0 32px 0; }
iframe { width: 100%; height: 512px; }
}