/* Cards, tags, glow edges, fields. Reference: components/content/GlowCard.jsx, Tag.jsx, posts/PostCard.jsx, forms/Input.jsx */

/* ---------- Eyebrow variants ---------- */
.eyebrow{color:var(--accent)}
.eyebrow--muted{color:var(--fg-3)}
.eyebrow--faint{color:var(--fg-4)}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Stretched link (card = one target, tags stay clickable) ---------- */
.stretch{color:inherit;text-decoration:none}
.stretch::after{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit}
.tags{position:relative;z-index:2;display:flex;gap:6px;flex-wrap:wrap}

/* ---------- Tag pill ---------- */
.tag{display:inline-flex;align-items:center;height:32px;padding:0 14px;border-radius:var(--radius-pill);font-family:var(--font-sans);font-size:13.5px;font-weight:var(--fw-medium);letter-spacing:-0.005em;text-decoration:none;white-space:nowrap;color:var(--fg-2);box-shadow:inset 0 0 0 1px var(--border-default);transition:color var(--dur-fast),box-shadow var(--dur-fast)}
.tag--sm{height:26px;padding:0 10px;font-size:12px}
.tag:hover{color:var(--fg-1);box-shadow:inset 0 0 0 1px var(--border-strong)}
.tag--metal{background:var(--metal-face)}

/* ---------- Glow card ---------- */
.glow{position:relative;isolation:isolate;border-radius:var(--radius-lg);transition:transform var(--dur-slow) var(--ease-out)}
.glow__inner{position:relative;border-radius:inherit;background:var(--surface-card);box-shadow:var(--shadow-card),inset 0 0 0 1px var(--border-subtle);overflow:hidden;height:100%;transition:box-shadow var(--dur-slow) var(--ease-out)}
.glow--interactive:hover{transform:translateY(-3px)}
.glow--interactive:hover .glow__inner{box-shadow:var(--shadow-card),inset 0 0 0 1px var(--border-default)}
/* horizon: warm halo cresting the top, violet pooling below, plus 1px light lines */
.glow--horizon::before{content:"";position:absolute;left:8%;right:8%;top:-46px;height:92px;border-radius:50%;background:radial-gradient(50% 50% at 50% 50%,var(--halo) 0%,var(--glow-a,var(--ember-500)) 35%,transparent 75%);filter:blur(22px);opacity:.7;z-index:-1;pointer-events:none;transition:opacity var(--dur-slow)}
.glow--horizon::after{content:"";position:absolute;left:14%;right:14%;bottom:-50px;height:100px;border-radius:50%;background:radial-gradient(50% 50% at 50% 50%,var(--glow-b,var(--violet-500)) 0%,transparent 72%);filter:blur(26px);opacity:.6;z-index:-1;pointer-events:none;transition:opacity var(--dur-slow)}
.glow--horizon.glow--interactive:hover::before{opacity:.95}
.glow--horizon.glow--interactive:hover::after{opacity:.9}
.glow--horizon .glow__inner::before{content:"";position:absolute;left:10%;right:10%;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--glow-a,var(--ember-500)),var(--halo),var(--glow-a,var(--ember-500)),transparent);z-index:3;pointer-events:none}
.glow--horizon .glow__inner::after{content:"";position:absolute;left:18%;right:18%;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--glow-b,var(--violet-500)),transparent);z-index:3;pointer-events:none}

