:root { --mask:#0c3b33; --mask-2:#135045; --gold:#e2a93b; --gold-deep:#b9842a; --gold-ink:#2d2000; --bg:#edf0ed; --panel:#fbfcfa; --ink:#14211d; --muted:#566560; --line:#d8dfda; --ok:#1e9e62; --danger:#c2372f; --font:"IBM Plex Sans Hebrew","Segoe UI",Arial,sans-serif; --mono:"IBM Plex Mono",ui-monospace,monospace; }
* { box-sizing: border-box; }
body { margin: 0; font-family: var(--font); background: var(--bg); color: var(--ink); line-height: 1.55; -webkit-font-smoothing: antialiased; }
.wrap { max-width: 560px; margin: 0 auto; padding: 0 16px 48px; }
.hd { background: var(--mask); color: #fff; padding: 22px 16px 54px; margin-bottom: -34px; background-image: radial-gradient(circle at 1px 1px, rgba(255,255,255,.07) 1px, transparent 0); background-size: 14px 14px; }
.hd .in { max-width: 560px; margin: 0 auto; }
.hd b { font-size: 17px; font-weight: 600; } .hd small { display: block; color: #9fc4b9; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 18px; box-shadow: 0 6px 18px -10px rgba(12,59,51,.3); margin-bottom: 14px; }
h1 { font-size: 20px; margin: 0 0 4px; font-weight: 600; } h2 { font-size: 15px; margin: 0 0 10px; }
.muted { color: var(--muted); } .mono { font-family: var(--mono); }
label { display: block; font-size: 13px; font-weight: 500; color: var(--muted); margin-bottom: 4px; }
input { width: 100%; padding: 12px; border: 1px solid #c5cfc9; border-radius: 8px; font: inherit; background: #fff; min-height: 46px; }
input:focus-visible, button:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.f { display: grid; gap: 12px; }
.btn { border: 1px solid var(--gold-deep); background: var(--gold); color: var(--gold-ink); font: inherit; font-weight: 600; border-radius: 10px; padding: 12px 16px; min-height: 48px; cursor: pointer; width: 100%; }
.btn.alt { background: var(--panel); border-color: #c5cfc9; color: var(--ink); font-weight: 500; }
.btn[disabled] { opacity: .55; }
.err { color: var(--danger); min-height: 20px; font-size: 14px; }
.status { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-bottom: 14px; }
.status h1 { font-size: 18px; white-space: nowrap; direction: ltr; }
.badge { padding: 3px 12px; border-radius: 20px; background: var(--mask); color: #fff; font-weight: 600; font-size: 14px; }
.prog { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; margin: 6px 0 4px; }
.prog i { height: 6px; border-radius: 3px; background: var(--line); } .prog i.on { background: var(--gold); }
.prog-l { display: grid; grid-template-columns: repeat(5, 1fr); font-size: 11.5px; color: var(--muted); text-align: center; }
.prog-l span.on { color: var(--ink); font-weight: 600; }
dl { display: grid; grid-template-columns: 96px 1fr; gap: 6px 10px; margin: 0; font-size: 14.5px; } dt { color: var(--muted); } dd { margin: 0; }
.tl { list-style: none; margin: 0; padding: 0; position: relative; } .tl::before { content: ""; position: absolute; inset-block: 6px; inset-inline-start: 5px; width: 2px; background: var(--line); }
.tl li { position: relative; padding: 0 22px 12px 0; padding-inline: 22px 0; } .tl li::before { content: ""; position: absolute; inset-inline-start: 0; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--gold); border: 2px solid var(--gold-deep); }
.tl small { color: var(--muted); display: block; }
.quote { border: 2px solid var(--gold); background: #fff8e6; }
.quote .amt { font-size: 30px; font-weight: 500; }
.row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.done { text-align: center; padding: 8px 0; font-weight: 600; }
a { color: inherit; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
/* v2.13: דוח תיקון */
.rep h2 { display: flex; align-items: center; gap: 8px; }
.rep .done-txt { white-space: pre-wrap; margin: 0 0 10px; }
.rep ul.parts { margin: 0 0 10px; padding-inline-start: 18px; }
.rep .ba { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 8px; }
.rep .ba figure { margin: 0; } .rep .ba figcaption { font-size: 12.5px; color: var(--muted); margin-bottom: 4px; font-weight: 600; }
.rep .ba img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 10px; border: 1px solid var(--line); background: #e6ebe7; display: block; }
.rep .warr { margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: #e8f5ee; color: #0f5a38; font-weight: 600; }
.noprint {}
@media print { body { background: #fff; } .hd { background: #fff !important; color: #000; margin: 0; padding: 8px 0; } .hd small { color: #444; } .noprint, .prog, .prog-l, .tl, .quote { display: none !important; } .card { box-shadow: none; break-inside: avoid; } }
/* v2.13: קביעת תור */
.days { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 8px; margin: 0 -2px; scroll-snap-type: x proximity; }
.days button { flex: 0 0 auto; min-width: 66px; border: 1px solid #c5cfc9; background: #fff; border-radius: 12px; padding: 8px 6px; font: inherit; cursor: pointer; text-align: center; scroll-snap-align: start; min-height: 58px; }
.days button b { display: block; font-size: 18px; font-weight: 600; } .days button span { font-size: 12px; color: var(--muted); }
.days button[aria-pressed="true"] { background: var(--mask); color: #fff; border-color: var(--mask); } .days button[aria-pressed="true"] span { color: #bcd8cf; }
.days button[disabled] { opacity: .4; cursor: not-allowed; }
.slots { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.slots button { border: 1px solid #c5cfc9; background: #fff; border-radius: 10px; padding: 10px 0; font: inherit; font-family: var(--mono); cursor: pointer; min-height: 46px; }
.slots button[aria-pressed="true"] { background: var(--gold); border-color: var(--gold-deep); font-weight: 700; }
.opts { display: flex; flex-wrap: wrap; gap: 8px; }
.opts button { border: 1px solid #c5cfc9; background: #fff; border-radius: 20px; padding: 8px 14px; font: inherit; cursor: pointer; min-height: 40px; }
.opts button[aria-pressed="true"] { background: var(--mask); color: #fff; border-color: var(--mask); }
textarea { width: 100%; padding: 12px; border: 1px solid #c5cfc9; border-radius: 8px; font: inherit; background: #fff; min-height: 80px; resize: vertical; }
.hp { position: absolute; inset-inline-start: -9999px; width: 1px; height: 1px; overflow: hidden; }
.okbox { text-align: center; } .okbox .big { font-size: 40px; line-height: 1; margin-bottom: 6px; }
@media (max-width: 380px) { .slots { grid-template-columns: repeat(3, 1fr); } }
.f { grid-template-columns: minmax(0, 1fr); } .f > * { min-width: 0; }

/* v2.15: עמוד לקוח */
.hero{max-width:560px;margin:-4px auto 0;padding:0 16px 22px;color:#fff;position:relative;z-index:1} .hero h1{font-size:25px;line-height:1.25;color:#fff;margin:0 0 6px} .hero p{margin:0 0 10px;color:#cfe5dd}
.trust{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:#e2a93b;font-weight:600}
.tabs{display:flex;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:5px;margin-bottom:14px;box-shadow:0 6px 18px -12px rgba(12,59,51,.4)}
.tabs button{flex:1;border:0;background:none;font:inherit;padding:11px 6px;border-radius:10px;cursor:pointer;font-weight:600;color:var(--muted);min-height:44px}
.tabs button[aria-pressed=true]{background:var(--mask);color:#fff} .tabs i{font-style:normal;background:var(--gold);color:var(--gold-ink);border-radius:10px;padding:0 7px;font-size:12px;margin-inline-start:4px}
.promo{position:relative;background:linear-gradient(135deg,#0c3b33,#135045);color:#fff;border-radius:16px;padding:20px 18px 16px;margin-bottom:12px;overflow:hidden}
.promo h3{margin:6px 0 4px;font-size:19px} .promo p{margin:0 0 8px;color:#cfe5dd} .promo small{display:block;color:#9fc4b9;margin:6px 0 10px}
.pbadge{position:absolute;inset-block-start:12px;inset-inline-end:12px;background:var(--gold);color:var(--gold-ink);font-weight:700;font-size:12px;padding:3px 10px;border-radius:20px}
.pprice{display:flex;align-items:baseline;gap:10px;margin:8px 0 2px} .pprice b{font-size:28px;color:var(--gold)} .pprice s{opacity:.6}
.promo .btn{width:100%}
.pchosen{background:#fff8e6;border:1px dashed var(--gold-deep);border-radius:10px;padding:9px 12px;font-size:14px} .pchosen button{border:0;background:none;text-decoration:underline;cursor:pointer;font:inherit;color:var(--muted)}
.svc{display:grid;grid-template-columns:1fr 1fr;gap:8px} .svc button{border:1px solid #c5cfc9;background:#fff;border-radius:12px;padding:12px 10px;font:inherit;cursor:pointer;text-align:start;display:grid;gap:2px;min-height:64px}
.svc button span{font-size:12.5px;color:var(--muted)} .svc button[aria-pressed=true]{border-color:var(--mask);box-shadow:inset 0 0 0 2px var(--mask);background:#eef6f3}
.hd.tall{padding-bottom:78px}.hd.tall .hero{padding:12px 0 0;margin:0}
.promo .pimg{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;margin-bottom:10px}
.pstrip{margin:0 0 14px}.pst-h{display:flex;justify-content:space-between;align-items:baseline;margin:0 2px 8px}.pst-h a{font-size:14px}
.pst-row{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:6px}
.pst-row .sc{flex:0 0 150px;scroll-snap-align:start;text-align:start;border:1px solid var(--line,#ddd);background:#fff;border-radius:12px;padding:0 0 10px;cursor:pointer;display:grid;gap:4px;font:inherit;color:inherit;overflow:hidden}
.pst-row .sc img,.pst-row .sc .ph{width:100%;aspect-ratio:4/3;object-fit:cover;background:#e9efe9;display:block}
.pst-row .sc b{padding:0 10px;font-size:14px;line-height:1.3}.pst-row .sc .sp{padding:0 10px;font-weight:600}
.pbody{margin:6px 0}.pbody summary{cursor:pointer;color:inherit;text-decoration:underline}.pbody p{white-space:pre-line;margin:6px 0}

/* v2.20: דירוג */
.rate h2 { text-align: center; }
.rate .stars { display: flex; justify-content: center; gap: 6px; font-size: 40px; line-height: 1; margin: 8px 0 12px; }
.rate .stars.done { font-size: 30px; color: #e0a32e; }
.rate .st { background: none; border: 0; padding: 2px 4px; color: #c9d3d0; cursor: pointer; font-size: inherit; line-height: 1; min-width: 44px; min-height: 44px; }
.rate .st.on { color: #e0a32e; }
.rate .st:focus-visible { outline: 2px solid #0d6b5c; outline-offset: 2px; border-radius: 6px; }
.rate textarea { width: 100%; box-sizing: border-box; border: 1px solid #c9d3d0; border-radius: 10px; padding: 10px; font: inherit; margin-bottom: 8px; background: transparent; color: inherit; }
.my-row { display: grid; gap: 6px; padding: 12px 0; border-top: 1px solid rgba(127,127,127,.25); }
.my-row:first-child { border-top: 0; }
.my-row .top { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.chipw { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 13px; background: #def5e8; color: #12633f; }
.chipw.off { background: rgba(127,127,127,.2); color: inherit; }
.code-in { font-size: 28px; letter-spacing: .4em; text-align: center; }
.rate a.btn { text-decoration: none; display: inline-block; }
.wrap a.btn { text-decoration: none; }
