/* PG Instagram — scoped to .pg-instagram. Ported from the DRobb #ig "drifting
   feed": text tiles (colour variants) auto-drift in a viewport, prev/next nudge. */

.pg-instagram{ padding:200px 0 220px; position:relative; }
.pg-instagram .ig-head{ max-width:1440px; margin:0 auto 80px; padding:0 80px; display:flex; justify-content:space-between; align-items:flex-end; gap:80px; }
.pg-instagram .ig-head-left{ max-width:720px; }
.pg-instagram .ig-eyebrow{ display:flex; align-items:center; gap:14px; font-family:var(--pg-font-sans); font-weight:400; text-transform:uppercase; letter-spacing:.32em; font-size:11px; color:var(--pg-ink-soft); margin-bottom:32px; }
.pg-instagram .ig-eyebrow .rule{ width:28px; height:1px; background:var(--pg-ink-hair); }
.pg-instagram .ig-eyebrow .diamond{ width:4px; height:4px; background:var(--pg-terracotta); transform:rotate(45deg); }
.pg-instagram .ig-heading{ font-family:var(--pg-font-display); font-weight:300; font-variation-settings:"opsz" 144; font-size:clamp(54px,6.4vw,92px); line-height:.96; letter-spacing:-.022em; color:var(--pg-ink); margin:0; }
.pg-instagram .ig-heading em{ font-style:italic; color:var(--pg-terracotta); }
.pg-instagram .ig-controls{ display:flex; flex-direction:column; align-items:flex-end; gap:20px; }
.pg-instagram .ig-handle-line{ font-family:var(--pg-font-italic); font-style:italic; font-size:18px; color:var(--pg-ink-soft); text-align:right; }
.pg-instagram .ig-handle-line .handle{ color:var(--pg-ink); font-style:normal; }
.pg-instagram .ig-handle-line em{ color:var(--pg-terracotta); }
.pg-instagram .nav-arrows{ display:flex; gap:10px; }
.pg-instagram .nav-arrows button{ width:44px; height:44px; border-radius:999px; border:1px solid var(--pg-ink-hair); background:var(--pg-bone); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; color:var(--pg-ink); transition:background 600ms var(--pg-ease), border-color 600ms var(--pg-ease), transform 600ms var(--pg-ease); }
.pg-instagram .nav-arrows button:hover{ background:var(--pg-ink); color:var(--pg-bone); border-color:var(--pg-ink); transform:translate3d(0,-1px,0); }
.pg-instagram .nav-arrows button:active{ transform:scale(.96); }
.pg-instagram .nav-arrows button svg{ width:14px; height:10px; }

.pg-instagram .feed-viewport{ position:relative; overflow:hidden; margin-bottom:64px; padding:32px 0; }
.pg-instagram .feed-viewport::before, .pg-instagram .feed-viewport::after{ content:""; position:absolute; top:0; bottom:0; width:80px; z-index:5; pointer-events:none; }
.pg-instagram .feed-viewport::before{ left:0; background:linear-gradient(to right, var(--pg-bone), transparent); }
.pg-instagram .feed-viewport::after{ right:0; background:linear-gradient(to left, var(--pg-bone), transparent); }
.pg-instagram .feed-track{ display:flex; gap:24px; padding:0 80px; width:max-content; animation:pg-drift 80s linear infinite; will-change:transform; }
@keyframes pg-drift{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(-50%,0,0); } }
.pg-instagram .feed-viewport:hover .feed-track, .pg-instagram .feed-viewport.paused .feed-track{ animation-play-state:paused; }

.pg-instagram .ig-post{ position:relative; width:360px; height:360px; flex-shrink:0; border-radius:4px; overflow:hidden; text-decoration:none; color:inherit; box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 30px 60px -40px rgba(26,21,18,.20); display:flex; flex-direction:column; padding:24px; transition:transform 800ms var(--pg-ease), box-shadow 800ms var(--pg-ease); }
.pg-instagram .ig-post:hover{ transform:translate3d(0,-4px,0); box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 50px 80px -40px rgba(26,21,18,.30); z-index:4; }
.pg-instagram .ig-top{ display:flex; justify-content:space-between; align-items:baseline; font-family:var(--pg-font-sans); font-weight:400; text-transform:uppercase; letter-spacing:.22em; font-size:9.5px; }
.pg-instagram .ig-body{ flex:1; display:flex; align-items:center; justify-content:center; padding:12px 4px; text-align:center; }
.pg-instagram .ig-statement{ font-family:var(--pg-font-italic); font-size:18px; line-height:1.32; margin:0; }
.pg-instagram .ig-statement em{ font-style:italic; }
.pg-instagram .ig-statement.meridian{ font-family:var(--pg-font-display); font-weight:400; font-variation-settings:"opsz" 144; font-size:32px; line-height:1.1; letter-spacing:-.012em; }
.pg-instagram .ig-statement.meridian em{ font-style:italic; }
.pg-instagram .ig-statement.meridian .slash{ color:var(--pg-terracotta); font-style:italic; margin:0 4px; }
.pg-instagram .ig-foot{ display:flex; justify-content:space-between; align-items:center; font-family:var(--pg-font-sans); font-weight:400; text-transform:uppercase; letter-spacing:.22em; font-size:9.5px; }
.pg-instagram .ig-compass{ width:16px; height:16px; opacity:.65; }

