/* Grid quilt hero: Great Big Yarn
   Everything is scoped to .gby-quilt so it can't affect the rest of the page.
   Layout: the quilt fills the section's full width (16 x 6 blocks; 8 x 12 under 640px).
   The caption row sits in a centered container: 1320px, 1600px on screens 1920px and wider. */
.gby-quilt{
  --gbyq-flame:#F73F12; --gbyq-blush:#FDAACF; --gbyq-amber:#FDCE08; --gbyq-emerald:#0ABE72;
  --gbyq-turquoise:#00DED3; --gbyq-laser:#0A5FE6; --gbyq-violet:#DC8AE7;
  --gbyq-paper:#F4ECDC; --gbyq-ink:#000000; --gbyq-muted:#5C564C; --gbyq-panel:#FBF7EF;
  /* Use the family names your site already loads */
  --gbyq-serif:"Romie",Georgia,"Times New Roman",serif;
  --gbyq-sans:"Be Vietnam","Helvetica Neue",Arial,sans-serif;
  --gbyq-gutter:clamp(16px,3vw,40px);
  display:grid;gap:clamp(14px,2vw,24px);padding:0 0 clamp(16px,2.5vw,28px);
  background:var(--gbyq-paper);color:var(--gbyq-ink);font-family:var(--gbyq-sans);
}
.gby-quilt *{box-sizing:border-box}
.gby-quilt .gbyq-art{position:relative;line-height:0}
.gby-quilt .gbyq-svg{width:100%;height:auto;display:block}
.gby-quilt .gbyq-blk{transform-box:fill-box;transform-origin:center}
.gby-quilt .gbyq-anim .gbyq-blk{animation:gbyq-piece .45s cubic-bezier(.2,.8,.2,1) both}
.gby-quilt .gbyq-blk polygon{stroke:var(--gbyq-paper);stroke-width:1.25;vector-effect:non-scaling-stroke}
@keyframes gbyq-piece{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.gby-quilt .gbyq-anim .gbyq-blk{animation:none}}

.gby-quilt .gbyq-meta{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"cap btn" "leg leg";gap:16px 32px;align-items:end;width:min(1320px,100% - 2 * var(--gbyq-gutter));margin-inline:auto}
@media (min-width:1920px){.gby-quilt .gbyq-meta{width:min(1600px,100% - 2 * var(--gbyq-gutter))}}
@media (max-width:820px){.gby-quilt .gbyq-meta{grid-template-columns:1fr;grid-template-areas:"cap" "leg" "btn"}.gby-quilt .gbyq-about-btn{justify-self:start}}
.gby-quilt .gbyq-cap{grid-area:cap}
.gby-quilt .gbyq-date{font-family:var(--gbyq-sans);font-weight:500;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--gbyq-muted);margin:0 0 4px}
.gby-quilt .gbyq-caption{font-family:var(--gbyq-serif);font-weight:700;font-size:clamp(24px,2.6vw,36px);line-height:1.06;letter-spacing:-.01em;margin:0;max-width:34ch;text-wrap:balance;color:var(--gbyq-ink)}
.gby-quilt .gbyq-legend{grid-area:leg;list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 16px;font-size:14px;font-weight:400}
.gby-quilt .gbyq-legend li{display:flex;gap:6px;align-items:center;white-space:nowrap;margin:0}
.gby-quilt .gbyq-swatch{width:10px;height:10px;display:block;clip-path:polygon(0 0,100% 0,50% 100%)}
.gby-quilt .gbyq-about-btn{grid-area:btn;appearance:none;border:2px solid var(--gbyq-ink);background:transparent;color:var(--gbyq-ink);font:700 16px/16px var(--gbyq-sans);text-transform:uppercase;padding:15px 30px;border-radius:0;cursor:pointer;white-space:nowrap}
.gby-quilt .gbyq-about-btn:hover{background:var(--gbyq-ink);color:var(--gbyq-paper)}
.gby-quilt .gbyq-about-btn:focus-visible,.gby-quilt .gbyq-close:focus-visible{outline:2px solid var(--gbyq-laser);outline-offset:2px}

.gby-quilt .gbyq-tip{position:absolute;pointer-events:none;background:var(--gbyq-panel);border:1px solid var(--gbyq-ink);padding:9px 11px;font-size:13px;line-height:1.45;min-width:170px;box-shadow:0 6px 24px rgba(0,0,0,.12);opacity:0;transition:opacity .12s;z-index:3}
.gby-quilt .gbyq-tip.gbyq-on{opacity:1}
.gby-quilt .gbyq-tip b{display:block;font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;margin-bottom:3px}
.gby-quilt .gbyq-tip div{display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center;font-variant-numeric:tabular-nums}

.gby-quilt .gbyq-dialog{border:2px solid var(--gbyq-ink);padding:0;max-width:min(640px,calc(100vw - 32px));width:100%;max-height:calc(100vh - 32px);background:var(--gbyq-paper);color:var(--gbyq-ink);border-radius:0;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.gby-quilt .gbyq-dialog::backdrop{background:rgba(0,0,0,.45)}
.gby-quilt .gbyq-sheet{padding:32px clamp(20px,4vw,40px);font-size:16px;line-height:1.54;font-weight:300;font-family:var(--gbyq-sans)}
.gby-quilt .gbyq-sheet h3{font-family:var(--gbyq-serif);font-weight:700;font-size:34px;line-height:1.06;letter-spacing:-.01em;margin:0 0 14px;text-wrap:balance}
.gby-quilt .gbyq-sheet h4{font-family:var(--gbyq-sans);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--gbyq-muted);margin:22px 0 6px}
.gby-quilt .gbyq-sheet p{margin:0 0 10px;max-width:62ch}
.gby-quilt .gbyq-sheet a{color:inherit}
.gby-quilt .gbyq-key{display:flex;gap:16px;align-items:center;margin:8px 0 6px}
.gby-quilt .gbyq-key svg{width:84px;height:84px;flex:none}
.gby-quilt .gbyq-key p{margin:0;font-size:14px;color:var(--gbyq-muted)}
.gby-quilt .gbyq-close{position:sticky;top:0;float:right;margin:12px 12px 0 0;appearance:none;border:2px solid var(--gbyq-ink);background:var(--gbyq-paper);color:var(--gbyq-ink);width:40px;height:40px;border-radius:0;font-size:18px;line-height:1;cursor:pointer}
.gby-quilt .gbyq-credit{font-size:14px;color:var(--gbyq-muted);border-top:1px solid var(--gbyq-ink);padding-top:12px;margin-top:20px}

.gby-quilt [hidden] { display:none !important; }
.gby-quilt .gbyq-fallback { display:block; width:100%; height:auto; }
.gby-quilt .gbyq-tip:not([hidden]) { opacity:1; max-width:calc(100% - 8px); }
.gby-quilt .gbyq-blk { cursor:help; }
.gby-quilt .gbyq-blk:focus { outline:none; }
.gby-quilt .gbyq-blk:focus-visible polygon { stroke:var(--gbyq-ink); stroke-width:2.5; }
.gby-quilt .gbyq-status { grid-column:1/-1; margin:0; font-size:14px; line-height:1.5; color:var(--gbyq-muted); }
.gby-quilt .gbyq-close { width:44px; height:44px; }
.gby-quilt[data-motion-paused] .gbyq-blk { animation-play-state:paused; }

.gby-quilt .gbyq-fallback img { display:block; width:100%; height:auto; }