/* ============================================================
   The Malka Method — shared stylesheet
   Design language inherited from the clinic brand: ink / brass / cream,
   Frank Ruhl Libre + Cormorant Garamond + Assistant + IBM Plex Mono.
   Mobile-first. RTL-safe via logical properties. Accessible focus states.
   No external network here beyond the Google Fonts <link> in each page head.
   ============================================================ */

:root{
  --ink:#10201d;
  --ink-deep:#0b1715;
  --ink-soft:#1a2f2b;
  --paper:#fafaf5;
  --paper-deep:#f1f0e8;
  --brass:#a9853f;
  --brass-soft:#c4a45f;
  --rise:#2e6e5e;
  --text:#22302d;
  --text-dim:#5c6a66;
  --line:#d8d6cb;
  --serif:'Frank Ruhl Libre','Cormorant Garamond',Georgia,'Times New Roman',serif;
  --body:'Assistant',-apple-system,'Segoe UI',Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
  --wrap:1100px;
}
/* English reads better with Cormorant as the display serif; Hebrew with Frank Ruhl */
html[lang="en"] body{--serif:'Cormorant Garamond','Frank Ruhl Libre',Georgia,'Times New Roman',serif;}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{font-family:var(--body);background:var(--paper);color:var(--text);font-weight:300;
  line-height:1.75;font-size:17px;overflow-x:hidden;}
img{max-width:100%;display:block;}
a{color:var(--brass);}
::selection{background:var(--brass);color:var(--paper);}

/* i18n visibility — English is primary; Hebrew shows only when lang=he */
html[lang="en"] .he-only{display:none!important;}
html[lang="he"] .en-only{display:none!important;}

/* skip link */
.skip{position:absolute;inset-inline-start:-999px;top:0;background:var(--brass);color:var(--paper);
  padding:.6em 1.2em;z-index:200;border-radius:0 0 .4em 0;text-decoration:none;}
.skip:focus{inset-inline-start:0;}

/* shared focus ring */
a:focus-visible,button:focus-visible,summary:focus-visible,.btn:focus-visible,
[tabindex]:focus-visible{outline:2px solid var(--brass-soft);outline-offset:3px;border-radius:2px;}

/* ---------------- header ---------------- */
header{position:fixed;top:0;inset-inline:0;z-index:100;display:flex;align-items:center;
  justify-content:space-between;gap:.8em;padding:12px 5vw;background:rgba(16,32,29,.9);
  backdrop-filter:blur(10px);border-bottom:1px solid rgba(196,164,95,.18);}
.wordmark{font-family:var(--serif);color:var(--paper);font-size:1.05rem;letter-spacing:.02em;
  text-decoration:none;display:flex;align-items:center;gap:.5em;line-height:1.1;}
