/* עיתון טרנדי - גרסת אתר רספונסיבית לגיליון 1 (15.10.2026)
   נטען אחרי trendy.css ו-issue.css. לא משנה את עימוד הדפוס/קנבה: רק דורס אותו לקריאה במסך.
   עמודי ה-A4 הופכים לבלוקים בזרימה אנכית. מובייל קודם, ומ-820px רשת של שני טורים. */

:root{--m:20px;--col:880px}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{background:var(--paper)}
body{overflow-x:clip}
img{max-width:100%}

/* ---------- העמוד כבלוק ---------- */
.pg{width:100%;max-width:var(--col);height:auto;overflow:hidden;margin:0 auto;padding-bottom:8px;break-after:auto;page-break-after:auto}
.pg + .pg{border-top:1px solid var(--sand)}
.pg.dark + .pg,.pg + .pg.dark,.pg + .backpg{border-top:0}
.pad{padding:0 var(--m)}
.pad.top{padding-top:32px}

/* פס העונה */
.season{height:auto;min-height:30px;flex-wrap:wrap;row-gap:2px;padding:7px var(--m);font-size:12px;letter-spacing:.16em}
.season .r{font-size:11.5px;letter-spacing:.06em}

/* פוליו */
.folio,.letterpg .folio{position:static;width:auto;margin:40px var(--m) 0;padding:14px 0 18px;border-top:1px solid rgba(180,162,126,.55);font-size:12px}
.dark .folio{border-top-color:rgba(201,164,92,.45)}

/* ---------- טיפוגרפיה לקריאה במסך ---------- */
.body,.body.big{font-size:17px;line-height:1.7;margin-top:16px}
.body.big{font-size:18px}
.body p{margin-bottom:12px}
.body h3{font-size:18.5px;margin:22px 0 6px}
.cols2{columns:1}
.hd{padding-top:28px}
.hd .head,.head.small,.hd .head.small{font-size:clamp(28px,7.4vw,42px);line-height:1.12;margin:10px 0 10px}
.hd .sub,.hd .sub.big{font-size:18.5px;line-height:1.5;max-width:640px}
.hd .lede{font-size:18px;line-height:1.6;max-width:640px}
.hd .lede p{margin-bottom:10px}
.eyebrow{font-size:12.5px;letter-spacing:.22em}
.quote{margin-top:24px}
.quote p{font-size:clamp(22px,5.6vw,28px);line-height:1.3}
.closing-line{font-size:18px;line-height:1.55;padding-top:12px}
.closing-line.big{font-size:20px}
.closing{font-size:18px;line-height:1.55;padding:4px 16px 4px 0}
.tip,.check,.ingr,.safety{padding:18px 20px}
.tip p,.safety,.safety p{font-size:16.5px;line-height:1.65}
.tip b,.check b,.safety b{font-size:16px}
.check ul{font-size:16.5px;line-height:1.6}
.check li{margin-bottom:4px}
.check li::before{flex-basis:11px;height:11px}
.box-do{padding:20px 22px}
.box-do b{font-size:13.5px}
.box-do p{font-size:17px;line-height:1.6}
.row2{grid-template-columns:1fr;gap:16px;margin-top:20px}
.row2 .box-do{margin-top:0}
.box-do{margin-top:20px}

/* ---------- תמונות גיבור: יחס מתוך גובה הדפוס (--h) ---------- */
.hero{height:clamp(240px,calc(100vw * var(--h,500) / 660),620px)!important}

/* ---------- שער ---------- */
.cover{display:grid;grid-template-columns:100%;grid-template-areas:"band" "img" "lines";padding-bottom:0}
.cover .c-band{grid-area:band;position:static;height:auto;padding:28px var(--m) 18px}
.cover .logo{font-size:clamp(92px,27vw,156px)}
.cover .tagline,.cover .tagline{position:static;white-space:normal;flex-direction:column;gap:8px;margin-top:16px;font-size:13px;text-align:center}
.cover .tagline .tg-r{letter-spacing:.12em}
.cover .tagline .tg-l{letter-spacing:.04em;font-size:13px}
.cover .c-img{grid-area:img;position:static;aspect-ratio:4/5;width:100%;height:auto;background-position:center 58%}
.cover .c-shade{grid-area:img;position:static;align-self:end;height:65%;background-size:100% 100%}
.cover .c-title{grid-area:img;position:static;align-self:end;padding:0 var(--m) 28px}
.cover .c-title h1{font-size:clamp(40px,11.5vw,66px)}
.cover .c-title p{font-size:17px;line-height:1.45}
.cover .c-title .script.he{font-size:clamp(52px,14vw,72px)}
.cover .c-lines{grid-area:lines;position:static;height:auto;grid-template-columns:1fr;gap:0;padding:12px var(--m) 20px}
.cover .c-lines div{padding:14px 0}
.cover .c-lines span{font-size:18px}

