@font-face{font-family:'Frank Ruhl Libre';font-style:normal;font-weight:500 900;font-display:swap;src:url(fonts/frank-hebrew.woff2) format('woff2');unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;}
@font-face{font-family:'Frank Ruhl Libre';font-style:normal;font-weight:500 900;font-display:swap;src:url(fonts/frank-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Heebo';font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/heebo-hebrew.woff2) format('woff2');unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;}
@font-face{font-family:'Heebo';font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/heebo-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
/* «המגזין» — Super Gluten Free's magazine. Brand green + gold (gold is a fill, never text on white), Frank Ruhl Libre for the
   editorial voice, Heebo for reading and UI, both served from our own host. Light + dark by prefers-color-scheme. RTL, logical props. */
:root{
  --page:#ffffff; --paper:#f2f6f2; --card:#ffffff; --rule:#dde5de; --tint:#e3eee5;
  --ink:#13221a; --ink2:#3d4b43; --ink3:#56645c; --deep:#005030; --mid:#0a6b3d; --link:#00663d;
  --gold:#f0c000; --gold-d:#c99a00; --on-gold:#1b2610; --band:#005030; --on-band:#ffffff;
  --sh:0 1px 2px rgba(10,40,24,.06), 0 8px 24px -12px rgba(10,40,24,.18); --shl:0 2px 4px rgba(10,40,24,.08), 0 22px 44px -18px rgba(10,40,24,.30);
  --r:18px; --ease:cubic-bezier(.2,.8,.2,1);
  --disp:'Frank Ruhl Libre', 'Times New Roman', serif; --text:'Heebo', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --page:#0e1712; --paper:#142019; --card:#16241c; --rule:#26372d; --tint:#1a2c22;
  --ink:#e7eee9; --ink2:#c3cec7; --ink3:#9fada5; --deep:#8fd9b0; --mid:#a9e5c4; --link:#9fe3bd;
  --band:#0b3d25; --on-band:#ffffff; --sh:0 1px 2px rgba(0,0,0,.4), 0 10px 26px -14px rgba(0,0,0,.7); --shl:0 2px 4px rgba(0,0,0,.45), 0 24px 46px -18px rgba(0,0,0,.8);
  color-scheme:dark; } }
:root[data-theme="dark"]{
  --page:#0e1712; --paper:#142019; --card:#16241c; --rule:#26372d; --tint:#1a2c22;
  --ink:#e7eee9; --ink2:#c3cec7; --ink3:#9fada5; --deep:#8fd9b0; --mid:#a9e5c4; --link:#9fe3bd;
  --band:#0b3d25; --on-band:#ffffff; --sh:0 1px 2px rgba(0,0,0,.4), 0 10px 26px -14px rgba(0,0,0,.7); --shl:0 2px 4px rgba(0,0,0,.45), 0 24px 46px -18px rgba(0,0,0,.8);
  color-scheme:dark; }

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-padding-top:76px; }
body{ margin:0; background:var(--page); color:var(--ink); font:400 18px/1.8 var(--text); -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img{ max-width:100%; display:block; }
a{ color:var(--link); text-underline-offset:3px; }
:focus-visible{ outline:3px solid var(--mid); outline-offset:3px; border-radius:6px; }
.vh{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip{ position:absolute; inset-inline-start:12px; top:-60px; z-index:50; background:var(--deep); color:#fff; padding:10px 16px; border-radius:10px; font-weight:800; text-decoration:none; }
.skip:focus{ top:10px; }

/* masthead */
.mast{ position:sticky; top:0; z-index:20; background:color-mix(in srgb, var(--page) 92%, transparent); backdrop-filter:saturate(1.4) blur(10px); -webkit-backdrop-filter:saturate(1.4) blur(10px); border-bottom:1px solid var(--rule); }
.mast-in{ max-width:1180px; margin:0 auto; padding:0 16px; height:64px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px; }
.plate{ justify-self:start; display:inline-flex; background:#fff; border-radius:10px; padding:4px 8px; box-shadow:0 0 0 1px var(--rule); }
.plate img{ width:auto; height:34px; }
.word{ font:900 28px/1 var(--disp); color:var(--ink); text-decoration:none; letter-spacing:-.01em; }
.tostore{ justify-self:end; display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:0 16px; border-radius:12px; background:var(--deep); color:#fff; font-weight:800; font-size:15px; text-decoration:none; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .tostore{ color:#0e1712; } }
:root[data-theme="dark"] .tostore{ color:#0e1712; }
.tostore:hover{ filter:brightness(1.08); }

/* the commercial-content label — visible at first view on every page */
.disclose{ margin:0; padding:8px 16px; background:var(--tint); color:var(--ink2); font-size:13.5px; line-height:1.5; text-align:center; display:flex; flex-wrap:wrap; justify-content:center; gap:4px 8px; }
.d-tag{ font-weight:800; color:var(--ink); }
.d-more{ color:var(--link); font-weight:700; }

/* article hero */
.hero{ max-width:1180px; margin:0 auto; padding:40px 16px 8px; display:grid; gap:28px; align-items:center; }
@media (min-width:980px){ .hero{ grid-template-columns:minmax(0,1fr) 460px; gap:56px; padding-top:64px; } .hero.wide{ grid-template-columns:minmax(0,1fr); } }
.hero-tx{ max-width:720px; }
.kick{ margin:0 0 14px; }
.kick a, .kick-s{ display:inline-block; font-size:13px; font-weight:800; letter-spacing:.06em; color:var(--deep); text-decoration:none; border:1.5px solid currentColor; border-radius:999px; padding:3px 12px; }
h1{ margin:0; font:900 clamp(34px, 5.4vw, 60px)/1.08 var(--disp); letter-spacing:-.015em; text-wrap:balance; color:var(--ink); }
.lede{ margin:18px 0 0; font-size:clamp(19px, 2.1vw, 22px); line-height:1.6; color:var(--ink2); max-width:40em; text-wrap:pretty; }
.byline{ margin:22px 0 0; display:flex; flex-wrap:wrap; gap:6px 18px; font-size:14px; color:var(--ink3); font-variant-numeric:tabular-nums; }
.byline span:first-child{ font-weight:800; color:var(--ink2); }
.cover{ margin:0; }
.cover img{ width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; border-radius:var(--r); background:var(--paper); box-shadow:var(--shl); }
.cover.wide img{ aspect-ratio:21/9; }
@media (max-width:979px){ .cover img{ aspect-ratio:4/3; } .cover.wide img{ aspect-ratio:16/9; } }
.cover figcaption{ margin-top:10px; font-size:13px; color:var(--ink3); line-height:1.5; }

/* reading column */
.col{ max-width:720px; margin:0 auto; padding:8px 16px 24px; }
.toc{ margin:28px 0 8px; padding:16px 18px; border:1px solid var(--rule); border-radius:var(--r); background:var(--card); }
.toc p{ margin:0 0 6px; font-size:13px; font-weight:800; letter-spacing:.06em; color:var(--ink3); }
.toc ol{ margin:0; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:6px 8px; }
.toc a{ display:inline-block; font-size:15px; line-height:1.4; font-weight:600; color:var(--ink); text-decoration:none; background:var(--paper); border-radius:999px; padding:6px 12px; }
.toc a:hover{ background:var(--tint); color:var(--deep); }
.col section{ margin-top:44px; }
.col h2{ margin:0 0 12px; font:700 clamp(26px, 3vw, 32px)/1.2 var(--disp); letter-spacing:-.01em; text-wrap:balance; color:var(--ink); }
.col p{ margin:0 0 16px; text-wrap:pretty; }
.col ul, .col ol{ margin:0 0 18px; padding-inline-start:0; list-style:none; }
.col section > ul > li, .rc-ing li{ position:relative; padding-inline-start:22px; margin:0 0 10px; }
.col section > ul > li::before, .rc-ing li::before{ content:""; position:absolute; inset-inline-start:2px; top:.72em; width:8px; height:8px; border-radius:50%; background:var(--deep); }
.tip{ margin:22px 0; padding:16px 20px 4px; background:var(--paper); border-radius:var(--r); }
.tip b{ display:block; margin-bottom:4px; font-size:13px; font-weight:800; letter-spacing:.08em; color:var(--deep); }
.tip p{ font-size:17px; }

/* product shelf — names + links only, never prices */
.shelf{ margin:22px 0 6px; }
.shelf-h{ margin:0 0 10px !important; font-size:13px; font-weight:800; letter-spacing:.06em; color:var(--ink3); }
.shelf-row{ display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:12px; }
@media (max-width:640px){ .shelf-row{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:10px; margin-inline:-16px; padding:2px 16px 10px; scrollbar-width:none; }
  .shelf-row::-webkit-scrollbar{ display:none; } .shelf-row > .pc{ flex:0 0 46%; scroll-snap-align:start; } }
.pc{ display:flex; flex-direction:column; background:var(--card); border:1px solid var(--rule); border-radius:16px; overflow:hidden; color:var(--ink); text-decoration:none; transition:box-shadow .25s var(--ease), transform .25s var(--ease); }
.pc:hover{ box-shadow:var(--sh); transform:translateY(-2px); }
.pc-im{ display:block; background:var(--paper); aspect-ratio:1/1; overflow:hidden; }
.pc-im img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.pc:hover .pc-im img{ transform:scale(1.04); }
.pc-tx{ display:flex; flex-direction:column; gap:6px; padding:10px 12px 12px; flex:1; }
.pc-tx b{ font-size:14px; font-weight:700; line-height:1.4; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.pc-tx i{ margin-top:auto; font-style:normal; font-size:13px; font-weight:800; color:var(--deep); }

/* recipe card */
.recipe{ margin-top:48px; padding:24px 20px 10px; border:1.5px solid var(--rule); border-radius:24px; background:var(--card); box-shadow:var(--sh); }
@media (min-width:720px){ .recipe{ padding:32px 32px 14px; } }
.rc-k{ display:inline-block; font-size:13px; font-weight:800; letter-spacing:.08em; color:var(--on-gold); background:var(--gold); border-radius:999px; padding:3px 12px; }
.recipe h2{ margin-top:10px !important; }
.rc-facts{ display:flex; flex-wrap:wrap; gap:10px; margin:6px 0 4px !important; }
.rc-facts li{ background:var(--paper); border-radius:12px; padding:6px 12px; font-size:15px; font-weight:700; }
.rc-facts li span{ display:block; font-size:12px; font-weight:700; color:var(--ink3); letter-spacing:.04em; }
.rc-cols{ display:grid; gap:8px 36px; margin-top:16px; }
@media (min-width:720px){ .rc-cols{ grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); } }
.recipe h3{ margin:8px 0 12px; font:800 15px/1.3 var(--text); letter-spacing:.06em; color:var(--ink3); }
.rc-ing li{ font-size:17px; }
.rc-steps ol{ counter-reset:st; }
.rc-steps li{ counter-increment:st; position:relative; padding-inline-start:44px; margin:0 0 16px; font-size:17px; }
.rc-steps li::before{ content:counter(st); position:absolute; inset-inline-start:0; top:2px; width:30px; height:30px; border-radius:50%; background:var(--deep); color:var(--page); font:800 15px/30px var(--text); text-align:center; font-variant-numeric:tabular-nums; }
.rc-note{ font-size:14.5px; color:var(--ink2); background:var(--tint); border-radius:12px; padding:10px 14px; }

/* «חשוב לדעת» — the disclaimer box */
.know{ margin:48px 0 8px; padding:20px 22px 8px; border:1.5px solid var(--ink3); border-radius:var(--r); background:var(--card); }
.know h2{ font:800 19px/1.3 var(--text) !important; letter-spacing:0 !important; margin:0 0 10px !important; }
.know ul{ margin:0 0 10px !important; }
.know li{ position:relative; padding-inline-start:20px; margin:0 0 8px; font-size:15.5px; line-height:1.65; color:var(--ink2); }
.know li::before{ content:""; position:absolute; inset-inline-start:2px; top:.7em; width:7px; height:7px; border-radius:2px; background:var(--ink3); }
.srcs{ margin-top:28px !important; }
.srcs h2{ font:800 17px/1.3 var(--text) !important; letter-spacing:0 !important; }
.srcs li{ margin:0 0 6px; font-size:16px; }

/* teasers (more + hub) */
.more{ background:var(--paper); margin-top:40px; }
.more-in{ max-width:1180px; margin:0 auto; padding:40px 16px 44px; }
.more h2, .hub h2.sec{ margin:0 0 18px; font:700 28px/1.2 var(--disp); }
.grid{ display:grid; gap:22px; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); }
.grid.three{ grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); }
.t{ display:flex; flex-direction:column; background:var(--card); border:1px solid var(--rule); border-radius:var(--r); overflow:hidden; color:var(--ink); text-decoration:none; transition:box-shadow .3s var(--ease), transform .3s var(--ease); }
.t[hidden]{ display:none; }
.t:hover{ box-shadow:var(--shl); transform:translateY(-3px); }
.t-im{ display:block; aspect-ratio:4/3; overflow:hidden; background:var(--paper); }
.t-im img{ width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease); }
.t:hover .t-im img{ transform:scale(1.035); }
.t-tx{ display:flex; flex-direction:column; gap:8px; padding:16px 18px 18px; flex:1; }
.t-k{ font-size:12.5px; font-weight:800; letter-spacing:.08em; color:var(--deep); }
.t-h{ font:700 23px/1.25 var(--disp); text-wrap:balance; }
.t.small .t-h{ font-size:20px; }
.t-l{ font-size:16px; line-height:1.6; color:var(--ink2); }
.t-m{ margin-top:auto; font-size:13px; color:var(--ink3); font-variant-numeric:tabular-nums; }
.all{ margin:22px 0 0; font-weight:800; }
.all a{ color:var(--deep); }

/* CTA band */
.band{ background:var(--band); color:var(--on-band); }
.band-in{ max-width:1180px; margin:0 auto; padding:30px 16px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; }
.band p{ margin:0; font:700 clamp(20px, 2.4vw, 26px)/1.35 var(--disp); max-width:34em; }
.btn{ display:inline-flex; align-items:center; gap:8px; min-height:52px; padding:0 26px; border-radius:14px; background:var(--gold); color:var(--on-gold); font-weight:900; font-size:17px; text-decoration:none; box-shadow:0 2px 0 var(--gold-d); }
.btn:hover{ filter:brightness(1.05); }

/* hub */
.hub-top{ max-width:1180px; margin:0 auto; padding:48px 16px 8px; }
.hub-h{ font-size:clamp(64px, 11vw, 132px); line-height:.95; letter-spacing:-.03em; }
.hub-sub{ margin:14px 0 0; font-size:clamp(18px, 2vw, 22px); color:var(--ink2); max-width:36em; }
.hub-lead{ max-width:1180px; margin:0 auto; padding:28px 16px 8px; }
.t.lead{ border-radius:24px; }
@media (min-width:860px){ .t.lead{ flex-direction:row; min-height:440px; } .t.lead .t-im{ flex:0 0 56%; aspect-ratio:auto; order:2; } .t.lead .t-tx{ justify-content:center; padding:36px 40px; gap:14px; } }
.t.lead .t-h{ font-size:clamp(30px, 3.6vw, 46px); line-height:1.12; }
.t.lead .t-l{ font-size:19px; }
.t.lead .t-m{ margin-top:6px; }
.hub-list{ max-width:1180px; margin:0 auto; padding:30px 16px 20px; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.chip{ font:700 15px/1 var(--text); min-height:40px; padding:0 16px; border-radius:999px; border:1.5px solid var(--rule); background:var(--card); color:var(--ink2); cursor:pointer; }
.chip[aria-pressed="true"]{ background:var(--deep); border-color:var(--deep); color:var(--page); }
.hub-know{ padding-bottom:48px; }

/* footer */
.foot{ border-top:1px solid var(--rule); background:var(--page); }
.foot-in{ max-width:1180px; margin:0 auto; padding:28px 16px 40px; font-size:14px; color:var(--ink3); line-height:1.7; }
.foot-in p{ margin:0 0 10px; }
.f-id b{ color:var(--ink2); }
.foot nav{ display:flex; flex-wrap:wrap; gap:4px 18px; margin:0 0 12px; }
.foot nav a{ color:var(--ink2); font-weight:700; }
.f-legal{ font-size:13px; max-width:70em; }

@media (prefers-reduced-motion:reduce){ *{ transition:none !important; animation:none !important; } .t:hover, .pc:hover{ transform:none; } }
@media print{ .mast, .more, .band, .toc, .foot nav, .skip{ display:none !important; } body{ font-size:12pt; } .cover img{ box-shadow:none; max-height:9cm; width:auto; } a{ color:inherit; } }