.wordmark .bowl-ico{width:1.25em;height:1.25em;flex:none;}
.wordmark .mm-name{display:flex;flex-direction:column;}
.wordmark .mm-name b{font-weight:500;}
.wordmark .mk{font-family:var(--mono);font-size:.55rem;color:var(--brass-soft);letter-spacing:.2em;}
nav{display:flex;gap:1.1em;align-items:center;}
.nav-links{display:none;gap:1.3em;}
.nav-links a{color:#cfd6d2;text-decoration:none;font-size:.85rem;letter-spacing:.03em;transition:color .25s;white-space:nowrap;}
.nav-links a:hover,.nav-links a:focus-visible{color:var(--brass-soft);}
.nav-links a[aria-current="page"]{color:var(--brass-soft);border-bottom:1px solid var(--brass-soft);padding-bottom:2px;}
.lang-toggle{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;color:var(--brass-soft);
  background:none;border:1px solid rgba(196,164,95,.45);border-radius:2em;padding:.35em 1em;
  cursor:pointer;transition:all .25s;}
.lang-toggle:hover{background:rgba(196,164,95,.12);}
/* mobile menu button */
.menu-btn{display:inline-flex;flex-direction:column;justify-content:center;gap:4px;background:none;
  border:none;cursor:pointer;padding:.4em;width:2.2em;height:2.2em;}
.menu-btn span{display:block;height:2px;width:20px;background:var(--brass-soft);transition:.25s;}
body.nav-open .menu-btn span:nth-child(1){transform:translateY(6px) rotate(45deg);}
body.nav-open .menu-btn span:nth-child(2){opacity:0;}
body.nav-open .menu-btn span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
/* mobile slide-down panel */
.mobile-nav{position:fixed;inset-inline:0;top:0;z-index:90;background:var(--ink);
  padding:74px 8vw 2.4em;display:flex;flex-direction:column;gap:1.1em;
  transform:translateY(-102%);transition:transform .32s cubic-bezier(.4,0,.2,1);
  border-bottom:1px solid rgba(196,164,95,.2);}
body.nav-open .mobile-nav{transform:translateY(0);}
.mobile-nav a{color:#e7ece9;text-decoration:none;font-family:var(--serif);font-size:1.3rem;
  padding:.25em 0;border-bottom:1px solid rgba(196,164,95,.12);}
.mobile-nav a[aria-current="page"]{color:var(--brass-soft);}

@media(min-width:860px){
  .nav-links{display:flex;}
  .menu-btn,.mobile-nav{display:none;}
  .wordmark{font-size:1.15rem;}
}

/* ---------------- buttons ---------------- */
.btn{font-family:var(--body);font-weight:600;font-size:.9rem;letter-spacing:.04em;text-decoration:none;
  padding:.85em 2em;border-radius:2em;transition:all .25s;display:inline-block;cursor:pointer;
  border:1px solid transparent;text-align:center;}
.btn-brass{background:var(--brass);color:var(--paper);border-color:var(--brass);}
.btn-brass:hover{background:var(--brass-soft);border-color:var(--brass-soft);transform:translateY(-1px);}
.btn-ghost{border-color:rgba(250,250,245,.4);color:var(--paper);background:none;}
.btn-ghost:hover{border-color:var(--brass-soft);color:var(--brass-soft);}
.btn-ink{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.btn-ink:hover{background:var(--ink-soft);transform:translateY(-1px);}
.btn-outline{border-color:var(--brass);color:var(--brass);background:none;}
.btn-outline:hover{background:var(--brass);color:var(--paper);}

/* ---------------- layout ---------------- */
main{display:block;}
section{padding:72px 6vw;scroll-margin-top:70px;}
@media(min-width:860px){section{padding:96px 6vw;}}
.wrap{max-width:var(--wrap);margin-inline:auto;}
.sec-head{max-width:760px;margin-bottom:2.6em;}
.eyebrow{font-family:var(--mono);font-size:.7rem;letter-spacing:.28em;color:var(--brass);margin-bottom:1.2em;text-transform:uppercase;}
.dark .eyebrow,.hero .eyebrow{color:var(--brass-soft);}
h1,h2,h3,p{overflow-wrap:break-word;}
h1,h2,h3{font-family:var(--serif);color:var(--ink);font-weight:500;line-height:1.25;}
h1,h2{font-size:clamp(1.6rem,4.6vw,2.4rem);}
.dark h1{color:var(--paper);}
h3{font-size:1.3rem;}
.dark h2,.dark h3{color:var(--paper);}
.sec-head p{margin-top:1em;color:var(--text-dim);max-width:38em;}
.dark .sec-head p{color:#9fb0aa;}
p{max-width:40em;}
.lead{font-size:1.06rem;color:var(--text-dim);}

/* ---------------- hero ---------------- */
.hero{background:var(--ink);color:var(--paper);min-height:92vh;display:flex;flex-direction:column;
  justify-content:center;padding:110px 6vw 56px;position:relative;overflow:hidden;}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 75% 55% at 50% 112%,rgba(46,110,94,.22),transparent 65%);}
.hero-inner{position:relative;z-index:1;max-width:var(--wrap);margin-inline:auto;width:100%;
  display:grid;grid-template-columns:1fr;gap:2.4em;}
.hero-inner>*{min-width:0;}
.hero h1{font-weight:400;font-size:clamp(2rem,6.4vw,3.6rem);line-height:1.18;color:var(--paper);max-width:12em;}
.hero h1 em{font-style:normal;color:var(--brass-soft);}
.hero .value{margin-top:1.2em;max-width:30em;color:#c3ccc8;font-size:1.08rem;}
.hero-cta{margin-top:2.2em;display:flex;gap:.9em;flex-wrap:wrap;}
@media(min-width:900px){
  .hero-inner{grid-template-columns:1.35fr .9fr;align-items:center;}
}
/* portrait placeholder */
.portrait{aspect-ratio:4/5;background:linear-gradient(160deg,var(--ink-soft),var(--ink-deep));
  border:1px solid rgba(196,164,95,.4);display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:1em;text-align:center;padding:2em;box-shadow:16px 16px 0 rgba(0,0,0,.12);
  max-width:340px;width:100%;margin-inline:auto;}
.portrait .p-ring{width:76px;height:76px;border-radius:50%;border:1px solid rgba(196,164,95,.5);
  display:flex;align-items:center;justify-content:center;}
.portrait .p-ring svg{width:40px;height:40px;}
.portrait .p-note{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;color:var(--brass-soft);
  text-transform:uppercase;opacity:.85;}

/* ---------------- nine-stage chart ---------------- */
.chart-wrap{margin-top:1vh;}
.chart-wrap svg.curve-svg{width:100%;height:auto;display:block;overflow:visible;}
.curve{fill:none;stroke:var(--brass-soft);stroke-width:2.2;
  stroke-dasharray:2200;stroke-dashoffset:2200;animation:draw 4.4s cubic-bezier(.4,0,.25,1) .3s forwards;}
.curve-glow{fill:none;stroke:rgba(196,164,95,.22);stroke-width:8;filter:blur(6px);
  stroke-dasharray:2200;stroke-dashoffset:2200;animation:draw 4.4s cubic-bezier(.4,0,.25,1) .3s forwards;}
@keyframes draw{to{stroke-dashoffset:0;}}
.stage-dot{fill:var(--ink);stroke:var(--brass-soft);stroke-width:2;opacity:0;animation:pop .5s ease forwards;}
.stage-lbl{font-family:var(--mono);font-size:12px;fill:#cfd6d2;letter-spacing:.08em;opacity:0;animation:pop .5s ease forwards;}
.stage-lbl tspan.n{fill:var(--brass-soft);}
@keyframes pop{to{opacity:1;}}
.chart-caption{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;color:#7f918b;margin-top:1.2em;text-align:center;}
.hero .chart-caption{color:#7f918b;}

/* ---------------- nine stages grid (method) ---------------- */
.stages{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);}
@media(min-width:600px){.stages{grid-template-columns:repeat(2,1fr);}}
@media(min-width:920px){.stages{grid-template-columns:repeat(3,1fr);}}
.stage{background:var(--paper);padding:1.8em 1.5em 2em;transition:background .3s;}
.stage:hover{background:var(--paper-deep);}
.stage .num{font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;color:var(--brass);}
.stage .room{font-family:var(--mono);font-size:.58rem;letter-spacing:.13em;color:var(--text-dim);
  display:block;margin-top:.3em;text-transform:uppercase;}
.stage h3{font-size:1.28rem;margin:.5em 0 .5em;}
.stage p{font-size:.92rem;color:var(--text-dim);line-height:1.68;}
.stage .key{margin-top:.9em;font-family:var(--serif);font-style:italic;font-size:1rem;color:var(--text);
  border-inline-start:2px solid var(--brass-soft);padding-inline-start:.9em;}
.stage .spark{height:28px;margin-top:1.1em;}
.stage .spark path{fill:none;stroke:var(--rise);stroke-width:1.8;opacity:.75;}
.method-note{max-width:760px;margin:2.4em auto 0;font-size:.94rem;color:var(--text-dim);
  border-inline-start:2px solid var(--brass);padding-inline-start:1.3em;}
.method-note strong{color:var(--brass);}

/* ---------------- journey rooms (dark) ---------------- */
.dark{background:var(--ink);color:#c7d0cc;}
.rooms{max-width:880px;margin-inline:auto;}
.room{display:grid;grid-template-columns:64px 1fr;gap:1.2em;padding:1.25em 0;
  border-bottom:1px solid rgba(196,164,95,.16);align-items:baseline;}
@media(min-width:600px){.room{grid-template-columns:88px 1fr;gap:1.6em;}}
.room:last-child{border-bottom:none;}
.room .idx{font-family:var(--mono);font-size:.75rem;letter-spacing:.12em;color:var(--brass-soft);}
.room .idx .st{display:block;font-size:.58rem;color:#7f918b;margin-top:.3em;letter-spacing:.06em;}
.room h3{font-weight:400;font-size:1.14rem;color:var(--paper);margin-bottom:.25em;}
.room p{font-size:.9rem;color:#9fb0aa;}
.journey-note{max-width:880px;margin:2.4em auto 0;font-size:.9rem;color:#8fa19a;
  border-inline-start:2px solid var(--brass);padding-inline-start:1.3em;}

/* ---------------- pricing ---------------- */
.price-grid{display:grid;grid-template-columns:1fr;gap:1.4em;max-width:1000px;margin-inline:auto;}
@media(min-width:760px){.price-grid{grid-template-columns:repeat(3,1fr);}}
.price{background:#fff;border:1px solid var(--line);padding:2em 1.7em;display:flex;flex-direction:column;}
.price.feature{border-color:var(--brass);box-shadow:10px 10px 0 rgba(169,133,63,.08);}
.price .tag{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;color:var(--brass);
  text-transform:uppercase;margin-bottom:.6em;}
.price h3{font-size:1.2rem;margin-bottom:.2em;}
.price .amt{font-family:var(--serif);font-size:1.7rem;color:var(--brass);margin:.35em 0 .1em;
  direction:ltr;} /* keep price ranges reading $1,800–$2,500 in both languages */
html[dir="rtl"] .price .amt{text-align:right;}
.price .per{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;color:var(--text-dim);text-transform:uppercase;}
.price p{font-size:.88rem;color:var(--text-dim);margin-top:.9em;}
.pricing-note{max-width:760px;margin:2.2em auto 0;font-size:.85rem;color:var(--text-dim);text-align:center;}

/* ---------------- prose blocks (about / generic) ---------------- */
.prose{max-width:760px;margin-inline:auto;}
.prose .rule{width:56px;height:2px;background:var(--brass);margin:1.8em 0;}
.prose p{color:var(--text-dim);margin-bottom:1.05em;}
.prose h2{margin-bottom:.4em;}
.prose .quiet{font-size:1rem;font-family:var(--serif);font-style:italic;color:var(--text);
  border-inline-start:2px solid var(--brass-soft);padding-inline-start:1em;margin:1.4em 0;}

/* ---------------- FAQ accordion ---------------- */
.faq{max-width:780px;margin-inline:auto;}
.faq details{border-bottom:1px solid var(--line);padding:.3em 0;}
.faq summary{list-style:none;cursor:pointer;padding:1em .2em;font-family:var(--serif);font-size:1.15rem;
  color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:1em;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";font-family:var(--mono);color:var(--brass);font-size:1.3rem;transition:transform .25s;flex:none;}
.faq details[open] summary::after{transform:rotate(45deg);}
.faq .answer{padding:0 .2em 1.2em;color:var(--text-dim);font-size:.96rem;}
.faq .answer p{margin-bottom:.7em;}

/* ---------------- contact ---------------- */
.contact-wrap{max-width:640px;margin-inline:auto;text-align:center;}
.contact-wrap p{margin:1em auto 1.8em;}
.dark .contact-wrap p{color:#9fb0aa;}
.c-line{font-family:var(--mono);font-size:.82rem;color:var(--brass-soft);margin-top:2.2em;letter-spacing:.06em;}
.c-line a{color:var(--brass-soft);}

/* ---------------- callout band ---------------- */
.band{background:var(--paper-deep);text-align:center;}
.band .bowl-art{width:96px;height:96px;margin:0 auto 1.4em;display:block;}
.band .bowl-art .rim,.band .bowl-art .body{fill:none;stroke:var(--brass);stroke-width:2.2;}
.band .bowl-art .shine{fill:none;stroke:var(--brass-soft);stroke-width:1.4;opacity:.6;}
.band h2{max-width:16em;margin:0 auto;}
.band .lines{max-width:34em;margin:1.4em auto 0;}
.band .lines span{display:block;margin:.35em 0;font-family:var(--serif);font-size:1.1rem;font-style:italic;color:var(--text);}
.band .cta{margin-top:1.8em;}

/* ---------------- footer ---------------- */
footer{background:var(--ink-deep);color:#7d8d87;font-size:.78rem;padding:2.6em 6vw;line-height:1.9;}
footer .legal{max-width:900px;margin-inline:auto;}
footer .foot-links{display:flex;flex-wrap:wrap;gap:.4em 1.4em;margin-bottom:1.4em;}
footer .foot-links a{color:#9fb0aa;text-decoration:none;font-size:.82rem;}
footer .foot-links a:hover{color:var(--brass-soft);}
footer .disc{border-top:1px solid rgba(196,164,95,.14);padding-top:1.4em;}
footer .safety{color:#a9b6b1;}
footer strong{color:#a9b6b1;font-weight:600;}
footer .copy{margin-top:1em;}

/* ---------------- reveal on scroll ---------------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease;}
.reveal.in{opacity:1;transform:none;}

/* ============================================================
   Quiz — "Where Are You in the Pattern?"
   ============================================================ */
.quiz-main{padding-top:88px;min-height:100vh;}
.quiz-shell{max-width:680px;margin-inline:auto;padding:2.4em 6vw 4em;}
.quiz-head{text-align:center;margin-bottom:2.4em;}
.quiz-head .eyebrow{margin-inline:auto;}
.quiz-head h1{font-size:clamp(1.7rem,5vw,2.6rem);font-weight:400;}
.quiz-head p{margin:.9em auto 0;color:var(--text-dim);max-width:32em;}
.quiz-progress{display:flex;gap:.4em;justify-content:center;margin-bottom:2em;}
.quiz-progress i{width:26px;height:3px;background:var(--line);border-radius:2px;transition:background .3s;}
.quiz-progress i.done{background:var(--brass);}
.quiz-progress i.now{background:var(--brass-soft);}

/* generic option list (domains + answers) */
.opt-list{display:grid;gap:.9em;}
.opt{display:block;width:100%;text-align:start;background:#fff;border:1px solid var(--line);
  border-radius:12px;padding:1.1em 1.3em;font-family:var(--body);font-size:1.02rem;color:var(--text);
  cursor:pointer;transition:border-color .2s,transform .12s,box-shadow .2s;line-height:1.5;font-weight:300;}
.opt:hover{border-color:var(--brass-soft);box-shadow:0 3px 14px rgba(169,133,63,.1);}
.opt:active{transform:scale(.995);}
.opt .opt-domain{display:flex;align-items:center;gap:.7em;font-family:var(--serif);font-size:1.15rem;}
.opt .opt-domain .dot{width:9px;height:9px;border-radius:50%;background:var(--brass);flex:none;}

.q-title{font-family:var(--serif);font-size:1.35rem;color:var(--ink);margin-bottom:.3em;line-height:1.3;}
.q-sub{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;color:var(--brass);
  text-transform:uppercase;margin-bottom:1.4em;}
.quiz-nav{display:flex;justify-content:space-between;align-items:center;margin-top:1.8em;}
.quiz-back{background:none;border:none;color:var(--text-dim);font-family:var(--body);font-size:.9rem;
  cursor:pointer;padding:.5em;}
.quiz-back:hover{color:var(--brass);}
.quiz-back[hidden]{visibility:hidden;}

/* result card */
.result{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;
  box-shadow:0 10px 40px rgba(16,32,29,.07);}
.result-top{background:var(--ink);color:var(--paper);padding:2.2em 1.8em 2em;text-align:center;position:relative;overflow:hidden;}
.result-top::before{content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 80% 60% at 50% 120%,rgba(46,110,94,.28),transparent 66%);}
.result-top .r-inner{position:relative;z-index:1;}
.result-top .r-eyebrow{font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;color:var(--brass-soft);text-transform:uppercase;}
.result-top .r-stage{font-family:var(--serif);font-size:clamp(2rem,7vw,3rem);font-weight:400;color:var(--paper);margin:.35em 0 .1em;}
.result-top .r-stage .num{color:var(--brass-soft);font-size:.6em;vertical-align:.15em;margin-inline-end:.2em;}
.result-top .r-room{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;color:#9fb0aa;text-transform:uppercase;}
.result-top .r-spark{height:34px;margin:1.2em auto 0;max-width:200px;}
.result-top .r-spark path{fill:none;stroke:var(--brass-soft);stroke-width:2;}
.result-body{padding:2em 1.8em 2.2em;}
.result-body .r-key{font-family:var(--serif);font-style:italic;font-size:1.25rem;color:var(--ink);
  text-align:center;line-height:1.4;margin-bottom:1.4em;}
.result-body h3{font-size:.72rem;font-family:var(--mono);letter-spacing:.16em;color:var(--brass);
  text-transform:uppercase;margin:1.4em 0 .5em;font-weight:400;}
.result-body p{color:var(--text-dim);max-width:none;}
.result-body .r-mistake{background:var(--paper-deep);border-inline-start:2px solid var(--brass);
  padding:1em 1.2em;border-radius:0 8px 8px 0;margin-top:.4em;}
.result-cta{display:flex;flex-wrap:wrap;gap:.8em;margin-top:1.8em;}
.result-cta .btn{flex:1 1 auto;}
.result-note{font-family:var(--mono);font-size:.64rem;letter-spacing:.06em;color:var(--text-dim);
  text-align:center;margin-top:1.6em;line-height:1.7;}
.share-note{text-align:center;font-size:.82rem;color:var(--brass);margin-top:.8em;min-height:1.2em;}
.quiz-restart{text-align:center;margin-top:1.6em;}
.quiz-restart button{background:none;border:none;color:var(--text-dim);font-family:var(--body);
  font-size:.88rem;cursor:pointer;text-decoration:underline;text-underline-offset:3px;}
.quiz-restart button:hover{color:var(--brass);}

/* privacy line under the quiz */
.privacy-line{text-align:center;font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;
  color:var(--text-dim);margin-top:2.4em;line-height:1.8;}

/* ---------------- a11y: contrast ---------------- */
/* darker brass for small labels on light backgrounds (WCAG AA for small text) */
:root{--brass-ink:#7e5f2b;}
.eyebrow,.q-sub,.stage .num,.price .tag,.result-body h3,.method-note strong{color:var(--brass-ink);}
.faq summary::after{color:var(--brass-ink);}
.dark .eyebrow,.hero .eyebrow{color:var(--brass-soft);} /* keep light brass on dark grounds */

/* ---------------- reduced motion ---------------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .curve,.curve-glow{animation:none;stroke-dashoffset:0;}
  .stage-dot,.stage-lbl{animation:none!important;opacity:1!important;}
  .reveal{opacity:1;transform:none;transition:none;}
  .mobile-nav{transition:none;}
}
