/* Ben Hamo — polish override layer (loaded after the compiled stylesheet).
   Rules: no new colours, no new fonts, motion = transform/opacity only,
   static / reduced-motion settle everything immediately. */

:root{
  --pl-ease:cubic-bezier(.2,.7,.25,1);
  --pl-shadow-photo:0 1px 1px rgba(21,12,18,.18),0 10px 18px -8px rgba(21,12,18,.30),0 30px 50px -24px rgba(21,12,18,.38);
  --pl-focus-halo:0 0 0 2px var(--ink);
}

/* ---------- Typography ---------- */
h1,h2,h3,.scene-title,.shop-heading,.visit-heading,.hero-subtitle,.fresh-heading h2,.basket-heading h2{text-wrap:balance}
p,li,figcaption{text-wrap:pretty}
html body :is(.scene-body,.basket-heading p,.basket-availability,.fresh-heading p,.shop-after p,.site-footer>p,.hero-subtitle,.hero-eyebrow,.basket-count){line-height:1.75}
html body :is(.scene-body,.basket-availability,.fresh-heading p:last-child){font-size:max(16px,1em)}
/* Hebrew never takes tracking; Latin caption keeps its own */
html body :is(.hero-eyebrow,.film-caption,.section-topline,.photo-label,.scroll-cue){letter-spacing:0}
.film-corner span:first-child{direction:ltr;unicode-bidi:isolate;letter-spacing:.06em}

