/* Circle Hub — the presentations in Circle's own style (Rami, 12 October 2026: "redesign all strategy presentations like we did for the
   proposal"). Every .deck: the marketing strategy, the marketing discovery, the brand strategy and the brand discovery, on screen
   (Read), full screen (Present) and printed. The language of circlexpr.com and lib/proposaldoc.js: Inter (IBM Plex Sans Arabic in
   Arabic), black / white / #F5F5F5 slides, labels in brackets, big tight headings, pills, no borders, a 5px dot as the marker, tables
   with alternating rows. Always light, whatever the Hub's theme: it is what the client sees. Loaded after app.css. */
.deck{--cd-black:#000;--cd-ink:#141414;--cd-g3:#333;--cd-mid:#8a8a8a;--cd-off:#F5F5F5;--cd-white:#fff;--cd-r:8px;--cd-font:"Inter","Helvetica Neue",Arial,sans-serif;
  font-family:var(--cd-font);color:var(--cd-black);font-weight:500;letter-spacing:-.02em;font-variant-numeric:tabular-nums;max-width:1100px}
.deck[lang="ar"],.deck[dir="rtl"]{--cd-font:"IBM Plex Sans Arabic","Inter",Tahoma,sans-serif;letter-spacing:0}
/* the Hub forces its own font on everything (cadence.css); the presentations keep Circle's */
html body .deck:not(#_),html body .deck:not(#_) *:not(code):not(pre):not(svg *){font-family:var(--cd-font)!important}

/* a slide: white, then #F5F5F5, in turn; the cover black. No borders: the colour change is the edge */
.deck .slide{background:var(--cd-white);color:var(--cd-black);border:0;border-radius:var(--cd-r);box-shadow:none;margin:0 0 12px;
  padding:clamp(56px,6.4vw,84px) clamp(28px,6vw,80px) clamp(36px,4.6vw,60px)}
.deck .slide:nth-of-type(even){background:var(--cd-off)}
.deck .slide::before{content:"Circle";position:absolute;top:clamp(20px,2.6vw,30px);inset-inline-start:clamp(28px,6vw,80px);font-size:15px;font-weight:600;letter-spacing:-.02em}
.deck .slide::after{right:auto;inset-inline-end:clamp(28px,6vw,80px);top:clamp(22px,2.7vw,32px);bottom:auto;font-size:12px;color:var(--cd-mid);content:"(" counter(slide, decimal-leading-zero) ")"}
.deck .slide .sr-label{font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--cd-black);margin:0 0 12px;opacity:1}
.deck .slide .sr-label::before{content:"("}.deck .slide .sr-label::after{content:")"}
.deck .slide h2{font-family:var(--cd-font);font-size:clamp(34px,4.6vw,64px);font-weight:600;line-height:1;letter-spacing:-.04em;margin:0 0 clamp(20px,3vw,36px);color:inherit;text-wrap:balance}
.deck[lang="ar"] .slide h2,.deck[dir="rtl"] .slide h2{letter-spacing:0;line-height:1.15}
.deck .slide-b{font-size:clamp(16px,1.35vw,19px);font-weight:400;line-height:1.5;max-width:68ch;letter-spacing:-.01em}
.deck .slide-b p{margin:0 0 14px}
.deck .slide-b h3{font-family:var(--cd-font);font-size:19px;font-weight:600;letter-spacing:-.02em;margin:24px 0 10px}
.deck .slide-b h3 small{color:var(--cd-mid);font-weight:500;margin-inline-start:6px}

/* lists: a 5px dot; numbered lists keep a quiet number */
.deck .slide-b ul{list-style:none;padding:0;margin:6px 0 14px}
.deck .slide-b ul>li{position:relative;padding-inline-start:18px;margin-bottom:8px}
.deck .slide-b ul>li::before{content:"";position:absolute;inset-inline-start:0;top:.62em;width:5px;height:5px;border-radius:50%;background:currentColor}
.deck .slide-b ol{padding-inline-start:1.6em;margin:6px 0 14px}.deck .slide-b ol>li{margin-bottom:10px}.deck .slide-b ol>li::marker{color:var(--cd-mid);font-weight:500}
.deck .slide-b .sr-plist,.deck .sr-plist{font-size:clamp(24px,3vw,40px);font-weight:600;line-height:1.15;letter-spacing:-.035em;list-style:none;padding:0;counter-reset:pl}
.deck .slide-b .sr-plist>li,.deck .sr-plist>li{counter-increment:pl;display:flex;align-items:baseline;gap:18px;padding:14px 0;margin:0}
.deck .slide-b .sr-plist>li::before,.deck .sr-plist>li::before{content:"(" counter(pl, decimal-leading-zero) ")";font-size:12px;font-weight:500;letter-spacing:0;color:var(--cd-mid);flex:none;width:34px}

