1<!DOCTYPE html> 2<html lang="he" dir="rtl" data-a11y-language="he" data-a11y-assist="tts,voice,keyboard,alttext,profiles,pagemap,captions,display,navigation,colors,typography,zoom,reading,hidebtn,feedback,ai" data-a11y-api="https://app.webydo.com" data-a11y-site="A004910" data-a11y-phone="0507944881" data-a11y-coordinator-name="××§× × ×¢××" data-a11y-live-captions-ondemand="false" data-a11y-extended-audio-ondemand="false" data-a11y-custom-statement-enabled="false" data-a11y-custom-statement-direction="ltr"> 3<head> 4<meta charset="utf-8"> 5<meta name="viewport" content="width=device-width,initial-scale=1"> 6<title>××§× × ×¢×× | צ×ר קשר</title> 7<meta name="description" content="×¦×¨× ×§×©×¨ ×¢× ××§× × ×¢×× â ×שק 90, ר××ת × ×¤×ª××. ××פ×× 050-7944881, ××××ס×פ ××××× ×ת×××× ×××§×ר ×××§× ×××× ×©×××."> 8<meta property="og:title" content="××§× × ×¢×× | צ×ר קשר"> 9<meta property="og:description" content="×¦×¨× ×§×©×¨ ×¢× ××§× × ×¢×× â ×שק 90, ר××ת × ×¤×ª××. ××פ×× 050-7944881, ××××ס×פ ××××× ×ת×××× ×××§×ר ×××§× ×××× ×©×××."> 10<meta property="og:type" content="website"> 11<meta property="og:image" content="https://storage.googleapis.com/webydo-published-sites/A004910/assets/2b6ad4ab476b.png?v=1"> 12<meta property="og:locale" content="he_IL"> 13<link rel="icon" href="https://storage.googleapis.com/webydo-published-sites/A004910/assets/2b6ad4ab476b.png?v=1"> 14 15<style>@font-face{font-family:'Rubik';src:url('/assets/deb8e2c6c4ff.ttf?v=1') format('truetype');font-weight:300 900;font-display:swap} 16@font-face{font-family:'KUNSTLER';src:url('/assets/8ed64dfb3d6b.ttf?v=1') format('truetype');font-weight:400;font-display:swap} 17 18*,*::before,*::after{box-sizing:border-box} 19html{-webkit-text-size-adjust:100%} 20body{margin:0;background:#fff;color:#000;font-family:'Rubik',Arial,Helvetica,sans-serif;font-size:16px;line-height:1.6;direction:rtl} 21img{max-width:100%;height:auto;display:block} 22a{color:inherit;text-decoration:none} 23h1,h2,h3,h4,h5{margin:0;font-weight:600;line-height:1.25} 24p{margin:0 0 1em} 25.wrap{max-width:1170px;margin:0 auto;padding:0 24px} 26.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0} 27 28/* ââ render-safe entrance effects ââââââââââââââââââââââââââââââââââââ 29 The RESTING state of .rv is fully visible â no opacity:0, no transform. 30 The animation is added by a class and uses fill-mode:both, so it ends on 31 the resting state too. A static publish render therefore shows content 32 whether JS ran or not; the worst case is catching a 0.7s fade in progress. 33 Never invert this into a hidden-by-default .rv + JS reveal (RENDER-SAFE). 34 35 â Never give these an animation-delay. With fill-mode:both a delay applies the 36 opening keyframe (opacity:0) for the whole delay, which is exactly the 37 hidden-until-JS state the RENDER-SAFE RULE forbids â a publish snapshot taken 38 during the delay would capture a blank element. A stagger is not worth that. */ 39.rv{--rv-x:0px;--rv-y:28px} 40.rv--right{--rv-x:60px;--rv-y:0px} 41.rv--left{--rv-x:-60px;--rv-y:0px} 42.rv--up{--rv-x:0px;--rv-y:40px} 43.rv.rv-in{animation:rvIn .75s cubic-bezier(.22,.7,.28,1) both} 44@keyframes rvIn{from{opacity:0;transform:translate(var(--rv-x),var(--rv-y))}to{opacity:1;transform:none}} 45@media (prefers-reduced-motion:reduce){.rv.rv-in{animation:none}} 46 47/* ââ age gate ââââââââââââââââââââââââââââââââââââââââââââââââââââââââ 48 Markup ships in the page but starts hidden, and only JS reveals it. A 49 no-JS / static render therefore sees the site, never a blocking overlay. */ 50#age-gate[hidden]{display:none} 51#age-gate{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;padding:20px; 52 background:rgba(0,0,0,.72);backdrop-filter:blur(2px)} 53/* padding-bottom is 0 on purpose â the cheers artwork is flush with the panel's 54 bottom edge (round-3 item 3), exactly as in the source popup. */ 55.ag__panel{background:#fff;color:#000;width:100%;max-width:420px;padding:26px 26px 0;text-align:center; 56 box-shadow:0 24px 70px rgba(0,0,0,.45);max-height:94vh;overflow:auto} 57.ag__logo{width:215px;max-width:70%;margin:0 auto 14px} 58.ag__title{font-size:20px;font-weight:600;margin:0 0 20px} 59.ag__btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:0 0 16px} 60.ag__btn{border:0;border-radius:999px;padding:12px 26px;font-family:inherit;font-size:15px;font-weight:500;cursor:pointer} 61.ag__btn--yes{background:#000;color:#fff} 62.ag__btn--yes:hover{background:#333} 63.ag__btn--no{background:#c9c9c9;color:#fff} 64.ag__btn--no:hover{background:#b0b0b0} 65.ag__warn{font-size:13px;color:#333;margin:0 0 6px} 66/* Round-3 item 3: the artwork spans the popup EDGE TO EDGE and is flush with 67 its bottom, so the negative inline margin has to cancel the panel's 26px 68 padding exactly. The corkscrew is positioned ON the drawing (percentages are 69 the source's own offsets divided by the artwork's 429x211 box), not laid out 70 beside it â a flex row could never keep it on the line at every width. */ 71.ag__art{position:relative;margin:18px -26px 0;direction:ltr} 72.ag__art .ag__cheers{display:block;width:100%;height:auto} 73.ag__art .ag__mark{position:absolute;
73left:63.4%;top:7.6%;width:20.7%;height:auto} 74 75/* ââ header âââââââââââââââââââââââââââââââââââââââââââââââââââââââââââ */ 76#site-header{background:#000;color:#fff;position:sticky;top:0;z-index:100} 77/* Shorter bar than before, and the logo panel deliberately OVERHANGS the 78 bottom edge (round-2 item 2) â hence the negative margin + z-index. */ 79.hdr{display:flex;align-items:center;gap:24px;min-height:74px;max-width:1400px;margin:0 auto;padding:0 24px} 80.hdr__logo{flex:0 0 auto;position:relative;z-index:2;margin-bottom:-16px;align-self:flex-start;margin-top:6px} 81.hdr__logo img{width:210px;height:auto;display:block} 82.hdr__nav{flex:1 1 auto;display:flex;justify-content:center} 83.hdr__nav ul{display:flex;align-items:center;gap:30px;list-style:none;margin:0;padding:0} 84.hdr__nav a{font-size:17px;font-weight:400;color:#fff;padding:6px 2px;border-bottom:2px solid transparent;transition:border-color .2s,color .2s;white-space:nowrap} 85.hdr__nav a:hover{border-bottom-color:#fff} 86.hdr__nav a[aria-current="page"]{color:#9a9a9a} 87.hdr__social{flex:0 0 auto;display:flex;align-items:center;gap:12px} 88.hdr__social a{width:34px;height:34px;border-radius:50%;background:#fff;color:#000;display:flex;align-items:center;justify-content:center} 89.hdr__social svg{width:19px;height:19px} 90.hdr__toggle{display:none;width:44px;height:44px;align-items:center;justify-content:center;background:none!important;border:0;color:#fff;cursor:pointer;padding:0;border-radius:0!important;box-shadow:none!important} 91.hdr__toggle svg{width:28px;height:28px} 92/* Hide the hamburger while the drawer is open, so a designer/global rule can 93 never paint it as a stray circle over the open panel (A004456 lesson). */ 94html.webydo-menu-open #site-header .hdr__toggle, 95html.webydo-menu-open #site-header .menu-toggle{display:none!important} 96 97/* ââ mobile drawer (canonical window-capture toggle) ââââââââââââââââââ */ 98[data-webydo-header-drawer][aria-hidden]{position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:auto!important; 99 width:min(84vw,340px)!important;max-width:340px!important;background:#000!important;color:#fff!important;z-index:2147482000!important; 100 display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;gap:0!important;align-items:stretch!important; 101 padding:22px 20px!important;margin:0!important;overflow-y:auto!important;overflow-x:hidden!important; 102 transform:translateX(105%)!important;transition:transform .28s ease!important;box-shadow:none!important;border:0!important;border-radius:0!important} 103[data-webydo-header-drawer][aria-hidden="false"]{transform:translateX(0)!important;box-shadow:-14px 0 40px rgba(0,0,0,.5)!important} 104[data-webydo-header-drawer][aria-hidden] a{display:block!important;color:#fff!important;font-size:18px!important;padding:14px 4px!important; 105 border-bottom:1px solid rgba(255,255,255,.16)!important;background:none!important;text-align:right!important;position:static!important} 106[data-webydo-header-drawer] .drw__close{align-self:flex-start;width:42px;height:42px;background:none;border:0;color:#fff;font-size:30px;line-height:1;cursor:pointer;padding:0;margin-bottom:6px} 107[data-webydo-header-drawer] .drw__social{display:flex;gap:14px;padding-top:18px} 108[data-webydo-header-drawer] .drw__social a{border:0!important;padding:0!important;width:36px;height:36px;border-radius:50%;background:#fff!important;color:#000!important;display:flex!important;align-items:center;justify-content:center} 109[data-webydo-header-drawer] .drw__social svg{width:19px;height:19px} 110.drw__backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:2147481900;opacity:0;pointer-events:none;transition:opacity .28s ease} 111html.webydo-menu-open .drw__backdrop{opacity:1;pointer-events:auto} 112html.webydo-menu-open{overflow:hidden} 113 114/* ââ hero âââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââ */ 115.hero{position:relative;min-height:min(82vh,780px);
115display:flex;align-items:center;overflow:hidden;background:#1b1b1b} 116.hero__slides{position:absolute;inset:0} 117.hero__slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0} 118/* Slide 1 is opaque AT REST so a no-JS / static render still shows the hero. */ 119.hero__slides img:first-child{opacity:1} 120@media (prefers-reduced-motion:no-preference){ 121 .hero__slides img{animation:heroFade 40s infinite} 122 .hero__slides img:nth-child(1){animation-delay:0s} 123 .hero__slides img:nth-child(2){animation-delay:8s} 124 .hero__slides img:nth-child(3){animation-delay:16s} 125 .hero__slides img:nth-child(4){animation-delay:24s} 126 .hero__slides img:nth-child(5){animation-delay:32s} 127} 128@keyframes heroFade{0%{opacity:0}4%{opacity:1}20%{opacity:1}24%{opacity:0}100%{opacity:0}} 129/* The source keeps the photo bright and sets the wordmark in BLACK, so no dark 130 scrim â only a soft light wash on the right where the type sits. */ 131.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(270deg,rgba(255,255,255,.42) 0%,rgba(255,255,255,.14) 34%,rgba(255,255,255,0) 62%)} 132/* padding-inline-start is the RIGHT padding under dir:rtl. Round-3 item 4 asks 133 for the block "a little more to the left": the source's type block ends at 134 x=1273 of 1440, so the right gutter is ~147px, not the 40px it used to be. */ 135.hero__inner{position:relative;z-index:2;width:100%;max-width:1400px;margin:0 auto; 136 padding:40px 40px 40px;padding-inline-start:clamp(24px,10vw,147px);text-align:right} 137.hero__brand{display:inline-block;text-align:center;color:#000} 138/* KUNSTLER is a wide, light script; the source sets two tight lines at the SAME 139 130px, with the second line the heavier of the two (measured, round-3 item 4). */ 140.hero__brand .k{font-family:'KUNSTLER','Rubik',cursive;display:block;direction:ltr;line-height:.74} 141.hero__brand .k1{font-size:clamp(60px,9vw,130px);font-weight:600} 142.hero__brand .k2{font-size:clamp(60px,9vw,130px);font-weight:700;letter-spacing:.04em;margin-top:-.06em} 143.hero__mark{display:block;width:clamp(64px,10.3vw,149px);margin:0 auto 2px} 144.hero__tag{color:#000;font-size:clamp(19px,2.1vw,30px);font-weight:700;margin:10px 0 24px;text-align:center} 145.hero__cta{text-align:center;margin:0} 146.hero__cta .btn{font-size:clamp(16px,1.4vw,20px);padding:15px 40px} 147/* Type block sits on the RIGHT of the photo, as in the source. */ 148.hero__block{display:inline-block;max-width:620px} 149.btn{display:inline-block;background:#000;color:#fff;border:1px solid #000;border-radius:999px;padding:13px 34px;font-size:16px;font-weight:500;font-family:inherit;cursor:pointer;transition:background .2s,color .2s} 150.btn:hover{background:#fff;color:#000} 151.btn--light{background:#fff;color:#000;border-color:#fff} 152.btn--light:hover{background:#000;color:#fff} 153 154/* ââ sections âââââââââââââââââââââââââââââââââââââââââââââââââââââââââ */ 155/* overflow-x:clip (NOT hidden) contains the sideways travel of the .rv entrance 156 effects. Now that they fire on scroll instead of all at once on load, an 157 element sliding in from +60px would otherwise widen the document for the 158 0.75s it is moving and flash a horizontal scrollbar. clip does not create a 159 scroll container, so the sticky header and the vertical overhangs the design 160 relies on (the jester above the photo band, the club card's negative margin) 161 are untouched â hidden would have broken both. */ 162.sec{padding:70px 0;overflow-x:clip} 163/* Same clip on the other full-width blocks. The /about rows are .stack__row, not 164 .sec, and on a phone their single column fills the viewport â so the 60px of 165 sideways travel widened the document to 417 on a 390 screen until this landed 166 (caught by verify-reveal-on-scroll.ts --mobile, which samples the width DURING 167 the animation; a resting-state overflow check cannot see it). */ 168.stack__row,.photoband,.band{overflow-x:clip} 169.sec--tight{padding:46px 0} 170.sec--grey{background:#e6e6e6} 171.sec--dark{background:#000;color:#fff} 172.sec__title{font-size:clamp(24px,3vw,32px);font-weight:600;text-align:center;margin:0 0 12px} 173.sec__lead{text-align:center;max-width:760px;margin:0 auto 34px;color:#333} 174.h-eyebrow{font-size:clamp(20px,2.4vw,25px);font-weight:600;margin:0 0 14px} 175 176.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center} 177.split--flip .split__media{order:2} 178.split__body p:last-child{margin-bottom:0} 179.split__media img{width:100%;height:auto} 180/* Tall portrait crops (e.g. the winemaker) get an arched frame like the source, 181 instead of stretching a 363Ã900 source to full column width. */ 182.split__media.portrait{display:flex;justify-content:center} 183.split__media.portrait img{width:auto;max-width:100%;max-height:520px;border-radius:180px 180px 14px 14px} 184 185/* ââ per-area backdrop art (round-3 items 5â9, 15) âââââââââââââââââââ 186 The source runs ONE hand-drawn line through each band and lets it bleed past 187 a viewport edge â that is what "ת××× ×ª רקע ××§×¦× ×קצ×" means here. Reproduced 188 as absolutely-positioned <img>s inside a full-width, overflow-hidden layer. 189 Every percentage below is the source's own x / width divided by 1440 190 (measured with probe-backgrounds.ts), so a wider screen keeps the same 191 composition and a narrower one just crops further, like the original. 192 193 These are <img> and not background-image on purpose: a background cannot 194 carry the entrance effect the customer asked for. overflow:hidden on the 195 layer is load-bearing â the pieces hang off both edges and would otherwise 196 give the page a horizontal scrollbar. 197 198 â NEVER put .rv on an element that is positioned BY a transform. rvIn ends on 199 transform:none, so a translateY(-50%) centring trick is wiped the moment the 200 class lands and the element jumps. (That is exactly what made the /about
201 banner art look wrong.) Position art with top/bottom/left only. */ 202.artful{position:relative} 203.artlayer{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0} 204/* Round-4 item 2 â "all the background images on every page should be smaller 205 so everything reads more clearly, like the existing site". 206 TWO levers, both applied: 207 (a) every piece below is 0.72x the size it was (which was the source's own 208 box divided by 1440). Widths only â height:auto keeps each drawing's 209 proportions, so nothing is squashed. 210 (b) they no longer paint at full strength. These are one-line drawings in 211 solid black; at 100% a line crossing a heading competes with it letter 212 for letter, which is what made our render look busier than the source's 213 even at identical geometry. 214 A piece is anchored by the edge it BLEEDS OFF â the right property for the 215 ones that run out of the right of the viewport, the left property for the left 216 ones â so shrinking the width pulls the drawing AWAY from the content column 217 instead of sliding it across the page. Anchoring them all from the left would 218 have marched every right-hand piece back into the copy as it got smaller. 219 220 Each offset below keeps the SAME FRACTION of the drawing on screen that the 221 source shows, rather than the same overhang in pixels. Holding the overhang 222 fixed while shrinking the image slides the drawn subject off the page: the 223 first attempt at this did exactly that to the contact grapes â the box was 224 still in the right place and measured correctly, and the visitor saw nothing 225 at all, because the grapes live 44% into that artwork and only its blank left 226 third was left inside the viewport. offset = -width x (1 - visibleFraction). */ 227.artlayer img{position:absolute;height:auto;max-width:none;opacity:.7} 228.artful > .wrap,.artful > .band__inner{position:relative;z-index:1} 229 230.art-netto-l{left:-12.6%;width:41.6%;top:47%} 231.art-netto-r{right:-2.2%;width:40%;top:54%} 232/* The source stands this character at x=217, just left of ITS bottles (which 233 start at 332). Ours are bigger (round-3 item 5) and start at 175, so the same 234 coordinate would bury it behind the left bottle; the gap between the bottles 235 and the copy is only 72px, narrower than the character. It rides the far-left 236 end of the same wave instead â the one place in the band that is clear at 237 every width. */ 238/* The characters are figures, not backdrop â they keep their size. */ 239.art-netto-red{left:0.6%;width:7%;top:45%;opacity:1} 240.art-club-l{left:22.7%;width:17.4%;top:12%} 241/* top pulled up from 36%: at its old size this one ran 449px tall and reached 242 past the end of its own band into the NEXT section's heading ("×ת ××× ××ר 243 ××¢×ת?"), which the source's copy never does. */ 244.art-club-r{right:-9.2%;width:45%;top:26%} 245/* top pushed off 0 so the wave passes UNDER the section heading rather than 246 straight through it â measured on the source, whose line clears the title. */ 247.art-tasted-top{left:-16.7%;width:65.6%;top:86px} 248.art-tasted-r{right:-11.8%;width:39%;top:32%} 249.art-tasted-l{left:-9%;width:45%;top:54%} 250.art-tasted-r2{right:-16.5%;width:45%;top:90%} 251.art-wm{right:-22.2%;width:45%;bottom:0} 252 253/* NETTO trio: bottles sit tight together on a dark slab and rise above AND 254 below it (round-3 item 5 â "×צ×צ×× ××ר××××¢ ×ש××ר"). The slab is inset from 255 the flex box's top and bottom, so the overhang is symmetric and the bottles 256 themselves set the band's height. */ 257.trio{position:relative;display:flex;justify-content:center;align-items:center;gap:0} 258/* left:0;right:0;margin:auto centres without a transform â see the â above. */ 259.trio__slab{position:absolute;left:0;right:0;margin:0 auto;top:58px;bottom:58px;width:min(400px,78%);background:#2c2c2c} 260.trio img{position:relative;z-index:1;width:38%;max-width:186px;height:auto;margin:0 -14px} 261.trio img:nth-child(3){z-index:2} 262 263/* Members club: grey card overlapping the vineyard photo, as in the source. */ 264.club{position:relative;padding:0 0 30px} 265/* Photo sits upper-RIGHT, the grey card overlaps it from the lower-LEFT. */ 266.club__photo{width:74%;margin-inline-end:auto;display:block} 267.club__card{position:relative;
267margin-top:-130px;margin-inline-start:auto;width:min(720px,88%);background:#e9e9e9;padding:34px 38px 38px;text-align:center;z-index:2} 268.club__card h2{margin-bottom:10px} 269/* The red character perches on the join button, as in the source. */ 270.club__creature{position:absolute;left:20%;bottom:16px;width:86px;z-index:3;pointer-events:none} 271 272/* "×ת ××× ××ר ××¢×ת?" â big grey squares with the bottle overflowing the top, 273 two staggered columns rather than a flat row. */ 274.tasted{display:grid;grid-template-columns:1fr 1fr;gap:0 70px;margin-top:26px;position:relative;align-items:start} 275/* align-self:start is load-bearing â grid items stretch by default and the 276 stagger margin then has nothing to push against. */ 277.tasted__item{text-align:center;max-width:420px;align-self:start} 278/* Measured, not reasoned: justify-self:end lands in the RIGHT column here, and 279 the source keeps the right item HIGHER than its left partner, descending in a 280 zigzag down the section. */ 281.tasted__item:nth-child(odd){justify-self:end;margin-top:0} 282.tasted__item:nth-child(even){justify-self:start;margin-top:150px} 283.tasted__item:nth-child(n+3){margin-top:-90px} 284.tasted__item:nth-child(4){margin-top:60px} 285.tasted__fig{position:relative;background:#d9d9d9;aspect-ratio:1/1;width:min(335px,100%);margin:0 auto;display:flex;align-items:flex-end;justify-content:center} 286.tasted__fig img{width:auto;max-width:96%;height:132%;object-fit:contain;margin-bottom:0} 287.tasted h3{font-size:20px;font-weight:700;margin:18px 0 8px} 288.tasted p{font-size:15px;color:#222;margin:0 0 16px} 289 290/* wine tiles â the "×ת ××× ××ר ××¢×ת?" grid */ 291.wines{display:grid;grid-template-columns:repeat(2,1fr);gap:46px 56px;margin-top:34px} 292.wine{display:grid;grid-template-columns:220px 1fr;gap:26px;align-items:center} 293.wine__fig{background:#e6e6e6;padding:18px;display:flex;align-items:center;justify-content:center;min-height:250px} 294.wine__fig img{max-height:230px;width:auto;object-fit:contain} 295.wine__name{font-size:20px;font-weight:700;margin:0 0 8px} 296.wine__desc{font-size:14.5px;color:#333;margin:0 0 16px} 297 298/* cards (visitor centre) */ 299.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;margin-top:34px} 300.card{background:#e6e6e6;padding:34px 30px;text-align:center} 301.card__icon{width:56px;height:56px;margin:0 auto 16px;color:#000} 302.card__icon svg{width:100%;height:100%} 303.card h3{font-size:20px;font-weight:600;margin:0 0 12px} 304.card p{font-size:15px;margin:0 0 8px} 305.card p:last-child{margin-bottom:0} 306 307.card__icon img{width:100%;height:100%;object-fit:contain} 308/* Round-3 item 12: the source sets each language as a small 35px badge with its 309 name BESIDE it on one line, not a 54px disc stacked over a caption. */ 310.langs{display:flex;gap:22px;justify-content:center;align-items:center;margin-top:16px;flex-wrap:wrap} 311.langs figure{margin:0;display:flex;align-items:center;gap:8px} 312.langs img{width:35px;height:35px;margin:0;flex:0 0 auto} 313.langs figcaption{font-size:16px;font-weight:600} 314/* Round-3 item 13: mail + WhatsApp marks at the END of each contact line, so 315 the lines above them stay flush with one another. */ 316.card__line{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 10px} 317.card__line a{text-decoration:underline} 318.card__mark{width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:#fff} 319.card__mark svg{width:19px;height:19px} 320.card__mark--wa{background:#25d366} 321.card__mark--mail{background:#000} 322 323/* Running photo strip (visitor-centre header). The track is duplicated and the 324 animation translates exactly -50%, so it loops seamlessly. Pure CSS: at rest 325 (no animation) the first set is still on screen, so a static render is fine. */ 326/* The whole strip is LTR: in an RTL container a width:max-content flex track is 327 laid out from the RIGHT edge, so the visible window landed on the END of the 328 track and the marquee ran away from the viewport instead of through it. */ 329.photostrip{position:relative;overflow:hidden;background:#fff;direction:ltr} 330.photostrip__bg{position:absolute;
330left:0;bottom:-10px;width:52%;opacity:.4;pointer-events:none;z-index:0} 331/* direction:ltr on the track is load-bearing: under RTL the flex row starts at 332 the right and an animation-direction:reverse put the track at -50% AT REST, 333 so the strip rendered almost entirely off-screen. LTR keeps translate math 334 predictable, and at rest (no animation, static render) the first images are 335 on screen. The photos carry no text, so reading order does not matter. */ 336.photostrip__track{display:flex;width:max-content;position:relative;z-index:1;direction:ltr} 337.photostrip__track img{width:clamp(240px,23vw,330px);height:clamp(230px,26vw,340px);object-fit:cover;flex:0 0 auto} 338@media (prefers-reduced-motion:no-preference){ 339 .photostrip__track{animation:stripRun 46s linear infinite} 340} 341@keyframes stripRun{from{transform:translateX(0)}to{transform:translateX(-50%)}} 342 343/* Visitor-centre intro without the flanking photo (round-2 item 13). */ 344.intro{max-width:900px;margin:0 auto 6px;text-align:right} 345 346/* Short hero band, right-aligned, with a square mark and the sketch arrow. 347 width:100% is load-bearing (round-3 item 11): .band is a flex container, so 348 without it .band__inner shrink-to-fits its longest line and margin:0 auto 349 then centres THAT â which floated the copy and the square mark ~100px left of 350 the page content column instead of sitting flush with it. */ 351.band--short{min-height:300px} 352.band--short .band__inner{padding:44px 24px 66px;text-align:right;width:100%;max-width:1170px;position:relative} 353.band__mark{display:block;width:46px;height:46px;background:#fff;margin:0 0 16px} 354/* The arrow sits UNDER the copy on the right, as in the source â not off in the 355 far left corner. It is already white artwork, so no invert filter. */ 356.band__arrow{display:block;width:76px;margin:14px 8px 0 auto;pointer-events:none} 357 358/* four-photo strip fallback */ 359.photostrip--static{display:grid;grid-template-columns:repeat(4,1fr)} 360.photostrip--static img{width:100%;height:340px;object-fit:cover} 361 362/* partner logo strip */ 363.logos{display:grid;grid-template-columns:repeat(6,1fr);gap:22px;align-items:center;margin-top:30px} 364.logos img{width:100%;max-height:92px;object-fit:contain} 365 366/* decorative line art â never load-bearing */ 367.deco{pointer-events:none} 368 369/* Winemaker portrait: hand-drawn arc, photo, hand-drawn arc â as in the source. 370 Round-3 item 8 asks for the drawing to arrive "half from the right and half 371 from the left", so each arc reveals from its OWN side and meets around the 372 photo; the three pieces are one 140/201/193-wide composite at a single 373 height, which is how the source draws one continuous circle. */ 374.portrait-art{display:flex;justify-content:center;align-items:center;gap:0} 375.portrait-art img{height:clamp(320px,42vw,500px);width:auto;max-width:none;object-fit:contain} 376.portrait-art__side{opacity:.9;pointer-events:none} 377@media (max-width:520px){ 378 /* The arcs would squeeze the photo to a sliver on a phone. */ 379 .portrait-art__side{display:none} 380 .portrait-art img{height:clamp(280px,72vw,420px)} 381} 382 383/* Tall pre-footer photo band with the purple jester overlapping its top edge. */ 384.photoband{position:relative;margin-top:60px} 385.photoband img.photoband__img{width:100%;height:min(62vh,600px);object-fit:cover;display:block} 386.photoband__jester{position:absolute;top:-46px;left:7%;width:110px;z-index:2;pointer-events:none} 387 388/* Page banner: photo centred with a drawn landscape continuing out of each side 389 (round-3 item 9). The three pieces are laid out as ONE flex row at a single 390 height, exactly as the source composes them (594 + 661 + 406 at 450 tall): 391 that is what stops the art rendering "×¢× ×§×ת" â the previous version scaled 392 each piece to a % of the viewport WIDTH, so a 1.32-ratio drawing grew to 393 ~500px tall inside a 460px band and only a magnified crop of it was visible. 394 The slight negative margins reproduce the source's own overlap. 395 No transform is used to position anything here â the .rv reveal would wipe it. */ 396.herobanner{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#fff} 397.herobanner img{height:clamp(210px,31vw,450px);width:auto;max-width:none;flex:0 0 auto;display:block} 398.herobanner__bg,.herobanner__side{opacity:.75;pointer-events:none} 399.herobanner__bg{margin-inline-end:-8%} 400.herobanner__side{margin-inline-start:-7%} 401.herobanner__img{position:relative;z-index:1} 402@media (max-width:768px){ 403 /* One drawn side only â two of them would leave the photo a thumbnail. */ 404 .herobanner__side{display:none} 405 .herobanner__bg{margin-inline-end:-14%} 406} 407 408/* Alternating rows. The band COLOUR still runs edge to edge and the rows are 409 still flush to each other (round-2 item 11), but round-3 item 10 asks for the 410 content itself to be centred and smaller: the source sets a ~430px square 411 picture beside the copy inside a centred column, not a full-bleed 50/50 split 412 with the paragraphs pushed against the viewport edge. */ 413.stack__row{background:#fff} 414.stack__row--grey{background:#e6e6e6} 415.stack__grid{display:grid;grid-template-columns:440px minmax(0,1fr);align-items:center;gap:54px; 416 max-width:1180px;margin:0 auto;padding:0 24px} 417.stack__row--flip .stack__grid{grid-template-columns:minmax(0,1fr) 440px} 418.stack__row--flip .stack__media{order:2} 419.stack__media img{width:100%;aspect-ratio:1/1;height:auto;object-fit:cover;display:block} 420.stack__body{display:flex;align-items:center;padding:48px 0} 421.stack__inner{max-width:590px} 422.stack__inner p{font-size:15.5px;line-height:1.72} 423.stack__body p:last-child{margin-bottom:0}
424@media (max-width:900px){ 425 .stack__grid,.stack__row--flip .stack__grid{grid-template-columns:1fr;gap:26px;padding:0 24px} 426 .stack__row--flip .stack__media{order:0} 427 .stack__body{padding:26px 0 48px} 428 .stack__media img{aspect-ratio:4/3} 429} 430 431/* The netto seal is a small stamp, not a hero image (round-2 item 12). 432 Needs to out-specify the .split__media img width:100% rule, which upscaled 433 it to full column width and made it look pixelated. */ 434.split__media img.seal,.seal{display:inline-block;width:120px;max-width:120px;height:auto} 435 436/* full-bleed photo band */ 437.band{position:relative;min-height:420px;display:flex;align-items:center;background:#000 center/cover no-repeat} 438.band::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.15),rgba(0,0,0,.6))} 439.band__inner{position:relative;z-index:2;max-width:1170px;margin:0 auto;padding:60px 24px;color:#fff} 440.band__inner h2{font-size:clamp(22px,2.6vw,30px);margin:0 0 14px} 441.band--plain::after{display:none} 442 443/* Contact page (round-2 items 16â17, round-3 items 14â15) */ 444.contactpage{position:relative;overflow:hidden} 445.contactpage .wrap{position:relative;z-index:1} 446/* Round-3 item 15: the source shows PART of a drawing off the left edge near 447 the top and PART of another off the right edge lower down. Physical left/right 448 on purpose â under RTL the logical properties flip these to the wrong side 449 (same trap as the drawer anchor). 450 451 Round-4 item 1: the grape drawing was crossing the "*ש×× ××××" line under the 452 form. Two changes, and BOTH are needed â shrinking alone still clipped it, 453 because the piece is anchored from the section's bottom and the note sits ~40px 454 above that edge. So it is smaller AND pinned to the very bottom of the section 455 (bottom:0 with the section carrying the extra padding below the form), which 456 is where the source draws it: below the send button, clear of every line. */ 457.art-contact-t{left:-21.5%;width:50%;top:0} 458.art-contact-b{right:-21.3%;width:45%;bottom:0} 459/* Room under the form so the drawing above has somewhere to sit that is not on 460 top of a sentence. */ 461.contactpage{padding-bottom:180px} 462.talk{display:flex;align-items:center;gap:12px;font-size:clamp(26px,3.2vw,34px)} 463.talk__icon{width:46px;height:auto;flex:0 0 auto} 464/* Round-3 item 14: 20px, matching the source's contact block. */ 465.contactpage .lead-row,.contactpage .lead-intro{font-size:20px;font-weight:500} 466.lead-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap} 467.lead-row a{text-decoration:underline} 468/* order:1 puts the chip LAST in the flex row â i.e. at the END of the line, 469 which under RTL is its left edge â so the text of both lead lines starts at 470 the same right-hand margin (round-3 item 14). */ 471.wa-chip{width:30px;height:30px;border-radius:50%;background:#25d366;color:#fff;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;order:1} 472.mapstack{position:relative;padding:0 0 26px 26px} 473.mapstack__slab{position:absolute;left:0;bottom:0;width:78%;height:82%;background:#d9d9d9;z-index:0} 474.mapstack__map{position:relative;z-index:1;width:100%;height:clamp(320px,34vw,460px);border:0;display:block} 475.addr{display:flex;align-items:center;gap:10px;margin:14px 0 0;font-weight:600} 476.addr svg{width:22px;height:22px;flex:0 0 auto} 477 478/* forms */ 479.form{display:grid;gap:14px;max-width:560px} 480.form input,.form textarea{width:100%;font-family:inherit;font-size:16px;color:#000;background:#fff;border:1.5px solid #000;border-radius:26px;padding:13px 20px} 481.form textarea{border-radius:18px;min-height:120px;resize:vertical} 482.form input:focus,.form textarea:focus{outline:2px solid #000;outline-offset:2px} 483.form .btn{justify-self:start} 484.form__note{font-size:13px;color:#555} 485/* Placeholders must read right-to-left like every other field. type="tel" 486 inputs get a left-to-right base direction from the UA, which left-aligned the 487 "××פ××:" placeholder alone (round-3 item 14). */ 488.form input[type="tel"]{direction:rtl;text-align:right} 489 490/* Full-width form (round-2 item 15 / round-3 item 11). This MUST come after the 491 .form block above: both selectors are one class, so the later one wins the 492 cascade â while it sat earlier in the sheet, .form's max-width:560px kept 493 beating .form--wide's max-width:none and the "wide" form was never wide. */ 494.form--wide{max-width:none;grid-template-columns:1fr 1fr 1fr;align-items:start} 495.form--wide textarea{grid-column:1/-1} 496.form--wide .btn{grid-column:1/-1;justify-self:center} 497.form--wide .form__note{grid-column:1/-1} 498@media (max-width:768px){ 499 .form--wide{grid-template-columns:1fr} 500}
500 501 502/* store */ 503.store-toolbar{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:0 0 34px} 504.chip{display:inline-block;border:1px solid #bcbcbc;border-radius:30px;padding:9px 22px;font-size:15px;background:#fff;color:#000;cursor:pointer} 505.chip[aria-current="true"]{background:#000;color:#fff;border-color:#000} 506.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:34px 26px} 507.prod{display:flex;flex-direction:column;text-align:center} 508.prod__fig{background:#e6e6e6;aspect-ratio:3/4;display:flex;align-items:center;justify-content:center;padding:16px;margin-bottom:14px} 509.prod__fig img{max-height:100%;width:auto;object-fit:contain} 510.prod__name{font-size:16px;font-weight:600;margin:0 0 6px;min-height:2.6em} 511.prod__price{font-size:17px;font-weight:700;margin:0 0 12px} 512.prod__price del{color:#888;font-weight:400;font-size:14px;margin-inline-start:8px} 513.prod .btn{padding:10px 22px;font-size:14px;align-self:center} 514.store-note{background:#e6e6e6;padding:22px 26px;margin:0 0 34px;font-size:15px;text-align:center} 515 516/* legal pages */ 517.legal{max-width:900px;margin:0 auto} 518.legal h2{font-size:21px;margin:30px 0 10px} 519.legal p,.legal li{font-size:15.5px;color:#222} 520.legal ol{padding-inline-start:22px} 521 522/* ââ footer âââââââââââââââââââââââââââââââââââââââââââââââââââââââââââ */ 523#site-footer{background:#000;color:#fff;padding:56px 0 26px} 524.ftr{display:grid;grid-template-columns:1.1fr 1fr 1fr 1fr;gap:36px} 525.ftr h3{font-size:22px;font-weight:500;margin:0 0 16px} 526.ftr ul{list-style:none;margin:0;padding:0} 527.ftr li{margin:0 0 9px} 528.ftr a:hover{text-decoration:underline} 529.ftr__logo img{width:190px} 530.ftr__row{display:flex;align-items:center;gap:10px;margin:0 0 9px} 531.ftr__row svg{width:17px;height:17px;flex:0 0 auto} 532.ftr__map{margin-top:16px;border:0;width:100%;height:190px;display:block;filter:grayscale(.15)} 533.ftr__social{display:flex;gap:12px} 534.ftr__social a{width:38px;height:38px;border-radius:50%;background:#fff;color:#000;display:flex;align-items:center;justify-content:center} 535.ftr__social svg{width:20px;height:20px} 536.ftr__legal{border-top:1px solid #333;margin-top:40px;padding-top:18px;font-size:12.5px;color:#9a9a9a;display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between} 537.ftr__legal a:hover{text-decoration:underline} 538 539/* ââ responsive âââââââââââââââââââââââââââââââââââââââââââââââââââââââ */ 540@media (max-width:1024px){ 541 .hdr__nav,.hdr__social{display:none} 542 .hdr__toggle{display:flex!important} 543 html.webydo-menu-open #site-header .hdr__toggle{display:none!important} 544 .hdr{min-height:78px;justify-content:space-between} 545 .hdr__logo img{width:180px} 546 .wines{grid-template-columns:1fr;gap:34px} 547 .grid{grid-template-columns:repeat(3,1fr)} 548 .ftr{grid-template-columns:1fr 1fr} 549 .logos{grid-template-columns:repeat(4,1fr)} 550 .photostrip img{height:250px} 551} 552@media (max-width:768px){ 553 .sec{padding:48px 0} 554 .split{grid-template-columns:1fr;gap:26px} 555 .split--flip .split__media{order:0} 556 .cards{grid-template-columns:1fr} 557 /* Two staggered columns collapse to ~160px tiles on a phone â stack them. */ 558 .tasted{grid-template-columns:1fr;gap:30px} 559 .tasted__item, 560 .tasted__item:nth-child(odd), 561 .tasted__item:nth-child(even), 562 .tasted__item:nth-child(n+3), 563 .tasted__item:nth-child(4){margin-top:0;justify-self:center} 564 .grid{grid-template-columns:repeat(2,1fr);gap:26px 16px} 565 .wine{grid-template-columns:1fr;gap:16px;text-align:center} 566 .wine__fig{min-height:0} 567 .wine .btn{margin:0 auto} 568 .hero{min-height:70vh} 569 .band__inner{padding:44px 24px} 570 .ftr{grid-template-columns:1fr;gap:28px} 571 .form{max-width:none} 572 .logos{grid-template-columns:repeat(3,1fr);gap:16px} 573 .photostrip{grid-template-columns:repeat(2,1fr)} 574 .photostrip img{height:190px} 575 .langs{gap:14px 18px} 576 /* The backdrop art is composed for a desktop-width band; on a phone the 577 pieces would be little more than a smear across the copy. Keep the two 578 that still read (the section-opening lines) and drop the rest. */ 579 .artlayer img{opacity:.5} 580 .art-netto-r,.art-tasted-r,.art-tasted-r2,.art-club-l,.art-contact-b{display:none} 581 .art-netto-l,.art-club-r,.art-tasted-top,.art-tasted-l,.art-wm,.art-contact-t{width:150%} 582 .club__creature{width:64px;left:8%} 583} 584@media (max-width:420px){ 585 .grid{grid-template-columns:1fr} 586 .trio img{margin:0 -8px} 587} 588/* ââ Round 11 â holiday promotion (ends 2.11.2026) ââââââââââââââ */ 589:root{--promo-red:#c1121f;--promo-red-ink:#96101a} 590 591/* The struck "was" price. The customer asked for the old price crossed out 592 with a RED line; the digits stay grey so the promotional price is what the 593 eye lands on, and only the rule through them is red. */ 594.prod__price del,.wine-price del,.wine-rel__pr del,.wbpromo del{ 595 text-decoration-line:line-through; 596 text-decoration-color:var(--promo-red); 597 text-decoration-thickness:2px; 598 text-underline-offset:0; 599} 600.prod__price .prod__now,.wine-price .wine-now{color:var(--promo-red-ink)} 601.wine-rel__pr del{color:#8a8a8a;font-weight:400;font-size:12.5px;margin-inline-start:6px} 602 603/* "××צע" flag on a promoted tile. position:relative is added HERE, on the 604 promoted tile only, instead of editing .prod__fig â 56 other tiles are tuned 605 to an exact 261x348 frame and must not move. */ 606.prod--sale .prod__fig{position:relative} 607.prod__sale{ 608 position:absolute;top:0;inset-inline-start:0; 609 background:var(--promo-red);color:#fff; 610 font-size:12px;font-weight:700;line-height:1;letter-spacing:.02em; 611 padding:6px 10px; 612} 613 614/* ââ running banner (home page) âââââââââââââââââââââââââââââââââââââââââââââ
615 Same mechanism as .photostrip, which is already proven on this site: the 616 track holds the chips TWICE and travels exactly -50%, so the loop is 617 seamless, and at rest (static publish render, prefers-reduced-motion, or the 618 pause control) the first set is on screen. direction:ltr on the track is the 619 documented RTL trap â under rtl a width:max-content flex row is laid out from 620 the right edge and the marquee runs away from the viewport instead of through 621 it. Each chip sets direction:rtl back for its own Hebrew. */ 622.wbpromo-strip{background:#111;color:#fff;overflow:hidden} 623.wbpromo-strip__wrap{display:flex;align-items:center;gap:0} 624.wbpromo-strip__viewport{flex:1 1 auto;overflow:hidden;min-width:0} 625.wbpromo-strip__track{display:flex;width:max-content;direction:ltr} 626@media (prefers-reduced-motion:no-preference){ 627 .wbpromo-strip__track{animation:wbpromoRun 42s linear infinite} 628} 629@keyframes wbpromoRun{from{transform:translateX(0)}to{transform:translateX(-50%)}} 630/* Hovering, focusing or pressing the control stops it. WCAG 2.2.2 asks for a 631 mechanism to pause moving content that runs longer than five seconds, and the 632 control is a checkbox + label so it keeps working with no JavaScript at all 633 â the animation is pure CSS, so a JS-driven pause button would be a dead 634 control exactly when the motion is least escapable. */ 635.wbpromo-strip__viewport:hover .wbpromo-strip__track, 636.wbpromo-strip__track:focus-within{animation-play-state:paused} 637.wbpromo-strip__cb:checked ~ .wbpromo-strip__viewport .wbpromo-strip__track{animation-play-state:paused} 638.wbpromo-chip{ 639 direction:rtl;display:inline-flex;align-items:baseline;gap:9px;flex:0 0 auto; 640 padding:13px 22px;font-size:15px;white-space:nowrap; 641 border-inline-end:1px solid rgba(255,255,255,.18); 642} 643.wbpromo-chip__name{font-weight:600} 644.wbpromo-chip__now{font-weight:700} 645.wbpromo-chip del{color:#b9b9b9;font-weight:400;font-size:13px;text-decoration-color:var(--promo-red)} 646.wbpromo-chip--head{background:var(--promo-red);font-weight:700;letter-spacing:.01em} 647.wbpromo-chip--head .wbpromo-chip__name{font-weight:700} 648.wbpromo-strip__pause{ 649 flex:0 0 auto;cursor:pointer;background:#000;color:#fff; 650 font-size:12.5px;font-weight:600;padding:13px 16px;border-inline-start:1px solid rgba(255,255,255,.2); 651} 652.wbpromo-strip__pause:hover{background:#262626} 653.wbpromo-strip__cb:focus-visible ~ .wbpromo-strip__pause{outline:3px solid #fff;outline-offset:-3px} 654.wbpromo-strip__off{display:none} 655.wbpromo-strip__cb:checked ~ .wbpromo-strip__pause .wbpromo-strip__on{display:none} 656.wbpromo-strip__cb:checked ~ .wbpromo-strip__pause .wbpromo-strip__off{display:inline} 657@media (max-width:620px){ 658 .wbpromo-chip{padding:11px 15px;font-size:13.5px;gap:7px} 659 .wbpromo-strip__pause{padding:11px 12px;font-size:11.5px} 660} 661 662/* ââ popup ââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââ 663 Starts hidden in the markup and is only ever REVEALED by script, exactly 664 like the age gate: a static publish render therefore never captures a 665 blocking overlay (RENDER-SAFE RULE). z-index sits BELOW the age gate's 666 2147483000 so the two can never argue about which is on top. */ 667#promo-popup[hidden]{display:none} 668#promo-popup{ 669 position:fixed;inset:0;z-index:2147482000; 670 display:flex;align-items:center;justify-content:center;padding:20px; 671 background:rgba(0,0,0,.62); 672} 673html.wbpromo-open{overflow:hidden} 674.wbpromo__panel{ 675 position:relative;background:#fff;width:min(460px,100%);max-height:88vh;overflow:auto; 676 padding:34px 30px 28px;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.4); 677} 678.wbpromo__close{ 679 position:absolute;top:8px;inset-inline-end:10px; 680 width:38px;height:38px;font-size:23px;line-height:1;cursor:pointer; 681 background:none;border:0;color:#555; 682} 683.wbpromo__close:hover{color:#000} 684.wbpromo__kicker{ 685 display:inline-block;background:var(--promo-red);color:#fff; 686 font-size:12px;font-weight:700;letter-spacing:.06em;padding:5px 13px;margin:0 0 14px; 687} 688.wbpromo__title{font-size:29px;font-weight:700;margin:0 0 6px;line-height:1.2} 689.wbpromo__valid{font-size:13.5px;color:#666;margin:0 0 20px} 690.wbpromo__group{margin:0 0 16px} 691.wbpromo__heading{font-size:15px;font-weight:700;margin:14px 0 2px} 692.wbpromo__note{font-size:13px;color:#666;margin:0 0 10px;line-height:1.5} 693.wbpromo__list{list-style:none;margin:0;padding:0;text-align:start} 694.wbpromo__row{ 695 display:flex;align-items:baseline;justify-content:space-between;gap:12px; 696 padding:9px 2px;border-bottom:1px solid #ededed;font-size:14.5px; 697} 698.wbpromo__row:last-child{border-bottom:0} 699.wbpromo__wine{font-weight:600} 700.wbpromo__prices{white-space:nowrap;flex:0 0 auto} 701.wbpromo__now{font-weight:700;color:var(--promo-red-ink)} 702.wbpromo__was{color:#8a8a8a;font-size:13px;margin-inline-start:7px} 703.wbpromo__cta{display:block;margin:20px 0 0} 704.wbpromo__cta .btn{width:100%} 705@media (max-width:480px){ 706 .wbpromo__panel{padding:28px 20px 22px} 707 .wbpromo__title{font-size:25px} 708 .wbpromo__row{font-size:13.5px} 709} 710</style> 711 <!-- WEBYDO_SEO_BASELINE:START --> 712 <link rel="canonical" href="https://naamanwine.co.il/contact"> 713 <meta property="og:url" content="https://naamanwine.co.il/contact"> 714 <meta property="og:site_name" content="naamanwine.co.il (New Studio)"> 715 <meta name="robots" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1"> 716<!-- WEBYDO_SEO_BASELINE:END --> 717 <!-- webydo-seo-autopilot:jsonld:start --> 718
718<script type="application/ld+json">{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://naamanwine.co.il"},{"@type":"ListItem","position":2,"name":"צ×ר קשר","item":"https://naamanwine.co.il/contact"}]}</script>
718 719 <!-- webydo-seo-autopilot:jsonld:end --> 720 721 <link rel="stylesheet" href="/webydo-a11y.css" data-webydo-a11y-external> 722</head> 723<body> 724<div id="age-gate" role="dialog" aria-modal="true" aria-labelledby="ag-title" data-agegate hidden> 725 <div class="ag__panel"> 726 <img class="ag__logo" src="https://storage.googleapis.com/webydo-published-sites/A004910/assets/29138195d76b.jpg?v=1" alt="××§× × ×¢××" width="215" height="107" decoding="sync"> 727 <h2 class="ag__title" id="ag-title">×× × ××שר/ת ×× ×× × ××¢× ××× 18</h2> 728 <div class="ag__btns"> 729 <button class="ag__btn ag__btn--yes" type="button" data-agegate-yes>×× × ××¢× ××× 18</button> 730 <button class="ag__btn ag__btn--no" type="button" data-agegate-no>×× × ×ת×ת ×××× 18</button> 731 </div> 732 <p class="ag__warn">×××ר×: ×××× ××××××× ×××××¥ ××××× ×¢ ×שת×× ××פר×ת</p> 733 <div class="ag__art"> 734 <img class="ag__cheers" src="https://storage.googleapis.com/webydo-published-sites/A004910/assets/0b12af76ff09.png?v=1" alt="" aria-hidden="true" decoding="sync"> 735 <img class="ag__mark" src="https://storage.googleapis.com/webydo-published-sites/A004910/assets/fc3320cdb6fe.png?v=1" alt="" aria-hidden="true" decoding="sync"> 736 </div> 737 </div> 738</div> 739<div class="wbpromo" id="promo-popup" role="dialog" aria-modal="true" aria-labelledby="wbpromo-title" hidden> 740 <div class="wbpromo__panel"> 741 <button class="wbpromo__close" type="button" data-promo-close aria-label="ס××רת ×××××">×</button> 742 <span class="wbpromo__kicker">×××¦×¢× ×××</span> 743 <h2 class="wbpromo__title" id="wbpromo-title">×¢×××× ××××¨× ××× ×ת</h2> 744 <p class="wbpromo__valid">×ת××§×£ ×¢× 2.11.2026</p> 745 <div class="wbpromo__group"> 746 <ul class="wbpromo__list"> 747 <li class="wbpromo__row"><span class="wbpromo__wine">×ר×× 2010, 2011, 2012</span><span class="wbpromo__prices"><span class="wbpromo__now">âª130</span><del class="wbpromo__was"><span class="sr-only">×××§×× </span>âª145</del></span></li> 748 <li class="wbpromo__row"><span class="wbpromo__wine">×§×××¤× ×©×××¨× 2010, 2011, 2012</span><span class="wbpromo__prices"><span class="wbpromo__now">âª130</span><del class="wbpromo__was"><span class="sr-only">×××§×× </span>âª145</del></span></li> 749 </ul> 750 </div> 751 <div class="wbpromo__group"><h3 class="wbpromo__heading">××× ×ת 2024 ××שק×</h3><p class="wbpromo__note">××× ×ת ×××××× ×©× ××¦×¨× ×¢× ××× ××ª× ×××× ×ª×ת ×ש</p> 752 <ul class="wbpromo__list"> 753 <li class="wbpromo__row"><span class="wbpromo__wine">×§××¨× × ×¡×××× ××× 2024</span><span class="wbpromo__prices"><span class="wbpromo__now">âª130</span><del class="wbpromo__was"><span class="sr-only">×××§×× </span>âª145</del></span></li> 754 <li class="wbpromo__row"><span class="wbpromo__wine">×§××¨× × ×¤×¨× ×§ 2024</span><span class="wbpromo__prices"><span class="wbpromo__now">âª130</span><del class="wbpromo__was"><span class="sr-only">×××§×× </span>âª145</del></span></li> 755 <li class="wbpromo__row"><span class="wbpromo__wine">×ר×× 2024</span><span class="wbpromo__prices"><span class="wbpromo__now">âª130</span><del class="wbpromo__was"><span class="sr-only">×××§×× </span>âª145</del></span></li> 756 <li class="wbpromo__row"><span class="wbpromo__wine">×ש×ת ×ש×××¨× 2024</span><span class="wbpromo__prices"><span class="wbpromo__now">âª110</span><del class="wbpromo__was"><span class="sr-only">×××§×× </span>âª130</del></span></li> 757 <li class="wbpromo__row"><span class="wbpromo__wine">עשר ×©× ×× ×××¨× 2024</span><span class="wbpromo__prices"><span class="wbpromo__now">âª100</span><del class="wbpromo__was"><span class="sr-only">×××§×× </span>âª120</del></span></li> 758 </ul> 759 </div> 760 <p class="wbpromo__cta"><a class="btn" href="/store-page" data-promo-close>××× ×ת ××××</a></p> 761 </div> 762</div> 763<header id="site-header"> 764 <div class="hdr"> 765 <a class="hdr__logo" href="/" aria-label="××§× × ×¢×× â ×××£ ×××ת"> 766 <img src="https://storage.googleapis.com/webydo-published-sites/A004910/assets/2b6ad4ab476b.png?v=1" alt="×××× ××§× × ×¢××" width="230" height="115" decoding="sync"> 767 </a> 768 <nav class="hdr__nav" aria-label="× ×××× ×¨×ש×"><ul><li><a href="/">××ת</a></li><li><a href="/about">×ס×פ×ר ש×× ×</a></li><li><a href="/visitor-center">×ר×× ××קר××</a></li><li><a href="https://naamanfriends.activetrail.biz/×רש××-××××¢×××-×××ר××---××§×-× ×¢××" target="_blank" rel="noopener">×××¢××× ××ר××</a></li><li><a href="/contact" aria-current="page">צ×ר קשר</a></li><li><a href="/store-page">×× ×ת ××××</a></li></ul></nav> 769 <div class="hdr__social"> 770 <a href="https://wa.me/972507944881" target="_blank" rel="noopener" aria-label="×××ס×פ"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
770<path fill="currentColor" d="M17.5 14.4c-.3-.2-1.7-.9-2-1-.3-.1-.5-.1-.7.1-.2.3-.7 1-.9 1.2-.2.2-.3.2-.6.1-1.7-.9-2.9-1.6-4-3.6-.3-.5.3-.5.8-1.5.1-.2 0-.4 0-.5s-.7-1.6-.9-2.2c-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.5s1.1 2.9 1.2 3.1c.1.2 2.1 3.2 5.1 4.5 1.9.8 2.6.9 3.5.7.6-.1 1.7-.7 1.9-1.4.2-.7.2-1.2.2-1.4-.1-.2-.3-.3-.5-.5z"/><path fill="currentColor" d="M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm0 18.2c-1.6 0-3.1-.4-4.4-1.2l-.3-.2-3 .8.8-2.9-.2-.3A8.2 8.2 0 1 1 12 20.2z"/></svg></a> 771 <a href="https://www.facebook.com/naamanwinery" target="_blank" rel="noopener" aria-label="פ××ס×××§"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M13.5 21v-8h2.7l.4-3.1h-3.1V7.9c0-.9.25-1.5 1.55-1.5h1.65V3.6c-.29-.04-1.27-.12-2.4-.12-2.38 0-4 1.45-4 4.11V9.9H7.5V13h2.8v8h3.2z"/></svg></a> 772 <a href="https://www.instagram.com/naaman_winery/" target="_blank" rel="noopener" aria-label="××× ×¡××ר×"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M12 2.16c3.2 0 3.58.01 4.85.07 1.17.05 1.8.25 2.23.41.56.22.96.48 1.38.9.42.42.68.82.9 1.38.16.42.36 1.06.41 2.23.06 1.27.07 1.65.07 4.85s-.01 3.58-.07 4.85c-.05 1.17-.25 1.8-.41 2.23-.22.56-.48.96-.9 1.38-.42.42-.82.68-1.38.9-.42.16-1.06.36-2.23.41-1.27.06-1.65.07-4.85.07s-3.58-.01-4.85-.07c-1.17-.05-1.8-.25-2.23-.41-.56-.22-.96-.48-1.38-.9-.42-.42-.68-.82-.9-1.38-.16-.42-.36-1.06-.41-2.23C2.17 15.58 2.16 15.2 2.16 12s.01-3.58.07-4.85c.05-1.17.25-1.8.41-2.23.22-.56.48-.96.9-1.38.42-.42.82-.68 1.38-.9.42-.16 1.06-.36 2.23-.41C8.42 2.17 8.8 2.16 12 2.16zM12 0C8.74 0 8.33.01 7.05.07 5.78.13 4.9.33 4.14.63a5.9 5.9 0 0 0-2.13 1.38A5.9 5.9 0 0 0 .63 4.14c-.3.76-.5 1.64-.56 2.91C.01 8.33 0 8.74 0 12s.01 3.67.07 4.95c.06 1.27.26 2.15.56 2.91
772a5.9 5.9 0 0 0 1.38 2.13 5.9 5.9 0 0 0 2.13 1.38c.76.3 1.64.5 2.91.56C8.33 23.99 8.74 24 12 24s3.67-.01 4.95-.07c1.27-.06 2.15-.26 2.91-.56a5.9 5.9 0 0 0 2.13-1.38 5.9 5.9 0 0 0 1.38-2.13c.3-.76.5-1.64.56-2.91.06-1.28.07-1.69.07-4.95s-.01-3.67-.07-4.95c-.06-1.27-.26-2.15-.56-2.91a5.9 5.9 0 0 0-1.38-2.13A5.9 5.9 0 0 0 19.86.63c-.76-.3-1.64-.5-2.91-.56C15.67.01 15.26 0 12 0z"/><path fill="currentColor" d="M12 5.84a6.16 6.16 0 1 0 0 12.32 6.16 6.16 0 0 0 0-12.32zm0 10.16a4 4 0 1 1 0-8 4 4 0 0 1 0 8z"/><circle fill="currentColor" cx="18.41" cy="5.59" r="1.44"/></svg></a></div> 773 <!-- The menu-toggle class is deliberate: it puts this button inside the 774 platform's canonical TOGGLE_SEL union, so the publish pipeline's 775 body-end shim, the header CSS show-rule and the shared drawer 776 verifiers all find it. See CLAUDE.md header rule 7(d) - a 777 bespoke-only class is how the menu keeps coming back broken. --> 778 <button class="hdr__toggle menu-toggle" type="button" data-header-menu-toggle aria-expanded="false" 779 aria-controls="site-drawer" aria-label="פת××ת תפר××" 780 onclick="if(window.webydoToggleHeader)window.webydoToggleHeader()"> 781 <svg viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M3 6h18v2H3V6zm0 5h18v2H3v-2zm0 5h18v2H3v-2z"/></svg> 782 </button> 783 </div> 784</header> 785<div class="drw__backdrop" data-webydo-drawer-close aria-hidden="true"></div> 786<nav id="site-drawer" data-webydo-header-drawer aria-hidden="true" aria-label="תפר×× × ×××" dir="rtl"> 787 <button class="drw__close" type="button" data-webydo-drawer-close aria-label="ס××רת תפר××" 788 onclick="if(window.webydoCloseHeader)window.webydoCloseHeader()">×</button> 789 <a href="/">××ת</a> 790 <a href="/about">×ס×פ×ר ש×× ×</a> 791 <a href="/visitor-center">×ר×× ××קר××</a> 792 <a href="https://naamanfriends.activetrail.biz/×רש××-××××¢×××-×××ר××---××§×-× ×¢××" target="_blank" rel="noopener">×××¢××× ××ר××</a> 793 <a href="/contact">צ×ר קשר</a> 794 <a href="/store-page">×× ×ת ××××</a> 795 <div class="drw__social"> 796 <a href="https://wa.me/972507944881" target="_blank" rel="noopener" aria-label="×××ס×פ"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M17.5 14.4c-.3-.2-1.7-.9-2-1-.3-.1-.5-.1-.7.1-.2.3-.7 1-.9 1.2-.2.2-.3.2-.6.1-1.7-.9-2.9-1.6-4-3.6-.3-.5.3-.5.8-1.5.1-.2 0-.4 0-.5s-.7-1.6-.9-2.2c-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.5s1.1 2.9 1.2 3.1c.1.2 2.1 3.2 5.1 4.5 1.9.8 2.6.9 3.5.7.6-.1 1.7-.7 1.9-1.4.2-.7.2-1.2.2-1.4-.1-.2-.3-.3-.5-.5z"/><path fill="currentColor" d="M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm0 18.2c-1.6 0-3.1-.4-4.4-1.2l-.3-.2-3 .8.8-2.9-.2-.3A8.2 8.2 0 1 1 12 20.2z"/></svg></a> 797 <a href="https://www.facebook.com/naamanwinery" target="_blank" rel="noopener" aria-label="פ××ס×××§"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M13.5 21v-8h2.7l.4-3.1h-3.1V7.9c0-.9.25-1.5 1.55-1.5h1.65V3.6c-.29-.04-1.27-.12-2.4-.12-2.38 0-4 1.45-4 4.11V9.9H7.5V13h2.8v8h3.2z"/></svg></a> 798 <a href="https://www.instagram.com/naaman_winery/" target="_blank" rel="noopener" aria-label="××× ×¡××ר×"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M12 2.16c3.2 0 3.58.01 4.85.07 1.17.05 1.8.25 2.23.41.56.22.96.48 1.38.9.42.42.68.82.9 1.38.16.42.36 1.06.41 2.23.06 1.27.07 1.65.07 4.85s-.01 3.58-.07 4.85c-.05 1.17-.25 1.8-.41 2.23-.22.56-.48.96-.9 1.38-.42.42-.82.68-1.38.9-.42.16-1.06.36-2.23.41-1.27.06-1.65.07-4.85.07s-3.58-.01-4.85-.07c-1.17-.05-1.8-.25-2.23-.41-.56-.22-.96-.48-1.38-.9-.42-.42-.68-.82-.9-1.38-.16-.42-.36-1.06-.41-2.23C2.17 15.58 2.16 15.2 2.16 12s.01-3.58.07-4.85c.05-1.17.25-1.8.41-2.23.22-.56.48-.96.9-1.38.42-.42.82-.68 1.38-.9.42-.16 1.06-.36 2.23-.41C8.42 2.17 8.8 2.16 12 2.16zM12 0C8.74 0 8.33.01 7.05.07 5.78.13 4.9.33 4.14.63a5.9 5.9 0 0 0-2.13 1.38A5.9 5.9 0 0 0 .63 4.14c-.3.76-.5 1.64-.56 2.91C.01 8.33 0 8.74 0 12s.01 3.67.07 4.95c.06 1.27.26 2.15.56 2.91
798a5.9 5.9 0 0 0 1.38 2.13 5.9 5.9 0 0 0 2.13 1.38c.76.3 1.64.5 2.91.56C8.33 23.99 8.74 24 12 24s3.67-.01 4.95-.07c1.27-.06 2.15-.26 2.91-.56a5.9 5.9 0 0 0 2.13-1.38 5.9 5.9 0 0 0 1.38-2.13c.3-.76.5-1.64.56-2.91.06-1.28.07-1.69.07-4.95s-.01-3.67-.07-4.95c-.06-1.27-.26-2.15-.56-2.91a5.9 5.9 0 0 0-1.38-2.13A5.9 5.9 0 0 0 19.86.63c-.76-.3-1.64-.5-2.91-.56C15.67.01 15.26 0 12 0z"/><path fill="currentColor" d="M12 5.84a6.16 6.16 0 1 0 0 12.32 6.16 6.16 0 0 0 0-12.32zm0 10.16a4 4 0 1 1 0-8 4 4 0 0 1 0 8z"/><circle fill="currentColor" cx="18.41" cy="5.59" r="1.44"/></svg></a></div> 799</nav> 800<main> 801 802<section class="sec contactpage artful"> 803 <!-- Round-3 item 15: part of a drawing shows off the LEFT edge near the top 804 and part of another off the RIGHT edge lower down, as in the source. --> 805 <div class="artlayer" aria-hidden="true"> 806 <img class="art-contact-t rv rv--left" src="https://storage.googleapis.com/webydo-published-sites/A004910/assets/3829f5403ef0.png?v=1" alt="" decoding="sync"> 807 <img class="art-contact-b rv rv--right" src="https://storage.googleapis.com/webydo-published-sites/A004910/assets/3228f479433c.jpg?v=1" alt="" decoding="sync"> 808 </div> 809 <div class="wrap"> 810 <div class="split split--flip"> 811 <!-- Round-3 item 14: each column arrives from its own side. --> 812 <div class="split__media rv rv--left"> 813 <!-- The grey slab sits UNDERNEATH the map (round-2 item 17), then the 814 address line with its pin icon below both. --> 815 <div class="mapstack"> 816 <span class="mapstack__slab" aria-hidden="true"></span> 817 <iframe class="mapstack__map" title="×פת ××§× × ×¢××" src="https://www.google.com/maps?q=Na%27aman+Winery+%D7%9E%D7%A9%D7%A7+90+%D7%A8%D7%9E%D7%95%D7%AA+%D7%A0%D7%A4%D7%AA%D7%9C%D7%99&output=embed" 818 loading="eager" referrerpolicy="no-referrer-when-downgrade"></iframe> 819 </div> 820 <p class="addr"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z"/></svg><span>×שק 90, ר××ת × ×¤×ª××, 138300</span></p> 821 </div> 822 <div class="split__body rv rv--right"> 823 <h1 class="h-eyebrow talk"><img class="talk__icon" src="https://storage.googleapis.com/webydo-published-sites/A004910/assets/fc6ff8676262.png?v=1" alt="" aria-hidden="true" decoding="sync"><span>×××× × ××ר</span></h1> 824 <p class="lead-intro">×ת×××× ×××§×ר ×××§× ×××× ×©×××:</p> 825 <p class="lead-row"> 826 <span>ש××× ××××¢× ×ר×× × ×¢×× ×××××ס×פ <a href="https://wa.me/972507944881" target="_blank" rel="noopener">050-7944881</a></span> 827 <a class="wa-chip" href="https://wa.me/972507944881" target="_blank" rel="noopener" aria-label="×××ס×פ"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M17.5 14.4c-.3-.2-1.7-.9-2-1-.3-.1-.5-.1-.7.1-.2.3-.7 1-.9 1.2-.2.2-.3.2-.6.1-1.7-.9-2.9-1.6-4-3.6-.3-.5.3-.5.8-1.5.1-.2 0-.4 0-.5s-.7-1.6-.9-2.2c-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.5s1.1 2.9 1.2 3.1c.1.2 2.1 3.2 5.1 4.5 1.9.8 2.6.9 3.5.7.6-.1 1.7-.7 1.9-1.4.2-.7.2-1.2.2-1.4-.1-.2-.3-.3-.5-.5z"/><path fill="currentColor" d="M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm0 18.2c-1.6 0-3.1-.4-4.4-1.2l-.3-.2-3 .8.8-2.9-.2-.3A8.2 8.2 0 1 1 12 20.2z"/></svg></a> 828 </p> 829 <p class="lead-row"><span>×× ×××××: <a href="mailto:[email protected]">[email protected]</a></span></p> 830 <hr style="border:0;border-top:1px solid #ccc;margin:22px 0"> 831 <p>×ש ××× ×©×××, רע×××, ××§×©× ×××××ת ×× ×¤×©×× ×ת××××ת? ××× ×× ××××ר ××××§×ר ×××§×, ×××× ×ª ××¢×××ת ×× ×× ××ר ××ר â ×× ×× × ××× ×ש×××××.</p> 832 <p>×ש×××¨× ×× × ×¤×¨×××, ×× ×××ר ××××× ×××§×× ×¢× ×× ×××××¢.</p> 833 <form class="form" method="post" action="/api/forms/submit" data-webydo-form="1"> 834 <input type="hidden" name="siteId" value="A004910"> 835 <input type="hidden" name="formName" value="contact"> 836 <input type="text" name="fullName" placeholder="×©× ×××:" aria-label="×©× ×××" required> 837 <input type="tel" name="phone" placeholder="××פ××:" aria-label="××פ××" required> 838 <input type="email" name="email" placeholder="××××××:" aria-label="××××××"> 839 <textarea name="message" placeholder="×× ×ª×¨×¦× ××ת×× ×× ×?" aria-label="ת××× ×××××¢×"></textarea> 840 <button class="btn" type="submit">×ש×××× ›</button> 841 <p class="form__note">*ש×× ××××</p> 842 </form> 843 </div> 844 </div> 845 </div> 846</section> 847 848</main> 849<footer id="site-footer"> 850 <div class="wrap"> 851 <div class="ftr"> 852 <div class="ftr__logo"> 853 <img src="https://storage.googleapis.com/webydo-published-sites/A004910/assets/2b6ad4ab476b.png?v=1" alt="×××× ××§× × ×¢××" width="190" height="95" decoding="sync"> 854 </div> 855 <div> 856 <h3>×פת ××תר</h3> 857 <ul><li><a href="/">××ת</a></li><li><a href="/about">×ס×פ×ר ש×× ×</a></li><li><a href="/visitor-center">×ר×× ××קר××</a></li><li><a href="https://naamanfriends.activetrail.biz/×רש××-××××¢×××-×××ר××---××§×-× ×¢××" target="_blank" rel="noopener">×××¢××× ××ר××</a></li><li><a href="/contact">צ×ר קשר</a></li><li><a href="/store-page">×× ×ת ××××</a></li><li><a href="/report">×ª×§× ×× ×תר</a></li></ul> 858 </div> 859 <div> 860 <h3>צ×ר קשר</h3> 861 <div class="ftr__row"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
861<path fill="currentColor" d="M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.2.2 2.4.6 3.6.1.3 0 .7-.2 1l-2.3 2.2z"/></svg><a href="tel:0507944881">050-7944881</a></div> 862 <div class="ftr__row"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M19 8h-1V3H6v5H5a3 3 0 0 0-3 3v6h4v4h12v-4h4v-6a3 3 0 0 0-3-3zM8 5h8v3H8V5zm8 15H8v-5h8v5zm3-8.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/></svg><span>04-6950062</span></div> 863 <div class="ftr__row"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z"/></svg><span>×שק 90, ר××ת × ×¤×ª××, 138300</span></div> 864 <div class="ftr__row"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4.2-8 4.8-8-4.8V6l8 4.8L20 6v2.2z"/></svg><a href="mailto:[email protected]">[email protected]</a></div> 865 </div> 866 <div> 867 <h3>×¢×§×× ××ר×× ×</h3> 868 <div class="ftr__social"> 869 <a href="https://wa.me/972507944881" target="_blank" rel="noopener" aria-label="×××ס×פ"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M17.5 14.4c-.3-.2-1.7-.9-2-1-.3-.1-.5-.1-.7.1-.2.3-.7 1-.9 1.2-.2.2-.3.2-.6.1-1.7-.9-2.9-1.6-4-3.6-.3-.5.3-.5.8-1.5.1-.2 0-.4 0-.5s-.7-1.6-.9-2.2c-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.5s1.1 2.9 1.2 3.1c.1.2 2.1 3.2 5.1 4.5 1.9.8 2.6.9 3.5.7.6-.1 1.7-.7 1.9-1.4.2-.7.2-1.2.2-1.4-.1-.2-.3-.3-.5-.5z"/><path fill="currentColor" d="M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm0 18.2c-1.6 0-3.1-.4-4.4-1.2l-.3-.2-3 .8.8-2.9-.2-.3A8.2 8.2 0 1 1 12 20.2z"/></svg></a> 870 <a href="https://www.facebook.com/naamanwinery" target="_blank" rel="noopener" aria-label="פ××ס×××§"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M13.5 21v-8h2.7l.4-3.1h-3.1V7.9c0-.9.25-1.5 1.55-1.5h1.65V3.6c-.29-.04-1.27-.12-2.4-.12-2.38 0-4 1.45-4 4.11V9.9H7.5V13h2.8v8h3.2z"/></svg></a> 871 <a href="https://www.instagram.com/naaman_winery/" target="_blank" rel="noopener" aria-label="××× ×¡××ר×"><svg class="" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path fill="currentColor" d="M12 2.16c3.2 0 3.58.01 4.85.07 1.17.05 1.8.25 2.23.41.56.22.96.48 1.38.9.42.42.68.82.9 1.38.16.42.36 1.06.41 2.23.06 1.27.07 1.65.07 4.85s-.01 3.58-.07 4.85c-.05 1.17-.25 1.8-.41 2.23-.22.56-.48.96-.9 1.38-.42.42-.82.68-1.38.9-.42.16-1.06.36-2.23.41-1.27.06-1.65.07-4.85.07s-3.58-.01-4.85-.07c-1.17-.05-1.8-.25-2.23-.41-.56-.22-.96-.48-1.38-.9-.42-.42-.68-.82-.9-1.38-.16-.42-.36-1.06-.41-2.23C2.17 15.58 2.16 15.2 2.16 12s.01-3.58.07-4.85c.05-1.17.25-1.8.41-2.23.22-.56.48-.96.9-1.38.42-.42.82-.68 1.38-.9.42-.16 1.06-.36 2.23-.41C8.42 2.17 8.8 2.16 12 2.16zM12 0C8.74 0 8.33.01 7.05.07 5.78.13 4.9.33 4.14.63a5.9 5.9 0 0 0-2.13 1.38A5.9 5.9 0 0 0 .63 4.14c-.3.76-.5 1.64-.56 2.91C.01 8.33 0 8.74 0 12s.01 3.67.07 4.95c.06 1.27.26 2.15.56 2.91
871a5.9 5.9 0 0 0 1.38 2.13 5.9 5.9 0 0 0 2.13 1.38c.76.3 1.64.5 2.91.56C8.33 23.99 8.74 24 12 24s3.67-.01 4.95-.07c1.27-.06 2.15-.26 2.91-.56a5.9 5.9 0 0 0 2.13-1.38 5.9 5.9 0 0 0 1.38-2.13c.3-.76.5-1.64.56-2.91.06-1.28.07-1.69.07-4.95s-.01-3.67-.07-4.95c-.06-1.27-.26-2.15-.56-2.91a5.9 5.9 0 0 0-1.38-2.13A5.9 5.9 0 0 0 19.86.63c-.76-.3-1.64-.5-2.91-.56C15.67.01 15.26 0 12 0z"/><path fill="currentColor" d="M12 5.84a6.16 6.16 0 1 0 0 12.32 6.16 6.16 0 0 0 0-12.32zm0 10.16a4 4 0 1 1 0-8 4 4 0 0 1 0 8z"/><circle fill="currentColor" cx="18.41" cy="5.59" r="1.44"/></svg></a> 872 </div> 873 <iframe class="ftr__map" title="×פת ××§× × ×¢××" loading="eager" referrerpolicy="no-referrer-when-downgrade" 874 src="https://www.google.com/maps?q=Na%27aman+Winery+%D7%9E%D7%A9%D7%A7+90+%D7%A8%D7%9E%D7%95%D7%AA+%D7%A0%D7%A4%D7%AA%D7%9C%D7%99&output=embed"></iframe> 875 </div> 876 </div> 877 <div class="ftr__legal"> 878 <span>××תר × ×× × ×¢× ××× <a href="https://www.kidumplus.co.il/" target="_blank" rel="noopener">×§×××× ×¤××ס - ×× ××ת ×תר×× ××§×××× ×תר××</a></span> 879 <span><a href="/report">×ª×§× ×× ×תר</a> · <a href="/privacy">×××× ××ת פר×××ת</a></span> 880 </div> 881 </div> 882</footer>
883<script>(function(){ 884 if (window.__wbHeaderMenu) return; 885 window.__wbHeaderMenu = true; 886 var inited = false; 887 var TOGGLE_SEL = '[data-header-menu-toggle],.hdr__toggle,[class*="menu-toggle"],[class*="mobile-toggle"],[class*="nav-toggle"],[class*="burger"],.hamburger'; 888 function init(){ 889 if (inited) return; 890 var drawer = document.querySelector('[data-webydo-header-drawer]'); 891 var toggle = document.querySelector(TOGGLE_SEL); 892 if (!drawer || !toggle) return; 893 inited = true; 894 var backdrop = document.querySelector('.drw__backdrop'); 895 function setOpen(open){ 896 drawer.setAttribute('aria-hidden', open ? 'false' : 'true'); 897 toggle.setAttribute('aria-expanded', open ? 'true' : 'false'); 898 document.documentElement.classList[open ? 'add' : 'remove']('webydo-menu-open'); 899 } 900 function toggleDrawer(){ setOpen(drawer.getAttribute('aria-hidden') !== 'false'); } 901 function closeDrawer(){ setOpen(false); } 902 window.webydoToggleHeader = toggleDrawer; 903 window.webydoCloseHeader = closeDrawer; 904 function handle(e){ 905 var t = e.target; 906 if (!t || !t.closest) return; 907 if (t.closest(TOGGLE_SEL)) { e.stopImmediatePropagation(); e.preventDefault(); toggleDrawer(); return; } 908 if (t.closest('[data-webydo-drawer-close]')) { e.stopImmediatePropagation(); e.preventDefault(); closeDrawer(); return; } 909 if (drawer.getAttribute('aria-hidden') === 'false') { 910 if (t.closest('[data-webydo-header-drawer] a')) { closeDrawer(); return; } 911 if (!t.closest('[data-webydo-header-drawer]')) { closeDrawer(); } 912 } 913 } 914 window.addEventListener('click', handle, true); 915 window.addEventListener('touchend', handle, true); 916 document.addEventListener('keydown', function(e){ if (e.key === 'Escape') closeDrawer(); }); 917 setOpen(false); 918 } 919 if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init); 920 else init(); 921 window.addEventListener('load', init); 922})();</script>
vendor: 1 bytes, line 922
922
923<script>(function(){ 924 if (window.__wbNaamanEnhance) return; 925 window.__wbNaamanEnhance = true; 926 927 function gate(){ 928 var g = document.getElementById('age-gate'); 929 if (!g) return; 930 var KEY = 'naaman-age-ok'; 931 try { if (sessionStorage.getItem(KEY) === '1') return; } catch (e) {} 932 g.hidden = false; 933 document.documentElement.style.overflow = 'hidden'; 934 function accept(){ 935 try { sessionStorage.setItem(KEY, '1'); } catch (e) {} 936 g.hidden = true; 937 document.documentElement.style.overflow = ''; 938 } 939 var yes = g.querySelector('[data-agegate-yes]'); 940 var no = g.querySelector('[data-agegate-no]'); 941 if (yes) yes.addEventListener('click', accept); 942 if (no) no.addEventListener('click', function(){ window.location.href = 'https://www.google.com/'; }); 943 g.addEventListener('keydown', function(e){ if (e.key === 'Escape') accept(); }); 944 if (yes) { try { yes.focus(); } catch (e) {} } 945 } 946 947 function reveals(){ 948 var els = document.querySelectorAll('.rv'); 949 if (!els.length) return; 950 if (!('IntersectionObserver' in window)) { 951 // No observer: reveal everything at once. The end state IS the resting 952 // state, so this is visually a no-op â it just means no scroll effect. 953 for (var i = 0; i < els.length; i++) els[i].classList.add('rv-in'); 954 return; 955 } 956 // â ROUND 4, item 5 â there used to be a blanket setTimeout(â¦, 2200) here 957 // that added rv-in to EVERY remaining .rv element a couple of seconds after 958 // load. Measured on the live review site: 25 of 25 elements below the fold 959 // were already revealed at tâ1.5s, so by the time a visitor scrolled to any 960 // of them the animation had long finished and the whole page read as static 961 // â which is what "add the entrance effects like the existing site" was 962 // actually reporting. It is NOT needed for render-safety either: an .rv 963 // element with no rv-in class is fully visible (see the .rv rules in the 964 // CSS), so a static publish render captures the finished look regardless. 965 // Do not reintroduce it. 966 var io = new IntersectionObserver(function(entries){ 967 for (var i = 0; i < entries.length; i++) { 968 if (entries[i].isIntersecting) { 969 entries[i].target.classList.add('rv-in'); 970 io.unobserve(entries[i].target); 971 } 972 } 973 }, { rootMargin: '0px 0px -6% 0px', threshold: 0.04 }); 974 for (var j = 0; j < els.length; j++) io.observe(els[j]); 975 } 976 977 function init(){ gate(); reveals(); } 978 if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', init); 979 else init(); 980})();</script>
vendor: 1 bytes, line 980
980
981<script> 982(function(){ 983 if (window.__wbNaamanPromo) return; 984 window.__wbNaamanPromo = true; 985 986 var el = document.getElementById('promo-popup'); 987 if (!el) return; 988 var KEY = 'naaman-promo-holiday-2026'; 989 try { if (sessionStorage.getItem(KEY) === '1') return; } catch (e) {} 990 991 var lastFocus = null; 992 993 function open(){ 994 try { sessionStorage.setItem(KEY, '1'); } catch (e) {} 995 lastFocus = document.activeElement; 996 el.hidden = false; 997 document.documentElement.classList.add('wbpromo-open'); 998 var c = el.querySelector('[data-promo-close]'); 999 if (c) { try { c.focus(); } catch (e) {} } 1000 } 1001 1002 function close(){ 1003 if (el.hidden) return; 1004 el.hidden = true; 1005 document.documentElement.classList.remove('wbpromo-open'); 1006 if (lastFocus && lastFocus.focus) { try { lastFocus.focus(); } catch (e) {} } 1007 } 1008 1009 el.addEventListener('click', function(e){ 1010 var t = e.target; 1011 if (t === el) { close(); return; } 1012 var hit = t && t.closest ? t.closest('[data-promo-close]') : null; 1013 if (!hit) return; 1014 // the CTA is a real link â let it navigate, just take the overlay down 1015 if (hit.tagName !== 'A') e.preventDefault(); 1016 close(); 1017 }); 1018 1019 document.addEventListener('keydown', function(e){ 1020 if (e.key === 'Escape' || e.key === 'Esc') close(); 1021 }); 1022 1023 // Keep focus inside the dialog while it is open. 1024 el.addEventListener('keydown', function(e){ 1025 if (e.key !== 'Tab' || el.hidden) return; 1026 var f = el.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'); 1027 if (!f.length) return; 1028 var first = f[0], last = f[f.length - 1]; 1029 if (e.shiftKey && document.activeElement === first) { e.preventDefault(); last.focus(); } 1030 else if (!e.shiftKey && document.activeElement === last) { e.preventDefault(); first.focus(); } 1031 }); 1032 1033 // Keep focus inside the dialog even if something else grabs it. The 1034 // accessibility toolbar and the age gate both move focus of their own accord, 1035 // so a one-shot focus() on open is not enough on this page. 1036 document.addEventListener('focusin', function(e){ 1037 if (el.hidden) return; 1038 if (el.contains(e.target)) return; 1039 var c = el.querySelector('[data-promo-close]'); 1040 if (c) { try { c.focus(); } catch (err) {} } 1041 }, true); 1042 1043 /* â "the gate is not visible" is NOT the same as "the gate has been 1044 answered". This script runs while the document is still parsing, BEFORE 1045 the enhance script has un-hidden the age gate â so a plain 1046 !g || g.hidden test is true for a moment on every single page load, and the 1047 promotion would open underneath a gate that is about to appear over it 1048 (the gate sits at a higher z-index). The visitor would then confirm their 1049 age and find the promotion already open with its once-per-session flag 1050 spent, or never see it at all. 1051 1052 The unambiguous signal is the key the gate itself writes on accept. */ 1053 var seenGateOpen = false; 1054 function gateAnswered(){ 1055 try { if (sessionStorage.getItem('naaman-age-ok') === '1') return true; } catch (e) {} 1056 var g = document.getElementById('age-gate'); 1057 if (!g) return true; // no gate on this page at all 1058 if (!g.hidden) { seenGateOpen = true; return false; } 1059 return seenGateOpen; // it was open, and now it is not 1060 } 1061 1062 var tries = 0; 1063 var iv = setInterval(function(){ 1064 if (gateAnswered()) { clearInterval(iv); setTimeout(open, 900); } 1065 else if (++tries > 480) { clearInterval(iv); } // give up after two minutes 1066 }, 250); 1067})(); 1068</script>
1068 1069 1070</textarea></select></option></title></style></script>
1070</noscript></noframes></xmp></plaintext> 1071 1072<!-- Webydo Form Handler -->
1073<script> 1074(function() { 1075 'use strict'; 1076 1077 const SITE_ID = "A004910"; 1078 const FORMS_ENABLED = true; 1079 const FORMREADER_API_URL = 'https://app.webydo.com/api/forms/submit'; 1080 const NOTIFICATION_EMAIL = "[email protected]"; 1081 const WEBHOOK_URL = ""; 1082 const SITE_NAME = "naamanwine.co.il (New Studio) ××§× × ×¢××"; 1083 const SUCCESS_MESSAGE = "Thank you for your submission! We will get back to you soon."; 1084 const ERROR_MESSAGE = "×××¨×¢× ×©×××× ×ש×××ת ×××פס. ×× × × ×¡× ×©××."; 1085 const SITE_REDIRECT_AFTER_SUBMIT = ""; 1086 // Forms owned by another Webydo subsystem must not be hijacked by the generic 1087 // lead handler. The store checkout, club-portal auth and chatbot composer all 1088 // submit through their own code; intercepting them files a junk lead, shows a 1089 // "thank you" toast over the flow, and form.reset()s the user's input 1090 // mid-checkout. `data-webydo-ignore-form` is the permanent opt-out contract. 1091 const SKIP_FORM_SELECTOR = '[data-webydo-ignore-form],#checkout-form,.ws-checkout-form,#formLogin,#formRegister'; 1092 1093 if (!FORMS_ENABLED) { 1094 console.log('ð Webydo Form Handler: form handling is disabled for this site â skipping interceptors.'); 1095 return; 1096 } 1097 1098 console.log('ð Webydo Form Handler initialized for site:', SITE_ID); 1099 console.log('ð¡ Form submissions will be sent to:', FORMREADER_API_URL); 1100 console.log('ð§ Notification email:', NOTIFICATION_EMAIL || 'Site owner email (default)'); 1101 if (WEBHOOK_URL) { 1102 console.log('ð Webhook URL configured (FormReader will POST server-side after saving)'); 1103 } 1104 1105 // Tracks the forms this runtime instance has already wired up. This MUST be 1106 // an in-memory WeakSet â NOT a DOM dataset attribute â because Webydo's 1107 // publish flow snapshots runtime DOM state (including dataset attributes 1108 // set by JS) into the static HTML. A previous publish that wrote 1109 // `data-webydo-handler-attached="runtime-attached"` onto every form would 1110 // then fool the next page load into thinking its forms were already wired, 1111 // skipping addEventListener entirely. The browser would fall through to a 1112 // native form submit, which on GCS-served pages returns the "POST object 1113 // expects Content-Type multipart/form-data" XML error. 1114 const ATTACHED_FORMS = new WeakSet(); 1115 const ATTACHED_CONTROLS = new WeakSet(); 1116 1117 // Honeypot field name â MUST match FORM_HONEYPOT_FIELD in 1118 // lib/forms/formSpamFilter.ts. The server silently drops any submission 1119 // where this field arrives non-empty (humans never see it; spam bots fill 1120 // every input they find). 1121 const HONEYPOT_FIELD = '_wb_website'; 1122 1123 /** 1124 * Add the hidden honeypot input to a form (idempotent â the publish flow 1125 * snapshots runtime DOM into the saved HTML, so the input may already be 1126 * baked in). Hidden rather than display:none, because some bots skip 1127 * display:none inputs; tabindex/aria/autocomplete keep it invisible to 1128 * keyboard + screen-reader users and to browser autofill. 1129 * 1130 * â ï¸ It is hidden by CLIPPING, never by a large negative left/top offset. 1131 * An absolutely positioned box parked at -9999px still contributes to the scrollable 1132 * overflow area, and on an RTL document that overflow lands on the visible 1133 * side: every Hebrew page carrying a form got a ~9,850px horizontal 1134 * scrollbar (measured on the contact page of A005199 â documentElement 1135 * scrollWidth 11,292px against a 1,440px viewport). The clip/inset pattern 1136 * below occupies a 1x1 box at the form's own origin, so it is equally 1137 * invisible, equally bot-visible, and contributes NO overflow in either 1138 * writing direction. 1139 */ 1140 function ensureHoneypot(form) { 1141 try { 1142 if (form.querySelector('input[name="' + HONEYPOT_FIELD + '"]')) { 1143 return; 1144 } 1145 const hp = document.createElement('input'); 1146 hp.type = 'text'; 1147 hp.name = HONEYPOT_FIELD; 1148 hp.value = ''; 1149 hp.tabIndex = -1; 1150 hp.setAttribute('autocomplete', 'off'); 1151 hp.setAttribute('aria-hidden', 'true'); 1152 hp.style.cssText = 'position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;clip-path:inset(50%) !important;white-space:nowrap !important;opacity:0 !important;pointer-events:none !important;'; 1153 form.appendChild(hp); 1154 } catch (_) {} 1155 } 1156 1157 /** 1158 * Initialize form handlers on page load 1159 */ 1160 function initFormHandlers() { 1161 const forms = document.querySelectorAll('form'); 1162 console.log(`ð Found ${forms.length} form(s) on page`); 1163
1164 forms.forEach((form, index) => { 1165 // Skip forms owned by another Webydo subsystem (store checkout, club 1166 // portal auth, chatbot composer) â see SKIP_FORM_SELECTOR. 1167 if (form.matches && form.matches(SKIP_FORM_SELECTOR)) { 1168 console.log(`âï¸ Skipping form #${index + 1} â owned by another Webydo subsystem`); 1169 return; 1170 } 1171 1172 // Defense in depth: neutralize dangerous form action schemes. Our submit 1173 // listener calls preventDefault, but if it ever fails to attach (DOM 1174 // race, CSP, stripped chunk on preview/local) the browser default fires. 1175 // action="mailto:..." would then open the user's email client instead 1176 // of submitting to FormReader. Idempotent on subsequent observer passes. 1177 const rawAction = (form.getAttribute('action') || '').trim().toLowerCase(); 1178 if ( 1179 rawAction.indexOf('mailto:') === 0 || 1180 rawAction.indexOf('javascript:') === 0 || 1181 rawAction.indexOf('data:') === 0 || 1182 rawAction.indexOf('vbscript:') === 0 || 1183 rawAction.indexOf('file:') === 0 1184 ) { 1185 console.log('ð¡ï¸ Webydo Form Handler: neutralizing dangerous action="' + form.getAttribute('action') + '" on form #' + (index + 1)); 1186 form.removeAttribute('action'); 1187 } 1188 1189 // Same defense for a stored action that points back at the page itself 1190 // (a GCS object URL). Without explicit action="" the browser's native 1191 // submit POSTs to the current URL â which is the exact failure mode the 1192 // attribute removal below is meant to short-circuit if our listener ever 1193 // does not run. 1194 if (rawAction === window.location.pathname || rawAction === window.location.href) { 1195 form.removeAttribute('action'); 1196 } 1197 1198 // Attach the submit handler at most once per RUNTIME instance, keyed in 1199 // memory (see ATTACHED_FORMS comment above). The legacy persisted 1200 // dataset flag is removed proactively so it stops accumulating in the 1201 // saved HTML; whether it is present or absent no longer affects the 1202 // attach decision. 1203 if (form.dataset && 'webydoHandlerAttached' in form.dataset) { 1204 try { delete form.dataset.webydoHandlerAttached; } catch (_) {} 1205 } 1206 // Anti-spam honeypot (runs even for already-attached forms â cheap and 1207 // idempotent, and dynamically re-rendered forms may have lost it). 1208 ensureHoneypot(form); 1209 1210 if (ATTACHED_FORMS.has(form)) { 1211 return; 1212 } 1213 ATTACHED_FORMS.add(form); 1214 console.log(`â Attaching submit handler to form #${index + 1}`); 1215 // Capture phase: run before other submit listeners so we always preventDefault. 1216 // Otherwise a native POST goes to the static page URL (e.g. GCS) and returns 1217 // "POST object expects Content-Type multipart/form-data" instead of FormReader. 1218 form.addEventListener('submit', handleFormSubmit, true); 1219 1220 // Override form.submit() so programmatic calls are also intercepted. 1221 // Some platform scripts call form.submit() directly, bypassing the submit event. 1222 try { 1223 form.submit = function() { 1224 handleFormSubmit({ target: form, preventDefault: function() {}, stopPropagation: function() {} }); 1225 }; 1226 } catch (_) {} 1227
1228 // Attach click handler to submit controls as well. 1229 // Some templates use type="button" for visual submit buttons. 1230 // Same persisted-dataset trap as forms above â track in an in-memory 1231 // WeakSet instead of dataset, and clean up any stale persisted flag. 1232 const submitControls = form.querySelectorAll('button[type="submit"], input[type="submit"], button:not([type]), button[type="button"]'); 1233 submitControls.forEach((control) => { 1234 if (control.dataset && 'webydoSubmitAttached' in control.dataset) { 1235 try { delete control.dataset.webydoSubmitAttached; } catch (_) {} 1236 } 1237 if (ATTACHED_CONTROLS.has(control)) { 1238 return; 1239 } 1240 ATTACHED_CONTROLS.add(control); 1241 control.addEventListener('click', handleSubmitControlClick); 1242 }); 1243 }); 1244 } 1245 1246 function handleSubmitControlClick(event) { 1247 const control = event.currentTarget; 1248 const form = control && (control.form || control.closest('form')); 1249 if (!form) { 1250 return; 1251 } 1252 1253 // If button is not a native submit control, trigger submit manually. 1254 const controlType = (control.getAttribute('type') || '').toLowerCase(); 1255 if (controlType === 'button') { 1256 event.preventDefault(); 1257 if (typeof form.requestSubmit === 'function') { 1258 form.requestSubmit(); 1259 } else { 1260 const submitEvent = new Event('submit', { bubbles: true, cancelable: true }); 1261 form.dispatchEvent(submitEvent); 1262 } 1263 } 1264 } 1265 1266 /** 1267 * Find the human-readable label text associated with a form input. 1268 * Checks (in order): <label for="..."> matching input.id, the wrapping <label>, 1269 * and the first <label> in the input's immediate parent (the typical 1270 * Webydo form-group structure: <div class="form-group"><label>X</label><input></div>). 1271 * Returns '' if nothing usable is found. 1272 */ 1273 function findLabelText(input) { 1274 try { 1275 if (input.id) { 1276 const escaped = (typeof CSS !== 'undefined' && CSS.escape) ? CSS.escape(input.id) : input.id; 1277 const labelFor = document.querySelector('label[for="' + escaped + '"]'); 1278 if (labelFor) { 1279 const text = (labelFor.textContent || '').trim().replace(/s+/g, ' '); 1280 if (text) return text; 1281 } 1282 } 1283 const wrappingLabel = input.closest('label'); 1284 if (wrappingLabel) { 1285 const text = (wrappingLabel.textContent || '').trim().replace(/s+/g, ' '); 1286 if (text) return text; 1287 } 1288 const parent = input.parentElement; 1289 if (parent) { 1290 const siblingLabel = parent.querySelector('label'); 1291 if (siblingLabel) { 1292 const text = (siblingLabel.textContent || '').trim().replace(/s+/g, ' '); 1293 if (text) return text; 1294 } 1295 } 1296 } catch (_) { 1297 // Selector errors etc. â fall through to the next fallback. 1298 } 1299 return ''; 1300 } 1301 1302 /** 1303 * Handle form submission 1304 */ 1305 async function handleFormSubmit(event) { 1306 event.preventDefault(); 1307 1308 const form = event.target; 1309 const submitButton = form.querySelector('button[type="submit"], input[type="submit"]'); 1310 const originalButtonText = submitButton ? submitButton.textContent || submitButton.value : ''; 1311 1312 console.log('ð¨ Form submission intercepted'); 1313 1314 // Disable submit button 1315 if (submitButton) { 1316 submitButton.disabled = true; 1317 if (submitButton.tagName === 'BUTTON') { 1318 submitButton.textContent = 'Sending...'; 1319 } else { 1320 submitButton.value = 'Sending...'; 1321 } 1322 } 1323 1324 // Collect form data (supports Unicode/international characters including Hebrew, Arabic, Chinese, etc.) 1325 const formData = new FormData(form); 1326 const formFields = {}; 1327 1328 // Method 1: Get data from FormData API (skip empty values and file uploads â JSON cannot carry File) 1329 formData.forEach((value, key) => { 1330 if (!key) { 1331 return; 1332 } 1333 if (value === '' || value === null || value === undefined) { 1334 return; 1335 } 1336 if (typeof File !== 'undefined' && value instanceof File) { 1337 return; 1338 } 1339 if (typeof Blob !== 'undefined' && value instanceof Blob) { 1340 return; 1341 } 1342 formFields[key] = value; 1343 }); 1344 1345 // Method 2: Fallback - manually collect from form inputs (for fields without name attribute). 1346 // 1347 // Field-name resolution order: 1348 // 1. name attribute 1349 // 2. id attribute 1350 // 3. associated <label> text â keeps editor-generated forms working when 1351 // inputs have only data-layer-id (no name/id). Surfaces real labels 1352 // ("×©× ×××", "××פ××") instead of placeholder example values 1353 // ("×שר×× ×שר×××", "052-6335080"). 1354 // 4. placeholder (sample value â last resort) 1355 // 5. random fallback so the field still ships 1356 const inputs = form.querySelectorAll('input, textarea, select');
1357 inputs.forEach((input) => { 1358 // Skip submit buttons 1359 if (input.type === 'submit' || input.type === 'button' || input.type === 'reset' || input.type === 'image') { 1360 return; 1361 } 1362 1363 // â ï¸ CHECKBOXES / RADIOS: only count when actually SELECTED. 1364 // `input.value` returns the value ATTRIBUTE ("××" / "on" / â¦) no matter whether the control 1365 // is checked â it is NOT the submitted state. Method 1 (FormData) already omits unchecked 1366 // controls exactly like a native POST does; without this guard Method 2 then "restored" them, 1367 // so an untouched marketing-consent box was recorded as consent the visitor never gave 1368 // (reported on A005094: the lead sheet showed ××ש×ר ××××ר = "××" for an unticked box). 1369 // Never read .value for these types without consulting .checked. 1370 if (input.type === 'checkbox' || input.type === 'radio') { 1371 if (!input.checked) { 1372 return; 1373 } 1374 } 1375 1376 const value = input.value; 1377 if (!value) { 1378 return; 1379 } 1380 1381 const name = input.name 1382 || input.id 1383 || findLabelText(input) 1384 || input.getAttribute('placeholder') 1385 || `field_${Math.random().toString(36).substr(2, 9)}`; 1386 1387 // Skip if already collected by FormData 1388 if (!formFields[name]) { 1389 formFields[name] = value; 1390 } 1391 }); 1392 1393 console.log('ð¦ Form data collected:', Object.keys(formFields)); 1394 console.log('ð Field names (with Unicode support):', Object.keys(formFields).map(k => `"${k}"`).join(', ')); 1395 console.log('ð Field values:', formFields); 1396 1397 // Get form metadata 1398 const formId = form.id || form.name || 'form_' + Date.now(); 1399 const pageName = window.location.pathname.split('/').pop() || 'index'; 1400 // Full page URL for lead attribution. `pageName` is only the LAST path segment, so 1401 // /en/panels and /panels are indistinguishable to it; and the submit is CROSS-ORIGIN 1402 // (site â app.webydo.com), which means the browser sends the Referer WITHOUT a path. 1403 // Without this the CRM cannot tell which page a lead came from. The API strips 1404 // `_page_url` from the form data before the notification email / Google Sheet / 1405 // FormReader see it, so it never shows up as a form answer. 1406 const pageUrl = window.location.origin + window.location.pathname; 1407 1408 // Prepare payload for FormReader API. 1409 // webhookUrl and siteName are passed through so FormReader fires the webhook 1410 // server-side â no browser CORS issues. 1411 const payload = { 1412 siteId: SITE_ID, 1413 pageName: pageName, 1414 _page_url: pageUrl, 1415 formId: formId, 1416 from: 'Website Contact Form', 1417 subject: 'New Form Submission from ' + pageName, 1418 ...formFields, 1419 }; 1420 if (NOTIFICATION_EMAIL) { 1421 payload.to = NOTIFICATION_EMAIL; 1422 } else { 1423 delete payload.to; 1424 } 1425 if (WEBHOOK_URL) { 1426 payload.webhookUrl = WEBHOOK_URL; 1427 } 1428 if (SITE_NAME) { 1429 payload.siteName = SITE_NAME; 1430 } 1431 1432 console.log('ð¤ Submitting to FormReader API...'); 1433 1434 try { 1435 // Send directly to FormReader API 1436 // Content-Type with UTF-8 charset to properly handle international characters 1437 const response = await fetch(FORMREADER_API_URL, { 1438 method: 'POST', 1439 headers: { 1440 'Content-Type': 'application/json; charset=UTF-8', 1441 'Accept': 'application/json', 1442 }, 1443 body: JSON.stringify(payload), 1444 }); 1445 1446 if (response.ok) { 1447 console.log('â Form submitted successfully to FormReader'); 1448 if (WEBHOOK_URL) { 1449 console.log('ð Webhook will be fired server-side by FormReader'); 1450 } 1451 1452 showMessage(SUCCESS_MESSAGE, 'success'); 1453 1454 // Reset form 1455 form.reset(); 1456 1457 const redirectRaw = ( 1458 form.dataset.redirectUrl || 1459 form.getAttribute('data-redirect') || 1460 SITE_REDIRECT_AFTER_SUBMIT || 1461 '' 1462 ).trim(); 1463 if (redirectRaw) { 1464 try { 1465 const redirectParsed = new URL(redirectRaw, window.location.href); 1466 if (redirectParsed.protocol === 'http:' || redirectParsed.protocol === 'https:') { 1467 setTimeout(() => { 1468 window.location.href = redirectParsed.href; 1469 }, 2000); 1470 } else { 1471 console.warn('Webydo Form Handler: ignored non-http(s) redirect'); 1472 } 1473 } catch (redirectErr) { 1474 console.warn('Webydo Form Handler: invalid redirect URL', redirectErr); 1475 } 1476 } 1477 } else { 1478 const errorText = await response.text().catch(() => 'Unknown error'); 1479 console.error('â FormReader API error:', errorText); 1480 throw new Error(`Server returned ${response.status}`); 1481 } 1482 } catch (error) { 1483 console.error('â Form submission error:', error); 1484 showMessage(ERROR_MESSAGE, 'error'); 1485 } finally { 1486 // Re-enable submit button 1487 if (submitButton) { 1488 submitButton.disabled = false;
1489 if (submitButton.tagName === 'BUTTON') { 1490 submitButton.textContent = originalButtonText; 1491 } else { 1492 submitButton.value = originalButtonText; 1493 } 1494 } 1495 } 1496 } 1497 1498 /** 1499 * Show message to user 1500 */ 1501 function showMessage(message, type = 'success') { 1502 // Remove existing messages 1503 const existingMessages = document.querySelectorAll('.webydo-form-message'); 1504 existingMessages.forEach(msg => msg.remove()); 1505 1506 // Create message element 1507 const messageEl = document.createElement('div'); 1508 messageEl.className = `webydo-form-message webydo-form-message-${type}`; 1509 messageEl.textContent = message; 1510 messageEl.style.cssText = ` 1511 position: fixed; 1512 top: 20px; 1513 left: 50%; 1514 transform: translateX(-50%); 1515 padding: 16px 24px; 1516 border-radius: 8px; 1517 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; 1518 font-size: 14px; 1519 font-weight: 500; 1520 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); 1521 z-index: 10000; 1522 max-width: 90%; 1523 text-align: center; 1524 animation: slideInDown 0.3s ease-out; 1525 ${type === 'success' 1526 ? 'background: #10b981; color: white;' 1527 : 'background: #ef4444; color: white;' 1528 } 1529 `; 1530 1531 document.body.appendChild(messageEl); 1532 1533 // Auto-remove after 5 seconds 1534 setTimeout(() => { 1535 messageEl.style.animation = 'slideOutUp 0.3s ease-out'; 1536 setTimeout(() => messageEl.remove(), 300); 1537 }, 5000); 1538 } 1539 1540 // Add animation styles 1541 const style = document.createElement('style'); 1542 style.textContent = ` 1543 @keyframes slideInDown { 1544 from { 1545 opacity: 0; 1546 transform: translate(-50%, -20px); 1547 } 1548 to { 1549 opacity: 1; 1550 transform: translate(-50%, 0); 1551 } 1552 } 1553 @keyframes slideOutUp { 1554 from { 1555 opacity: 1; 1556 transform: translate(-50%, 0); 1557 } 1558 to { 1559 opacity: 0; 1560 transform: translate(-50%, -20px); 1561 } 1562 } 1563 `; 1564 document.head.appendChild(style); 1565 1566 // Initialize on DOM ready 1567 if (document.readyState === 'loading') { 1568 document.addEventListener('DOMContentLoaded', initFormHandlers); 1569 } else { 1570 initFormHandlers(); 1571 } 1572 1573 // Re-initialize if forms are dynamically added 1574 const observer = new MutationObserver((mutations) => { 1575 let shouldReinit = false; 1576 mutations.forEach((mutation) => { 1577 mutation.addedNodes.forEach((node) => { 1578 if (node.nodeType === 1 && (node.tagName === 'FORM' || node.querySelector('form'))) { 1579 shouldReinit = true; 1580 } 1581 }); 1582 }); 1583 if (shouldReinit) { 1584 console.log('ð New forms detected, re-initializing handlers'); 1585 initFormHandlers(); 1586 } 1587 }); 1588 1589 observer.observe(document.body, { 1590 childList: true, 1591 subtree: true 1592 }); 1593 1594 // Window-level capture interceptor â fires before any element-level handler. 1595 // Needed for Duda/Webydo-migrated sites whose platform scripts intercept submit 1596 // button clicks at the element level, preventing the native submit event from 1597 // ever being dispatched and leaving our form-level submit listener unreachable. 1598 window.addEventListener('click', function webydoClickInterceptor(e) { 1599 var node = e.target; 1600 var isSubmitLike = false; 1601 while (node && node !== document.documentElement) { 1602 // Track if we passed through a submit-like control on the way up the DOM. 1603 if (!isSubmitLike) { 1604 var tag = (node.tagName || '').toUpperCase(); 1605 var inputType = (node.getAttribute ? (node.getAttribute('type') || '') : '').toLowerCase(); 1606 if (tag === 'BUTTON' || 1607 (tag === 'INPUT' && (inputType === 'submit' || inputType === 'image')) || 1608 (node.dataset && node.dataset.webydoSubmitAttached === 'runtime-attached')) { 1609 isSubmitLike = true; 1610 } 1611 } 1612 // When we reach a registered form, intercept if the click was on a submit-like control. 1613 if ((node.tagName || '').toUpperCase() === 'FORM' && 1614 node.dataset && node.dataset.webydoHandlerAttached) { 1615 if (isSubmitLike) { 1616 e.stopImmediatePropagation(); 1617 e.preventDefault(); 1618 handleFormSubmit({ target: node, preventDefault: function() {}, stopPropagation: function() {} }); 1619 } 1620 return; 1621 } 1622 node = node.parentElement; 1623 } 1624 }, true); 1625 1626 console.log('â Webydo Form Handler ready'); 1627})(); 1628</script>
1628 1629 1630 1631 1632 1633<!-- Professional Accessibility Toolbar -->
1634<script src="/webydo-a11y.js" defer data-webydo-a11y-external></script>
1634 1635</body> 1636</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.