/* ==========================================================================
   Neo-Digital Futurism — future-facing, quietly technological.
   Light grey #F4F4F0 · deep black #111218 · violet #7454FF · lime #B9FF45
   Geometric sans with mono labels; a generative opening field, then a clean,
   conventional index. Motion is optional and honours reduced-motion.
   ========================================================================== */

:root {
    --art-bg: #f4f4f0; --art-surface: #e8e8e2; --art-text: #111218; --art-heading: #111218; --art-muted: #61636d;
    --art-link: #111218; --art-link-hover: #7454ff; --art-accent: #7454ff; --art-accent-2: #b9ff45; --art-price: #111218;
    --art-font: Geist, "Space Grotesk", Arial, sans-serif; --art-size: 16px;
    --art-heading-font: "Space Grotesk", Geist, Arial, sans-serif; --art-heading-weight: 500; --art-heading-case: none;
    --art-meta-font: "Geist Mono", "JetBrains Mono", monospace;
    --art-header-bg: #f4f4f0; --art-header-text: #111218; --art-header-hover: #7454ff; --art-header-rule: #111218; --art-header-rule-w: 0px;
    --art-title-font: "Space Grotesk", sans-serif; --art-title-size: 20px; --art-title-weight: 600; --art-title-case: none; --art-title-tracking: -0.5px; --art-logo-h: 44px;
    --art-nav-font: "Geist Mono", monospace; --art-nav-size: 13px; --art-nav-weight: 400; --art-nav-case: none; --art-nav-tracking: 0px;
    --art-footer-bg: #111218; --art-footer-text: #a5a7b2; --art-footer-link: #f4f4f0; --art-footer-hover: #b9ff45;
    --art-footer-rule: #7454ff; --art-footer-rule-w: 2px; --art-footer-font: "Geist Mono", monospace; --art-footer-size: 13px; --art-footer-case: none;
    --art-gallery-gap: 24px;
    --art-max: 1400px;
    --nd-radius: 14px;
}

body { line-height: 1.6; }
h1, h2, h3 { letter-spacing: -.03em; line-height: 1.02; }
::selection { background: var(--art-accent-2); color: var(--art-text); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--art-accent); outline-offset: 3px; }

.nd-mono { font: 400 12px/1.4 var(--art-meta-font); letter-spacing: .02em; color: var(--art-muted); }
.nd-dot { display: inline-block; width: 8px; height: 8px; margin-right: .6em; border-radius: 50%; background: var(--art-accent-2); box-shadow: 0 0 0 3px rgba(185, 255, 69, .3); vertical-align: 1px; }

/* Header: frosted when sticky */
.art-header { backdrop-filter: blur(10px); background: color-mix(in srgb, var(--art-header-bg) 86%, transparent); }
.art-brand a::after { content: "_"; color: var(--art-accent); }
.art-menu .nav-link::before { content: "/"; margin-right: .2em; color: var(--art-accent); opacity: 0; transition: opacity .2s; }
.art-menu .nav-link:hover::before, .art-menu .current-menu-item > .nav-link::before, .art-menu .nav-link.active::before { opacity: 1; }
.art-toggler { border: 1px solid var(--art-text); border-radius: 999px; padding: .3rem .9rem; font-family: var(--art-meta-font); }

/* Opening field */
.nd-field { position: relative; display: flex; align-items: flex-end; min-height: min(78vh, 760px); margin-bottom: 4.5rem; overflow: hidden; border-radius: var(--nd-radius); background: var(--art-surface); touch-action: pan-y; }
.nd-field__canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.nd-field__text { position: relative; z-index: 1; max-width: 760px; padding: clamp(1.4rem, 4vw, 3.5rem); pointer-events: none; }
.nd-field__text a { pointer-events: auto; }
.nd-field__title { margin: .8rem 0 1rem; font-size: clamp(52px, 10vw, 148px); font-weight: 500; line-height: .9; letter-spacing: -.055em; }
.nd-field__lede { max-width: 34em; margin: 0 0 1.6rem; font-size: 17px; color: var(--art-text); }
.nd-button { display: inline-flex; align-items: center; gap: .5rem; padding: .7rem 1.2rem; border-radius: 999px; background: var(--art-text); color: var(--art-bg); font: 400 13px var(--art-meta-font); text-decoration: none; transition: background .2s, color .2s; }
.nd-button:hover { background: var(--art-accent-2); color: var(--art-text); }
.nd-field__toggle { position: absolute; z-index: 2; top: 1rem; right: 1rem; padding: .35rem .8rem; border: 1px solid currentColor; border-radius: 999px; background: color-mix(in srgb, var(--art-bg) 80%, transparent); cursor: pointer; }
.nd-field__toggle:hover { color: var(--art-accent); }

