{"id":102,"date":"2026-08-17T12:57:40","date_gmt":"2026-08-17T12:57:40","guid":{"rendered":"https:\/\/hetvenhat.hu\/?page_id=102"},"modified":"2026-08-29T08:20:30","modified_gmt":"2026-08-29T08:20:30","slug":"kapcsolat-2","status":"publish","type":"page","link":"https:\/\/hetvenhat.hu\/en\/kapcsolat-2\/","title":{"rendered":"Contact"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"102\" class=\"elementor elementor-102\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f4e738b e-flex e-con-boxed e-con e-parent\" data-id=\"f4e738b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3677510 elementor-widget elementor-widget-html\" data-id=\"3677510\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"hh-contact-page\" id=\"kapcsolat\">\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=Montserrat:wght@400;500;600&display=swap');\r\n\r\n:root {\r\n    --hh-black: #050505;\r\n    --hh-card: #0d0d0d;\r\n    --hh-gold: #d3ad5d;\r\n    --hh-gold-light: #efd38f;\r\n    --hh-cream: #f3ead8;\r\n    --hh-muted: #a79f92;\r\n    --hh-border: rgba(211,173,93,.25);\r\n}\r\n\r\n* {\r\n    box-sizing: border-box;\r\n}\r\n\r\nhtml {\r\n    scroll-behavior: smooth;\r\n}\r\n\r\nbody {\r\n    margin: 0;\r\n    background: var(--hh-black);\r\n}\r\n\r\n.elementor-widget-html,\r\n.elementor-widget-html .elementor-widget-container {\r\n    width: 100%;\r\n    max-width: none !important;\r\n    margin: 0 !important;\r\n    padding: 0 !important;\r\n}\r\n\r\n.hh-contact-page {\r\n    width: 100vw;\r\n    max-width: none;\r\n\r\n    margin-left: calc(50% - 50vw);\r\n    margin-right: calc(50% - 50vw);\r\n\r\n    background:\r\n        radial-gradient(\r\n            circle at 70% 20%,\r\n            rgba(211,173,93,.06),\r\n            transparent 34%\r\n        ),\r\n        var(--hh-black);\r\n\r\n    color: var(--hh-cream);\r\n\r\n    overflow: hidden;\r\n\r\n    font-family: 'Montserrat', sans-serif;\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   HEADER\r\n============================================================ *\/\r\n\r\n.hh-header {\r\n    position: fixed;\r\n\r\n    top: 0;\r\n    left: 0;\r\n\r\n    width: 100%;\r\n    height: 88px;\r\n\r\n    z-index: 9999;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n\r\n    background: rgba(5,5,5,.36);\r\n\r\n    backdrop-filter: blur(5px);\r\n    -webkit-backdrop-filter: blur(5px);\r\n\r\n    border-bottom: 1px solid rgba(211,173,93,.07);\r\n\r\n    transition:\r\n        background .35s ease,\r\n        backdrop-filter .35s ease,\r\n        border-color .35s ease;\r\n}\r\n\r\n.hh-header.scrolled {\r\n    background: rgba(5,5,5,.93);\r\n\r\n    backdrop-filter: blur(20px);\r\n    -webkit-backdrop-filter: blur(20px);\r\n\r\n    border-bottom-color: rgba(211,173,93,.15);\r\n}\r\n\r\n.hh-header-inner {\r\n    width: min(1500px, calc(100% - 64px));\r\n\r\n    margin: 0 auto;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n\r\n    gap: 40px;\r\n}\r\n\r\n\r\n\/* LOGO *\/\r\n\r\n.hh-logo {\r\n    display: flex;\r\n    align-items: center;\r\n\r\n    gap: 14px;\r\n\r\n    text-decoration: none;\r\n\r\n    color: var(--hh-cream);\r\n\r\n    flex-shrink: 0;\r\n}\r\n\r\n.hh-logo-number {\r\n    font-family: 'Cormorant Garamond', serif;\r\n\r\n    font-size: 52px;\r\n    font-weight: 500;\r\n\r\n    line-height: .85;\r\n\r\n    color: var(--hh-gold);\r\n\r\n    letter-spacing: -3px;\r\n}\r\n\r\n.hh-logo-text {\r\n    display: flex;\r\n\r\n    flex-direction: column;\r\n\r\n    line-height: 1;\r\n}\r\n\r\n.hh-logo-main {\r\n    font-family: 'Cormorant Garamond', serif;\r\n\r\n    font-size: 25px;\r\n    font-weight: 600;\r\n\r\n    letter-spacing: .5px;\r\n}\r\n\r\n.hh-logo-sub {\r\n    margin-top: 5px;\r\n\r\n    font-size: 8px;\r\n\r\n    letter-spacing: 3px;\r\n\r\n    color: var(--hh-gold);\r\n\r\n    text-transform: uppercase;\r\n}\r\n\r\n\r\n\/* NAV *\/\r\n\r\n.hh-nav {\r\n    display: flex;\r\n    align-items: center;\r\n\r\n    gap: clamp(14px, 1.7vw, 28px);\r\n}\r\n\r\n.hh-nav a {\r\n    position: relative;\r\n\r\n    color: #ded7cb;\r\n\r\n    text-decoration: none;\r\n\r\n    font-size: 13px;\r\n    font-weight: 500;\r\n\r\n    transition: color .25s ease;\r\n}\r\n\r\n.hh-nav a::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    left: 0;\r\n    bottom: -10px;\r\n\r\n    width: 0;\r\n    height: 1px;\r\n\r\n    background: var(--hh-gold);\r\n\r\n    transition: width .3s ease;\r\n}\r\n\r\n.hh-nav a:hover,\r\n.hh-nav a.active {\r\n    color: var(--hh-gold-light);\r\n}\r\n\r\n.hh-nav a:hover::after,\r\n.hh-nav a.active::after {\r\n    width: 100%;\r\n}\r\n\r\n\r\n\/* MOBILE MENU BUTTON *\/\r\n\r\n.hh-mobile-toggle {\r\n    display: none;\r\n\r\n    width: 42px;\r\n    height: 42px;\r\n\r\n    border: 1px solid var(--hh-border);\r\n\r\n    background: rgba(0,0,0,.45);\r\n\r\n    border-radius: 50%;\r\n\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    cursor: pointer;\r\n\r\n    padding: 0;\r\n}\r\n\r\n.hh-mobile-toggle span,\r\n.hh-mobile-toggle span::before,\r\n.hh-mobile-toggle span::after {\r\n    width: 18px;\r\n    height: 1px;\r\n\r\n    display: block;\r\n\r\n    position: relative;\r\n\r\n    background: var(--hh-gold-light);\r\n\r\n    transition:\r\n        transform .25s ease,\r\n        opacity .25s ease;\r\n}\r\n\r\n.hh-mobile-toggle span::before,\r\n.hh-mobile-toggle span::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    left: 0;\r\n}\r\n\r\n.hh-mobile-toggle span::before {\r\n    top: -6px;\r\n}\r\n\r\n.hh-mobile-toggle span::after {\r\n    top: 6px;\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   HERO\r\n============================================================ *\/\r\n\r\n.hh-contact-hero {\r\n    position: relative;\r\n\r\n    width: 100%;\r\n\r\n    \/*\r\n       KAPCSOLAT.PNG = 1680 x 896\r\n       = 15:8 k\u00e9par\u00e1ny\r\n\r\n       DESKTOPON A HERO PONTOSAN EZT AZ AR\u00c1NYT KAPJA.\r\n       NINCS CROP.\r\n       NINCS ZOOM.\r\n    *\/\r\n\r\n    aspect-ratio: 15 \/ 8;\r\n\r\n    min-height: 0;\r\n\r\n    display: flex;\r\n\r\n    align-items: flex-end;\r\n\r\n    overflow: hidden;\r\n\r\n    background: #050505;\r\n}\r\n\r\n\r\n\/* IMAGE WRAPPER *\/\r\n\r\n.hh-contact-hero-image {\r\n    position: absolute;\r\n\r\n    inset: 0;\r\n\r\n    width: 100%;\r\n    height: 100%;\r\n\r\n    background: #050505;\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   FONTOS:\r\n   DESKTOPON NINCS OBJECT-FIT COVER\r\n   NINCS SCALE\r\n   NINCS ZOOM\r\n============================================================ *\/\r\n\r\n.hh-contact-hero-image img {\r\n    display: block;\r\n\r\n    width: 100%;\r\n    height: 100%;\r\n\r\n    object-fit: contain;\r\n\r\n    object-position: center center;\r\n\r\n    transform: none !important;\r\n\r\n    scale: none !important;\r\n}\r\n\r\n\r\n\/* HERO DARK OVERLAY *\/\r\n\r\n.hh-contact-hero::before {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    inset: 0;\r\n\r\n    z-index: 1;\r\n\r\n    pointer-events: none;\r\n\r\n    background:\r\n\r\n        linear-gradient(\r\n            90deg,\r\n            rgba(0,0,0,.93) 0%,\r\n            rgba(0,0,0,.70) 22%,\r\n            rgba(0,0,0,.28) 45%,\r\n            rgba(0,0,0,.05) 72%,\r\n            rgba(0,0,0,.02) 100%\r\n        ),\r\n\r\n        linear-gradient(\r\n            0deg,\r\n            rgba(5,5,5,.98) 0%,\r\n            rgba(5,5,5,.34) 25%,\r\n            rgba(5,5,5,.03) 60%\r\n        );\r\n}\r\n\r\n\r\n\/* HERO CONTENT *\/\r\n\r\n.hh-contact-hero-content {\r\n    position: relative;\r\n\r\n    z-index: 2;\r\n\r\n    width: min(1500px, calc(100% - 64px));\r\n\r\n    margin: 0 auto;\r\n\r\n    padding-bottom: clamp(180px, 15vw, 250px);\r\n}\r\n\r\n.hh-eyebrow {\r\n    display: flex;\r\n\r\n    align-items: center;\r\n\r\n    gap: 14px;\r\n\r\n    margin-bottom: 21px;\r\n\r\n    color: var(--hh-gold);\r\n\r\n    text-transform: uppercase;\r\n\r\n    letter-spacing: 5px;\r\n\r\n    font-size: 11px;\r\n    font-weight: 600;\r\n}\r\n\r\n.hh-eyebrow::before {\r\n    content: \"\";\r\n\r\n    width: 42px;\r\n    height: 1px;\r\n\r\n    background: var(--hh-gold);\r\n}\r\n\r\n.hh-contact-hero h1 {\r\n    margin: 0;\r\n\r\n    max-width: 700px;\r\n\r\n    font-family: 'Cormorant Garamond', serif;\r\n\r\n    font-weight: 500;\r\n\r\n    font-size: clamp(58px, 6.6vw, 108px);\r\n\r\n    line-height: .88;\r\n\r\n    letter-spacing: -3px;\r\n}\r\n\r\n.hh-contact-hero h1 em {\r\n    color: var(--hh-gold-light);\r\n\r\n    font-style: italic;\r\n    font-weight: 400;\r\n}\r\n\r\n.hh-contact-hero-copy {\r\n    margin: 27px 0 0;\r\n\r\n    max-width: 520px;\r\n\r\n    font-family: 'Cormorant Garamond', serif;\r\n\r\n    font-size: clamp(18px, 1.5vw, 22px);\r\n\r\n    line-height: 1.45;\r\n\r\n    color: rgba(243,234,216,.78);\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   CONTACT SECTION\r\n============================================================ *\/\r\n\r\n.hh-contact-main {\r\n    position: relative;\r\n\r\n    padding: 120px 0 130px;\r\n\r\n    background:\r\n        radial-gradient(\r\n            circle at 20% 0%,\r\n            rgba(211,173,93,.035),\r\n            transparent 30%\r\n        );\r\n}\r\n\r\n.hh-contact-main::before {\r\n    content: \"76\";\r\n\r\n    position: absolute;\r\n\r\n    right: -40px;\r\n    top: -60px;\r\n\r\n    font-family: 'Cormorant Garamond', serif;\r\n\r\n    font-size: 390px;\r\n\r\n    line-height: 1;\r\n\r\n    color: rgba(211,173,93,.022);\r\n\r\n    pointer-events: none;\r\n}\r\n\r\n.hh-contact-grid {\r\n    width: min(1320px, calc(100% - 64px));\r\n\r\n    margin: 0 auto;\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns:\r\n        minmax(0, 1.15fr)\r\n        minmax(380px, .85fr);\r\n\r\n    gap: 80px;\r\n\r\n    align-items: start;\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   LEFT TITLE\r\n============================================================ *\/\r\n\r\n.hh-contact-heading {\r\n    margin-bottom: 45px;\r\n}\r\n\r\n.hh-contact-heading .small {\r\n    color: var(--hh-gold);\r\n\r\n    text-transform: uppercase;\r\n\r\n    letter-spacing: 4px;\r\n\r\n    font-size: 10px;\r\n    font-weight: 600;\r\n}\r\n\r\n.hh-contact-heading h2 {\r\n    margin: 12px 0 10px;\r\n\r\n    font-family: 'Cormorant Garamond', serif;\r\n\r\n    font-size: clamp(46px, 5vw, 75px);\r\n\r\n    font-weight: 500;\r\n\r\n    line-height: .95;\r\n}\r\n\r\n.hh-contact-heading h2 em {\r\n    color: var(--hh-gold-light);\r\n\r\n    font-style: italic;\r\n\r\n    font-weight: 400;\r\n}\r\n\r\n.hh-contact-heading p {\r\n    max-width: 620px;\r\n\r\n    margin: 18px 0 0;\r\n\r\n    color: var(--hh-muted);\r\n\r\n    font-size: 14px;\r\n\r\n    line-height: 1.8;\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   FORM\r\n============================================================ *\/\r\n\r\n.hh-form {\r\n    position: relative;\r\n\r\n    padding: 42px;\r\n\r\n    background:\r\n\r\n        linear-gradient(\r\n            145deg,\r\n            rgba(255,255,255,.025),\r\n            rgba(255,255,255,0)\r\n        ),\r\n\r\n        #090909;\r\n\r\n    border: 1px solid var(--hh-border);\r\n\r\n    border-radius: 2px;\r\n}\r\n\r\n.hh-form::before {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    top: -1px;\r\n    left: 38px;\r\n\r\n    width: 90px;\r\n    height: 1px;\r\n\r\n    background: var(--hh-gold);\r\n}\r\n\r\n.hh-field-row {\r\n    display: grid;\r\n\r\n    grid-template-columns: 1fr 1fr;\r\n\r\n    gap: 20px;\r\n}\r\n\r\n.hh-field {\r\n    margin-bottom: 22px;\r\n}\r\n\r\n.hh-field label {\r\n    display: block;\r\n\r\n    margin-bottom: 9px;\r\n\r\n    color: var(--hh-gold);\r\n\r\n    font-size: 9px;\r\n    font-weight: 600;\r\n\r\n    letter-spacing: 3px;\r\n\r\n    text-transform: uppercase;\r\n}\r\n\r\n.hh-field input,\r\n.hh-field textarea {\r\n    width: 100%;\r\n\r\n    border: 1px solid rgba(211,173,93,.22);\r\n\r\n    background: rgba(0,0,0,.34);\r\n\r\n    color: var(--hh-cream);\r\n\r\n    font-family: 'Montserrat', sans-serif;\r\n\r\n    font-size: 14px;\r\n\r\n    padding: 16px 17px;\r\n\r\n    border-radius: 0;\r\n\r\n    outline: none;\r\n\r\n    transition:\r\n        border-color .25s ease,\r\n        background .25s ease,\r\n        box-shadow .25s ease;\r\n}\r\n\r\n.hh-field input {\r\n    height: 54px;\r\n}\r\n\r\n.hh-field textarea {\r\n    min-height: 175px;\r\n\r\n    resize: vertical;\r\n\r\n    line-height: 1.6;\r\n}\r\n\r\n.hh-field input::placeholder,\r\n.hh-field textarea::placeholder {\r\n    color: #59544d;\r\n}\r\n\r\n.hh-field input:focus,\r\n.hh-field textarea:focus {\r\n    border-color: rgba(239,211,143,.75);\r\n\r\n    background: rgba(211,173,93,.025);\r\n\r\n    box-shadow:\r\n        0 0 0 3px rgba(211,173,93,.035);\r\n}\r\n\r\n\r\n\/* HONEYPOT *\/\r\n\r\n.hh-website-field {\r\n    position: absolute !important;\r\n\r\n    left: -99999px !important;\r\n\r\n    width: 1px !important;\r\n    height: 1px !important;\r\n\r\n    opacity: 0 !important;\r\n\r\n    pointer-events: none !important;\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   SUBMIT\r\n============================================================ *\/\r\n\r\n.hh-submit {\r\n    width: 100%;\r\n\r\n    min-height: 58px;\r\n\r\n    padding: 0 24px;\r\n\r\n    border: 1px solid var(--hh-gold);\r\n\r\n    background: var(--hh-gold);\r\n\r\n    color: #080705;\r\n\r\n    font-family: 'Montserrat', sans-serif;\r\n\r\n    font-size: 11px;\r\n    font-weight: 600;\r\n\r\n    letter-spacing: 2.5px;\r\n\r\n    text-transform: uppercase;\r\n\r\n    cursor: pointer;\r\n\r\n    transition:\r\n        transform .25s ease,\r\n        background .25s ease,\r\n        box-shadow .25s ease;\r\n}\r\n\r\n.hh-submit:hover {\r\n    transform: translateY(-2px);\r\n\r\n    background: var(--hh-gold-light);\r\n\r\n    box-shadow:\r\n        0 14px 35px rgba(211,173,93,.14);\r\n}\r\n\r\n.hh-submit:disabled {\r\n    cursor: wait;\r\n\r\n    opacity: .65;\r\n\r\n    transform: none;\r\n\r\n    box-shadow: none;\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   FORM STATUS\r\n============================================================ *\/\r\n\r\n.hh-form-status {\r\n    display: none;\r\n\r\n    margin-top: 18px;\r\n\r\n    padding: 16px 18px;\r\n\r\n    border: 1px solid var(--hh-border);\r\n\r\n    font-family: 'Cormorant Garamond', serif;\r\n\r\n    font-size: 18px;\r\n\r\n    line-height: 1.4;\r\n}\r\n\r\n.hh-form-status.show {\r\n    display: block;\r\n}\r\n\r\n.hh-form-status.success {\r\n    border-color: rgba(211,173,93,.55);\r\n\r\n    color: var(--hh-gold-light);\r\n\r\n    background: rgba(211,173,93,.055);\r\n}\r\n\r\n.hh-form-status.error {\r\n    border-color: rgba(190,90,70,.55);\r\n\r\n    color: #e3a092;\r\n\r\n    background: rgba(190,90,70,.05);\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   RIGHT SIDE\r\n============================================================ *\/\r\n\r\n.hh-contact-side {\r\n    padding-top: 89px;\r\n}\r\n\r\n.hh-contact-side-title {\r\n    margin-bottom: 22px;\r\n\r\n    color: var(--hh-gold);\r\n\r\n    font-size: 10px;\r\n    font-weight: 600;\r\n\r\n    letter-spacing: 4px;\r\n\r\n    text-transform: uppercase;\r\n}\r\n\r\n.hh-contact-card {\r\n    position: relative;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n\r\n    gap: 20px;\r\n\r\n    width: 100%;\r\n\r\n    min-height: 104px;\r\n\r\n    padding: 22px 25px;\r\n\r\n    margin-bottom: 14px;\r\n\r\n    color: var(--hh-cream);\r\n\r\n    text-decoration: none;\r\n\r\n    background: rgba(255,255,255,.018);\r\n\r\n    border:\r\n        1px solid rgba(211,173,93,.18);\r\n\r\n    overflow: hidden;\r\n\r\n    transition:\r\n        transform .25s ease,\r\n        border-color .25s ease,\r\n        background .25s ease;\r\n}\r\n\r\n.hh-contact-card::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    left: 0;\r\n    bottom: 0;\r\n\r\n    width: 100%;\r\n    height: 2px;\r\n\r\n    background: var(--hh-gold);\r\n\r\n    transform: scaleX(0);\r\n\r\n    transform-origin: left;\r\n\r\n    transition: transform .35s ease;\r\n}\r\n\r\n.hh-contact-card:hover {\r\n    transform: translateX(7px);\r\n\r\n    border-color:\r\n        rgba(211,173,93,.50);\r\n\r\n    background:\r\n        rgba(211,173,93,.035);\r\n}\r\n\r\n.hh-contact-card:hover::after {\r\n    transform: scaleX(1);\r\n}\r\n\r\n.hh-contact-icon {\r\n    width: 52px;\r\n    height: 52px;\r\n\r\n    flex: 0 0 52px;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    border:\r\n        1px solid rgba(211,173,93,.26);\r\n\r\n    border-radius: 50%;\r\n\r\n    color: var(--hh-gold-light);\r\n}\r\n\r\n.hh-contact-icon svg {\r\n    width: 23px;\r\n    height: 23px;\r\n}\r\n\r\n.hh-contact-card-text {\r\n    flex: 1;\r\n\r\n    min-width: 0;\r\n}\r\n\r\n.hh-contact-card-text span {\r\n    display: block;\r\n\r\n    margin-bottom: 5px;\r\n\r\n    color: #7d7569;\r\n\r\n    font-size: 9px;\r\n\r\n    letter-spacing: 2px;\r\n\r\n    text-transform: uppercase;\r\n}\r\n\r\n.hh-contact-card-text strong {\r\n    display: block;\r\n\r\n    font-family: 'Cormorant Garamond', serif;\r\n\r\n    font-size: 22px;\r\n\r\n    line-height: 1.2;\r\n\r\n    font-weight: 500;\r\n}\r\n\r\n.hh-contact-arrow {\r\n    color: var(--hh-gold);\r\n\r\n    font-size: 23px;\r\n\r\n    line-height: 1;\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   CRINGE QUOTE\r\n============================================================ *\/\r\n\r\n.hh-cringe-box {\r\n    margin-top: 34px;\r\n\r\n    padding: 35px;\r\n\r\n    border-top: 1px solid var(--hh-border);\r\n    border-bottom: 1px solid var(--hh-border);\r\n\r\n    text-align: center;\r\n}\r\n\r\n.hh-cringe-quote {\r\n    margin: 0;\r\n\r\n    font-family: 'Cormorant Garamond', serif;\r\n\r\n    font-size: 26px;\r\n\r\n    font-style: italic;\r\n\r\n    line-height: 1.35;\r\n\r\n    color: #cfc2ac;\r\n}\r\n\r\n.hh-cringe-small {\r\n    margin-top: 12px;\r\n\r\n    color: var(--hh-gold);\r\n\r\n    font-size: 9px;\r\n\r\n    letter-spacing: 3px;\r\n\r\n    text-transform: uppercase;\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   REVEAL\r\n============================================================ *\/\r\n\r\n.hh-reveal {\r\n    opacity: 0;\r\n\r\n    transform: translateY(26px);\r\n\r\n    transition:\r\n        opacity .8s cubic-bezier(.2,.75,.25,1),\r\n        transform .8s cubic-bezier(.2,.75,.25,1);\r\n}\r\n\r\n.hh-reveal.visible {\r\n    opacity: 1;\r\n\r\n    transform: translateY(0);\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   TABLET\r\n============================================================ *\/\r\n\r\n@media (max-width: 1050px) {\r\n\r\n    .hh-header-inner {\r\n        width: calc(100% - 38px);\r\n    }\r\n\r\n    .hh-mobile-toggle {\r\n        display: flex;\r\n\r\n        z-index: 10002;\r\n    }\r\n\r\n    .hh-nav {\r\n        position: fixed;\r\n\r\n        inset: 0;\r\n\r\n        background: rgba(5,5,5,.985);\r\n\r\n        display: flex;\r\n\r\n        flex-direction: column;\r\n\r\n        justify-content: center;\r\n\r\n        gap: 26px;\r\n\r\n        opacity: 0;\r\n\r\n        visibility: hidden;\r\n\r\n        pointer-events: none;\r\n\r\n        transition:\r\n            opacity .3s ease,\r\n            visibility .3s ease;\r\n\r\n        z-index: 10001;\r\n    }\r\n\r\n    .hh-nav.open {\r\n        opacity: 1;\r\n\r\n        visibility: visible;\r\n\r\n        pointer-events: auto;\r\n    }\r\n\r\n    .hh-nav a {\r\n        font-family: 'Cormorant Garamond', serif;\r\n\r\n        font-size: 31px;\r\n    }\r\n\r\n    .hh-contact-grid {\r\n        grid-template-columns: 1fr;\r\n\r\n        gap: 20px;\r\n    }\r\n\r\n    .hh-contact-side {\r\n        padding-top: 25px;\r\n    }\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   MOBILE\r\n============================================================ *\/\r\n\r\n@media (max-width: 700px) {\r\n\r\n    \/*\r\n       MOBILE WIDTH FIX\r\n       Elementor\/mobile viewport alatt a desktopos 100vw breakout\r\n       v\u00edzszintes t\u00falcsordul\u00e1st okozhat. Mobilon vissza\u00e1llunk\r\n       norm\u00e1l 100%-os sz\u00e9less\u00e9gre.\r\n    *\/\r\n\r\n    html,\r\n    body {\r\n        width: 100%;\r\n        max-width: 100%;\r\n        overflow-x: hidden !important;\r\n    }\r\n\r\n    .hh-contact-page {\r\n        width: 100% !important;\r\n        max-width: 100% !important;\r\n\r\n        margin-left: 0 !important;\r\n        margin-right: 0 !important;\r\n\r\n        overflow-x: hidden !important;\r\n    }\r\n\r\n    .hh-contact-main,\r\n    .hh-contact-grid,\r\n    .hh-contact-left,\r\n    .hh-contact-side,\r\n    .hh-form,\r\n    .hh-field-row,\r\n    .hh-field {\r\n        min-width: 0;\r\n        max-width: 100%;\r\n    }\r\n\r\n    .hh-header {\r\n        height: 72px;\r\n\r\n        background: rgba(5,5,5,.72);\r\n\r\n        backdrop-filter: blur(12px);\r\n        -webkit-backdrop-filter: blur(12px);\r\n    }\r\n\r\n    .hh-header-inner,\r\n    .hh-contact-hero-content,\r\n    .hh-contact-grid {\r\n        width: calc(100% - 36px);\r\n    }\r\n\r\n\r\n    \/* ========================================================\r\n       MOBILE MENU \u2014 teljes men\u00fc l\u00e1that\u00f3 \u00e9s g\u00f6rgethet\u0151\r\n    ======================================================== *\/\r\n\r\n    .hh-nav {\r\n        position: fixed !important;\r\n\r\n        top: 0 !important;\r\n        left: 0 !important;\r\n\r\n        width: 100% !important;\r\n        height: 100svh !important;\r\n        max-width: 100% !important;\r\n\r\n        padding:\r\n            calc(92px + env(safe-area-inset-top))\r\n            24px\r\n            calc(35px + env(safe-area-inset-bottom));\r\n\r\n        display: flex;\r\n        flex-direction: column;\r\n\r\n        align-items: center;\r\n        justify-content: flex-start;\r\n\r\n        gap: 18px;\r\n\r\n        overflow-y: auto;\r\n        overflow-x: hidden;\r\n\r\n        background: rgba(5,5,5,.99);\r\n\r\n        -webkit-overflow-scrolling: touch;\r\n\r\n        z-index: 100000 !important;\r\n    }\r\n\r\n    .hh-nav a {\r\n        flex: 0 0 auto;\r\n\r\n        width: 100%;\r\n\r\n        padding: 4px 0;\r\n\r\n        text-align: center;\r\n\r\n        font-family: 'Cormorant Garamond', serif;\r\n\r\n        font-size: clamp(29px, 8.5vw, 40px);\r\n        line-height: 1.08;\r\n    }\r\n\r\n    .hh-mobile-toggle {\r\n        position: relative;\r\n\r\n        z-index: 100001 !important;\r\n    }\r\n\r\n\r\n    \/* LOGO *\/\r\n\r\n    .hh-logo-number {\r\n        font-size: 42px;\r\n    }\r\n\r\n    .hh-logo-main {\r\n        font-size: 19px;\r\n    }\r\n\r\n    .hh-logo-sub {\r\n        font-size: 6px;\r\n\r\n        letter-spacing: 2px;\r\n    }\r\n\r\n\r\n    \/* ========================================================\r\n       MOBILE HERO \u2014 teljes k\u00e9p, nincs crop\r\n    ======================================================== *\/\r\n\r\n    .hh-contact-hero {\r\n        width: 100%;\r\n\r\n        aspect-ratio: auto;\r\n        min-height: 0;\r\n\r\n        display: block;\r\n\r\n        padding-top: 72px;\r\n\r\n        overflow: hidden;\r\n\r\n        background: #050505;\r\n    }\r\n\r\n    .hh-contact-hero-image {\r\n        position: relative;\r\n\r\n        top: auto;\r\n        left: auto;\r\n        right: auto;\r\n        bottom: auto;\r\n\r\n        width: 100%;\r\n        height: auto;\r\n\r\n        aspect-ratio: 15 \/ 8;\r\n\r\n        overflow: hidden;\r\n\r\n        background: #050505;\r\n    }\r\n\r\n    .hh-contact-hero-image img {\r\n        width: 100%;\r\n        height: 100%;\r\n\r\n        display: block;\r\n\r\n        object-fit: contain;\r\n        object-position: center center;\r\n\r\n        transform: none !important;\r\n        scale: none !important;\r\n    }\r\n\r\n    .hh-contact-hero::before {\r\n        z-index: 1;\r\n\r\n        background:\r\n\r\n            linear-gradient(\r\n                to bottom,\r\n                rgba(5,5,5,.01) 0%,\r\n                rgba(5,5,5,.02) 25%,\r\n                rgba(5,5,5,.12) 39%,\r\n                rgba(5,5,5,.62) 50%,\r\n                #050505 61%,\r\n                #050505 100%\r\n            );\r\n    }\r\n\r\n    .hh-contact-hero-content {\r\n        position: relative;\r\n\r\n        z-index: 2;\r\n\r\n        margin-top: 0;\r\n\r\n        padding:\r\n            34px\r\n            0\r\n            52px;\r\n    }\r\n\r\n    .hh-contact-hero h1 {\r\n        font-size:\r\n            clamp(52px, 17vw, 78px);\r\n\r\n        letter-spacing: -2px;\r\n\r\n        max-width: 340px;\r\n    }\r\n\r\n    .hh-contact-hero-copy {\r\n        font-size: 19px;\r\n\r\n        max-width: 350px;\r\n    }\r\n\r\n\r\n    \/* CONTACT *\/\r\n\r\n    .hh-contact-main {\r\n        padding: 75px 0 90px;\r\n    }\r\n\r\n    .hh-contact-main::before {\r\n        font-size: 230px;\r\n\r\n        right: -35px;\r\n\r\n        top: -20px;\r\n    }\r\n\r\n    .hh-contact-heading {\r\n        margin-bottom: 30px;\r\n    }\r\n\r\n    .hh-contact-heading h2 {\r\n        font-size: 52px;\r\n    }\r\n\r\n\r\n    \/* FORM *\/\r\n\r\n    .hh-form {\r\n        padding: 25px 20px;\r\n    }\r\n\r\n    \/* Submit button \u2014 mobilon ne l\u00f3gjon ki a hossz\u00fa sz\u00f6veg *\/\r\n    .hh-submit {\r\n        min-height: 58px;\r\n\r\n        padding: 13px 12px;\r\n\r\n        font-size: clamp(8.5px, 2.55vw, 10px);\r\n        line-height: 1.35;\r\n\r\n        letter-spacing: 1.25px;\r\n\r\n        white-space: normal;\r\n        text-align: center;\r\n        overflow-wrap: anywhere;\r\n    }\r\n\r\n    .hh-field-row {\r\n        grid-template-columns: 1fr;\r\n\r\n        gap: 0;\r\n    }\r\n\r\n\r\n    \/* CARDS *\/\r\n\r\n    .hh-contact-card {\r\n        min-height: 92px;\r\n\r\n        padding: 18px;\r\n    }\r\n\r\n    .hh-contact-card-text strong {\r\n        font-size: 19px;\r\n    }\r\n\r\n    .hh-contact-icon {\r\n        width: 46px;\r\n        height: 46px;\r\n\r\n        flex-basis: 46px;\r\n    }\r\n\r\n    .hh-cringe-box {\r\n        padding: 28px 12px;\r\n    }\r\n\r\n    .hh-cringe-quote {\r\n        font-size: 22px;\r\n    }\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   VERY SMALL PHONES\r\n============================================================ *\/\r\n\r\n@media (max-width: 420px) {\r\n\r\n    .hh-contact-hero {\r\n        min-height: 0;\r\n    }\r\n\r\n    .hh-contact-hero-image img {\r\n        object-fit: contain;\r\n        object-position: center center;\r\n    }\r\n\r\n    .hh-nav {\r\n        padding-top:\r\n            calc(84px + env(safe-area-inset-top));\r\n\r\n        gap: 14px;\r\n    }\r\n\r\n    .hh-nav a {\r\n        font-size: clamp(27px, 8vw, 36px);\r\n    }\r\n\r\n    .hh-contact-card {\r\n        gap: 13px;\r\n\r\n        padding: 16px 14px;\r\n    }\r\n\r\n    .hh-contact-card-text strong {\r\n        font-size: 17px;\r\n    }\r\n\r\n    .hh-contact-icon {\r\n        width: 42px;\r\n        height: 42px;\r\n\r\n        flex-basis: 42px;\r\n    }\r\n\r\n}\r\n\r\n\r\n\/* ============================================================\r\n   REDUCED MOTION\r\n============================================================ *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n    *,\r\n    *::before,\r\n    *::after {\r\n        scroll-behavior: auto !important;\r\n\r\n        transition-duration: .01ms !important;\r\n\r\n        animation-duration: .01ms !important;\r\n    }\r\n\r\n    .hh-reveal {\r\n        opacity: 1;\r\n\r\n        transform: none;\r\n    }\r\n}\r\n\r\n<\/style>\r\n\r\n\r\n\r\n<!-- ==========================================================\r\n     HEADER\r\n=========================================================== -->\r\n\r\n<header class=\"hh-header\" id=\"hhHeader\">\r\n\r\n    <div class=\"hh-header-inner\">\r\n\r\n\r\n        <a\r\n            class=\"hh-logo\"\r\n            href=\"https:\/\/hetvenhat.hu\/en\/\"\r\n        >\r\n\r\n            <span class=\"hh-logo-number\">\r\n                76\r\n            <\/span>\r\n\r\n\r\n            <span class=\"hh-logo-text\">\r\n\r\n                <span class=\"hh-logo-main\">\r\n                    seventy-six\r\n                <\/span>\r\n\r\n                <span class=\"hh-logo-sub\">\r\n                    Wine Bar &amp; Webshop\r\n                <\/span>\r\n\r\n            <\/span>\r\n\r\n        <\/a>\r\n\r\n\r\n\r\n        <nav\r\n            class=\"hh-nav\"\r\n            id=\"hhNav\"\r\n        >\r\n\r\n            <a href=\"https:\/\/hetvenhat.hu\/en\/\">\r\n                Home\r\n            <\/a>\r\n\r\n            <a href=\"https:\/\/hetvenhat.hu\/en\/webshop-2\/\">\r\n                Online shop\r\n            <\/a>\r\n\r\n            <a href=\"https:\/\/hetvenhat.hu\/en\/kostolok\/\">\r\n                Tastings\r\n            <\/a>\r\n\r\n            <a href=\"https:\/\/hetvenhat.hu\/en\/boraszaink\/\">\r\n                Our winemakers\r\n            <\/a>\r\n\r\n            <a href=\"https:\/\/hetvenhat.hu\/en\/hirek-2\/\">\r\n                News\r\n            <\/a>\r\n\r\n            <a href=\"https:\/\/hetvenhat.hu\/en\/viszonteladoknak-2\/\">\r\n                For trade\r\n            <\/a>\r\n\r\n            <a\r\n                href=\"https:\/\/hetvenhat.hu\/en\/kapcsolat-2\/\"\r\n                class=\"active\"\r\n            >\r\n                Contact\r\n            <\/a>\r\n\r\n        <\/nav>\r\n\r\n\r\n\r\n        <button\r\n            class=\"hh-mobile-toggle\"\r\n            id=\"hhMobileToggle\"\r\n            type=\"button\"\r\n            aria-label=\"Open menu\"\r\n            aria-expanded=\"false\"\r\n        >\r\n\r\n            <span><\/span>\r\n\r\n        <\/button>\r\n\r\n    <\/div>\r\n\r\n<\/header>\r\n\r\n\r\n\r\n<!-- ==========================================================\r\n     HERO\r\n=========================================================== -->\r\n\r\n<section class=\"hh-contact-hero\">\r\n\r\n\r\n    <div class=\"hh-contact-hero-image\">\r\n\r\n        <img decoding=\"async\"\r\n            src=\"https:\/\/hetvenhat.hu\/wp-content\/uploads\/2026\/08\/kapcsolat.png\"\r\n            alt=\"Hetvenhat kapcsolat\"\r\n        >\r\n\r\n    <\/div>\r\n\r\n\r\n\r\n    <div class=\"hh-contact-hero-content\">\r\n\r\n\r\n        <div class=\"hh-eyebrow\">\r\n\r\n            Contact\r\n\r\n        <\/div>\r\n\r\n\r\n        <h1>\r\n\r\n            Tell me.<br>\r\n\r\n            <em>We're listening.<\/em>\r\n\r\n        <\/h1>\r\n\r\n\r\n        <p class=\"hh-contact-hero-copy\">\r\n\r\n            Zsolt is making a phone call. Feri is writing a message. The communication infrastructure is therefore theoretically complete.\r\n\r\n        <\/p>\r\n\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n\r\n<!-- ==========================================================\r\n     CONTACT\r\n=========================================================== -->\r\n\r\n<section class=\"hh-contact-main\">\r\n\r\n\r\n    <div class=\"hh-contact-grid\">\r\n\r\n\r\n        <!-- ==================================================\r\n             LEFT \/ FORM\r\n        =================================================== -->\r\n\r\n        <div class=\"hh-contact-left hh-reveal\">\r\n\r\n\r\n            <div class=\"hh-contact-heading\">\r\n\r\n\r\n                <div class=\"small\">\r\n\r\n                    Write to us\r\n\r\n                <\/div>\r\n\r\n\r\n                <h2>\r\n\r\n                    There is a<br>\r\n\r\n                    <em>very important<\/em> Question?\r\n\r\n                <\/h2>\r\n\r\n\r\n                <p>\r\n\r\n                    Tasting, wine, events, partnerships\r\n                    or do you simply want to ask,\r\n                    why is Feri looking like that in the photo?\r\n                    Drop us a line.\r\n\r\n                <\/p>\r\n\r\n\r\n            <\/div>\r\n\r\n\r\n\r\n            <form\r\n                class=\"hh-form\"\r\n                id=\"hhContactForm\" action=\"\"\r\n            >\r\n\r\n\r\n                <!-- SPAM HONEYPOT -->\r\n\r\n                <input\r\n                    type=\"text\"\r\n                    name=\"website\"\r\n                    id=\"hhWebsite\"\r\n                    class=\"hh-website-field\"\r\n                    tabindex=\"-1\"\r\n                    autocomplete=\"off\"\r\n                >\r\n\r\n\r\n\r\n                <div class=\"hh-field-row\">\r\n\r\n\r\n                    <div class=\"hh-field\">\r\n\r\n                        <label for=\"hhName\">\r\n\r\n                            Name\r\n\r\n                        <\/label>\r\n\r\n\r\n                        <input\r\n                            type=\"text\"\r\n                            id=\"hhName\"\r\n                            name=\"name\"\r\n                            placeholder=\"What shall we call you?\"\r\n                            autocomplete=\"name\"\r\n                            required\r\n>\r\n\r\n                    <\/div>\r\n\r\n\r\n\r\n                    <div class=\"hh-field\">\r\n\r\n                        <label for=\"hhPhone\">\r\n\r\n                            Telephone number\r\n\r\n                        <\/label>\r\n\r\n\r\n                        <input\r\n                            type=\"tel\"\r\n                            id=\"hhPhone\"\r\n                            name=\"phone\"\r\n                            placeholder=\"+36...\"\r\n                            autocomplete=\"tel\"\r\n                        >\r\n\r\n                    <\/div>\r\n\r\n\r\n                <\/div>\r\n\r\n\r\n\r\n                <div class=\"hh-field\">\r\n\r\n\r\n                    <label for=\"hhEmail\">\r\n\r\n                        Email address\r\n\r\n                    <\/label>\r\n\r\n\r\n                    <input\r\n                        type=\"email\"\r\n                        id=\"hhEmail\"\r\n                        name=\"email\"\r\n                        placeholder=\"te@valami.hu\"\r\n                        autocomplete=\"email\"\r\n                        required\r\n>\r\n\r\n\r\n                <\/div>\r\n\r\n\r\n\r\n                <div class=\"hh-field\">\r\n\r\n\r\n                    <label for=\"hhMessage\">\r\n\r\n                        Message\r\n\r\n                    <\/label>\r\n\r\n\r\n                    <textarea\r\n                        id=\"hhMessage\"\r\n                        name=\"message\"\r\n                        placeholder=\"Write it here before you change your mind...\"\r\n                        required\r\n><\/textarea>\r\n\r\n\r\n                <\/div>\r\n\r\n\r\n\r\n                <button\r\n                    type=\"submit\"\r\n                    class=\"hh-submit\"\r\n                    id=\"hhSubmit\"\r\n                >\r\n\r\n                    I am sending the very important message\r\n\r\n                <\/button>\r\n\r\n\r\n\r\n                <div\r\n                    class=\"hh-form-status\"\r\n                    id=\"hhFormStatus\"\r\n                    aria-live=\"polite\"\r\n                ><\/div>\r\n\r\n\r\n            <input type=\"hidden\" name=\"trp-form-language\" value=\"en\"\/><\/form>\r\n\r\n\r\n        <\/div>\r\n\r\n\r\n\r\n        <!-- ==================================================\r\n             RIGHT \/ CONTACT LINKS\r\n        =================================================== -->\r\n\r\n        <aside class=\"hh-contact-side hh-reveal\">\r\n\r\n\r\n            <div class=\"hh-contact-side-title\">\r\n\r\n                Faster solutions\r\n\r\n            <\/div>\r\n\r\n\r\n\r\n            <!-- FACEBOOK -->\r\n\r\n            <a href=\"https:\/\/www.facebook.com\/profile.php?id=61593230589642\" class=\"hh-contact-card\" id=\"hhFacebook\" target=\"_blank\" rel=\"noopener noreferrer\">\r\n\r\n\r\n                <div class=\"hh-contact-icon\">\r\n\r\n                    <svg\r\n                        viewbox=\"0 0 24 24\"\r\n                        fill=\"none\"\r\n                        stroke=\"currentColor\"\r\n                        stroke-width=\"1.7\"\r\n                        stroke-linecap=\"round\"\r\n                        stroke-linejoin=\"round\"\r\n                    >\r\n\r\n                        <path\r\n                            d=\"M14 8h3V4.5A16 16 0 0 0 14.5 4C12 4 10 5.5 10 8.5V11H7v4h3v7h4v-7h3.2l.8-4H14V8.8c0-.6.3-.8 1-.8Z\"\r\n                        \/>\r\n\r\n                    <\/svg>\r\n\r\n                <\/div>\r\n\r\n\r\n\r\n                <div class=\"hh-contact-card-text\">\r\n\r\n                    <span>\r\n                        Social media\r\n                    <\/span>\r\n\r\n                    <strong>\r\n                        Facebook\r\n                    <\/strong>\r\n\r\n                <\/div>\r\n\r\n\r\n\r\n                <div class=\"hh-contact-arrow\">\r\n                    \u2192\r\n                <\/div>\r\n\r\n\r\n            <\/a>\r\n\r\n\r\n\r\n            <!-- =================================================\r\n                 WHATSAPP ZSOLT\r\n            ================================================== -->\r\n\r\n            <a href=\"https:\/\/wa.me\/36205658920\" class=\"hh-contact-card\" target=\"_blank\" rel=\"noopener noreferrer\">\r\n\r\n\r\n                <div class=\"hh-contact-icon\">\r\n\r\n\r\n                    <svg\r\n                        viewbox=\"0 0 24 24\"\r\n                        fill=\"none\"\r\n                        stroke=\"currentColor\"\r\n                        stroke-width=\"1.7\"\r\n                        stroke-linecap=\"round\"\r\n                        stroke-linejoin=\"round\"\r\n                    >\r\n\r\n                        <path\r\n                            d=\"M21 11.5a8.4 8.4 0 0 1-9 8.4 9.2 9.2 0 0 1-3.9-.9L3 20l1-4.7a8.4 8.4 0 1 1 17-3.8Z\"\r\n                        \/>\r\n\r\n                        <path\r\n                            d=\"M8.5 8.4c.3-.7.6-.7 1-.7h.4c.2 0 .4.1.5.4l.8 1.9c.1.3 0 .5-.1.7l-.6.8c-.2.2-.2.4 0 .7.6 1.2 1.6 2.2 2.8 2.8.3.2.5.1.7-.1l.9-1.1c.2-.3.5-.3.8-.2l1.8.9c.3.1.4.3.4.5 0 .8-.4 1.6-1 2.1-.7.5-1.7.7-2.6.5-1.6-.4-3.2-1.2-4.5-2.4-1.3-1.2-2.3-2.7-2.8-4.3-.3-.9-.1-1.8.5-2.5Z\"\r\n                        \/>\r\n\r\n                    <\/svg>\r\n\r\n\r\n                <\/div>\r\n\r\n\r\n\r\n                <div class=\"hh-contact-card-text\">\r\n\r\n                    <span>\r\n                        WhatsApp\r\n                    <\/span>\r\n\r\n                    <strong>\r\n                        Zsolt \u00b7 +36 20 565 8920\r\n                    <\/strong>\r\n\r\n                <\/div>\r\n\r\n\r\n\r\n                <div class=\"hh-contact-arrow\">\r\n                    \u2192\r\n                <\/div>\r\n\r\n\r\n            <\/a>\r\n\r\n\r\n\r\n            <!-- =================================================\r\n                 WHATSAPP FERENC\r\n            ================================================== -->\r\n\r\n            <a href=\"https:\/\/wa.me\/36202176214\" class=\"hh-contact-card\" target=\"_blank\" rel=\"noopener noreferrer\">\r\n\r\n\r\n                <div class=\"hh-contact-icon\">\r\n\r\n\r\n                    <svg\r\n                        viewbox=\"0 0 24 24\"\r\n                        fill=\"none\"\r\n                        stroke=\"currentColor\"\r\n                        stroke-width=\"1.7\"\r\n                        stroke-linecap=\"round\"\r\n                        stroke-linejoin=\"round\"\r\n                    >\r\n\r\n                        <path\r\n                            d=\"M21 11.5a8.4 8.4 0 0 1-9 8.4 9.2 9.2 0 0 1-3.9-.9L3 20l1-4.7a8.4 8.4 0 1 1 17-3.8Z\"\r\n                        \/>\r\n\r\n                        <path\r\n                            d=\"M8.5 8.4c.3-.7.6-.7 1-.7h.4c.2 0 .4.1.5.4l.8 1.9c.1.3 0 .5-.1.7l-.6.8c-.2.2-.2.4 0 .7.6 1.2 1.6 2.2 2.8 2.8.3.2.5.1.7-.1l.9-1.1c.2-.3.5-.3.8-.2l1.8.9c.3.1.4.3.4.5 0 .8-.4 1.6-1 2.1-.7.5-1.7.7-2.6.5-1.6-.4-3.2-1.2-4.5-2.4-1.3-1.2-2.3-2.7-2.8-4.3-.3-.9-.1-1.8.5-2.5Z\"\r\n                        \/>\r\n\r\n                    <\/svg>\r\n\r\n\r\n                <\/div>\r\n\r\n\r\n\r\n                <div class=\"hh-contact-card-text\">\r\n\r\n                    <span>\r\n                        WhatsApp\r\n                    <\/span>\r\n\r\n                    <strong>\r\n                        Ferenc \u00b7 +36 20 217 6214\r\n                    <\/strong>\r\n\r\n                <\/div>\r\n\r\n\r\n\r\n                <div class=\"hh-contact-arrow\">\r\n                    \u2192\r\n                <\/div>\r\n\r\n\r\n            <\/a>\r\n\r\n\r\n\r\n            <!-- QUOTE -->\r\n\r\n            <div class=\"hh-cringe-box\">\r\n\r\n\r\n                <p class=\"hh-cringe-quote\">\r\n\r\n                    \u201eIf we don't reply immediately, we're probably looking at a wine with far too serious an expression.\u201d\r\n\r\n                <\/p>\r\n\r\n\r\n                <div class=\"hh-cringe-small\">\r\n\r\n                    Seventy-six customer service protocols\r\n\r\n                <\/div>\r\n\r\n\r\n            <\/div>\r\n\r\n\r\n        <\/aside>\r\n\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n\r\n<script>\r\n(() => {\r\n\r\n    \/* ========================================================\r\n       HEADER SCROLL\r\n    ======================================================== *\/\r\n\r\n    const header =\r\n        document.getElementById('hhHeader');\r\n\r\n    function updateHeader() {\r\n\r\n        if (window.scrollY > 35) {\r\n\r\n            header.classList.add('scrolled');\r\n\r\n        } else {\r\n\r\n            header.classList.remove('scrolled');\r\n\r\n        }\r\n\r\n    }\r\n\r\n    updateHeader();\r\n\r\n    window.addEventListener(\r\n        'scroll',\r\n        updateHeader,\r\n        {\r\n            passive: true\r\n        }\r\n    );\r\n\r\n\r\n\r\n    \/* ========================================================\r\n       MOBILE MENU\r\n    ======================================================== *\/\r\n\r\n    const mobileToggle =\r\n        document.getElementById(\r\n            'hhMobileToggle'\r\n        );\r\n\r\n    const nav =\r\n        document.getElementById(\r\n            'hhNav'\r\n        );\r\n\r\n\r\n    mobileToggle.addEventListener(\r\n        'click',\r\n        () => {\r\n\r\n            const isOpen =\r\n                nav.classList.toggle('open');\r\n\r\n            mobileToggle.setAttribute(\r\n                'aria-expanded',\r\n                isOpen ? 'true' : 'false'\r\n            );\r\n\r\n        }\r\n    );\r\n\r\n\r\n    nav\r\n        .querySelectorAll('a')\r\n        .forEach(link => {\r\n\r\n            link.addEventListener(\r\n                'click',\r\n                () => {\r\n\r\n                    nav.classList.remove('open');\r\n\r\n                    mobileToggle.setAttribute(\r\n                        'aria-expanded',\r\n                        'false'\r\n                    );\r\n\r\n                }\r\n            );\r\n\r\n        });\r\n\r\n\r\n\r\n    \/* ========================================================\r\n       SCROLL REVEAL\r\n    ======================================================== *\/\r\n\r\n    const revealElements =\r\n        document.querySelectorAll(\r\n            '.hh-reveal'\r\n        );\r\n\r\n\r\n    if (\r\n        'IntersectionObserver'\r\n        in window\r\n    ) {\r\n\r\n        const observer =\r\n            new IntersectionObserver(\r\n\r\n                entries => {\r\n\r\n                    entries.forEach(\r\n                        entry => {\r\n\r\n                            if (\r\n                                entry.isIntersecting\r\n                            ) {\r\n\r\n                                entry.target\r\n                                    .classList\r\n                                    .add('visible');\r\n\r\n                                observer.unobserve(\r\n                                    entry.target\r\n                                );\r\n\r\n                            }\r\n\r\n                        }\r\n                    );\r\n\r\n                },\r\n\r\n                {\r\n                    threshold: 0.12\r\n                }\r\n\r\n            );\r\n\r\n\r\n        revealElements.forEach(\r\n            element => {\r\n\r\n                observer.observe(\r\n                    element\r\n                );\r\n\r\n            }\r\n        );\r\n\r\n    } else {\r\n\r\n        revealElements.forEach(\r\n            element => {\r\n\r\n                element.classList.add(\r\n                    'visible'\r\n                );\r\n\r\n            }\r\n        );\r\n\r\n    }\r\n\r\n\r\n\r\n    \/* ========================================================\r\n       CONTACT FORM\r\n       WordPress AJAX -> wp_mail()\r\n    ======================================================== *\/\r\n\r\n    const form =\r\n        document.getElementById(\r\n            'hhContactForm'\r\n        );\r\n\r\n    const button =\r\n        document.getElementById(\r\n            'hhSubmit'\r\n        );\r\n\r\n    const status =\r\n        document.getElementById(\r\n            'hhFormStatus'\r\n        );\r\n\r\n\r\n    form.addEventListener(\r\n        'submit',\r\n        async event => {\r\n\r\n            event.preventDefault();\r\n\r\n\r\n            status.className =\r\n                'hh-form-status';\r\n\r\n            status.textContent = '';\r\n\r\n\r\n            button.disabled = true;\r\n\r\n\r\n            const originalButtonText =\r\n                button.textContent;\r\n\r\n\r\n            button.textContent =\r\n                '\u00dczenet k\u00fcld\u00e9se...';\r\n\r\n\r\n            const formData =\r\n                new FormData(form);\r\n\r\n\r\n            formData.append(\r\n                'action',\r\n                'hh_send_contact'\r\n            );\r\n\r\n\r\n            try {\r\n\r\n                const response =\r\n                    await fetch(\r\n                        '\/wp-admin\/admin-ajax.php',\r\n                        {\r\n\r\n                            method: 'POST',\r\n\r\n                            body: formData,\r\n\r\n                            credentials: 'same-origin'\r\n\r\n                        }\r\n                    );\r\n\r\n\r\n                if (!response.ok) {\r\n\r\n                    throw new Error(\r\n                        'Network error'\r\n                    );\r\n\r\n                }\r\n\r\n\r\n                const result =\r\n                    await response.json();\r\n\r\n\r\n                if (result.success) {\r\n\r\n                    status.className =\r\n                        'hh-form-status show success';\r\n\r\n\r\n                    status.textContent =\r\n                        result.data?.message ||\r\n                        'Meg\u00e9rkezett. Most m\u00e1r hivatalosan is tudunk r\u00f3lad.';\r\n\r\n\r\n                    form.reset();\r\n\r\n                } else {\r\n\r\n                    status.className =\r\n                        'hh-form-status show error';\r\n\r\n\r\n                    status.textContent =\r\n                        result.data?.message ||\r\n                        'Valami f\u00e9lrement. Pr\u00f3b\u00e1ld meg \u00fajra.';\r\n\r\n                }\r\n\r\n            } catch (error) {\r\n\r\n                console.error(\r\n                    'Hetvenhat contact form:',\r\n                    error\r\n                );\r\n\r\n\r\n                status.className =\r\n                    'hh-form-status show error';\r\n\r\n\r\n                status.textContent =\r\n                    'Az \u00fczenetet most nem siker\u00fclt elk\u00fcldeni. Pr\u00f3b\u00e1ld meg \u00fajra.';\r\n\r\n            }\r\n\r\n\r\n            button.disabled = false;\r\n\r\n\r\n            button.textContent =\r\n                originalButtonText;\r\n\r\n        }\r\n    );\r\n\r\n\r\n\r\n})();\r\n<\/script>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>76 HETVENHAT Wine Bar &amp; Webshop F\u0151oldal Webshop K\u00f3stol\u00f3k Bor\u00e1szaink H\u00edrek Viszontelad\u00f3knak Kapcsolat Kapcsolat Mondjad. Hallgatunk. Zsolt telefon\u00e1l. Feri \u00fczenetet \u00edr. A kommunik\u00e1ci\u00f3s infrastrukt\u00fara teh\u00e1t elm\u00e9letileg teljes. \u00cdrj nek\u00fcnk Van egy nagyon fontos k\u00e9rd\u00e9sed? K\u00f3stol\u00f3, bor, esem\u00e9ny, egy\u00fcttm\u0171k\u00f6d\u00e9s vagy egyszer\u0171en szeretn\u00e9d megk\u00e9rdezni, hogy Feri mi\u00e9rt n\u00e9z \u00edgy a k\u00e9pen? \u00cdrd meg. N\u00e9v Telefonsz\u00e1m E-mail c\u00edm [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-102","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/hetvenhat.hu\/en\/wp-json\/wp\/v2\/pages\/102","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hetvenhat.hu\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hetvenhat.hu\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hetvenhat.hu\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hetvenhat.hu\/en\/wp-json\/wp\/v2\/comments?post=102"}],"version-history":[{"count":22,"href":"https:\/\/hetvenhat.hu\/en\/wp-json\/wp\/v2\/pages\/102\/revisions"}],"predecessor-version":[{"id":233,"href":"https:\/\/hetvenhat.hu\/en\/wp-json\/wp\/v2\/pages\/102\/revisions\/233"}],"wp:attachment":[{"href":"https:\/\/hetvenhat.hu\/en\/wp-json\/wp\/v2\/media?parent=102"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}