/* ============================================================
   פוטוגני סנטר 1 · מערכת עיצוב משותפת לכל עמודי האתר
   הצבעים נלקחו מהמותג הקיים: קרם #EFE0CC, זהב #FFBF00,
   טקסט #333, פונט Assistant.
   שינוי כאן משנה את כל האתר.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Assistant:wght@400;600;700;800&display=swap');

:root{
  /* מותג */
  --cream:#efe0cc; --cream-l:#f7efe3; --cream-xl:#fbf7f1;
  --gold:#ffbf00; --gold-d:#e5a800; --gold-l:#fff4d1;
  --tan:#d2b48c; --tan-d:#b9975f;
  --ink:#2b2b2b; --ink-2:#5c5751; --ink-3:#8d867e;
  --line:#e6dccd; --line-2:#efe7db;
  --dark:#2a231a; --dark-2:#3d3327;
  --bg:#fff; --wa:#25d366; --ok:#16a34a;
  --r:14px; --r-l:22px;
  --sh-s:0 1px 2px rgba(43,43,43,.05), 0 4px 12px -6px rgba(43,43,43,.14);
  --sh:0 2px 4px rgba(43,43,43,.05), 0 12px 32px -14px rgba(43,43,43,.26);
  --sh-l:0 30px 70px -30px rgba(0,0,0,.55);
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; direction:rtl; background:var(--bg); color:var(--ink);
  font-family:Assistant,system-ui,"Segoe UI",Arial,"Arial Hebrew",sans-serif;
  font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{margin:0; line-height:1.2; letter-spacing:-.02em; font-weight:800}
p{margin:0}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}
.wrap{max-width:var(--max); margin:0 auto; padding:0 24px}
.hide{display:none !important}
/* מספרים וטווחי שעות — מונע היפוך של "20+" ו-"10:00-21:00" בתוך טקסט עברי */
.ltr{direction:ltr; display:inline-block; unicode-bidi:isolate}