/* ---------- Cover post card (Recent) ---------- */
.post-card--cover .post-card__inner{display:grid;align-content:end;min-height:420px;padding:28px;background:var(--surface-raised)}
.post-card__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:var(--img-hero);transform:scale(1.001);transition:transform var(--dur-slow) var(--ease-out),filter var(--dur-slow) var(--ease-out)}
.post-card__scrim{position:absolute;inset:0;z-index:0;background:var(--scrim-card)}
.post-card__body{position:relative;z-index:1;display:grid;gap:12px}
.post-card__title{margin:0;font:var(--fw-display) 24px/1.15 var(--font-display);letter-spacing:-0.025em;color:var(--fg-1);text-wrap:balance;text-shadow:0 1px 18px rgba(0,0,0,.5)}
.post-card__excerpt{margin:0;font-family:var(--font-sans);font-size:15.5px;line-height:1.5;color:var(--fg-2);text-wrap:pretty;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.post-card__meta{display:flex;align-items:center;gap:12px}
.post-card__arrow{margin-left:auto;--icon:20px;color:var(--fg-3);transition:color var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
.post-card--cover:hover .post-card__img{filter:var(--img-card-hover);transform:scale(1.04)}
.post-card--cover:hover .post-card__arrow{color:var(--fg-1);transform:translate(2px,-2px)}

/* ---------- Archive row ---------- */
.post-row{position:relative;display:grid;grid-template-columns:clamp(112px,16vw,200px) minmax(0,1fr) auto;gap:clamp(16px,3vw,32px);align-items:stretch;padding:16px 0;border-top:1px solid var(--border-subtle)}
.post-row__thumb{position:relative;display:block;min-height:clamp(96px,11vw,124px);height:100%;border-radius:12px;overflow:hidden;isolation:isolate;background:var(--metal-face)}
.post-row__thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:var(--img-card);transition:transform var(--dur-slow) var(--ease-out),filter var(--dur-slow) var(--ease-out)}
.post-row__thumb::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:12px;background:linear-gradient(180deg,rgba(6,7,9,0) 35%,rgba(6,7,9,.85) 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.post-row__date{position:absolute;left:10px;bottom:9px;font-size:10px;letter-spacing:.12em;white-space:nowrap;color:var(--fg-1)}
.post-row__body{display:grid;gap:10px;align-content:center}
.post-row__title{margin:0;font:var(--fw-display) clamp(17px,2.2vw,24px)/1.18 var(--font-display);letter-spacing:-0.025em;color:var(--fg-1);text-wrap:balance;transition:color var(--dur-fast)}
.post-row__arrow{align-self:center;--icon:22px;color:var(--fg-4);transition:color var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
.post-row:hover .post-row__title{color:var(--ink-1000)}
.post-row:hover .post-row__thumb img{filter:var(--img-card-hover);transform:scale(1.05)}
.post-row:hover .post-row__arrow{color:var(--fg-1);transform:translate(2px,-2px)}

/* ---------- Metal button + field ---------- */
.btn--metal{background:var(--metal-face);color:var(--ink-800);box-shadow:var(--shadow-metal)}
.btn--metal::after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--metal-sheen);pointer-events:none}
.btn--metal:hover{color:var(--ink-1000)}
.btn--metal:hover::before{background:conic-gradient(from var(--rd-angle),#ffffff,#8b8e96 12%,#3D6BFF 20%,#2c2e33 30%,#e6e7ea 42%,#A884FF 52%,#5b5e66 60%,#F08A4B 70%,#ffffff 80%,#2c2e33 90%,#ffffff);animation:rd-chase 9s linear infinite}
.btn .icon{--icon:18px;position:relative;z-index:1}

.field{position:relative;display:flex;align-items:center;gap:10px;height:48px;padding:0 6px 0 20px;border-radius:var(--radius-pill);background:var(--ink-0);box-shadow:inset 0 0 0 1px var(--border-default);transition:box-shadow var(--dur-base) var(--ease-out)}
.field--lg{height:60px}
.field:focus-within{box-shadow:0 0 24px -8px rgba(168,132,255,.5)}
.field::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:var(--rim);background:conic-gradient(from var(--rd-angle),#ffffff,#8b8e96 12%,#3D6BFF 20%,#2c2e33 30%,#e6e7ea 42%,#A884FF 52%,#5b5e66 60%,#F08A4B 70%,#ffffff 80%,#2c2e33 90%,#ffffff);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity var(--dur-base);pointer-events:none}
.field:focus-within::before{opacity:1}
.field__input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--fg-1);font-family:var(--font-sans);font-size:17px;letter-spacing:-0.01em}
.field__input::placeholder{color:var(--fg-4)}
.field__submit{width:48px;height:48px;--icon:19px;z-index:1}