/* Minimum readable sizes (captions 13px, small text 13px+) */
html body :is(.walk-bottom,.scroll-cue,.walk-location,.photo-label,.collage-second figcaption,.visit-photo figcaption,.stepper-unit,.basket-preview-hint,.basket-field small,.basket-count,.site-footer>p,.film-caption,.film-corner,.film-corner span,.film-corner span:first-child,.section-topline,.weekly-hours caption,.hours-status,.hero-note,.basket-feedback){font-size:13px}
html body :is(.motion-controls a,.motion-controls button,.basket-review,.copy-number,.basket-clear,.nav-links a,.header-phone,.site-footer a){font-size:14px}
html body :is(.hero-eyebrow){font-size:max(14px,1em)}
@media(max-width:640px){
  html body .hero-eyebrow{font-size:14px}
  html body :is(.walk-bottom,.scroll-cue){font-size:13px}
  html body .stepper-unit{font-size:13px;color:#463b3f}
  html body .basket-field small,html body .basket-field input::placeholder,html body .basket-field textarea::placeholder{color:#4f4119}
}
html body .stepper-unit{color:#463b3f}

/* ---------- 44px targets ---------- */
.header-brand{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
.nav-links a{display:inline-flex;align-items:center;min-height:44px;padding-block:0;padding-inline:8px}
.nav-links a:after{inset:auto 8px 8px}
.header-phone{min-height:44px;padding-inline:4px}
.text-link{display:inline-flex;align-items:center;min-height:44px;padding-block:6px}
.shop-after a{display:inline-grid;place-items:center;min-width:44px;min-height:44px}
.site-footer a{display:inline-flex;align-items:center;min-height:44px;padding-inline:6px}
.basket-field input,.basket-field textarea{min-height:44px}
.basket-review{display:inline-flex;align-items:center;min-height:44px;padding-inline:4px}
.basket-clear{min-height:44px;min-width:44px;padding-inline:10px}
.copy-number{min-height:44px;min-width:44px}
html body .scene-cta{min-height:44px}
html body .contact-dock a{min-height:48px}
.basket-tab{min-height:56px;min-width:44px}
.basket-preview{min-height:44px}

/* ---------- Focus (visible on every surface) ---------- */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex="0"]:focus-visible{
  outline:3px solid var(--lemon);outline-offset:4px;box-shadow:var(--pl-focus-halo)
}
.shop-section :focus-visible,.basket-section :focus-visible,.fresh-gallery :focus-visible{outline-color:var(--plum);box-shadow:0 0 0 2px var(--white)}
.basket-order :focus-visible{outline-color:var(--ink)}
.skip-link:focus-visible{outline:3px solid var(--ink);outline-offset:2px}

/* ---------- Depth ---------- */
.collage-main{box-shadow:var(--pl-shadow-photo)}
.collage-second{box-shadow:var(--pl-shadow-photo)}
.visit-photo{box-shadow:0 2px 2px rgba(0,0,0,.25),0 16px 30px -10px rgba(0,0,0,.5),0 40px 70px -30px rgba(0,0,0,.6)}
.fresh-grid img{box-shadow:var(--pl-shadow-photo)}
.fresh-grid figure{transition:transform .45s var(--pl-ease)}
.fresh-grid figure:hover{transform:translateY(-4px)}
.fresh-grid figcaption{line-height:1.6}
.story-copy:before{content:"";position:absolute;inset:-12% -8% -12% -30%;background:radial-gradient(60% 55% at 70% 50%,rgba(62,19,48,.55),transparent 72%);z-index:-1;pointer-events:none}
.product-row.is-selected{background:linear-gradient(90deg,transparent,rgba(62,19,48,.07) 40%,transparent)}
.stepper button:hover{background:var(--lemon);border-color:var(--ink)}
.stepper button:disabled:hover{background:transparent}
.outline-button:hover{background:rgba(244,208,63,.1)}
.basket-send:hover{background:#1c7c4b}
.contact-dock{box-shadow:0 10px 36px rgba(0,0,0,.45),0 1px 0 rgba(246,241,231,.08) inset}
.site-header{background:linear-gradient(180deg,rgba(21,12,18,.55),transparent)}

/* ---------- Short landscape: opening controls + CTAs fully in the first viewport ---------- */
@media (orientation:landscape) and (max-height:520px){
  html body .walk-stage{min-height:0}
  html body .stage-grid{padding-top:calc(var(--header) + 4px);padding-bottom:124px;align-items:center}
  html body .story-copy{height:auto;min-height:0}
  html body .story-beat{justify-content:center}
  html body .cinema{height:calc(var(--stage-height,390px) - var(--header) - 190px);min-height:110px}
  html body .motion-controls{top:auto;bottom:calc(64px + env(safe-area-inset-bottom,0px));inset-inline-end:var(--gutter);inset-inline-start:auto}
  html body .motion-controls button{display:inline-flex}
  html body .walk-bottom{bottom:calc(112px + env(safe-area-inset-bottom,0px));justify-content:center}
  html body .hero-eyebrow{margin-bottom:2px;line-height:1.4}
  html body .hero-title{flex-direction:row;gap:.18em;font-size:clamp(52px,15vh,84px);line-height:.95;padding-block:0}
  html body .hero-title span:nth-child(2){margin-inline-start:0}
  html body .hero-subtitle{display:flex;flex-wrap:wrap;gap:0 14px;margin-top:6px;max-width:none;line-height:1.5}
  html body .hero-subtitle>span,html body .hero-subtitle>span:first-child{font-size:14px}
  html body .hero-bottom{margin-top:8px;gap:20px}
  html body .hero-bottom .scene-cta,html body .hero-bottom .text-link,html body .scene-cta,html body .text-link{font-size:14px;min-height:44px}
  html body .hero-bottom .scene-cta{padding:8px 16px;margin-top:0}
  html body .contact-dock a{min-height:44px}
}

/* ---------- Progressive scroll reveals (JS adds .pl-r; content visible without JS) ---------- */
.pl-r{opacity:0;transform:translateY(20px);will-change:opacity,transform}
.pl-r.pl-in{opacity:1;transform:none;transition:opacity .6s var(--pl-ease),transform .7s var(--pl-ease)}
.pl-r.pl-in.pl-done{will-change:auto}
.pl-o{opacity:0}
.pl-o.pl-in{opacity:1;transition:opacity .7s var(--pl-ease)}

/* ---------- Static choice + reduced motion: everything settles immediately ---------- */
html.static-motion,html.static-motion *{scroll-behavior:auto!important}
html.static-motion :not(.hours-status):not(.hours-status *),
html.static-motion :not(.hours-status):not(.hours-status *)::before,
html.static-motion :not(.hours-status):not(.hours-status *)::after{transition:none!important;animation:none!important}
html.static-motion .pl-r,html.static-motion .pl-r.pl-in{opacity:1!important;transform:none!important}
html.static-motion .pl-o,html.static-motion .pl-o.pl-in{opacity:1!important}
html.static-motion .fresh-grid figure:hover{transform:none}
@media (prefers-reduced-motion:reduce){
  html,html *{scroll-behavior:auto!important}
  .pl-r,.pl-r.pl-in{opacity:1!important;transform:none!important;transition:none!important}
  .pl-o,.pl-o.pl-in{opacity:1!important;transition:none!important}
  .fresh-grid figure,.fresh-grid figure:hover{transition:none;transform:none}
}
@media print{.pl-r{opacity:1!important;transform:none!important}.pl-o{opacity:1!important}.contact-dock,.motion-controls{display:none!important}}

/* Reviewed authentic entrance crop: avoid intrinsic height stretching narrow cards. */
html body .visit-photo img { height: auto; aspect-ratio: 3 / 4; object-fit: cover; }

/* Short gesture-led opening: native content scroll resumes immediately after exit. */
.walk{height:calc(var(--stage-height,700px) + 120px)}
.static-motion .walk{height:auto}
@media(prefers-reduced-motion:reduce){.walk{height:auto}}

/* Photo progress is readable without moving or scaling either photograph. */
.scene-tick,.scene-tick.active{position:relative;background:var(--line);overflow:hidden;transition:none}
.scene-tick::after{content:"";position:absolute;inset:0;background:var(--lemon);transform:scaleX(var(--tick-fill,0));transform-origin:left;transition:none}
.photo-opening{transform:none!important;will-change:auto}
.scroll-cue{max-width:13em;line-height:1.45}
@media(prefers-reduced-motion:reduce){.scene-tick::after{transform:none}}

/* Scroll Craft market threshold: stable heading, two short paced lines.
   Only text moves. Existing observer owns .pl-in; no new scrolling span. */
.shop-heading.pl-r{opacity:1;transform:none;will-change:auto}
.shop-heading.pl-r > span{opacity:0;transform:translateY(12px);clip-path:inset(0 0 100% 0)}
.shop-heading.pl-in > span{opacity:1;transform:none;clip-path:inset(0);transition:opacity .4s var(--pl-ease),transform .5s var(--pl-ease),clip-path .5s var(--pl-ease)}
.shop-heading.pl-in > span + span{transition-delay:60ms}
.pl-instant,.shop-heading.pl-instant > span{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
html.static-motion .shop-heading > span{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){.shop-heading > span{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}}
@media print{.shop-heading > span{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}}