/* ---------- טיפוגרפיה ---------- */
.h1{font-size:clamp(30px,5vw,52px)}
.h2{font-size:clamp(24px,3.4vw,36px)}
.h3{font-size:clamp(18px,2vw,22px)}
.lead{font-size:clamp(16px,1.8vw,19px); color:var(--ink-2); line-height:1.75}
.muted{color:var(--ink-2)}
.eyebrow{display:inline-block; font-size:13px; font-weight:800; letter-spacing:.06em;
  color:#7a5c00; background:var(--gold-l); padding:6px 14px; border-radius:99px; margin-bottom:16px}
.eyebrow.warm{color:#5c4a2e; background:#f0e3d0}

/* ---------- כפתורים ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border:0; border-radius:12px; padding:14px 26px; font:inherit; font-size:16px; font-weight:700;
  cursor:pointer; transition:.18s; white-space:nowrap}
.btn-p{background:var(--gold); color:#2b2b2b; box-shadow:0 10px 24px -12px rgba(229,168,0,.95)}
.btn-p:hover{background:var(--gold-d); transform:translateY(-1px)}
.btn-wa{background:var(--wa); color:#fff; box-shadow:0 10px 24px -12px rgba(37,211,102,.9)}
.btn-wa:hover{background:#1fb457; transform:translateY(-1px)}
.btn-o{background:#fff; color:var(--ink); border:1.5px solid var(--line)}
.btn-o:hover{border-color:var(--gold-d); color:#8a6800}
.btn-gh{background:rgba(255,255,255,.14); color:#fff; border:1.5px solid rgba(255,255,255,.32)}
.btn-gh:hover{background:rgba(255,255,255,.24)}
.btn-sm{padding:10px 18px; font-size:14.5px}

/* ---------- הדר ---------- */
.hdr{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.92);
  backdrop-filter:blur(14px); border-bottom:1px solid var(--line)}
.hdr .wrap{display:flex; align-items:center; gap:20px; height:74px}
.logo{display:flex; align-items:center; gap:10px; font-weight:800; font-size:18px; flex:none}
.logo .mark{width:38px; height:38px; border-radius:11px; flex:none;
  background:linear-gradient(145deg,var(--gold),#ffd85e); color:#4a3800;
  display:grid; place-items:center; font-size:18px}
.logo small{display:block; font-size:11px; font-weight:600; color:var(--ink-3); letter-spacing:.02em}
.logo img.brandimg{height:46px; width:auto}
.nav{display:flex; gap:2px; margin-inline-start:auto}
.nav a{padding:9px 12px; border-radius:9px; font-size:15px; font-weight:600; color:var(--ink-2); transition:.15s}
.nav a:hover{background:var(--cream-l); color:var(--ink)}
.nav a.on{color:#7a5c00; background:var(--gold-l)}
.hdr .btn{flex:none}
.burger{display:none; width:42px; height:42px; border:1px solid var(--line); background:#fff;
  border-radius:11px; font-size:19px; cursor:pointer; margin-inline-start:auto}
@media(max-width:1040px){
  .nav{position:fixed; inset:74px 0 auto; background:#fff; flex-direction:column; gap:0;
    padding:12px 16px 20px; border-bottom:1px solid var(--line); box-shadow:var(--sh); display:none}
  .nav.open{display:flex}
  .nav a{padding:13px 12px; font-size:16px}
  .burger{display:block}
  .hdr .btn-hdr{display:none}
}

/* ---------- מקטעים ---------- */
.sec{padding:clamp(56px,8vw,96px) 0}
.sec.soft{background:var(--cream-xl)}
.sec.cream{background:var(--cream)}
.sec-head{max-width:680px; margin:0 auto clamp(32px,5vw,52px); text-align:center}
.sec-head p{margin-top:14px}

/* ---------- הירו ---------- */
.hero{background:linear-gradient(160deg,#221c14 0%,#332a1e 55%,#463823 100%); color:#fff;
  position:relative; overflow:hidden}
.hero::after{content:""; position:absolute; inset-block-start:-32%; inset-inline-start:-12%;
  width:62%; aspect-ratio:1; border-radius:50%; background:rgba(255,191,0,.09)}
.hero .wrap{position:relative; z-index:1; padding-block:clamp(56px,9vw,104px)}
.hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:center}
.hero p.lead{color:#e3d8c6}
.hero .eyebrow{background:rgba(255,191,0,.18); color:var(--gold)}
.hero-cta{display:flex; gap:12px; flex-wrap:wrap; margin-top:32px}
.hero-trust{display:flex; gap:22px; flex-wrap:wrap; margin-top:36px; padding-top:26px;
  border-top:1px solid rgba(255,255,255,.18); font-size:14.5px; color:#d8cbb6}
.hero-trust span{display:flex; align-items:center; gap:7px}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr; gap:36px}}

.glass{background:rgba(255,255,255,.09); border:1px solid rgba(255,191,0,.24);
  border-radius:var(--r-l); padding:26px; backdrop-filter:blur(10px); box-shadow:var(--sh-l)}
.glass h3{font-size:19px; margin-bottom:6px}
.glass .steps{list-style:none; margin:20px 0 0; padding:0; display:grid; gap:14px}
.glass .steps li{display:flex; gap:13px; align-items:flex-start; font-size:15px; color:#e8dfd0}
.glass .steps b{width:26px; height:26px; border-radius:8px; background:var(--gold); color:#3a2c00;
  display:grid; place-items:center; font-size:13px; flex:none; font-weight:800}

/* ---------- כרטיסים ---------- */
.grid{display:grid; gap:18px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.g2,.g3,.g4{grid-template-columns:1fr}}

.card{background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:24px; box-shadow:var(--sh-s)}
.card h3{font-size:18px; margin-bottom:8px}
.card p{font-size:15px; color:var(--ink-2)}

/* אריחי קטגוריות — להחלפה בתמונות אמיתיות: ראו הערה ב-README */
.tile{display:block; background:#fff; border:1px solid var(--line); border-radius:var(--r);
  overflow:hidden; transition:.2s; box-shadow:var(--sh-s)}
.tile:hover{transform:translateY(-3px); box-shadow:var(--sh); border-color:var(--tan)}
.tile-img{aspect-ratio:4/3; display:grid; place-items:center; font-size:clamp(40px,7vw,58px);
  background:linear-gradient(150deg,var(--cream-xl),var(--cream)); position:relative;
  background-size:cover; background-position:center}
/* בעמודה אחת האריח מתקצר, אחרת נוצר שטח ריק גדול מדי */
@media(max-width:560px){.tile-img{aspect-ratio:16/9}}
.tile:nth-child(3n) .tile-img{background:linear-gradient(150deg,#fdf6e3,var(--gold-l))}
.tile:nth-child(4n) .tile-img{background:linear-gradient(150deg,#faf4ea,#ecdcc4)}
.tile-b{padding:14px 16px}
.tile-b b{display:block; font-size:15.5px; font-weight:700}
.tile-b span{font-size:13px; color:var(--ink-3)}

/* ---------- שלבים ---------- */
.steps-grid{counter-reset:s; display:grid; gap:20px; grid-template-columns:repeat(5,1fr)}
@media(max-width:1000px){.steps-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.steps-grid{grid-template-columns:1fr}}
.step-c{position:relative; background:#fff; border:1px solid var(--line);
  border-radius:var(--r); padding:26px 20px 22px; box-shadow:var(--sh-s)}
.step-c::before{counter-increment:s; content:counter(s);
  position:absolute; inset-block-start:-15px; inset-inline-start:20px;
  width:32px; height:32px; border-radius:10px; background:var(--gold); color:#3a2c00;
  display:grid; place-items:center; font-weight:800; font-size:15px;
  box-shadow:0 6px 14px -6px rgba(229,168,0,.95)}
.step-c h3{font-size:16.5px; margin:6px 0 7px}
.step-c p{font-size:14.5px; color:var(--ink-2)}

/* ---------- באנר הבודק ---------- */
.promo{background:linear-gradient(150deg,var(--dark),var(--dark-2)); color:#fff;
  border-radius:var(--r-l); padding:clamp(30px,5vw,52px); display:grid;
  grid-template-columns:1.2fr .8fr; gap:36px; align-items:center; overflow:hidden}
.promo p{color:#d5c9b6; margin-top:12px}
.promo .mini{background:rgba(255,255,255,.06); border:1px solid rgba(255,191,0,.2);
  border-radius:var(--r); padding:18px}
.promo .mini div{display:flex; align-items:center; gap:10px; padding:9px 0; font-size:14.5px; color:#e5dbc9}
.promo .mini div+div{border-top:1px solid rgba(255,255,255,.09)}
@media(max-width:820px){.promo{grid-template-columns:1fr}}

/* ---------- המלצות ---------- */
.quote{background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:24px;
  box-shadow:var(--sh-s); display:flex; flex-direction:column; gap:14px; height:100%}
.quote .stars{color:var(--gold-d); font-size:15px; letter-spacing:2px}
.quote p{font-size:15px; color:var(--ink-2); line-height:1.75; flex:1}
.quote .who{display:flex; align-items:center; gap:11px; padding-top:14px; border-top:1px solid var(--line)}
.quote .av{width:38px; height:38px; border-radius:50%; background:var(--gold-l); color:#7a5c00;
  display:grid; place-items:center; font-weight:800; font-size:15px; flex:none}
.quote .who b{display:block; font-size:14.5px}
.quote .who span{font-size:12.5px; color:var(--ink-3)}

/* ---------- שאלות ותשובות ---------- */
.faq{max-width:820px; margin:0 auto; display:grid; gap:12px}
.faq details{background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
.faq details[open]{border-color:var(--tan); box-shadow:var(--sh-s)}
.faq summary{padding:19px 22px; font-weight:700; font-size:16.5px; cursor:pointer;
  list-style:none; display:flex; align-items:center; gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; margin-inline-start:auto; color:var(--gold-d);
  font-size:22px; font-weight:400; transition:.2s; line-height:1}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .a{padding:0 22px 20px; color:var(--ink-2); font-size:15.5px}
.faq .a a{color:#8a6800; font-weight:600; text-decoration:underline}

/* ---------- פסי מידע ---------- */
.strip{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line);
  border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
@media(max-width:820px){.strip{grid-template-columns:repeat(2,1fr)}}
.strip div{background:#fff; padding:22px 20px; text-align:center}
.strip b{display:block; font-size:22px; font-weight:800; color:#8a6800}
.strip span{font-size:13.5px; color:var(--ink-2)}

/* ---------- קריאה לפעולה ---------- */
.cta{background:linear-gradient(150deg,var(--dark),var(--dark-2)); color:#fff;
  border-radius:var(--r-l); padding:clamp(34px,5vw,58px); text-align:center}
.cta p{color:#d5c9b6; margin:14px auto 0; max-width:520px}
.cta .btns{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:30px}

/* ---------- פוטר ---------- */
.ftr{background:var(--dark); color:#b0a595; padding:56px 0 28px; font-size:14.5px}
.ftr-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:36px}
@media(max-width:820px){.ftr-grid{grid-template-columns:1fr; gap:28px}}
.ftr h4{color:#fff; font-size:15px; margin-bottom:14px}
.ftr a{color:#b0a595; transition:.15s}
.ftr a:hover{color:var(--gold)}
.ftr ul{list-style:none; margin:0; padding:0; display:grid; gap:9px}
.ftr .logo{color:#fff; margin-bottom:14px}
.ftr .logo small{color:#8a7f6f}
.ftr-btm{margin-top:40px; padding-top:22px; border-top:1px solid #453a2b;
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; font-size:13px; color:#8a7f6f}

/* ---------- כפתור וואטסאפ צף ---------- */
.wa-float{position:fixed; inset-block-end:22px; inset-inline-start:22px; z-index:60;
  width:58px; height:58px; border-radius:50%; background:var(--wa); color:#fff;
  display:grid; place-items:center; font-size:29px; box-shadow:0 12px 30px -8px rgba(37,211,102,.8);
  transition:.2s}
.wa-float:hover{transform:scale(1.07)}

/* ---------- עמוד פנימי ---------- */
.phead{background:var(--cream); border-bottom:1px solid var(--line); padding:clamp(38px,6vw,68px) 0}
.phead .lead{margin-top:14px; max-width:640px; color:#5a5147}
.crumb{font-size:13.5px; color:#8b8073; margin-bottom:14px}
.crumb a:hover{color:#8a6800}
.prose{max-width:760px; margin:0 auto}
.prose h2{font-size:clamp(22px,3vw,30px); margin:44px 0 14px}
.prose h2:first-child{margin-top:0}
.prose p{margin-bottom:16px; color:var(--ink-2); font-size:16.5px; line-height:1.85}
.prose strong{color:var(--ink)}
.pull{background:var(--gold-l); border-inline-start:4px solid var(--gold);
  border-radius:0 var(--r) var(--r) 0; padding:22px 26px; margin:28px 0; font-size:17px; color:var(--ink)}

/* ---------- פרטי קשר ---------- */
.info{display:flex; gap:14px; align-items:flex-start; background:#fff;
  border:1px solid var(--line); border-radius:var(--r); padding:20px; box-shadow:var(--sh-s);
  transition:.18s}
.info:hover{border-color:var(--tan); transform:translateY(-2px)}
.info .ic{width:44px; height:44px; border-radius:12px; background:var(--gold-l); color:#8a6800;
  display:grid; place-items:center; font-size:19px; flex:none}
.info b{display:block; font-size:15.5px; margin-bottom:3px}
.info p, .info a{font-size:14.5px; color:var(--ink-2)}
.hours{list-style:none; margin:0; padding:0}
.hours li{display:flex; justify-content:space-between; padding:11px 0; font-size:15px; color:var(--ink-2)}
.hours li+li{border-top:1px solid var(--line)}
.hours b{color:var(--ink)}