/* Home page: dark opening and the four tools */
:root{--night:#141c26;--night-2:#1c2733;--gilt-lt:#cdb072;--vellum-ink:#f3f1ea}
.hero{background:radial-gradient(1200px 600px at 78% 30%,#26364a 0%,var(--night) 62%);color:var(--vellum-ink);padding:84px 0 96px;position:relative}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,transparent,var(--gilt-lt) 18%,var(--gilt-lt) 82%,transparent);opacity:.55}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:64px;align-items:center}
.hero h1{font-size:clamp(2.7rem,5.4vw,4.4rem);line-height:1.06;letter-spacing:-.01em;color:#fbf9f3;font-weight:500}
.hero .h1-sub{display:block;font-size:.46em;font-style:italic;color:var(--gilt-lt);margin-top:.55em;font-weight:400;letter-spacing:.01em}
.hero .sub{font-size:1.28rem;color:#d3d6db;margin:26px 0 32px;max-width:34ch;font-style:normal;line-height:1.55}
.hero .actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:22px}
.btn-light{background:#f3f1ea;color:#141c26;border-color:#f3f1ea}
.btn-light:hover{background:#fff;color:#141c26}
.btn-ghost{background:transparent;color:#f3f1ea;border-color:rgba(205,176,114,.7)}
.btn-ghost:hover{background:rgba(205,176,114,.14);color:#fff}
.hero .note{font-size:1.02rem;color:#b9bec7;max-width:44ch;margin:0 0 6px}
.hero .note a{color:var(--gilt-lt)}
.hero .byline{font-size:.98rem;color:#8f98a5;margin:18px 0 0;font-variant:small-caps;letter-spacing:.04em}
.specimen{margin:0}
.sheet{background:#f3f1ea;padding:0;border-radius:5px;box-shadow:0 30px 60px -24px rgba(0,0,0,.65),0 0 0 1px rgba(205,176,114,.35);aspect-ratio:1500/576;overflow:hidden;position:relative}
.sheet img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 97%}
.specimen figcaption{margin-top:18px;font-size:1.04rem;color:#c4c9d1;line-height:1.55;max-width:56ch}
.specimen figcaption b{color:#f3f1ea;font-weight:500}
.specimen figcaption a{color:var(--gilt-lt)}

/* the word of God */
.epigraph{background:var(--vellum);padding:56px 0 52px;text-align:center;border-bottom:1px solid var(--rule)}
.epigraph .ep-lead{font-size:1.3rem;color:var(--ink);max-width:46ch;margin:0 auto 30px;line-height:1.5}
.epigraph .ep-quote{margin:0 auto;max-width:52ch;padding:0}
.epigraph .ep-greek{font-size:1.5rem;line-height:1.55;margin:0 0 12px;color:var(--ink)}
.epigraph .ep-en{font-size:1.2rem;font-style:italic;line-height:1.55;color:var(--ink-soft);margin:0}
.epigraph .ep-cite{margin:16px 0 0;font-size:1.02rem;letter-spacing:.04em;color:var(--gilt)}

/* tools */
.tools{background:var(--stone);padding:88px 0 80px}
.tools .head{margin-bottom:36px}
.toolgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.tool{display:grid;grid-template-columns:200px minmax(0,1fr);gap:0;background:var(--vellum);border:1px solid var(--rule);text-decoration:none;color:var(--ink);position:relative;transition:border-color .15s,box-shadow .15s,transform .15s}
.tool:hover{border-color:var(--rubric);box-shadow:0 18px 34px -24px rgba(31,42,54,.55);color:var(--ink)}
.tool-viz{background:#ebe8df;border-right:1px solid var(--rule);padding:22px 16px 16px;display:flex;flex-direction:column;justify-content:space-between;gap:12px}
.tool-body{padding:22px 24px 22px}
.tool h3{font-size:1.5rem;margin-bottom:8px}
.tool p{font-size:1.06rem;line-height:1.55;color:var(--ink-soft);margin:0 0 14px}
.tool .go{color:var(--rubric);font-size:1.05rem;border-bottom:1px solid currentColor;padding-bottom:1px}
.tool .go::after{content:" \203A"}
.tool:hover .go{color:var(--rubric-dark)}
.viz{width:100%;height:auto;display:block}
.viz .d1{fill:var(--rubric)}.viz .d2{fill:var(--r1,#2f5d7c)}
.viz .b-byz{fill:#4d6b4a}.viz .b-crit{fill:#2f5d7c}.viz .b-tr{fill:#8c7343}.viz .b-ms{fill:var(--rubric)}
.viz .bl{font-size:6.6px;fill:var(--ink-soft);font-family:"EB Garamond",serif}.viz .bl.c{text-anchor:middle}
.viz-cap{font-size:.86rem!important;line-height:1.35!important;margin:0!important;color:var(--ink-soft)}
.k{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:4px;vertical-align:baseline}.k1{background:var(--rubric)}.k2{background:#2f5d7c;margin-left:6px}
.fake-search{display:flex;flex-direction:column;gap:3px}
.fs-label{font-size:.8rem;color:var(--ink-soft)}
.fs-box{background:#f3f1ea;border:1px solid var(--rule);border-radius:3px;padding:5px 8px;font-size:.98rem;margin-bottom:7px;line-height:1.3}
.fs-box.greek{font-family:"GFS Didot",serif;font-size:1.1rem}

.colophon{display:flex;align-items:center;gap:24px;margin-top:30px}
.colophon img{width:150px;height:150px;border-radius:50%;background:#f3f1ea;padding:4px;flex:none}
.hero .colophon .byline{margin:0;max-width:34ch;line-height:1.4}
.viz .bl{font-size:7.6px}
.tool{grid-template-columns:224px minmax(0,1fr)}
.tool-viz{justify-content:flex-start}
.tool-viz .viz,.tool-viz .fake-search{margin-top:4px;margin-bottom:auto}
.viz-cap{margin-top:auto!important}
.hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
.sheet{aspect-ratio:1500/576}

/* responsive rules last, so they win over the base rules above */
@media (max-width:1060px){.toolgrid{grid-template-columns:1fr}}
@media (max-width:900px){.hero{padding:56px 0 64px}.hero-grid{grid-template-columns:1fr;gap:44px}}
@media (max-width:560px){.tool{grid-template-columns:1fr}.tool-viz{border-right:0;border-bottom:1px solid var(--rule);flex-direction:row;align-items:flex-end;gap:18px}.tool-viz .viz,.tool-viz .fake-search{flex:1 1 55%;max-width:55%;margin:0}.viz-cap{flex:1 1 40%;margin:0!important}.hero .sub,.hero .note{max-width:none}}
@media (max-width:560px){.epigraph{padding:40px 0 38px}.epigraph .ep-lead{font-size:1.2rem;margin-bottom:24px}.epigraph .ep-greek{font-size:1.3rem}.epigraph .ep-en{font-size:1.1rem}}