/* pills, cards, the enemy */
.deck .sr-flag{display:inline-block;font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;border:0;border-radius:999px;padding:4px 12px;background:var(--cd-black);color:var(--cd-white);vertical-align:middle}
.deck .sr-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:0 0 16px}
.deck .sr-card,.deck .sr-pillar{border:0;border-radius:var(--cd-r);background:var(--cd-off);padding:20px;display:flex;flex-direction:column;gap:8px;min-height:150px}
.deck .slide:nth-of-type(even) .sr-card,.deck .slide:nth-of-type(even) .sr-pillar{background:var(--cd-white)}
.deck .sr-card::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--cd-black);margin-bottom:10px}
.deck .sr-card h3{margin:0;font-size:19px}.deck .sr-card p{font-size:15px;margin:0;color:var(--cd-g3)}
.deck .sr-enemy{border:0;margin-top:20px;padding:16px 20px;border-radius:var(--cd-r);background:var(--cd-black);color:var(--cd-white);display:grid;gap:4px;max-width:520px}
.deck .sr-enemy b{font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;opacity:.7}.deck .sr-enemy b::before{content:"("}.deck .sr-enemy b::after{content:")"}
.deck .sr-by{color:var(--cd-mid)}

/* tables: no lines, alternating rows, rounded */
.deck .slide-b table{width:100%;border-collapse:separate;border-spacing:0;font-size:15px;margin:6px 0 16px}
.deck .slide-b caption{text-align:start;font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--cd-mid);padding:0 0 10px}
.deck .slide-b td{border:0;padding:12px 12px;vertical-align:top}
.deck .slide-b tr:nth-child(odd) td{background:var(--cd-off)}.deck .slide:nth-of-type(even) .slide-b tr:nth-child(odd) td{background:var(--cd-white)}
.deck .slide-b td:first-child{border-start-start-radius:var(--cd-r);border-end-start-radius:var(--cd-r)}.deck .slide-b td:last-child{border-start-end-radius:var(--cd-r);border-end-end-radius:var(--cd-r)}
.deck .slide-b td.k{font-weight:600}.deck .slide-b td.n{text-align:end;font-weight:600}

/* the cover: black, the client huge */
.deck .slide.cover{background:var(--cd-black);color:var(--cd-white);justify-content:flex-end}
.deck .slide.cover::after{color:var(--cd-white);opacity:.5}
.deck .slide.cover .sr-label{color:var(--cd-white);opacity:.7}
.deck .slide.cover h1{font-family:var(--cd-font);font-size:clamp(56px,9vw,128px);font-weight:600;line-height:.9;letter-spacing:-.045em;margin:6px 0 clamp(18px,3vw,32px);text-wrap:balance;overflow-wrap:anywhere}
.deck[lang="ar"] .slide.cover h1,.deck[dir="rtl"] .slide.cover h1{letter-spacing:0;line-height:1.1}
.deck .slide.cover .sr-big,.deck .slide.cover .ds-sentence{font-size:clamp(18px,1.9vw,24px);font-weight:400;line-height:1.45;max-width:46ch;opacity:1;margin:0 0 clamp(24px,3vw,40px);letter-spacing:-.015em}
.deck .slide.cover .sr-credits{font-size:13px;opacity:1;color:#bdbdbd;line-height:1.6}
.deck .slide.cover .sr-credits b{color:var(--cd-white);font-weight:500}

/* discovery: a question in grey, the answer under it */
.deck .ds-sec .slide-b{gap:22px 40px}
.deck .ds-a small{font-size:12px;font-weight:500;color:var(--cd-mid);letter-spacing:0;margin-bottom:6px}
.deck .ds-a p{font-size:clamp(16px,1.3vw,18px);font-weight:400;color:var(--cd-black)}

/* team only: never a slide; on screen a quiet box, never when presenting or printed */
.deck .sr-team{border:0;background:#fff7e0;color:#5b4300;border-radius:var(--cd-r);padding:18px 22px;font-family:var(--cd-font)}
.deck .sr-team .sr-label{color:inherit;font-size:12px;letter-spacing:0;text-transform:none}
.deck.showing>:not(.slide):not(.deck-count){display:none!important}

/* the buttons above it stay the Hub's */
.deck .deck-bar{font-family:initial;letter-spacing:normal}

/* present: black around, the slide as it is on screen */
.deck.showing{background:#000}
.deck.showing .slide{margin:0;border-radius:var(--cd-r)}

@media (max-width:700px){.deck .slide{padding:56px 20px 28px}.deck .slide::before{inset-inline-start:20px}.deck .slide::after{inset-inline-end:20px}}

/* printed: one slide a page, landscape, colours kept, nothing for the team only */
@page deck{size:297mm 167mm;margin:0}
@media print{
  .deck{max-width:none}.deck .slide{page:deck;border-radius:0;margin:0;aspect-ratio:auto;min-height:167mm;break-after:page;break-inside:avoid;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .deck .sr-team,.deck .deck-bar{display:none!important}
}
