/* Tiremesù method guides. Loaded after /site.css and uses the same palette, type and geometry:
   page #F6F0E8 · ink #1A0F09 · body #3B2B20 · muted #5A4638 · line #D9CFC3 · link/emphasis #9B1049 · primary action #EE2A7B.
   Logical properties only, so the same rules serve English (ltr) and Arabic (rtl). */
.g{width:100%;max-width:1280px;margin:0 auto;padding:clamp(20px,3vw,32px) clamp(18px,4vw,48px) 0;display:flex;flex-direction:column;min-width:0}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.g h2,.g h3{margin:0}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 8px}
.crumbs li{display:inline-flex;gap:8px;align-items:center}
.crumbs a{color:#5A4638;text-decoration:none;display:inline-flex;min-height:32px;align-items:center}
.crumbs a:hover{color:#9B1049;text-decoration:underline}
.crumbs [aria-current]{color:#1A0F09}

/* site.css styles bare <article> for the privacy page; the guide resets it. */
article.guide{max-width:none;margin:0;padding:0;display:block;font-size:16px;line-height:1.65}
[lang=ar] article.guide{font-size:17px;line-height:1.85}

/* Hero */
.g-hero{display:flex;flex-wrap:wrap;align-items:flex-end;gap:clamp(28px,5vw,80px);padding-block:clamp(24px,4vw,48px) 0;border-block-end:1px solid #1A0F09}
.g-hero-copy{flex:999 1 480px;min-width:0;max-width:720px;display:flex;flex-direction:column;gap:20px;padding-block-end:clamp(28px,4vw,48px)}
.g-hero h1,article.guide h1{font-size:clamp(40px,5.4vw,76px);line-height:1.02;font-weight:300;letter-spacing:-.035em;margin:0}
[lang=ar] .g-hero h1,[lang=ar] article.guide h1{font-size:clamp(34px,4.6vw,64px);line-height:1.3;font-weight:700;letter-spacing:0}
.g .lead{max-width:640px}
.facts{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));border-block-start:1px solid #1A0F09}
.facts>div{padding-block:14px 0;padding-inline-end:16px;display:flex;flex-direction:column;gap:4px}
.facts>div+div{padding-inline-start:16px;border-inline-start:1px solid #D9CFC3}
.facts dt{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#5A4638}
[lang=ar] .facts dt{font-family:inherit;font-size:14px;letter-spacing:0;text-transform:none}
.facts dd{margin:0;font-size:17px;color:#1A0F09}
.g-hero-art{flex:1 1 220px;max-width:340px;margin:0;display:flex;justify-content:center;align-items:flex-end;align-self:stretch}
.g-hero-art img{display:block;width:auto;height:auto;max-height:clamp(260px,34vw,420px);max-width:100%}
.mirror{transform:scaleX(-1)}

/* The short answer */
.g-answer{margin-block-start:clamp(28px,4vw,48px);padding:clamp(20px,3vw,32px);background:#fff;border:1px solid #D9CFC3;border-block-start:3px solid #1A0F09;display:flex;flex-direction:column;gap:10px;max-width:880px}
.g-answer p{margin:0;font-size:clamp(18px,1.7vw,21px);line-height:1.55;font-weight:300;color:#1A0F09;text-wrap:pretty}
[lang=ar] .g-answer p{font-weight:400;line-height:1.9}

/* Sections */
.g-sec{padding-block-start:clamp(40px,6vw,64px);display:flex;flex-direction:column;gap:20px;scroll-margin-top:16px}
.g-sec>h2{font-size:clamp(24px,2.6vw,32px);line-height:1.15;font-weight:300;letter-spacing:-.015em;padding-block-start:14px;border-block-start:1px solid #1A0F09}
[lang=ar] .g-sec>h2{font-weight:700;letter-spacing:0;line-height:1.5}
.prose{max-width:720px;display:flex;flex-direction:column;gap:16px}
.prose p,.example p,.faq p,.cardwrap>p{margin:0;font-size:17px;line-height:1.7;color:#3B2B20;text-wrap:pretty}
[lang=ar] .prose p,[lang=ar] .example p,[lang=ar] .faq p,[lang=ar] .cardwrap>p{font-size:18px;line-height:1.9}
.g h3.eyebrow{font-weight:400}
.pair{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:14px}
.lcard{background:#fff;border:1px solid #D9CFC3;border-block-start:3px solid #1A0F09;padding:22px;display:flex;flex-direction:column;gap:12px}
.lcard-no{border-block-start-color:#9B1049}
.lcard-no h3{color:#9B1049}
.lcard ul{margin:0;padding-inline-start:20px;display:flex;flex-direction:column;gap:10px}
.lcard li{line-height:1.6;color:#3B2B20}
.lcard li::marker{color:#8A7868}
.need{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:1px;background:#D9CFC3;border:1px solid #D9CFC3}
.need>div{background:#fff;padding:20px;display:flex;flex-direction:column;gap:8px}
.need dt{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#5A4638}
[lang=ar] .need dt{font-family:inherit;font-size:14px;letter-spacing:0;text-transform:none}
.need dd{margin:0;line-height:1.6;color:#3B2B20}

/* Steps with their drawings beside them */
.steps{list-style:none;margin:0;padding:0}
.steps>li{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:16px 40px;align-items:start;padding-block:24px;border-block-start:1px solid #D9CFC3;scroll-margin-top:16px}
.steps>li:first-child{border-block-start:0;padding-block-start:4px}
.step{display:grid;grid-template-columns:56px minmax(0,1fr);gap:8px 16px}
.step .n{grid-row:span 2;font-size:44px;line-height:1;font-weight:300;color:#9B1049;font-variant-numeric:tabular-nums}
.step h3{font-size:20px;line-height:1.35;font-weight:400}
[lang=ar] .step h3{font-weight:700;line-height:1.6}
.step p{margin:0;line-height:1.7;color:#3B2B20;text-wrap:pretty}
.cut{margin:0;background:#EFE7DC;padding:16px}
.cut img{display:block;width:100%;height:auto}

/* Worked example */
.example{max-width:760px;display:flex;flex-direction:column;gap:16px;border-inline-start:3px solid #1A0F09;padding-inline-start:clamp(16px,3vw,28px)}
.example p.ctx{font-size:18px;line-height:1.6;color:#1A0F09}

/* Related */
.related{max-width:760px;display:flex;flex-direction:column;gap:10px}
.related ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.related a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid #8A7868;background:#fff;color:#1A0F09;text-decoration:none;font-size:15px}
.related a:hover{border-color:#1A0F09;color:#9B1049}

/* FAQ */
.faq{max-width:760px}
.faq details{border-block-start:1px solid #D9CFC3;padding-block:16px}
.faq details:last-child{border-block-end:1px solid #D9CFC3}
.faq summary{display:flex;justify-content:space-between;align-items:baseline;gap:16px;cursor:pointer;list-style:none;min-height:32px}
.faq summary::-webkit-details-marker{display:none}
.faq summary h3{font-size:18px;line-height:1.45;font-weight:400;color:#1A0F09}
[lang=ar] .faq summary h3{font-weight:700;line-height:1.7}
.faq .pm{font-family:ui-monospace,monospace;font-size:20px;color:#5A4638;transition:transform 180ms cubic-bezier(.3,.7,.3,1)}
.faq details[open] .pm{transform:rotate(45deg)}
.faq p{margin-block-start:10px}

/* Tool card preview */
.cardwrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:28px;align-items:start}
.toolcard{margin:0;background:#fff;border:1px solid #D9CFC3;border-block-start:3px solid #1A0F09;padding:20px;display:flex;flex-direction:column;gap:8px;box-shadow:0 2px 10px rgba(26,15,9,.08)}
.toolcard figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin-block-end:4px}
.tc-name{font-size:18px;font-weight:300;color:#1A0F09}
[lang=ar] .tc-name{font-weight:700}
.toolcard ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.toolcard li{min-height:56px;border:1px solid #D9CFC3;padding:8px 10px;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#5A4638}
[lang=ar] .toolcard li{font-family:inherit;font-size:14px;letter-spacing:0;text-transform:none}

/* Film link-out */
.film{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:center;max-width:560px;padding:20px;background:#fff;border:1px solid #D9CFC3;border-block-start:3px solid #1A0F09;color:#1A0F09;text-decoration:none;transition:transform 180ms cubic-bezier(.3,.7,.3,1)}
.film:hover{color:#1A0F09;transform:translateY(-2px)}
.film .play{display:grid;place-items:center;width:56px;height:56px;background:#1A0F09;color:#F6F0E8}
[dir=rtl] .film .play svg{transform:scaleX(-1)}
.film>span:last-child{display:flex;flex-direction:column;gap:4px}
.film .ft{font-size:18px}

/* Closing call to action: the home page's own words, pointing to its waiting-list form */
.g-cta{margin-block:clamp(56px,8vw,96px) clamp(40px,6vw,72px);padding:clamp(24px,4vw,44px);background:#fff;border:1px solid #D9CFC3;border-block-start:3px solid #1A0F09;display:flex;flex-direction:column;align-items:flex-start;gap:16px;max-width:880px}
.g-cta h2{font-size:clamp(30px,3.6vw,48px);line-height:1.05;font-weight:300;letter-spacing:-.03em;text-wrap:balance}
[lang=ar] .g-cta h2{font-weight:700;letter-spacing:0;line-height:1.35}
.g-cta p{margin:0;font-size:16px;line-height:1.55;color:#3B2B20}
.g-btn{display:inline-flex;align-items:center;text-decoration:none;transition:transform 140ms cubic-bezier(.3,.7,.3,1)}
.g-btn:hover{color:#1A0F09;transform:translateY(-1px)}
.g-btn:active{transform:translateY(0)}

/* Index */
.g-index-head{display:flex;flex-direction:column;gap:20px;padding-block:clamp(24px,4vw,48px) clamp(8px,2vw,16px)}
.g-index-head h1{font-size:clamp(44px,6.4vw,96px);line-height:1;font-weight:300;letter-spacing:-.035em;margin:0}
[lang=ar] .g-index-head h1{font-size:clamp(40px,5.6vw,84px);line-height:1.25;font-weight:700;letter-spacing:0}
.tagnav{display:flex;flex-direction:column;gap:8px;border-block-start:1px solid #1A0F09;padding-block-start:14px;max-width:880px}
.tagnav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.tagnav a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid #8A7868;background:#fff;color:#1A0F09;text-decoration:none;font-size:15px}
.tagnav a:hover{background:#1A0F09;border-color:#1A0F09;color:#F6F0E8}
.g-tag{padding-block-start:clamp(40px,6vw,64px);scroll-margin-top:16px}
.g-tag-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-block-start:1px solid #1A0F09;padding-block:14px}
.g-tag-head h2{font-size:clamp(28px,3vw,40px);line-height:1.1;font-weight:300;letter-spacing:-.02em}
[lang=ar] .g-tag-head h2{font-weight:700;letter-spacing:0;line-height:1.4}
.glist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:1px;background:#D9CFC3;border:1px solid #D9CFC3}
.glist li{display:flex;background:#fff}
.glist a{flex:1;display:flex;flex-direction:column;gap:8px;padding:20px;color:#1A0F09;text-decoration:none;transition:background 180ms cubic-bezier(.3,.7,.3,1)}
.glist a:hover{background:#FBF7F1;color:#1A0F09}
.glist a:hover .gname{color:#9B1049}
.gname{font-size:19px;line-height:1.3;font-weight:400}
[lang=ar] .gname{font-weight:700;line-height:1.6}
.gdek{font-size:15px;line-height:1.55;color:#3B2B20}
[lang=ar] .gdek{font-size:16px;line-height:1.8}
.gmeta{margin-block-start:auto;padding-block-start:4px}

.g-404{padding-block:clamp(40px,6vw,80px)}
.g-404 p{margin:12px 0 0}
.ar-line{font-family:'PP Neue Montreal Arabic',sans-serif;line-height:1.85}

@media (max-width:560px){
  .facts{grid-template-columns:1fr 1fr}
  .facts>div+div{padding-inline-start:12px}
  .facts>div:nth-child(3){grid-column:1/-1;border-inline-start:0;padding-inline-start:0;border-block-start:1px solid #D9CFC3;margin-block-start:14px}
  .step{grid-template-columns:40px minmax(0,1fr)}
  .step .n{font-size:32px}
  .g-hero-art{max-width:none;justify-content:flex-end}
  .g-hero-art img{max-height:220px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}}

/* Language menu in the header (29 Oct 2026): the same page in six languages, each named in its own language.
   Mirrors the home page's .s-lang menu, self-contained so it works with either version of /site.css. */
.g-lang{position:relative}
.g-lang summary{list-style:none;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 4px;cursor:pointer;color:#1A0F09;font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:12px;letter-spacing:.12em}
.g-lang summary::-webkit-details-marker{display:none}
.g-lang summary:hover{color:#9B1049}
.g-lang svg{display:block;flex:none}
.g-lang ul{position:absolute;top:calc(100% + 6px);inset-inline-end:0;z-index:20;margin:0;padding:6px 0;list-style:none;min-width:180px;background:#F6F0E8;border:1px solid #1A0F09;border-top:3px solid #EE2A7B;box-shadow:0 8px 24px rgba(26,15,9,.12)}
.g-lang li a{display:flex;align-items:center;min-height:44px;padding:0 16px;color:#1A0F09;text-decoration:none;font-family:'PP Neue Montreal',system-ui,sans-serif;font-size:16px}
.g-lang li a[lang=ar]{font-family:'PP Neue Montreal Arabic',sans-serif}
.g-lang li a:hover{background:#EDE4D8;color:#9B1049}
.g-lang li a[aria-current]{font-weight:600}
.g-lang li a[aria-current]::after{content:"";width:6px;height:6px;margin-inline-start:auto;background:#EE2A7B}
/* Long compound words (German, French) wrap instead of pushing the page sideways. */
.g h1,.g h2,.g h3,.gname,.tc-name,.crumbs [aria-current]{overflow-wrap:break-word;hyphens:auto}

/* Method drawings on the index cards (29 Oct 2026): each card opens on the method's own canvas */
.gplate{display:grid;place-items:center;aspect-ratio:12/7;max-width:none;margin:-20px -20px 6px;background:#F3ECE2;border-block-end:1px solid #E6DCCF;transition:background 180ms cubic-bezier(.3,.7,.3,1)}
.glist a:hover .gplate{background:#EFE5D8}
.gplate svg{width:76%;height:auto;overflow:visible}
.gplate .l,.gplate .t,.gplate .al,.gplate .c{fill:none;stroke-linecap:round;stroke-linejoin:round}
.gplate .l{stroke:#1A0F09;stroke-width:1.6}
.gplate .t{stroke:#1A0F09;stroke-width:1;opacity:.35}
.gplate .al{stroke:#EE2A7B;stroke-width:1.8}
.gplate .a{fill:#EE2A7B}
.gplate .f{fill:#1A0F09}
.gplate .c{fill:#fff;stroke:#1A0F09;stroke-width:1.4}
.gplate .x,.gplate .xa,.gplate .xd{font-family:'IBM Plex Mono',ui-monospace,monospace;font-weight:500}
.gplate .x,.gplate .xd{fill:#1A0F09}
.gplate .xa{fill:#EE2A7B}