/* Index: one interaction per project — the preview window follows the pointer */
.nd-index { margin-bottom: 4.5rem; }
.nd-index__head { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: .8rem; border-bottom: 1px solid var(--art-text); }
.nd-index__title { margin: 0; font-size: clamp(32px, 4vw, 56px); }
.nd-rows { margin: 0; padding: 0; list-style: none; }
.nd-row {
    --nd-x: 60%;
    position: relative; display: grid; grid-template-columns: 4rem minmax(0, 1fr) minmax(0, 16rem) 4rem; gap: 1rem; align-items: baseline;
    padding: 1.1rem 0; border-bottom: 1px solid rgba(17, 18, 24, .15); color: var(--art-text); text-decoration: none; transition: padding .25s, color .2s;
}
.nd-row__title { font: 500 clamp(22px, 2.8vw, 38px)/1.05 var(--art-heading-font); letter-spacing: -.03em; }
.nd-row__count { text-align: right; }
.nd-row__preview {
    position: absolute; z-index: 3; top: 50%; left: var(--nd-x); width: 220px; pointer-events: none;
    padding: 6px; border-radius: 10px; background: var(--art-text); box-shadow: 0 18px 40px rgba(17, 18, 24, .25);
    opacity: 0; transform: translate(-50%, -50%) scale(.92); transition: opacity .2s, transform .2s;
}
.nd-row__preview img { width: 100%; border-radius: 6px; }
.nd-row:hover, .nd-row:focus-visible { color: var(--art-accent); padding-left: .6rem; }
.nd-row:hover .nd-row__num, .nd-row:focus-visible .nd-row__num { color: var(--art-accent); }
.nd-row:hover .nd-row__preview, .nd-row:focus-visible .nd-row__preview { opacity: 1; transform: translate(-50%, -50%) scale(1); }
@media (hover: none), (max-width: 767.98px) {
    .nd-row { grid-template-columns: 2.6rem minmax(0, 1fr) 72px; }
    .nd-row__meta, .nd-row__count { display: none; }
    .nd-row__preview { position: static; grid-column: 3; grid-row: 1; width: 72px; padding: 0; background: none; box-shadow: none; opacity: 1; transform: none; align-self: center; }
    .nd-row__preview img { width: 72px; height: 72px; aspect-ratio: 1 !important; object-fit: cover; }
}
@media (prefers-reduced-motion: reduce) { .nd-row, .nd-row__preview, .nd-button { transition: none; } }

/* Shared sections */
.art-home-section__head { border-bottom: 1px solid var(--art-text); padding-bottom: .6rem; }
.art-home-section__head .edith-section-title { font-size: clamp(28px, 3.2vw, 44px); }
.edith-more { font-family: var(--art-meta-font); font-size: 13px; }
.edith-card__media { border-radius: var(--nd-radius); overflow: hidden; }
.edith-card__price { font-family: var(--art-meta-font); display: inline-block; padding: .05rem .5rem; border-radius: 999px; background: var(--art-accent-2); }
.art-news-list__num { color: var(--art-accent); }
.art-news-list__date { font-family: var(--art-meta-font); }
.art-news-list__title { font: 500 20px var(--art-heading-font); }

/* Pages */
.edith-page__title, .edith-post__title { font-size: clamp(40px, 6vw, 92px); letter-spacing: -.05em; }
.art-project-meta { font-family: var(--art-meta-font); color: var(--art-muted); }
.art-project-meta__num { color: var(--art-accent); }
.fran-artwork img { border-radius: 8px; }
.fran-artwork__caption { font-family: var(--art-meta-font); font-size: 11px; }
.fran-contact .form-control { border-radius: 10px; }
.btn { border-radius: 999px; }

.art-footer__name { font-family: var(--art-heading-font); font-size: 22px; color: var(--art-footer-link); }
.art-footer__label { color: var(--art-footer-hover); opacity: 1; }

:root { --art-lightbox-bg: rgba(17, 18, 24, .96); --art-lightbox-text: #f4f4f0; }
