@charset "UTF-8";
a, button, input, select, textarea, li { -webkit-tap-highlight-color: transparent; /* For mobile tap highlights */ outline: none; /* For desktop focus outlines */ -webkit-box-shadow: none; box-shadow: none; /* Optional: removes any default shadows */ }

p { margin: 0; }

h1 { font-size: 16px; color: #333333; margin-bottom: 25px; }

h2 { font-size: 28px; font-weight: 700; color: #333333; }

a { text-decoration: none; color: #494949; }

img { width: 100%; }

.btns { display: -webkit-box; display: -ms-flexbox; display: flex; }

.btns a { color: #333333; border: solid #333333 1px; border-radius: 18px; padding: 7px 21px; font-weight: 400; text-decoration: none; margin: 0 5px; }

.btns a:hover { background-color: #121212; color: white; }

.btns.white a { color: white; border-color: white; }

.btns.white a:hover { background-color: white; color: #333333; }

.text { padding: 25px 15px; }

.text p { margin-bottom: 22px; line-height: 22px; }

.section { border-top: solid #333333 1px; display: -ms-grid; display: grid; -ms-grid-columns: 1fr; grid-template-columns: 1fr; padding-bottom: 25px; }

.contact-section { display: none; padding: 40px 20px; max-width: 500px; margin: 0 auto; font-family: sans-serif; border-top: solid #333333 1px; }

.contact-section.open { display: block; }

.form-container { background: #ffffff; padding: 30px; border-radius: 12px; -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); }

.input-group { margin-bottom: 20px; }

.input-group label { display: block; margin-bottom: 8px; font-weight: bold; color: #555; }

.input-group input, .input-group textarea { width: 100%; padding: 12px; border: 2px solid #eee; border-radius: 8px; -webkit-transition: border-color 0.3s ease; -o-transition: border-color 0.3s ease; transition: border-color 0.3s ease; -webkit-box-sizing: border-box; box-sizing: border-box; /* Crucial for padding */ font-family: 'Alef', sans-serif; }

.input-group input:focus, .input-group textarea:focus { outline: none; border-color: #333; }

#submitBtn { width: 100%; padding: 14px; background-color: #333; color: white; border: none; border-radius: 8px; cursor: pointer; font-size: 1rem; -webkit-transition: background-color 0.3s, -webkit-transform 0.2s; transition: background-color 0.3s, -webkit-transform 0.2s; -o-transition: transform 0.2s, background-color 0.3s; transition: transform 0.2s, background-color 0.3s; transition: transform 0.2s, background-color 0.3s, -webkit-transform 0.2s; }

#submitBtn:hover { background-color: #000; -webkit-transform: translateY(-2px); -ms-transform: translateY(-2px); transform: translateY(-2px); }

.status-message { margin-top: 15px; text-align: center; font-size: 0.9rem; }

/* The Button Container */
.menu-btn { width: 30px; height: 25px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; background: transparent; border: none; cursor: pointer; padding: 0; }

/* Common style for all 3 bars */
.bar { width: 100%; height: 2px; background-color: #333; border-radius: 10px; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; /* This makes it "slide" into the X */ }

/* --- THE TRANSFORMATION --- */
/* 1. Rotate the top bar 45 degrees down */
.menu-btn.open .bar:nth-child(1) { -webkit-transform: translateY(13px) rotate(45deg); -ms-transform: translateY(13px) rotate(45deg); transform: translateY(13px) rotate(45deg); }

/* 2. Fade out the middle bar */
.menu-btn.open .bar:nth-child(2) { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); /* Optional: makes it "shoot" out to the left */ }

/* 3. Rotate the bottom bar 45 degrees up */
.menu-btn.open .bar:nth-child(3) { -webkit-transform: translateY(-13px) rotate(-45deg); -ms-transform: translateY(-13px) rotate(-45deg); transform: translateY(-13px) rotate(-45deg); }

body { margin: 0; direction: rtl; font-family: 'Alef', sans-serif; font-size: 14px; letter-spacing: 0.2px; background-color: #fdfbf6; }

body .topnav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: #fdfbf6; z-index: 9; position: fixed; width: 100%; }

body .topnav nav { height: 78px; width: 100%; }

body .topnav nav ul { opacity: 0; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; margin-top: 78px; background-color: #fdfbf6; list-style: none; border-top: solid #333333 1px; padding: 5px 15px; }

body .topnav nav ul li { border-bottom: solid #9d917f 1px; }

body .topnav nav ul li a { display: block; color: #333333; padding: 12px 16px; text-decoration: none; font-size: 14px; }

body .topnav nav ul li a:hover { color: #9d917f; }

body .topnav nav ul li:last-of-type { border-bottom: none; }

body .topnav nav ul.open { opacity: 1; }

body .topnav nav .icon { position: absolute; top: 24px; right: 24px; }

body .topnav nav .icon .fa-bars { font-size: 24px; }

body .topnav .logo { position: absolute; left: 24px; top: 18px; }

body .topnav .logo a { display: block; }

body .topnav .logo a img { width: 175px; }

body header .video { padding-top: 78px; }

body header .info .text { padding-top: 15px; }

body main .section.klinik .info .text h2 { margin-top: 0; }

body main .section.tipolim .tips .tip { position: relative; }

body main .section.tipolim .tips .tip .photo-wrapper { position: relative; }

body main .section.tipolim .tips .tip .photo-wrapper .overlay { position: absolute; height: 160px; left: 0; right: 0; bottom: 0; background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(#fdfbf6)); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), #fdfbf6); background: -o-linear-gradient(top, rgba(255, 255, 255, 0), #fdfbf6); background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fdfbf6); }

body main .section.tipolim .tips .tip .text { padding-top: 0; }

body main .section.tipolim .tips .tip .text .info { padding-right: 5px; }

body main .section.tipolim .tips .tip .text .info p { font-size: 14px; line-height: 18px; margin-bottom: 0; }

body main .section.tipolim .tips .tip .text .info h3 { font-size: 24px; }

body main .section.tipolim .info .text h2 { margin-top: 0; }

body main .section.tipolim .info .list { list-style-type: none; padding: 0 15px; }

body main .section.tipolim .info .list li { border-bottom: solid rgba(51, 51, 51, 0.5) 1px; font-size: 16px; font-weight: 700; padding: 10px 0; line-height: 25px; color: #333333; cursor: pointer; }

body main .section.tipolim .info .list li:after { display: block; font-weight: 400; font-size: 14px; margin-top: -25px; opacity: 0; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; max-height: 24px; }

body main .section.tipolim .info .list li:nth-of-type(1):after { content: 'טיפול רפלקסולוגיה בבוטיק ”שקט” ברמת הגולן מתמקד ברפלקסולוגיה ומשלב טכניקות נוספות של עיסוי גוף עליון. זהו טיפול עדין, קשוב ובטוח, המיועד לנשים. מרחב שבו נשים יכולות לעצור לרגע, לבחור בעצמן, ולמצוא את השקט שלהן. הגישה הטיפולית מבוססת על יצירת תחושת ביטחון עמוקה – כזו שמאפשרת לגוף להרפות באמת ולרגש לשחרר. שני מטפלת גם בילדים ומתבגרים. המגע הוא הכלי המרכזי, כשהמגע בטוח, נוכח ומדויק – השקט מגיע מעצמו.הקליניקה פונה לנשים בכל שלבי החיים, ולילדים בכל גיל, ומציעה מרחב אינטימי, רגוע ומכיל, שבו אפשר לעצור לרגע את המרוץ, לנשום ולהרגיש שמוחזקים בידיים טובות.'; }

body main .section.tipolim .info .list li:nth-of-type(2):after { content: 'למצוא את ה־שקט שלך.שקט שמאפשר להרפות.שקט שמחזיר אותנו פנימה. שקט שלא צריך להסביר אותו — הוא פשוט מורגש. ריח עדין, תאורה רכה, מגע מקצועי, אנרגיה עוטפת. הקפדתי על כל פרט קטן. כי כל פרט כזה מאפשר לאישה שנכנסת להניח לרגע את העולם בחוץ, ולהקשיב למה שקורה בתוכה. אני מאמינה שכל אישה צריכה רגעים כאלה. רגעים שהיא בוחרת בהם את עצמה. רגעים שבהם היא לא מטפלת, לא מספיקה, לא נדרשת — רק נמצאת. ושם, בתוך השקט הזה, משהו בתוכה משתחרר, מתאחד, נרגע.'; }

body main .section.tipolim .info .list li:nth-of-type(3):after { content: 'כשהקמתי את בוטיק שקט בקיבוץ באל-רום שבצפון רמת הגולן, ידעתי שאני רוצה ליצור מרחב אחר. מרחב שנותן מקום למה שהכי חסר לנו ביומיום: שקט פנימי. בשנים האחרונות למדתי משהו על עצמי, אולי על כולנו. האושר שלנו, הבריאות שלנו, האיזון שלנו – מתחילים מבפנים. מתחת לכל העומס, הרעש, הרשימות, המחויבויות — יש מקום שקט. דק, עדין, כזה שקל לפספס אותו. ובאיזשהו שלב הבנתי שאני רוצה לחזור אליו. אני מאמינה שקט פנימי הוא לא מותרות. הוא הבסיס לאושר, לבריאות, לנשימה רגועה ולחיים טובים. להקשיב למה שהגוף אומר, למה שהלב מבקש, למרחב שמרפא באמת. שם נולד שקט. מתנה שאני רוצה לתת לכל אישה שתגיע.'; }

body main .section.tipolim .info .list li.open:after { opacity: 1; margin-top: 0; max-height: 500px; }

body main .section.about { padding-bottom: 0; line-height: 0; }

body main .section.social { -ms-grid-columns: 1fr 1fr; grid-template-columns: 1fr 1fr; justify-items: center; padding-bottom: 0; border-top: none; }

body main .section.social .text p { margin-bottom: 0; font-size: 16px; letter-spacing: 1px; }

body main .section.social .icons { -ms-flex-item-align: center; -ms-grid-row-align: center; align-self: center; }

body main .section.social .icons a { display: inline-block; margin: 0 7px; }

body main .section.social .icons a img { width: 30px; }

body footer.section { -ms-grid-columns: 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr; -webkit-box-align: end; -ms-flex-align: end; align-items: end; }

body footer .textblock ul { list-style-type: none; padding-right: 25px; }

body footer .textblock ul li a { font-size: 12px; text-decoration: none; }

body footer .logoblock .logo a { display: block; padding-left: 25px; }

body .rights { text-align: center; padding: 15px 0; font-size: 12px; }

body .rights a { color: #FF606E; }

body .rights a:hover { color: #494949; }

/* Styles for tablets and larger (e.g., screens 768px and up) */
@media (min-width: 768px) { body { font-size: 18px; }
  body .topnav nav { border-bottom: solid #9d917f 1px; height: auto; }
  body .topnav nav ul { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; border-top: none; height: 80px; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; padding: 0 15px; margin: 0; opacity: 1; }
  body .topnav nav ul li { border-bottom: none; width: 140px; text-align: center; }
  body .topnav nav ul li a { font-size: 18px; border-left: solid #9d917f 1px; height: 100%; padding: 0 16px; line-height: 80px; }
  body .topnav nav .icon { display: none; }
  body .topnav .logo { top: 20px; left: 45px; }
  body header { position: relative; }
  body header .info { padding: 75px; position: absolute; margin-top: 0; bottom: 0; font-size: 18px; line-height: 28px; color: white; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; max-width: 780px; }
  body header .info .btns a { border-radius: 24px; }
  body header .info h1 { font-size: 28px; color: white; }
  body header .video iframe { height: 800px; }
  body main .section { -ms-grid-columns: 1fr 1fr; grid-template-columns: 1fr 1fr; border-top: none; padding-bottom: 0; }
  body main .section .info { padding-right: 45px; max-width: 575px; }
  body main .section.klinik .pic { display: inherit; }
  body main .section.tipolim .tips { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; -webkit-column-gap: 15px; column-gap: 15px; }
  body main .section.tipolim .tips .tip .text { left: auto; right: 0; text-align: right; }
  body main .section.tipolim .tips .tip .text p { font-size: 36px; font-weight: 700; }
  body main .section.tipolim .tips .tip .text .info { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }
  body main .section.tipolim .tips .tip .text .info p { font-size: 16px; font-weight: 400; line-height: 22px; }
  body main .section.about { padding: 45px 0; }
  body main .section.about .text { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; max-width: 575px; }
  body main .section.about .text p { margin-bottom: 5px; }
  body main .section.about .pic { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; }
  body main .section.about .pic img { max-width: 360px; border-radius: 50%; display: block; margin: 0 auto; }
  body main .section.social { border-top: solid #333333 1px; }
  body main .section.social .text p { font-size: 28px; font-weight: 700; color: #333333; }
  body main .section.social .icons { -ms-grid-column-align: start; justify-self: start; }
  body main .section.social .icons a img { width: 45px; }
  body main .section.social .icons a:hover img { opacity: 0.75; }
  body main .text p { line-height: 28px; font-size: 18px; }
  body footer.section { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; padding-bottom: 0; }
  body footer .textblock { border-left: solid #333333 1px; }
  body footer .textblock ul li a { font-size: 18px; line-height: 28px; color: #333333; }
  body footer .logoblock { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
  body footer .logoblock .logo { margin-right: 15px; }
  body footer .logoblock .logo a img { width: 150px; }
  body .rights .rightline p { font-size: 14px; }
  .contact-section { border-top: none; } }