.pg-instagram .ig-post.bone{ background:var(--pg-bone-card); color:var(--pg-ink); }
.pg-instagram .ig-post.bone .ig-top, .pg-instagram .ig-post.bone .ig-foot{ color:var(--pg-ink-soft); }
.pg-instagram .ig-post.bone .ig-statement em{ color:var(--pg-terracotta); }
.pg-instagram .ig-post.terracotta{ background:radial-gradient(80% 80% at 50% 60%, rgba(232,200,180,.30), transparent 65%), linear-gradient(180deg, rgba(140,60,40,.95) 0%, rgba(70,30,20,1) 100%); color:var(--pg-bone); }
.pg-instagram .ig-post.terracotta .ig-top, .pg-instagram .ig-post.terracotta .ig-foot{ color:var(--pg-bone-soft); }
.pg-instagram .ig-post.terracotta .ig-statement em{ font-style:italic; color:var(--pg-bone); }
.pg-instagram .ig-post.ink{ background:radial-gradient(60% 60% at 50% 50%, rgba(60,45,32,.40), transparent 70%), var(--pg-ink); color:var(--pg-bone); }
.pg-instagram .ig-post.ink .ig-top, .pg-instagram .ig-post.ink .ig-foot{ color:var(--pg-bone-soft); }
.pg-instagram .ig-post.ink .ig-statement em{ font-style:italic; color:var(--pg-ochre); }
.pg-instagram .ig-post.teal{ background:radial-gradient(70% 70% at 35% 35%, rgba(80,130,130,.30), transparent 65%), linear-gradient(180deg, var(--pg-teal) 0%, rgba(20,38,42,1) 100%); color:var(--pg-bone); }
.pg-instagram .ig-post.teal .ig-top, .pg-instagram .ig-post.teal .ig-foot{ color:var(--pg-bone-soft); }
.pg-instagram .ig-post.filtered{ background:linear-gradient(180deg, rgba(45,35,28,.25) 0%, rgba(26,21,18,.85) 100%), radial-gradient(70% 60% at 50% 40%, rgba(220,180,145,.50), transparent 70%), linear-gradient(135deg, rgba(160,110,85,.85) 0%, rgba(40,30,24,1) 100%); color:var(--pg-bone); }
.pg-instagram .ig-post.filtered .ig-top, .pg-instagram .ig-post.filtered .ig-foot{ color:var(--pg-bone-soft); }
.pg-instagram .ig-post.filtered .ig-statement{ font-family:var(--pg-font-italic); font-style:italic; }
.pg-instagram .ig-post.filtered .ig-statement em{ font-style:normal; color:var(--pg-ochre); }
.pg-instagram .ig-post::before{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none; mix-blend-mode:overlay; opacity:.55; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/><feColorMatrix values='0 0 0 0 0.6  0 0 0 0 0.5  0 0 0 0 0.4  0 0 0 0.14 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }
.pg-instagram .ig-post.bone::before{ display:none; }
.pg-instagram .ig-post > *{ position:relative; z-index:2; }

.pg-instagram .ig-cta-row{ max-width:1440px; margin:0 auto; padding:32px 80px 0; border-top:1px solid var(--pg-ink-hair); display:flex; justify-content:space-between; align-items:center; }
.pg-instagram .ig-cta{ display:inline-flex; align-items:baseline; gap:14px; text-decoration:none; color:var(--pg-ink); position:relative; padding-bottom:14px; }
.pg-instagram .ig-cta .verb{ font-family:var(--pg-font-italic); font-style:italic; font-size:18px; color:var(--pg-terracotta); }
.pg-instagram .ig-cta .label{ font-family:var(--pg-font-sans); font-weight:500; text-transform:uppercase; letter-spacing:.22em; font-size:12px; color:var(--pg-ink); transition:letter-spacing 700ms var(--pg-ease); }
.pg-instagram .ig-cta .arrow{ color:var(--pg-ink); display:inline-flex; transition:transform 700ms var(--pg-ease); }
.pg-instagram .ig-cta .arrow svg{ width:18px; height:12px; }
.pg-instagram .ig-cta::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--pg-terracotta); transform-origin:left center; transform:scaleX(1); transition:transform 800ms var(--pg-ease); }
.pg-instagram .ig-cta:hover .label{ letter-spacing:.26em; }
.pg-instagram .ig-cta:hover .arrow{ transform:translate3d(4px,-2px,0); }
.pg-instagram .ig-cta:hover::after{ transform:scaleX(1.05); }
.pg-instagram .feed-meta{ font-family:var(--pg-font-italic); font-style:italic; font-size:16px; color:var(--pg-ink-soft); }
.pg-instagram .feed-meta em{ color:var(--pg-terracotta); }

@media (prefers-reduced-motion: reduce){ .pg-instagram .feed-track{ animation:none; } }
@media (max-width:1100px){
  .pg-instagram{ padding:140px 0 160px; }
  .pg-instagram .ig-head{ padding:0 40px; }
  .pg-instagram .ig-cta-row{ padding:32px 40px 0; }
  .pg-instagram .feed-track{ padding:0 40px; }
}
@media (max-width:720px){
  .pg-instagram{ padding:80px 0 100px; }
  .pg-instagram .ig-head{ flex-direction:column; align-items:flex-start; gap:24px; padding:0 24px; margin-bottom:48px; }
  .pg-instagram .ig-controls{ align-items:flex-start; }
  .pg-instagram .ig-handle-line{ text-align:left; }
  .pg-instagram .feed-track{ padding:0 24px; gap:16px; }
  .pg-instagram .ig-post{ width:280px; height:280px; padding:18px; }
  .pg-instagram .ig-cta-row{ flex-direction:column; align-items:flex-start; gap:16px; padding:32px 24px 0; }
}