/* ============================================================================
   XXVI — V18 (task 013): David's design choices from TASTE_IDEAS, in one layer loaded last.
   The fonts themselves (Geist, Geist Mono, Heebo, Bodoni Moda) are declared in brand.css.
   ========================================================================== */

/* 2 · THE MARK = logo 05.1 (icons.html): Bodoni Moda 400 at its display optical size, .34em, the letters #E9EAED,
   the V upright in a soft champagne #D2BC92. Header 25 px on a phone and 30 px from 821 px (as David saw it in the
   header pictures of task 011); the footers keep their own small sizes. */
.mark, .sysfoot .fm, .endline .el-mk{
  font-family:'Bodoni Moda XXVI', Didot, "Bodoni 72", Georgia, serif;
  font-weight:400; font-variation-settings:'opsz' 96; font-style:normal;
}
.mark{ font-size:25px; letter-spacing:.34em; padding-inline-end:.34em; color:#E9EAED; line-height:1; }
@media(min-width:821px){ .mark{ font-size:30px; } }
[dir="rtl"] .mark{ letter-spacing:.34em; }
.mark .gv, .sysfoot .fm i, .endline .el-mk i{ font-style:normal; color:#D2BC92; }
.sysfoot .fm{ font-size:15px; letter-spacing:.34em; }
.endline .el-mk{ font-size:15px; line-height:16px; letter-spacing:.34em; margin-right:-.34em; }

/* 7 · THE CURSOR = ז 06: a thin gold crosshair, open at the centre, on a desktop pointer only. Links, buttons and
   anything that already asks for a hand keep the system's own pointer; text fields keep the text cursor. A cursor
   image does not move, so reduced motion is unaffected. Touch devices never match this query. */
@media (hover:hover) and (pointer:fine){
  html, body{
    cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='21' viewBox='0 0 21 21'%3E%3Cpath d='M10.5 0V8.5M10.5 12.5V21M0 10.5H8.5M12.5 10.5H21' stroke='%23C9A876' stroke-opacity='.85' stroke-width='1' fill='none'/%3E%3C/svg%3E") 10 10, crosshair;
  }
  a, button, [role="button"], label, summary, select{ cursor:pointer; }
  input, textarea{ cursor:text; }
}

/* 8 · THE QUIET PRESS = ז 09, on W2 (WRITE) and EN/HE: hover turns them light gold in .18 s (a desktop pointer
   only), a press gives a little (.96) for .14 s on every device. Replaces task 004's white hover on W2 (I6) and its
   .16 s press; reduced motion keeps the colour and drops the shrink, as before (emil004.css). */
.langs button{ transition:color .18s var(--e15, ease), scale .14s var(--e15, ease); }
.wa{ transition:color .18s var(--e15, ease), scale .14s var(--e15, ease); }
.wa .wtx{ transition:color .18s var(--e15, ease); }
.langs button:active, .wa:active{ scale:.96; }
@media (hover:hover) and (pointer:fine){
  .wa:hover .wtx{ color:#EEDCB4; }
  .langs button:hover{ color:#EEDCB4; }
}
@media (prefers-reduced-motion:reduce){ .langs button:active, .wa:active{ scale:none; } }

/* 10 · THE OPENING, ENGLISH ONLY = round2 version 02: "From ideas to" is a small grey label above the big line,
   which keeps today's size; the big line takes ב 05's tighter tracking. Phone 22 px (David, task 013 Q1), 26 px
   from 821 px. Hebrew is exactly as today. The entrance (opacity and the 4 px rise, hero-r27.js) is unchanged. */
html:not([dir="rtl"]) .type h1{ letter-spacing:-.04em; }
html:not([dir="rtl"]) .type h1 .ln:first-child{
  display:block; font-family:var(--display); font-weight:400; font-size:22px; line-height:1.2;
  letter-spacing:-.01em; color:var(--ink-2); margin-bottom:14px; white-space:nowrap;
}
@media(min-width:821px){ html:not([dir="rtl"]) .type h1 .ln:first-child{ font-size:26px; margin-bottom:22px; } }

/* 10 · the two small gold lines are gone in both languages: the rule above the headline and the tick before the
   audience line (its markup is also gone from shell.js; this keeps any cached copy clean too). */
.type:before{ content:none; display:none; }
.type .aud .tick{ display:none; }

/* 11 · THE LEGAL LINE: one small dim line at the very bottom, under the endline (David: almost unnoticeable, the
   minimum the law needs). 12 px, #8A909B on the ground (5.9:1), links focusable with a visible ring. */
.endline{ flex-wrap:wrap; row-gap:2px; padding-block-start:12px; }
.legal18{ flex:1 0 100%; margin:0; padding:0 0 10px; font:400 12px/1.6 var(--display); color:#8A909B; text-align:start; }
.legal18 nav{ display:inline; }
.legal18 a{ color:#8A909B; text-decoration:none; border-bottom:1px solid rgba(138,144,155,.35); }
.legal18 a:hover{ color:#C4C8CF; }
.legal18 a:focus-visible{ outline:1px solid var(--champ); outline-offset:3px; border-radius:2px; }
.legal18 .dot{ padding:0 .45em; }
.legal18 .dis{ display:block; }
@media(min-width:1200px){ .legal18 .dis{ display:inline; margin-inline-start:1.2em; } }
@media (max-width:820px){
  .endline, html[dir="rtl"] .endline{ grid-template-rows:auto auto 44px; padding-block-start:14px; }
  .legal18{ grid-column:1 / -1; grid-row:2; padding:10px 0 0; max-width:30em; }
  .endline .el-mk{ grid-row:3; }
}
