/* Blitchka homepage look 2B · "Light hero + charcoal panel" (Sam's pick, 1 Nov 2026)
   Tektur (EN display) + Secular One (HE display) + Rubik (body). All SIL OFL 1.1, self-hosted (assets/fonts/, licences OFL-*.txt there).
   Layer on top of assets/styles.css: logo-shape details (round buttons, L bar, C dot, ring-framed icons) + take 2B. */


/* ---- feedback banner (homepage top, replaces "Fresh paint"; dismiss remembered in localStorage) ---- */
.fb-banner{background:#141518;color:#E5E9EE;border-bottom:3px solid var(--red);font-size:13px;line-height:1.45;font-weight:500}
.fb-banner .wrap{padding:8px 0;gap:12px}
.fb-banner span{text-align:start}
.fb-banner .fb-link{display:inline-block;margin-inline-start:4px;color:#fff;background:var(--red);font-weight:700;white-space:nowrap;text-decoration:none;border-radius:999px;padding:2px 11px 3px;line-height:1.4}
.fb-banner .fb-link:hover{background:#c92f34}
.fb-banner button{border-color:#3A3F49;width:26px;height:26px;font-size:16px}

/* ---- shared logo-shape details ---- */
.btn{border-radius:999px;min-height:52px;font-size:16px;letter-spacing:0}
.main-nav a.talk{border-radius:999px}
.hero{background-image:none}
.hero h1::after{content:"";display:block;width:64px;height:7px;border-radius:999px;background:var(--red);margin-top:20px}          /* the L bar */
.kicker::before{width:6px;height:18px;border-radius:999px;background:var(--red)}                                                     /* the L bar */
.tag i{width:8px;height:8px;box-shadow:none}                                                                                          /* the C dot */
.track .star{display:none}
.track span{display:inline-flex;align-items:center;gap:22px}
.track span::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--red);flex:none}                                /* the C dot */
.tool{border-radius:18px}
.tool .tic{border-radius:50%;margin:3px 3px 10px}
.tool .tic svg{width:19px;height:19px}
.svc-list .n{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;padding:0;margin-top:3px;font-size:13px}
.c-item .ic{border-radius:50%}

/* ---- take 2B ---- */
/* TAKE 2B · Light hero + charcoal panel — Tektur (EN display) + Secular One (HE display) + Rubik (body, already on the site).
   All SIL OFL 1.1, self-hosted. Layer on top of styles.css + samples3-common.css.
   Palette: #E43B40 · #22252B · #141518 · #fff · #FCFBFA · cool greys. */
@font-face{font-family:'Tektur';src:url(fonts/tektur-latin.woff2) format('woff2');font-weight:400 900;font-display:swap}
@font-face{font-family:'Secular One';src:url(fonts/secular-one-hebrew.woff2) format('woff2');font-weight:400;font-display:swap;unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:'Secular One';src:url(fonts/secular-one-latin.woff2) format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+2122,U+2212}
:root{--poster:'Tektur','Secular One',sans-serif;--display:'Tektur','Secular One',sans-serif;--body:'Rubik','Heebo',sans-serif;--pink:#E43B40;--paper:#FCFBFA;--black:#141518}
[dir=rtl]{--poster:'Secular One',sans-serif;--display:'Secular One',sans-serif;--body:'Rubik',sans-serif}
body{font-size:16.5px;background:#FCFBFA}
.site-head{background:rgba(252,251,250,.94)}
/* hero: light page, charcoal panel holding the headline */
.hero{background:#FCFBFA linear-gradient(90deg,rgba(34,37,43,.06) 1px,transparent 1px) 0 0/26px 26px;color:var(--ink);padding:24px 0 40px;border-bottom:0}
.hero::after{display:none}
.hero h1{overflow:hidden}
.tag{font-family:'Tektur','Secular One',sans-serif;font-weight:600;font-size:11.5px;letter-spacing:.14em;color:var(--ink)}
[dir=rtl] .tag{font-family:'Secular One',sans-serif;font-weight:400;font-size:15px;letter-spacing:0}
.poster{text-transform:none}
.hero h1{position:relative;font-size:44px;font-weight:800;letter-spacing:-.02em;line-height:1;color:#fff;background:var(--ink);margin:30px calc(var(--pad)*-1) 22px;padding:30px var(--pad) 28px;border-block:5px solid var(--black);box-shadow:inset 0 -5px 0 var(--black)}
.hero h1 span{font-weight:800}
.hero h1 .o{color:var(--red);-webkit-text-stroke:0;font-weight:900}
.hero h1 .r{color:#C3C9D2;font-weight:600}
[dir=rtl] .hero h1{font-size:60px;font-weight:400;line-height:1;letter-spacing:0}
[dir=rtl] .hero h1 span,[dir=rtl] .hero h1 .o,[dir=rtl] .hero h1 .r{font-weight:400}
.hero h1::after{width:72px;height:9px;background:var(--red);margin-top:20px}                          /* the L bar */
.sub{color:#3A3F49;font-size:17px;font-weight:500}
.btn{font-family:'Tektur','Secular One',sans-serif;font-weight:700;font-size:15.5px;letter-spacing:.02em}
[dir=rtl] .btn{font-family:'Secular One',sans-serif;font-weight:400;font-size:18px;letter-spacing:0}
.btn-red{box-shadow:0 10px 22px -12px rgba(228,59,64,.9)}
.btn-ghost{color:#fff;background:var(--black);border:0}
/* ticker: black band, red dots */
.ticker{background:var(--black);color:#fff;border:0;padding:13px 0}
.track span{font-family:'Tektur','Secular One',sans-serif;font-weight:700;font-size:17px;letter-spacing:.1em;text-transform:uppercase}
[dir=rtl] .track span{font-family:'Secular One',sans-serif;font-weight:400;font-size:21px;letter-spacing:0}
/* sections */
.sec h2.poster{font-size:40px;font-weight:800;letter-spacing:-.02em}
[dir=rtl] .sec h2.poster{font-size:56px;font-weight:400}
.sec h2 .r{color:var(--red)}
.kicker{font-family:'Tektur','Secular One',sans-serif;font-weight:700;font-size:12px;letter-spacing:.16em}
[dir=rtl] .kicker{font-family:'Secular One',sans-serif;font-weight:400;font-size:16px;letter-spacing:0}
/* studio: charcoal with black cards and red rings */
.studio{background:var(--ink);border-top:10px solid var(--red)}
.studio .kicker{color:var(--red)}
.studio .lead{color:#C3C9D2}
.tool{background:var(--black);border:1px solid #2B2F37;border-radius:14px}
.tool b{font-family:'Tektur','Secular One',sans-serif;font-weight:700;font-size:15px;letter-spacing:.02em}
[dir=rtl] .tool b{font-family:'Secular One',sans-serif;font-weight:400;font-size:18px}
.tool .tic{background:var(--ink);color:#fff;box-shadow:inset 0 0 0 0 transparent,0 0 0 2.5px var(--red)}
.tool .tic svg [fill="#fafbfc"]{fill:var(--ink)}
.svc-list .n{background:var(--black);color:#fff;font-family:'Tektur',sans-serif;font-weight:700;font-size:12px;box-shadow:0 0 0 2px var(--red)}
.c-item .ic{box-shadow:inset 0 0 0 2px var(--red);background:#fff}


/* ---- hero wordmark (Sam, 1:42 AM: no red-ring logo in the hero; his wordmark in white on the charcoal panel, red parts animated by blitchka-motion) ---- */
.tag{padding-inline-end:0}
.hero-mark{background:var(--ink);color:#FCFBFA;margin:30px calc(var(--pad)*-1) 0;padding:28px var(--pad) 4px;border-top:5px solid var(--black);cursor:pointer;-webkit-tap-highlight-color:transparent}
.hero-mark .wm{display:block;width:min(270px,76%);height:auto;overflow:visible}
.hero .hero-mark + h1{margin-top:-1px;border-top:0;padding-top:24px}
@media(min-width:960px){.hero-grid{grid-template-columns:1fr}.hero-mark .wm{width:340px}}

/* ---- inner pages (quote, work, studio hub, 404): same display type as the home headline ---- */
.poster{font-weight:800}
.inner .quote-hero h1,.inner .work-hero h1,.work-cat h2{font-weight:800;text-transform:none;letter-spacing:-.02em}
[dir=rtl] .poster,[dir=rtl] .inner .quote-hero h1,[dir=rtl] .inner .work-hero h1,[dir=rtl] .work-cat h2{font-weight:400;letter-spacing:0}

/* Blitchka tool icons, style 1 "Classic" (icon drop-in) */
.tool .tic.tic-c{width:48px;height:48px;padding:0;background:none;border:0;box-shadow:none;border-radius:13px;overflow:hidden}
.tool .tic.tic-c svg{width:48px;height:48px;display:block}