/* === round4 (builder, 30.10.2026) — separate file, loaded after round2.css. Does not touch door / threshold / veil /
   3D / glass-panel rules in style.css; every rule here is new and scoped to .r4-* (plus the #3/#13 blocks below). === */

/* ---------- #13: Hebrew (and English) header stays one row on phone with the menu open too ----------
   With the menu open the header wraps (the menu drops below), and a wrapped flex line is only as tall as its items
   (44px), so the row jumped 6px up and no longer lined up with the docked widget button. Keep the row 56px tall. */
@media (max-width: 760px), (hover: none) and (pointer: coarse) and (max-width: 1020px) {
  .header-inner:has(.main-nav.is-open) > :not(.main-nav) { margin-block: 6px; }
}

/* ---------- round5 (WCAG 3.1.2 language of parts): English runs on Hebrew pages carry lang="en" (+ .r5-lang, added by
   round1_cd_tools/lang_parts_src.py, text unchanged). Screen readers switch voice; the look stays exactly as before
   (style.css gives [lang="en"] DM Sans — these keep the surrounding font). ---------- */
[lang].r5-lang { font-family: inherit; }

/* ---------- round5 #27 (default): the card itself opens in place from its icon (round4.js, second block) ----------
   1) First paint, before JS: the same elements JS will fold are already folded, so wrapping them is not a layout
      shift (CLS 0 on load). Only when scripting is on: without JS the card is fully open. */
@media (scripting: enabled) {
  html:not(.r27-off) .into-light :is(.split > .copy, .section > .container, .guarantee):has(> .emblem):not(:has(form, input, select, textarea, [data-sim], .cmp-stage, video, iframe)) > :is(h2, h3) + p ~ :not(.r27-more, script, template),
  html:not(.r27-off) .into-light :is(.split > .copy, .section > .container, .guarantee):has(> .emblem):not(:has(form, input, select, textarea, [data-sim], .cmp-stage, video, iframe)):not(:has(> :is(h2, h3))) > .prose > :is(h2, h3) + p ~ :not(.r27-more, script, template) { display: none !important; }
}
/* 2) the fold: the glass card grows with its content (grid rows 0fr -> 1fr); the content is revealed by JS from the icon */
.r27-more { display: grid; grid-template-rows: 0fr; }   /* round5 FLIP: the layout changes once, instantly; round4.js animates transform + opacity only */
.r27-more.r27-open { grid-template-rows: 1fr; }
.r27-more[hidden]:not([hidden="until-found"]) { display: none; }
.r27-in { min-height: 0; overflow: hidden; }
.r27-more.r27-done > .r27-in { overflow: visible; }        /* focus rings / tilt shadows inside are not clipped once open */
/* 3) the heading is the toggle: same text, same look, a 44px target, a small chevron (aria-hidden) */
.r27-h > .r27-hd { display: block; width: 100%; min-height: 44px; margin: 0; padding: 0; border: 0; background: none; color: inherit;
  font: inherit; letter-spacing: inherit; line-height: inherit; text-align: start; text-transform: inherit; cursor: pointer;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation; border-radius: 8px; }
.r27-hd:focus-visible { outline: 3px solid #0071e3; outline-offset: 4px; }
.r27-chev { display: inline-block; width: .38em; height: .38em; margin-inline-start: .4em; vertical-align: .12em;
  border: solid currentColor; border-width: 0 .09em .09em 0; transform: rotate(-45deg); transition: transform .32s cubic-bezier(.32,.72,0,1); }
[dir="rtl"] .r27-chev { transform: rotate(135deg); }
.r27-hd[aria-expanded="true"] .r27-chev { transform: rotate(45deg); }
@media (hover: hover) and (pointer: fine) { .r27-hd:hover .r27-chev { translate: .12em 0; } [dir="rtl"] .r27-hd:hover .r27-chev { translate: -.12em 0; } .r27-hd[aria-expanded="true"]:hover .r27-chev { translate: 0 .1em; } }
@media (prefers-reduced-motion: reduce) { .r27-chev { transition: none; } }
html.wa-still .r27-chev { transition: none; }
/* 4) the card's own 2D icon is a tap target (transparent, over the icon itself: not a second symbol). None for 3D emblems. */
.r27-tile { position: absolute; z-index: 2; left: var(--x, 0); top: var(--y, 0); width: var(--w, 44px); height: var(--h, 44px);
  min-width: 44px; min-height: 44px; margin: 0; padding: 0; border: 0; border-radius: 14px; background: transparent; cursor: pointer;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.r27-tile[hidden], .has-deco3d .r27-tile { display: none; }
@media (forced-colors: active) { .r27-hd { forced-color-adjust: auto; } }
@media print { .r27-more { display: block !important; content-visibility: visible !important; } .r27-chev, .r27-tile { display: none !important; } }

/* ---------- round5 #14: desktop text >= 16px and targets >= 44px (the phone has its own block in round2.css; phone unchanged).
   Desktop = the complement of the phone query. Copy unchanged; only size. The .cmp-before "before" demo is deliberately bad (not changed). */
@media (min-width: 761px) and (hover: hover), (min-width: 761px) and (pointer: fine), (min-width: 1021px) {
  .lang-switch, .header-actions .btn-small, .brand,
  .site-footer, .footer-grid h2, .note, .preview-note, .small-print, .promise-card .small-print, .src, .fact-src,
  .hint, .error-msg, .form-note, .form-privacy, .sample figcaption, .sample-tag, .addon-alt, .callout, :dir(rtl) .callout,
  .flow li, .steps li::before, .page-hero .meta, .risk-kicker, .guarantee-scope-h, .promise-card .guarantee-scope-h,
  .guarantee-scope li, .guarantee-scope li + li, .sim-small, .sim-field, .sim-opt, .cmp figcaption, .cmp-tag,
  .demo-video figcaption, .hero-points, .compare td::before { font-size: 1rem; }
  .header-actions .btn-small { min-height: 44px; }
  .footer-grid li a, .site-footer a[href^="mailto:"], .site-footer a[href^="tel:"] { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; }
  /* stand-alone links (the whole line is the link): a full 44px row */
  .r5-solo { display: inline-flex; align-items: center; min-height: 44px; }   /* class set in the HTML by round1_cd_tools/solo_links_src.py */
}
@media (min-width: 1021px) { .main-nav a { font-size: 1rem; min-width: 44px; justify-content: center; } }   /* the <=1020 menu keeps its own 17px */