/* ---------- מכתב + תוכן ---------- */
.letterpg .lt-main{position:static;width:auto;padding:32px var(--m) 8px}
.letterpg .lt-main .head{font-size:clamp(28px,7.4vw,34px)}
.letter{font-size:17px;line-height:1.7}
.letter p{margin-bottom:10px}
.letter .sign b{font-size:20px}
.letter .sign span{font-size:14px}
.lt-img,.lt-img[style]{height:auto;aspect-ratio:3/2;margin-top:20px}
.letterpg .lt-toc{position:static;width:auto;padding:32px var(--m) 24px;margin-top:24px}
.lt-toc h2{font-size:clamp(36px,10vw,44px)}
.lt-toc .it{grid-template-columns:50px 1fr;padding:12px 0}
.lt-toc .it small{font-size:11.5px}
.lt-toc .it b{font-size:17px;margin:2px 0}
.lt-toc .it span{font-size:14.5px;line-height:1.45}
.letterpg .folio{margin-top:0}

/* ---------- טרנד ---------- */
.trend-title{position:static;color:var(--dom);padding:24px var(--m) 0}
.trend-title h1{font-size:clamp(48px,14vw,76px);line-height:.98}
.hero-script,.hero-script.he{position:static;display:block;padding:20px var(--m) 0;margin-bottom:-14px;color:var(--acc1);font-size:clamp(52px,14vw,74px)}
.swatches{gap:18px}
.sw{grid-template-columns:76px 1fr;gap:16px;padding-top:18px}
.sw i{width:76px;height:76px}
.sw h3{font-size:24px}
.sw p{font-size:17px;line-height:1.65}
.trend-foot{margin-top:24px}

/* ---------- פיצול תמונה/טקסט ---------- */
.split{display:block;height:auto;padding:32px var(--m) 0}
.split-img{aspect-ratio:4/5;width:100%}
.split-text{height:auto;padding:0}
.i2-low .quote p{font-size:clamp(24px,6.4vw,32px)}

/* ---------- אופנה 2 ---------- */
.fab-wrap{display:block;height:auto;padding:32px var(--m) 0}
.fab-img{aspect-ratio:4/5;width:100%;margin-bottom:24px}
.fab-list{gap:22px}
.fab{grid-template-columns:44px 1fr;font-size:16.5px;line-height:1.65;padding-top:12px}
.fab h3{font-size:19px;margin-bottom:6px}
.fab p{margin-bottom:8px}

/* ---------- השעה הכחולה ---------- */
.bh-top{display:block}
.bh-ph .hero{height:auto!important;aspect-ratio:4/3}
.bh-head{padding:4px var(--m) 24px}
.bh-head .hd{padding-top:20px}
.bh-head .head{font-size:clamp(30px,8vw,42px)}
.bh-head .sub{font-size:18px}

/* ---------- אוכל ---------- */
.room{grid-template-columns:1fr;gap:16px;margin-top:24px;padding-top:18px}
.room-t h3{font-size:18.5px}
.room-t p{font-size:17px;line-height:1.65}
.chips4{grid-template-columns:repeat(2,1fr);gap:16px}
.chips4 .chip{font-size:14.5px;line-height:1.45}
.chips4 .chip i{height:56px}
.chips4 .chip b{font-size:15px}
.meta{font-size:16px;margin:0 0 16px}
.recipe{grid-template-columns:1fr;gap:20px}
.ingr b,.steps-r b{font-size:17px}
.ingr ul{font-size:16.5px;line-height:1.7}
.steps-r ol{font-size:17px;line-height:1.65;padding-right:24px}
.steps-r li{margin-bottom:10px}
.food-low{grid-template-columns:1fr;gap:16px;margin-top:20px}
.food-side .tip,.food-side .body{grid-column:auto;margin-top:0}
.food-strip2{grid-template-columns:1fr;height:auto;gap:12px;margin-top:20px}
.food-strip2>div{aspect-ratio:4/3}

/* ---------- פרסום (עמוד כהה) ---------- */
.ad-top{display:block;padding:32px var(--m) 0}
.ad-img{height:auto;aspect-ratio:4/5;width:100%;margin-bottom:24px}
.ad-head h1{font-size:clamp(38px,10.5vw,56px)}
.ad-head .lede{font-size:18px;line-height:1.55}
.light-q{margin-top:32px}
.light-q p{font-size:clamp(34px,10vw,48px)}

/* ---------- מסלולים ---------- */
.safety .cols2{columns:1}

