/* ===== Sayfa: Günlük ===== */

/* SECTION 1 — Günlük Hero */
.diary-hero{
  position: relative; padding: clamp(28px, 6vw, 64px) 0 40px;
  background: radial-gradient(1200px 600px at 20% -20%, rgba(14,165,233,.10), transparent 60%),
              radial-gradient(1100px 600px at 120% 10%, rgba(245,158,11,.10), transparent 60%);
  overflow: clip;
}
.hero-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:22px; align-items:center; }
.diary-hero .lede{ color: var(--ink-soft); margin: 0 0 12px; }

.date-strip{ display:flex; flex-wrap:wrap; gap:8px; }
.date-chip{
  border:2px solid var(--brand); background:#fff; color:var(--brand-ink);
  border-radius:12px; padding:8px 12px; font-weight:700; cursor:pointer;
  transition: transform .2s ease, background .2s ease;
}
.date-chip:hover{ transform: translateY(-2px); background: var(--brand); color:#fff; }
.date-chip.is-active{ background: var(--brand); color:#fff; }

.hero-photos{ position:relative; display:grid; grid-template-columns: 1fr 1fr; gap:12px; }
.hero-photos .p3{ grid-column: 1 / -1; justify-self:center; max-width:320px; }
.ph{ transition: transform .35s ease, box-shadow .35s ease, opacity .25s ease; }
.ph:hover{ transform: translateY(-4px) scale(1.02); box-shadow: var(--shadow); }
.diary-hero[data-month="baku"]   .ph[data-tag]:not([data-tag="baku"])   { opacity:.4; }
.diary-hero[data-month="gabala"] .ph[data-tag]:not([data-tag="gabala"]) { opacity:.4; }
.diary-hero[data-month="seki"]   .ph[data-tag]:not([data-tag="seki"])   { opacity:.4; }

/* Dekoratif çizikler */
.scribble{
  position:absolute; inset-inline:-8px; height:10px; border-radius:999px;
  background: linear-gradient(90deg, rgba(14,165,233,.18), rgba(245,158,11,.18));
  filter: blur(.4px); opacity:.55;
}
.s1{ top:18%; animation: sway 8s ease-in-out infinite; }
.s2{ top:48%; animation: sway 10s ease-in-out infinite reverse; }
.s3{ top:78%; animation: sway 12s ease-in-out infinite; }
@keyframes sway{ 0%,100%{ transform: translateX(-2%);} 50%{ transform: translateX(2%);} }

/* SECTION 2 — Vaka Zaman Çizgisi */
.case-timeline{ padding:56px 0; }
.case-grid{ display:grid; grid-template-columns: 140px 1fr .9fr; gap:24px; align-items:start; }
.time-rail{ position: sticky; top: 84px; align-self:start; }
.time-rail .tick{
  display:block; width:max-content; margin:12px 0; font-weight:700; color:var(--brand-ink);
}
.events{ display:grid; gap:12px; position:relative; }
.events::before{
  content:""; position:absolute; left:-14px; top:0; bottom:0; width:2px; background: rgba(2,6,23,.1);
}
.evt{
  background:#fff; border:1px solid rgba(2,6,23,.08); border-radius:12px; padding:10px; box-shadow: var(--shadow);
  transform: translateX(-6px); transition: transform .35s ease, box-shadow .35s ease;
}
.reveal.in-view .evt{ transform: translateX(0); }
.case-photos{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; }

/* SECTION 3 — Sesli Notlar (wave simülasyonu) */
.audio-waves{ padding:56px 0; }
.waves-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:24px; align-items:start; }
.audio-waves .sec-lede{ color: var(--ink-soft); margin: 0 0 12px; }

.wave-cards{ display:grid; gap:12px; }
.wcard{
  background:#fff; border:1px solid rgba(2,6,23,.08); border-radius:12px; padding:10px; box-shadow: var(--shadow);
  display:grid; grid-template-columns: auto 1fr; gap:10px; align-items:center;
}
.play{
  width:40px; height:40px; border-radius:999px; border:2px solid var(--brand); background:#fff; color: var(--brand-ink);
  font-weight:700; cursor:pointer; transition: transform .2s ease, background .2s ease;
}
.play:hover{ transform: translateY(-2px); background: var(--brand); color:#fff; }

.wavebar{ display:flex; gap:3px; height:24px; align-items:flex-end; }
.wavebar i{
  width:6px; height:6px; background:#0ea5e9; border-radius:3px; transform-origin: bottom center;
  animation: none; opacity:.85;
}
.wcard.playing .wavebar i{
  animation: waveJump 800ms ease-in-out infinite;
}
.wcard.playing .wavebar i:nth-child(2){ animation-delay: .05s; }
.wcard.playing .wavebar i:nth-child(3){ animation-delay: .10s; }
.wcard.playing .wavebar i:nth-child(4){ animation-delay: .15s; }
.wcard.playing .wavebar i:nth-child(5){ animation-delay: .20s; }
.wcard.playing .wavebar i:nth-child(6){ animation-delay: .25s; }
.wcard.playing .wavebar i:nth-child(7){ animation-delay: .30s; }
@keyframes waveJump{ 0%,100%{ height:6px; } 50%{ height:22px; } }

.meta{ grid-column: 1 / -1; margin:4px 0 0; color:#475569; }

.waves-photos{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; }

/* Duyarlılık */
@media (max-width: 1024px){
  .hero-grid{ grid-template-columns: 1fr; }
  .case-grid{ grid-template-columns: 1fr; }
  .waves-grid{ grid-template-columns: 1fr; }
  .hero-photos, .case-photos, .waves-photos{ grid-template-columns: 1fr; }
}
/* === FIX: мобильная раскладка таймлайна (до 640px) === */
@media (max-width: 640px){
  .case-grid{
    grid-template-columns: 1fr;   /* уже есть, но уточним */
    position: relative;           /* для абсолютного рейла */
  }

  /* левый столбец времени закрепляем внутри секции */
  .time-rail{
    position: absolute;
    left: 8px;
    top: 0;
    width: 60px;                  /* фикс ширины колонки времени */
    z-index: 3;
  }
  .time-rail .tick{
    margin: 20px 0;               /* равномерный шаг, без налезания на карточки */
    white-space: nowrap;
  }

  /* контенту даём место под рейл */
  .events{
    padding-left: 76px;           /* 60 + отступы */
    position: relative;
    z-index: 1;
  }
  /* вертикальная линия переносится туда же */
  .events::before{
    left: 60px;                   /* совпадает с правым краем колонки времени */
  }

  /* карточки без горизонтального сдвига на мобилке */
  .evt{ transform: none; }
}
/* ===== 4. Photo Mosaic ===== */
.photo-mosaic{ padding:56px 0; }
.mosaic-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:24px; align-items:start; }
.photo-mosaic .sec-lede{ color:var(--ink-soft); margin:0 0 12px; }

.mosaic-photos{
  display:grid; grid-template-columns: repeat(3, minmax(140px, 1fr)); gap:12px;
  align-items:start;
}
.mosaic-photos .m-item{ width:min(100%, 350px); justify-self:start; }
.mosaic-photos img{ aspect-ratio:auto; }        /* genel 7/5'i bu bölümde esnetiyoruz */
.mosaic-photos .tall img{ aspect-ratio: 4 / 5; }
.mosaic-photos .wide img{ aspect-ratio: 16 / 9; }

@media (max-width: 1024px){
  .mosaic-grid{ grid-template-columns: 1fr; }
  .mosaic-photos{ grid-template-columns: 1fr; }
}

/* ===== 5. Micro Metrics ===== */
.micro-metrics{ padding:56px 0; }
.micro-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:24px; align-items:start; }
.micro-metrics .sec-lede{ color:var(--ink-soft); margin:0 0 12px; }

.mm-switch{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.mm-btn{
  border:2px solid var(--brand); background:#fff; color:var(--brand-ink);
  border-radius:12px; padding:8px 12px; font-weight:700; cursor:pointer;
  transition: transform .2s ease, background .2s ease;
}
.mm-btn:hover{ transform: translateY(-2px); background: var(--brand); color:#fff; }
.mm-btn.is-active{ background: var(--brand); color:#fff; }

.mm-bars{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.mm-bars .bar{
  --w: 40%;
  display:grid; grid-template-columns: 120px 1fr 60px; gap:10px; align-items:center;
  background:#fff; border:1px solid rgba(2,6,23,.08); border-radius:12px; padding:10px; box-shadow: var(--shadow);
}
.mm-bars .bar span{ font-weight:700; color:var(--brand-ink); }
.mm-bars .bar .fill{ height:10px; border-radius:999px; background: linear-gradient(90deg, var(--brand), #60a5fa); width:0%; transition: width 1s ease; }
.mm-bars .bar .val{ text-align:right; font-weight:700; color:var(--ink); }
.reveal.in-view .mm-bars .bar .fill{ width: var(--w); }

/* metrik modlarına göre yüzdeler */
.micro-metrics[data-metric="iletisim"] .b1{ --w: 78%; }  /* Tempo */
.micro-metrics[data-metric="iletisim"] .b2{ --w: 86%; }  /* Görünürlük */
.micro-metrics[data-metric="iletisim"] .b3{ --w: 72%; }  /* Uyum */

.micro-metrics[data-metric="guven"] .b1{ --w: 64%; }
.micro-metrics[data-metric="guven"] .b2{ --w: 74%; }
.micro-metrics[data-metric="guven"] .b3{ --w: 88%; }

.micro-metrics[data-metric="karar"] .b1{ --w: 70%; }
.micro-metrics[data-metric="karar"] .b2{ --w: 60%; }
.micro-metrics[data-metric="karar"] .b3{ --w: 82%; }

.micro-photos{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; }

@media (max-width: 1024px){
  .micro-grid{ grid-template-columns: 1fr; }
  .micro-photos{ grid-template-columns: 1fr; }
}

/* ===== 6. Ritual Band ===== */
.ritual-band{ padding:56px 0; }
.band-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:24px; align-items:start; }
.ritual-band .sec-lede{ color:var(--ink-soft); margin:0 0 12px; }

.band-track{
  display:grid; grid-auto-flow: column; grid-auto-columns: max-content; gap:10px;
  overflow-x:auto; scroll-snap-type:x mandatory; padding:8px 0 8px;
  border:1px solid rgba(2,6,23,.08); border-radius:999px; background:#fff; box-shadow: var(--shadow);
}
.band-track::-webkit-scrollbar{ height:8px; }
.band-track::-webkit-scrollbar-thumb{ background: rgba(2,6,23,.2); border-radius:999px; }
.band-track .chip{
  scroll-snap-align:center;
  white-space:nowrap; padding:8px 12px; border-radius:999px; background: rgba(14,165,233,.08);
}
.band-track .chip:nth-child(odd){ background: rgba(245,158,11,.10); }

.band-photos{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; }

@media (max-width: 1024px){
  .band-grid{ grid-template-columns: 1fr; }
  .band-photos{ grid-template-columns: 1fr; }
}
/* ===== 7. Field Sketches ===== */
.field-sketches{ padding:56px 0; }
.sketch-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:24px; align-items:start; }
.field-sketches .sec-lede{ color:var(--ink-soft); margin:0 0 12px; }
.sketch-points{ margin:0; padding-left:18px; }

.notebook{
  position:relative; height:220px; border-radius:16px; background:
    repeating-linear-gradient(#f8fafc 0 26px, #f8fafc 26px 52px),
    linear-gradient(180deg, rgba(14,165,233,.12), rgba(14,165,233,0));
  border:1px solid rgba(2,6,23,.08); box-shadow: var(--shadow);
  overflow:hidden;
}
.notebook::before{
  content:""; position:absolute; left:52px; top:0; bottom:0; width:2px; background: rgba(245,158,11,.25);
}
.pin{
  position:absolute; width:8px; height:8px; border-radius:999px; background:#0ea5e9;
  box-shadow: 0 0 0 0 rgba(14,165,233,.25); animation: pinpulse 2.4s ease-out infinite;
}
@keyframes pinpulse{ to{ box-shadow: 0 0 0 18px rgba(14,165,233,0);} }
.k1{ left:30%; top:28%; } .k2{ left:74%; top:68%; }

.sketch{
  position:absolute; font-size:12px; color:#1f2b3f; background:#fff; border:1px dashed rgba(2,6,23,.15);
  padding:4px 8px; border-radius:8px; box-shadow: var(--shadow);
  transform-origin:center; opacity:.9;
}
.s1{ left:18%; top:32%; transform: rotate(-6deg); }   /* kapı oranı */
.s2{ left:52%; top:22%; transform: rotate(8deg); }     /* rüzgâr */
.s3{ left:68%; top:72%; transform: rotate(-3deg); }    /* hizası */

.sketch-photos{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; }

@media (max-width: 1024px){
  .sketch-grid{ grid-template-columns: 1fr; }
  .sketch-photos{ grid-template-columns: 1fr; }
}

/* ===== 8. Wind Journal (Beaufort) ===== */
.wind-journal{ padding:56px 0; }
.wind-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:24px; align-items:start; }
.wind-journal .sec-lede{ color:var(--ink-soft); margin:0 0 12px; }

.bft-switch{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.bft-btn{
  border:2px solid var(--brand); background:#fff; color:var(--brand-ink);
  border-radius:12px; padding:8px 12px; font-weight:700; cursor:pointer;
  transition: transform .2s ease, background .2s ease;
}
.bft-btn:hover{ transform: translateY(-2px); background: var(--brand); color:#fff; }
.bft-btn.is-active{ background: var(--brand); color:#fff; }

.flag-canvas{
  position:relative; height:180px; border-radius:16px;
  background: linear-gradient(180deg, #cfefff, #ffffff);
  border:1px solid rgba(2,6,23,.08); box-shadow: var(--shadow); overflow:hidden;
  display:grid; grid-template-columns: repeat(3, 1fr); place-items:center;
}
.mast{ position:relative; width:64px; height:120px; }
.mast::before{
  content:""; position:absolute; left:8px; top:0; bottom:0; width:4px; background:#94a3b8; border-radius:2px;
}
.flag{
  position:absolute; left:12px; top:10px; width:48px; height:20px; border-radius:4px;
  background: linear-gradient(90deg, #0ea5e9, #60a5fa);
  transform-origin: left center;
  animation: waveLight 3.4s ease-in-out infinite;
  box-shadow: 0 0 0 0 rgba(14,165,233,.25);
}

/* hız modları */
.wind-journal[data-bft="light"] .flag{ animation: waveLight 3.4s ease-in-out infinite; }
.wind-journal[data-bft="mid"]   .flag{ animation: waveMid 2.2s ease-in-out infinite; }
.wind-journal[data-bft="hard"]  .flag{ animation: waveHard 1.3s ease-in-out infinite; }

@keyframes waveLight{ 0%,100%{ transform: rotate(0) skewX(-6deg);} 50%{ transform: rotate(4deg) skewX(-10deg);} }
@keyframes waveMid{   0%,100%{ transform: rotate(0) skewX(-10deg);} 50%{ transform: rotate(8deg) skewX(-16deg);} }
@keyframes waveHard{  0%,100%{ transform: rotate(2deg) skewX(-14deg);} 50%{ transform: rotate(12deg) skewX(-22deg);} }

.wind-photos{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; }

@media (max-width: 1024px){
  .wind-grid{ grid-template-columns: 1fr; }
  .wind-photos{ grid-template-columns: 1fr; }
}

/* ===== 9. Evening Market — Filmstrip ===== */
.evening-market{ padding:56px 0; }
.market-grid{ display:grid; grid-template-columns: 1fr; gap:16px; align-items:start; }
.evening-market .sec-lede{ color:var(--ink-soft); margin:0 0 12px; }

.filmstrip{
  position:relative; display:grid; grid-template-columns: repeat(3, minmax(220px, 260px));
  gap:12px; overflow:hidden; padding:12px; border-radius:16px; background:#fff;
  border:1px solid rgba(2,6,23,.08); box-shadow: var(--shadow);
}
.frame{ transition: transform .25s ease, box-shadow .25s ease; }
.frame:hover{ transform: translateY(-4px) scale(1.02); box-shadow: 0 12px 34px rgba(2,6,23,.12); }

.led{
  position:absolute; left:8px; right:8px; height:6px; border-radius:999px;
  background: linear-gradient(90deg, rgba(14,165,233,.2), rgba(245,158,11,.2));
  filter: blur(.3px); opacity:.8;
}
.l1{ top:6px; animation:sway 8s ease-in-out infinite; }
.l2{ bottom:6px; animation:sway 10s ease-in-out infinite reverse; }
.l3{ top:50%; height:2px; opacity:.4; filter:none; animation:sway 11s ease-in-out infinite; }

@media (max-width: 1024px){
  .filmstrip{ grid-template-columns: 1fr; }
}
/* ===== 10. Gear Shelf ===== */
.gear-shelf{ padding:56px 0; }
.shelf-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:24px; align-items:start; }
.gear-shelf .sec-lede{ color:var(--ink-soft); margin:0 0 12px; }
.shelf-chips{ display:flex; flex-wrap:wrap; gap:8px; padding:0; margin:0; list-style:none; }
.shelf-chips li{ padding:8px 12px; border-radius:999px; background:#fff; border:1px solid rgba(2,6,23,.08); font-weight:700; color:var(--brand-ink); box-shadow: var(--shadow); }

.shelf-canvas{
  position:relative; height:220px; border-radius:16px; background:
    linear-gradient(180deg,#fefefe,#ffffff);
  border:1px solid rgba(2,6,23,.08); box-shadow: var(--shadow); overflow:hidden;
  display:grid; gap:14px; padding:12px;
}
.shelf-row{ position:relative; display:flex; gap:12px; align-items:center; }
.shelf-row::before{
  content:""; position:absolute; left:0; right:0; bottom:-6px; height:6px; border-radius:999px;
  background: linear-gradient(90deg, rgba(14,165,233,.16), rgba(245,158,11,.16));
  filter: blur(.2px);
}
.shelf-canvas .box{
  display:inline-block; padding:8px 10px; border-radius:10px; background:#fff;
  border:1px solid rgba(2,6,23,.08); box-shadow: var(--shadow);
  transition: transform .25s ease;
}
.shelf-canvas .box:hover{ transform: translateY(-4px) rotate(-1deg); }

.shelf-photos{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; }

@media (max-width: 1024px){
  .shelf-grid{ grid-template-columns: 1fr; }
  .shelf-photos{ grid-template-columns: 1fr; }
}

/* ===== 11. Mood Heatmap ===== */
.mood-heatmap{ padding:56px 0; }
.heat-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:24px; align-items:start; }
.mood-heatmap .sec-lede{ color:var(--ink-soft); margin:0 0 12px; }

.hm-switch{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.hm-btn{
  border:2px solid var(--brand); background:#fff; color:var(--brand-ink);
  border-radius:12px; padding:8px 12px; font-weight:700; cursor:pointer;
  transition: transform .2s ease, background .2s ease;
}
.hm-btn:hover{ transform: translateY(-2px); background: var(--brand); color:#fff; }
.hm-btn.is-active{ background: var(--brand); color:#fff; }

.heatmap{ display:grid; place-items:center; }
.hm-grid{
  --cols: 8; --rows: 6; --gap: 6px;
  display:grid; grid-template-columns: repeat(var(--cols), 1fr);
  grid-auto-rows: 18px; gap: var(--gap); padding: 6px;
  background:#fff; border:1px solid rgba(2,6,23,.08); border-radius:12px; box-shadow: var(--shadow);
}
.hm-grid .cell{
  --alpha: .4;
  border-radius:4px; transition: background-color .45s ease, transform .25s ease;
}
/* Modlara göre renk */
.mood-heatmap[data-mode="pozitif"]  .hm-grid .cell{ background-color: rgba(16,185,129,var(--alpha)); }
.mood-heatmap[data-mode="denge"]    .hm-grid .cell{ background-color: rgba(14,165,233,var(--alpha)); }
.mood-heatmap[data-mode="zorlanma"] .hm-grid .cell{ background-color: rgba(245,158,11,var(--alpha)); }
.hm-grid .cell:hover{ transform: translateY(-2px); }

/* Foto kolon */
.heat-photos{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; }

@media (max-width: 1024px){
  .heat-grid{ grid-template-columns: 1fr; }
  .heat-photos{ grid-template-columns: 1fr; }
}

/* ===== 12. Mini Interviews ===== */
.mini-interviews{ padding:56px 0; }
.interviews-grid{ display:grid; grid-template-columns: 1fr; gap:16px; }
.interviews-track{
  display:grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 260px);
  gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:8px;
}
.interviews-track::-webkit-scrollbar{ height:8px; }
.interviews-track::-webkit-scrollbar-thumb{ background: rgba(2,6,23,.2); border-radius:999px; }

.iv-card{
  scroll-snap-align:start; background:#fff; border:1px solid rgba(2,6,23,.08); border-radius:16px; padding:10px;
  box-shadow: var(--shadow); width:min(100%, 350px); transition: transform .25s ease, box-shadow .25s ease;
}
.iv-card:hover{ transform: translateY(-4px) scale(1.02); box-shadow: 0 12px 34px rgba(2,6,23,.12); }
.iv-card details{ margin-top:6px; }
.interviews-hint{ text-align:right; font-size:12px; color:#64748b; }

@media (max-width: 1024px){
  .interviews-track{ grid-auto-columns: 1fr; }
}
/* ===== 13. Daily Calendar ===== */
.daily-calendar{ padding:56px 0; }
.cal-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:24px; align-items:start; }
.daily-calendar .sec-lede{ color:var(--ink-soft); margin:0 0 12px; }

.cal-switch{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.cal-chip{
  border:2px solid var(--brand); background:#fff; color:var(--brand-ink);
  border-radius:12px; padding:8px 12px; font-weight:700; cursor:pointer;
  transition: transform .2s ease, background .2s ease;
}
.cal-chip:hover{ transform: translateY(-2px); background: var(--brand); color:#fff; }
.cal-chip.is-active{ background: var(--brand); color:#fff; }

.cal-progress{
  position:relative; height:10px; border-radius:999px; background:#fff;
  border:1px solid rgba(2,6,23,.08); box-shadow: var(--shadow); overflow:hidden; margin-top:6px;
}
.cal-progress .fill{
  position:absolute; inset:0; width:40%; background: linear-gradient(90deg, var(--brand), #60a5fa);
  transition: width .8s ease;
}

.cal-board{
  display:grid; grid-template-columns: repeat(7,1fr); grid-auto-rows: 28px; gap:6px;
  background:#fff; border:1px solid rgba(2,6,23,.08); border-radius:12px; box-shadow: var(--shadow); padding:8px;
}
.cal-board .cell{
  border-radius:6px; background: rgba(2,6,23,.06); transition: transform .25s ease, background .25s ease;
}

/* vurgular (Bugün = 4. sütun, Yarın = 5. sütun) */
.daily-calendar[data-scope="bugun"] .cal-board .cell:nth-child(4),
.daily-calendar[data-scope="bugun"] .cal-board .cell:nth-child(11){ background: rgba(14,165,233,.22); transform: scale(1.04); }
.daily-calendar[data-scope="yarin"] .cal-board .cell:nth-child(5),
.daily-calendar[data-scope="yarin"] .cal-board .cell:nth-child(12){ background: rgba(245,158,11,.22); transform: scale(1.04); }
.daily-calendar[data-scope="hafta"] .cal-board .cell{ background: rgba(16,185,129,.12); }

/* foto kolon */
.cal-photos{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; }

@media (max-width: 1024px){
  .cal-grid{ grid-template-columns: 1fr; }
  .cal-photos{ grid-template-columns: 1fr; }
}

/* ===== 14. Feedback Wall ===== */
.feedback-wall{ padding:56px 0; }
.wall-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:24px; align-items:start; }
.feedback-wall .sec-lede{ color:var(--ink-soft); margin:0 0 12px; }
.wall-shuffle{
  margin:8px 0 12px; padding:10px 12px; border-radius:12px; border:2px solid var(--brand);
  background:#fff; color:var(--brand-ink); font-weight:700; cursor:pointer; transition: transform .2s ease, background .2s ease;
}
.wall-shuffle:hover{ transform: translateY(-2px); background: var(--brand); color:#fff; }

.wall-masonry{
  column-count: 2; column-gap: 12px;
}
.note{
  display:inline-block; width:100%; margin:0 0 12px; padding:10px 12px; border-radius:10px;
  background:#fff6e6; border:1px solid rgba(2,6,23,.08); box-shadow: var(--shadow);
  transform: rotate(var(--r,0deg)); transition: transform .2s ease, box-shadow .2s ease;
}
.note:hover{ transform: rotate(0deg) translateY(-2px); box-shadow: 0 12px 34px rgba(2,6,23,.12); }
.note.n1{ --r:-1deg } .note.n2{ --r:1deg } .note.n3{ --r:-2deg } .note.n4{ --r:1deg }
.note.n5{ --r:-1deg } .note.n6{ --r:1deg } .note.n7{ --r:-2deg } .note.n8{ --r:2deg }

.wall-photos{ display:grid; grid-template-columns: repeat(3,1fr); gap:12px; }

@media (max-width: 1024px){
  .wall-grid{ grid-template-columns: 1fr; }
  .wall-photos{ grid-template-columns: 1fr; }
}

/* ===== 15. Postcards Strip ===== */
.postcards-strip{ padding:56px 0; }
.post-grid{ display:grid; grid-template-columns: 1fr; gap:16px; }
.cards{ display:grid; grid-template-columns: repeat(2, minmax(220px, 260px)); gap:12px; }
.postcard{
  position:relative; background:#fff; border:1px solid rgba(2,6,23,.08); border-radius:16px; padding:10px;
  box-shadow: var(--shadow); width:min(100%, 350px); transition: transform .25s ease, box-shadow .25s ease;
}
.postcard::after{
  content:""; position:absolute; right:14px; top:14px; width:40px; height:40px; border-radius:8px;
  border:1px dashed rgba(2,6,23,.28);
}
.postcard:hover{ transform: translateY(-4px) rotate(-.3deg); box-shadow: 0 12px 34px rgba(2,6,23,.12); }
.postcard figcaption{ margin-top:6px; font-weight:700; }

.fav{
  position:absolute; left:12px; top:12px; width:34px; height:34px; border-radius:999px;
  border:2px solid var(--brand); background:#fff; color:var(--brand-ink); font-weight:700; cursor:pointer;
  transition: transform .2s ease, background .2s ease, color .2s ease;
}
.fav[aria-pressed="true"]{ background: var(--brand); color:#fff; transform: scale(1.05); }

@media (max-width: 1024px){
  .cards{ grid-template-columns: 1fr; }
}