/* =========================================================
   MIYEOL — 인스타그램 피드 + 점주 후기 (instagram.js 짝)
   사이트 토큰(--gold 등)이 있으면 따르고, 없어도 단독으로 보이게 기본값을 둔다.
   ========================================================= */
.ig,.ig-lb,.mi-rv{
  --ig-gold:var(--gold,#c9a35b);
  --ig-gold-l:var(--gold-l,#e8c98a);
  --ig-gold-xl:var(--gold-xl,#f6e4b8);
  --ig-ember:var(--ember,#e0893a);
  --ig-text:var(--text,#efe8dc);
  --ig-text-2:var(--text-2,#c2b8a7);
  --ig-text-3:var(--text-3,#948a7b);
  --ig-bg:var(--bg,#0d0a07);
  --ig-line:rgba(232,201,138,.16);
  --ig-glass:linear-gradient(135deg,rgba(255,240,214,.075),rgba(255,240,214,.02));
  --ig-ring:conic-gradient(from 210deg,#f6e4b8,#e0893a,#c0392b,#c9a35b,#f6e4b8);
  --ig-r:20px;
  --ig-ease:cubic-bezier(.16,1,.3,1);
}
.ig{position:relative;display:flex;flex-direction:column;gap:clamp(28px,4vw,44px)}
.ig-ico{display:inline-flex;width:18px;height:18px;flex:none}
.ig-ico svg,.ig-play svg,.ig-corner svg,.ig-arrow svg,.ig-lb svg{width:100%;height:100%;display:block}

/* ---------- 프로필 카드 ---------- */
.ig-profile{
  position:relative;display:flex;align-items:center;gap:clamp(16px,2.4vw,26px);
  width:100%;max-width:760px;margin:0 auto;padding:clamp(18px,2.4vw,26px) clamp(18px,2.6vw,30px);
  border:1px solid var(--ig-line);border-radius:28px;background:var(--ig-glass);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:0 30px 80px -40px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,244,214,.06);
  overflow:hidden;isolation:isolate;
}
.ig-profile::before{ /* 은은한 앰버 글로우 */
  content:"";position:absolute;z-index:-1;width:320px;height:320px;left:-120px;top:-180px;border-radius:50%;
  background:radial-gradient(circle,rgba(224,137,58,.22),transparent 65%);pointer-events:none;
}
.ig.has-feed .ig-profile{max-width:none}
.ig-avatar{
  position:relative;flex:none;width:clamp(68px,8vw,88px);aspect-ratio:1;border-radius:50%;padding:3px;
  background:var(--ig-ring);
}
.ig-avatar::after{ /* 링 회전 하이라이트 */
  content:"";position:absolute;inset:0;border-radius:50%;padding:3px;background:var(--ig-ring);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:ig-spin 9s linear infinite;opacity:.55;
}
.ig-avatar img{width:100%;height:100%;border-radius:50%;border:3px solid var(--ig-bg);background:#15100b;object-fit:contain;padding:18%}
.ig-avatar img.is-photo{object-fit:cover;padding:0}
@keyframes ig-spin{to{transform:rotate(360deg)}}
.ig-id{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.ig-name{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;font-size:clamp(17px,1.6vw,20px);font-weight:700;letter-spacing:-.01em;color:var(--ig-text);line-height:1.3}
.ig-name small{font-size:12px;font-weight:600;letter-spacing:.08em;color:var(--ig-gold-l);padding:3px 9px;border-radius:99px;background:rgba(201,163,91,.12);border:1px solid rgba(201,163,91,.25)}
.ig-handle{font-size:14px;font-weight:600;color:var(--ig-gold-l);letter-spacing:.01em}
.ig-bio{font-size:13.5px;color:var(--ig-text-2);line-height:1.6}
.ig-followers{font-size:13px;color:var(--ig-text-3)}
.ig-followers b{color:var(--ig-text);font-weight:700;margin-left:3px}
.ig-follow{
  flex:none;display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 22px;border-radius:99px;
  font-size:14.5px;font-weight:700;letter-spacing:-.005em;color:#1a1309;white-space:nowrap;
  background:linear-gradient(120deg,#f6e4b8,#e8c98a 40%,#e0a35a 75%,#e0893a);
  box-shadow:0 10px 30px -12px rgba(224,137,58,.7),inset 0 1px 0 rgba(255,250,236,.7);
  transition:transform .35s var(--ig-ease),box-shadow .35s var(--ig-ease);
}
.ig-follow:hover{transform:translateY(-2px);box-shadow:0 16px 40px -12px rgba(224,137,58,.85),inset 0 1px 0 rgba(255,250,236,.8)}
.ig-follow:active{transform:translateY(0) scale(.98)}
.ig-follow .ig-ico{width:18px;height:18px}

/* ---------- 블록 헤더 ---------- */
.ig-feed{display:flex;flex-direction:column;gap:clamp(30px,4vw,48px)}
.ig-block{display:flex;flex-direction:column;gap:16px;min-width:0;animation:ig-up .8s var(--ig-ease) both}
.ig-block:nth-child(2){animation-delay:.08s}
.ig-block:nth-child(3){animation-delay:.16s}
@keyframes ig-up{from{opacity:0;transform:translate3d(0,24px,0)}to{opacity:1;transform:none}}
.ig-bhead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.ig-btitle{display:flex;align-items:baseline;gap:10px;margin:0;font-family:var(--display,"Cormorant Garamond",serif);font-size:clamp(24px,2.4vw,30px);font-weight:500;font-style:italic;letter-spacing:.02em;color:var(--ig-gold-xl);line-height:1}
.ig-btitle small{font-family:var(--sans,sans-serif);font-style:normal;font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--ig-text-3)}
.ig-bside{display:flex;align-items:center;gap:8px}
.ig-arrow{
  display:none;width:40px;height:40px;padding:11px;border-radius:50%;color:var(--ig-text);
  border:1px solid var(--ig-line);background:rgba(255,240,214,.04);transition:background .3s,border-color .3s,transform .3s var(--ig-ease)
}
.ig-arrow:hover{background:rgba(201,163,91,.14);border-color:rgba(232,201,138,.4);transform:scale(1.06)}
@media (min-width:900px) and (hover:hover){.ig-arrow{display:inline-flex}}
.ig-more{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 16px;border-radius:99px;font-size:13px;font-weight:600;color:var(--ig-text-2);border:1px solid var(--ig-line);transition:color .3s,border-color .3s,background .3s}
.ig-more .ig-ico{width:14px;height:14px}
.ig-more:hover{color:var(--ig-gold-xl);border-color:rgba(232,201,138,.4);background:rgba(201,163,91,.08)}

/* ---------- 릴스 트랙 (9:16) ---------- */
.ig-track{
  display:grid;grid-auto-flow:column;gap:14px;margin:0;padding:4px 2px 10px;list-style:none;
  overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.ig-track::-webkit-scrollbar{display:none}
.ig-track--reels{grid-auto-columns:clamp(176px,58vw,240px)}
@media (min-width:900px){
  .ig-track--reels{grid-auto-columns:calc((100% - 14px*3)/4)}
  .ig-track--reels[data-n="1"],.ig-track--reels[data-n="2"],.ig-track--reels[data-n="3"]{justify-content:center}
}
@media (min-width:1200px){
  .ig-track--reels{grid-auto-columns:calc((100% - 14px*4)/5)}
  .ig-track--reels[data-n="4"]{justify-content:center}
}
.ig-bside .ig-arrow[hidden]{display:none}
.ig-track > li{scroll-snap-align:start;min-width:0}
.ig-card{position:relative;display:block;overflow:hidden;border-radius:var(--ig-r);background:#1d160f;isolation:isolate;transform:translateZ(0);
  box-shadow:0 18px 40px -26px rgba(0,0,0,.9);transition:transform .5s var(--ig-ease),box-shadow .5s var(--ig-ease)}
.ig-card img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ig-ease),filter .5s}
.ig-reel .ig-card{aspect-ratio:9/16}
.ig-card:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 30px 60px -28px rgba(224,137,58,.45)}
.ig-card:hover img{transform:scale(1.06)}
.ig-card:focus-visible{outline:2px solid var(--ig-gold-l);outline-offset:3px}
.ig-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,7,4,.35) 0%,transparent 26%,transparent 52%,rgba(10,7,4,.88) 100%);pointer-events:none}
.ig-play{
  position:absolute;left:50%;top:50%;width:54px;height:54px;padding:16px 15px 16px 18px;margin:-27px 0 0 -27px;border-radius:50%;
  color:#fff;background:rgba(255,248,236,.16);border:1px solid rgba(255,248,236,.35);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  transition:transform .45s var(--ig-ease),background .45s;
}
.ig-card:hover .ig-play{transform:scale(1.12);background:rgba(224,137,58,.55)}
.ig-chip{position:absolute;left:12px;top:12px;display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px 0 8px;border-radius:99px;
  font-size:11.5px;font-weight:700;letter-spacing:.02em;color:#fff;background:rgba(12,9,6,.45);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.ig-chip .ig-ico{width:14px;height:14px}
.ig-cap{position:absolute;left:14px;right:14px;bottom:14px;font-size:13px;line-height:1.5;color:rgba(255,250,240,.92);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 1px 8px rgba(0,0,0,.5)}

/* ---------- 사진 그리드 (정사각) ---------- */
.ig-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(4px,1vw,12px);margin:0;padding:0;list-style:none}
.ig-grid[data-n="1"]{grid-template-columns:minmax(0,420px)}
.ig-grid[data-n="2"]{grid-template-columns:repeat(2,minmax(0,1fr));max-width:840px}
.ig-tile .ig-card{aspect-ratio:1;border-radius:clamp(10px,1.2vw,16px)}
.ig-tile .ig-card:hover{transform:scale(1.025)}
.ig-corner{position:absolute;right:10px;top:10px;width:22px;height:22px;color:#fff;filter:drop-shadow(0 1px 4px rgba(0,0,0,.6))}
.ig-hover{position:absolute;inset:0;display:grid;place-items:center;background:rgba(12,9,6,.42);opacity:0;transition:opacity .4s}
.ig-hover .ig-ico{width:34px;height:34px;color:#fff}
.ig-card:hover .ig-hover,.ig-card:focus-visible .ig-hover{opacity:1}

/* ---------- 공식 임베드 (manualPosts 주소만 넣었을 때) ---------- */
.ig-track--embeds{grid-auto-columns:min(340px,86vw);align-items:start}
.ig-embed .instagram-media{
  min-width:0!important;width:100%!important;max-width:340px!important;margin:0!important;border-radius:var(--ig-r)!important;
  background:#fff;border:0!important;box-shadow:0 18px 40px -26px rgba(0,0,0,.9)!important;overflow:hidden
}
.ig-embed iframe.instagram-media{border-radius:var(--ig-r)!important}
.ig-embed-fallback{display:flex;align-items:center;justify-content:center;gap:8px;min-height:120px;padding:24px;font-size:14px;font-weight:600;color:#1a1309}
.ig-embed-fallback .ig-ico{width:20px;height:20px}

/* ---------- 라이트박스 ---------- */
html.ig-lock,html.ig-lock body{overflow:hidden}
.ig-lb{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:16px;opacity:0;transition:opacity .28s ease}
.ig-lb[hidden]{display:none}
.ig-lb.is-open{opacity:1}
.ig-lb-bg{position:absolute;inset:0;background:rgba(8,6,4,.88);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.ig-lb-panel{
  position:relative;display:flex;flex-direction:column;width:min(440px,100%);max-height:calc(100dvh - 32px);
  border-radius:24px;overflow:hidden;background:#120d09;border:1px solid var(--ig-line);
  box-shadow:0 40px 120px -30px rgba(0,0,0,.9);transform:translateY(16px) scale(.98);transition:transform .45s var(--ig-ease)
}
.ig-lb.is-open .ig-lb-panel{transform:none}
.ig-lb-top{display:flex;align-items:center;gap:10px;padding:12px 12px 12px 16px;border-bottom:1px solid var(--ig-line)}
.ig-lb-user{display:inline-flex;align-items:center;gap:8px;flex:1;min-width:0;font-size:14px;font-weight:700;color:var(--ig-text)}
.ig-lb-user svg{width:20px;height:20px;color:var(--ig-gold-l);flex:none}
.ig-lb-open{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-radius:99px;font-size:12.5px;font-weight:700;color:#1a1309;
  background:linear-gradient(120deg,#f6e4b8,#e8c98a 50%,#e0a35a)}
.ig-lb-open svg{width:14px;height:14px}
.ig-lb-x{width:36px;height:36px;padding:8px;border-radius:50%;color:var(--ig-text);background:rgba(255,240,214,.06);transition:background .3s}
.ig-lb-x:hover{background:rgba(255,240,214,.14)}
.ig-lb-media{
  position:relative;flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:#0b0806;
}
.ig-lb-media::before{ /* 불러오는 동안 표지 + 은은한 반짝임 */
  content:"";position:absolute;inset:0;background:var(--ig-poster,none) center/cover no-repeat;filter:blur(18px) brightness(.55);transform:scale(1.1);transition:opacity .5s
}
.ig-lb-media::after{content:"";position:absolute;left:50%;top:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;
  border:2px solid rgba(255,240,214,.25);border-top-color:var(--ig-gold-l);animation:ig-spin .9s linear infinite}
.ig-lb-media.is-loaded::before,.ig-lb-media.is-loaded::after{opacity:0;animation:none}
.ig-lb-media iframe{position:relative;z-index:1;display:block;width:100%;height:min(78dvh,620px);border:0;background:transparent}
.ig-lb.is-reel .ig-lb-media iframe{height:min(82dvh,760px)}
.ig-lb-nav{position:absolute;top:50%;width:48px;height:48px;margin-top:-24px;padding:13px;border-radius:50%;color:#fff;
  background:rgba(255,248,236,.1);border:1px solid rgba(255,248,236,.22);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .3s,transform .3s var(--ig-ease)}
.ig-lb-nav:hover{background:rgba(224,137,58,.5);transform:scale(1.06)}
.ig-lb-prev{left:max(16px,calc(50% - 220px - 76px))}
.ig-lb-next{right:max(16px,calc(50% - 220px - 76px))}
@media (max-width:599px){
  .ig-lb{padding:0;align-items:end}
  .ig-lb-panel{width:100%;max-height:94dvh;border-radius:22px 22px 0 0;transform:translateY(40px)}
  .ig-lb-nav{top:auto;bottom:calc(94dvh - 48px - 66px);display:none}
}

/* ---------- 모바일 ---------- */
@media (max-width:599px){
  .ig-profile{flex-wrap:wrap;border-radius:24px}
  .ig-id{flex:1 1 calc(100% - 100px)}
  .ig-follow{width:100%;justify-content:center;height:48px}
  .ig-name small{display:none}
  .ig-bhead{align-items:center}
  .ig-more > span:not(.ig-ico){display:none}
  .ig-more{width:40px;padding:0;justify-content:center}
  .ig-cap{font-size:12px}
}

/* =========================================================
   점주 후기 (site-config.js reviews — 비어 있으면 섹션 hidden)
   ========================================================= */
.mi-rv .rv-list{
  display:grid;gap:16px;margin:0;padding:4px 2px 10px;list-style:none;
  grid-auto-flow:column;grid-auto-columns:min(340px,84vw);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain
}
.mi-rv .rv-list::-webkit-scrollbar{display:none}
@media (min-width:900px){
  .mi-rv .rv-list{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible}
  .mi-rv .rv-list[data-n="1"]{grid-template-columns:minmax(0,440px);justify-content:center}
  .mi-rv .rv-list[data-n="2"]{grid-template-columns:repeat(2,minmax(0,420px));justify-content:center}
}
.rv-card{
  position:relative;display:flex;flex-direction:column;gap:18px;scroll-snap-align:start;
  padding:26px 24px 22px;border-radius:24px;border:1px solid var(--ig-line);background:var(--ig-glass);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  animation:ig-up .8s var(--ig-ease) both;animation-delay:calc(var(--i,0)*80ms);
}
.rv-card::before{content:"\201C";position:absolute;right:20px;top:4px;font-family:var(--display,Georgia,serif);font-size:76px;line-height:1;color:rgba(232,201,138,.18);pointer-events:none}
.rv-tag{align-self:flex-start;margin:0;padding:5px 12px;border-radius:99px;font-size:12px;font-weight:700;letter-spacing:.01em;color:#1a1309;background:linear-gradient(120deg,#f6e4b8,#e8c98a 55%,#e0a35a)}
.rv-text{margin:0;flex:1}
.rv-text p{margin:0;font-size:15.5px;line-height:1.8;color:var(--ig-text);white-space:pre-line}
.rv-meta{display:flex;align-items:center;gap:12px;padding-top:16px;border-top:1px solid var(--ig-line)}
.rv-photo{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none;border:1px solid var(--ig-line)}
.rv-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;flex:none;font-family:var(--display,Georgia,serif);font-style:italic;font-size:14px;color:var(--ig-gold-xl);background:rgba(201,163,91,.12);border:1px solid rgba(201,163,91,.3)}
.rv-who{display:flex;flex-direction:column;min-width:0;line-height:1.4}
.rv-who b{font-size:14.5px;font-weight:700;color:var(--ig-text)}
.rv-who span{font-size:12.5px;color:var(--ig-text-3)}

@media (prefers-reduced-motion:reduce){
  .ig-avatar::after,.ig-block,.rv-card,.ig-lb-media::after{animation:none}
  .ig-card,.ig-card img,.ig-play,.ig-follow,.ig-lb-panel{transition:none}
  .ig-card:hover,.ig-card:hover img{transform:none}
}
