/* Ali's Instagram pages + the homepage strip (written by make_instagram.py) */
.ig-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem}
.ig-tile{position:relative;display:block;aspect-ratio:1;overflow:hidden;border-radius:14px;background:var(--cream)}
.ig-tile[hidden]{display:none}
.ig-tile img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.ig-tile:hover img{transform:scale(1.05)}
.ig-reel{position:absolute;top:.6rem;right:.6rem;color:#fff;font-size:.8rem;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.ig-over{position:absolute;inset:auto 0 0 0;padding:2.2rem .8rem .7rem;background:linear-gradient(transparent,rgba(26,21,16,.82));color:var(--cream);display:flex;flex-direction:column;gap:.15rem;opacity:0;transition:opacity .25s}
.ig-tile:hover .ig-over,.ig-tile:focus .ig-over{opacity:1}
.ig-over b{font-family:var(--serif);font-size:.92rem;line-height:1.25;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ig-over i{font-style:normal;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--blush)}

.ig-head{max-width:1300px;margin:0 auto;padding:var(--s5) var(--s4) var(--s3);display:flex;flex-direction:column;gap:var(--s2)}
.ig-head h1{font-family:var(--display);font-size:clamp(2.2rem,4.6vw,3.8rem);line-height:1.04}
.ig-head h1 em{color:var(--terra)}
.ig-head p{max-width:620px;color:var(--muted);font-weight:300;line-height:1.75}
.ig-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:var(--s2)}
.ig-chip{font:500 .78rem var(--sans);padding:.5rem 1rem;border-radius:999px;border:1.5px solid var(--sand);background:transparent;color:var(--muted);cursor:pointer}
.ig-chip.on,.ig-chip:hover{background:var(--ink);border-color:var(--ink);color:var(--cream)}
section.ig-grid{max-width:1300px;margin:0 auto;padding:var(--s2) var(--s4) var(--s6)}

.ig-crumb{max-width:1100px;margin:0 auto;padding:var(--s3) var(--s4) 0;font-size:.8rem;color:var(--muted)}
.ig-crumb a{color:var(--terra)}
.ig-post{max-width:1100px;margin:0 auto;padding:var(--s3) var(--s4) var(--s5);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:var(--s5);align-items:start}
.ig-media{position:sticky;top:90px;display:block;border-radius:20px;overflow:hidden;box-shadow:0 24px 60px rgba(26,21,16,.14)}
.ig-media img{width:100%;height:auto}
.ig-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(26,21,16,.78);color:#fff;padding:.7rem 1.3rem;border-radius:999px;font-size:.85rem;font-weight:500}
.ig-text{display:flex;flex-direction:column;gap:var(--s2)}
.ig-text h1{font-family:var(--display);font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.1}
.ig-topics{display:flex;flex-wrap:wrap;gap:.4rem}
.ig-cap p{font-weight:300;line-height:1.8;margin-bottom:1rem;overflow-wrap:anywhere}
.ig-cap a{color:var(--terra)}
.ig-cap .tag{display:inline-block;font-size:.75rem;color:var(--muted);background:rgba(212,184,150,.18);border-radius:999px;padding:.05rem .55rem;margin:.1rem .1rem}
.ig-text .btn{align-self:flex-start}
.ig-spicy{margin-top:var(--s3);background:#2c3a2b;color:var(--cream);border-radius:18px;padding:var(--s3);display:flex;flex-direction:column;gap:.5rem}
.ig-spicy .eyebrow{color:#ff7a6f}
.ig-spicy b{font-family:var(--display);font-size:1.4rem;font-weight:400}
.ig-spicy p{font-weight:300;opacity:.9}
.ig-pager{max-width:1100px;margin:0 auto;padding:0 var(--s4);display:flex;justify-content:space-between;font-size:.85rem;font-weight:500}
.ig-pager a{color:var(--terra)}
.ig-more{max-width:1100px;margin:0 auto;padding:var(--s4) var(--s4) var(--s6)}
.ig-more h2{font-family:var(--serif);font-size:1.6rem;margin-bottom:var(--s2)}
.ig-more .ig-grid{grid-template-columns:repeat(3,minmax(0,1fr))}

.ig-home{max-width:1300px;margin:0 auto;padding:var(--s6) var(--s4) 0}
.ig-home .sec-header{margin-bottom:var(--s3)}

/* mobile menu (mobile-nav.js), same as shared.css */
.nav-hamburger{display:none;background:none;border:none;cursor:pointer;padding:10px;position:relative;z-index:101}
.nav-hamburger span{display:block;width:22px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px;transition:transform .3s,opacity .3s}
.nav-hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-hamburger.active span:nth-child(2){opacity:0}
.nav-hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media(max-width:960px){
  .ig-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ig-post{grid-template-columns:1fr;gap:var(--s3)}
  .ig-media{position:relative;top:0}
}
@media(max-width:768px){
  .nav-hamburger{display:block}
  .nav-wrap{padding:0 1rem;position:relative}
  nav .nav-links{display:none!important;position:absolute;top:100%;left:0;right:0;background:var(--offwhite);flex-direction:column;padding:12px 24px 20px;gap:0;border-top:1px solid rgba(212,184,150,.25);box-shadow:0 8px 24px rgba(26,21,16,.08)}
  nav .nav-links.nav-open{display:flex!important}
  nav .nav-links a{display:block;padding:12px 0;font-size:.95rem}
  .ig-head,section.ig-grid,.ig-crumb,.ig-post,.ig-pager,.ig-more,.ig-home{padding-left:16px;padding-right:16px}
  .ig-grid,.ig-more .ig-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem}
  .ig-over{opacity:1;padding:1.6rem .6rem .5rem}
  .ig-over b{font-size:.8rem;-webkit-line-clamp:2}
}