/* ---------- לוקים ---------- */
.lk-main{grid-template-columns:1fr;gap:16px;margin-top:20px}
.lk-main-img,.lk-main-t{grid-column:auto;grid-row:auto}
.lk-main-img .hero,.looks-3 .hero{height:auto!important;aspect-ratio:1/1}
.lk-main-img .hero{aspect-ratio:3/2}
.lk-main .lk-h .bud{font-size:28px}
.lk-main .lk-h h3{font-size:20px}
.lk-h h3{font-size:18px}
.lk-why{font-size:17px;line-height:1.6}
.lk-note{font-size:14.5px}
.lk-cap{font-size:12.5px}
.looks-3{grid-template-columns:1fr;gap:36px}
.looks-3 .lk-h{min-height:0}
.buy{padding:12px 14px}
.buy>b{font-size:15px}
.buy table{font-size:14.5px;line-height:1.4}
.buy td{padding:7px 0}
.buy td.it{width:auto;padding-left:8px}
.buy td.st,.buy td.st a{width:auto;white-space:normal;overflow-wrap:anywhere;font-size:13px;letter-spacing:0}
.buy td.st a{font-size:12.5px}
.buy td.st small{font-size:12px}
.buy td.pr{padding-right:8px}
.tot{font-size:14.5px;gap:3px;margin-top:8px}
.lk-palette b{font-size:17px}
.lk-palette p{font-size:17px;line-height:1.6}
.lk-foot{font-size:13.5px;line-height:1.55;align-items:flex-start}

/* ---------- עמוד אחורי ---------- */
.back-top{padding:48px var(--m) 0}
.back-top h1{font-size:clamp(38px,11vw,58px)}
.next li{font-size:18px;line-height:1.45}
.ads-slots{position:static;display:grid;grid-template-columns:1fr;gap:16px;padding:32px var(--m) 40px}
.slot{height:180px}

/* ======================================================
   טאבלט ומחשב: עמוד-מגזין ממורכז עם רשת שני טורים
   ====================================================== */
@media (min-width:820px){
  :root{--m:48px}
  html,body{background:#d9d3c7}
  .pg{margin:0 auto 32px;box-shadow:0 1px 0 rgba(64,36,14,.06)}
  .pg + .pg{border-top:0}
  body{padding-top:32px}
  .hero{height:clamp(240px,calc(var(--col) * var(--h,500) / 794),760px)!important}
  .cols2,.safety .cols2{columns:2;column-gap:32px}
  .row2{grid-template-columns:1fr 1fr;gap:24px}
  .season .r{font-size:12.5px}

  /* שער: היחס של הדפוס */
  .cover .c-img{aspect-ratio:794/723}
  .cover .c-shade{height:300px}
  .cover .tagline{flex-direction:row;justify-content:space-between;text-align:right}
  .cover .c-lines{grid-template-columns:repeat(3,1fr);gap:24px;padding:24px var(--m) 32px}

  /* מכתב לצד תוכן העניינים */
  .letterpg{display:grid;grid-template-columns:1fr 380px;align-items:stretch}
  .letterpg .season,.letterpg .folio{grid-column:1 / -1}
  .letterpg .lt-main{grid-column:1;padding:40px 40px 24px var(--m)}
  .letterpg .lt-toc{grid-column:2;margin-top:0}
  .letterpg .folio{margin:0 var(--m)}

  .trend-title{padding-top:32px}
  .sw{grid-template-columns:120px 1fr;gap:24px}
  .sw i{width:120px;height:120px}

  .split{display:grid;grid-template-columns:1fr 320px;gap:32px}
  .split .split-img{grid-column:2;grid-row:1;aspect-ratio:auto;min-height:560px}
  .split .split-text{grid-column:1;grid-row:1}

  .fab-wrap{display:grid;grid-template-columns:1fr 320px;gap:32px;align-items:start}
  .fab-img{grid-column:2;grid-row:1;aspect-ratio:2/3;margin:0;position:sticky;top:24px}

  .bh-top{display:grid;grid-template-columns:1fr 380px;align-items:end}
  .bh-ph{grid-column:2;grid-row:1}
  .bh-head{grid-column:1;grid-row:1}
  .bh-ph .hero{aspect-ratio:auto;height:400px!important}

  .room{grid-template-columns:240px 1fr;gap:28px}
  .chips4{grid-template-columns:repeat(4,1fr)}
  .recipe{grid-template-columns:260px 1fr;gap:32px}
  .food-low{grid-template-columns:1fr 1fr;gap:24px}
  .food-strip2{grid-template-columns:2fr 1fr;height:300px}
  .food-strip2>div{aspect-ratio:auto}

  .ad-top{display:grid;grid-template-columns:1fr 320px;gap:32px}
  .ad-img{grid-column:2;grid-row:1;aspect-ratio:auto;height:400px;margin:0}
  .ad-head{grid-column:1;grid-row:1}

  .lk-main{grid-template-columns:1fr 360px;gap:28px}
  .lk-main-img{grid-column:1;grid-row:1}
  .lk-main-t{grid-column:2;grid-row:1}
  .lk-main-img .hero{aspect-ratio:4/5}
  .looks-3{grid-template-columns:repeat(3,1fr);gap:20px}
  .looks-3 .lk-h{min-height:48px}
  .looks-3 .buy table{font-size:13px}
  .looks-3 .buy td.st,.looks-3 .buy td.st a{font-size:12px}

  .ads-slots{grid-template-columns:1fr 1fr;gap:20px;padding:40px var(--m) 48px}
  .slot{height:300px}
}

/* קיצור תנועה */
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto}}