/* LawFiq tools: faraid calculator, nikah checker, prenup builder */
:root{--gold:#0B1F3A;--gold-dk:#0B1F3A;--gold-lt:#E6EAF0;--ivory:#F7F8FA}

.tl-hero{background:radial-gradient(130% 100% at 50% 0%,#12325C 0%,var(--navy) 58%,#08152a 100%);color:#F4F1EA;padding:clamp(3rem,6vw,4.75rem) 0 clamp(2.5rem,5vw,3.75rem)}
.tl-hero .crumb{color:#9FB2D4;font-size:var(--t-sm);margin-bottom:1.25rem}
.tl-hero .crumb a{color:#CBD3E2;text-decoration:none}
.tl-hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(2.2rem,4.4vw,3.4rem);line-height:1.08;letter-spacing:-.015em;color:#fff;margin:0 0 1rem;max-width:22ch}
.tl-hero p{color:#CBD3E2;font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.6;max-width:60ch;margin:0}
.tl-hero .tl-note{margin-top:1.25rem;font-size:var(--t-sm);color:#9FB2D4;max-width:64ch}

.tl-sec{padding:clamp(2.5rem,5vw,4rem) 0;background:var(--mist)}
.tl-sec--white{background:#fff}
.tl-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(1.25rem,3vw,2.5rem);align-items:start}
@media(max-width:1024px){.tl-grid{grid-template-columns:1fr}}

.tl-panel{background:#fff;border:1px solid var(--line);border-radius:var(--r-feat);padding:clamp(1.25rem,3vw,2rem)}
.tl-panel h2{font-family:var(--serif);font-weight:600;font-size:var(--t-h4);color:var(--navy);margin:0 0 .35rem}
.tl-panel .tl-sub{color:var(--ink-2);font-size:var(--t-sm);margin:0 0 1.25rem}
.tl-group{border:0;margin:0 0 1.25rem;padding:0}
.tl-group>legend{font-weight:600;color:var(--navy);font-size:.98rem;margin-bottom:.6rem;padding:0}
.tl-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--line)}
.tl-row:last-child{border-bottom:0}
.tl-row label,.tl-row .tl-lbl{color:var(--ink);font-size:.98rem}
.tl-row small{display:block;color:var(--muted);font-size:var(--t-cap)}
.tl-field{display:block;margin-bottom:1rem}
.tl-field>span{display:block;font-weight:600;color:var(--navy);font-size:var(--t-sm);margin-bottom:.4rem}
.tl-field>small{display:block;color:var(--muted);font-size:var(--t-cap);margin:-.2rem 0 .45rem}
.tl-input,.tl-select,.tl-text{width:100%;font:inherit;font-size:1rem;color:var(--ink);background:#fff;border:1.5px solid var(--line-2);border-radius:var(--r);padding:.7rem .85rem;min-height:46px}
.tl-text{min-height:84px;resize:vertical}
.tl-input:focus,.tl-select:focus,.tl-text:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(29,78,216,.18)}
.tl-money{position:relative}
.tl-money::before{content:"£";position:absolute;left:.85rem;top:50%;transform:translateY(-50%);color:var(--muted)}
.tl-money .tl-input{padding-left:1.7rem}
.tl-2{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
@media(max-width:640px){.tl-2{grid-template-columns:1fr}}

/* stepper */
.tl-step{display:inline-flex;align-items:center;border:1.5px solid var(--line-2);border-radius:var(--r-pill);overflow:hidden;flex:none}
.tl-step button{width:40px;height:40px;border:0;background:#fff;color:var(--navy);font-size:1.2rem;cursor:pointer}
@media (hover:hover){.tl-step button:hover{background:var(--mist)}}
.tl-step output{min-width:2.2rem;text-align:center;font-weight:600;color:var(--navy)}
/* segmented choice */
.tl-seg{display:inline-flex;border:1.5px solid var(--line-2);border-radius:var(--r-pill);padding:3px;gap:3px;flex:none}
.tl-seg input{position:absolute;opacity:0;pointer-events:none}
.tl-seg label{padding:.45rem .95rem;border-radius:var(--r-pill);cursor:pointer;font-size:var(--t-sm);color:var(--ink-2)}
.tl-seg input:checked+label{background:var(--navy);color:#fff}
.tl-seg input:focus-visible+label{outline:3px solid var(--blue);outline-offset:2px}
/* toggle */
.tl-tog{position:relative;width:48px;height:28px;flex:none}
.tl-tog input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer;z-index:1}
.tl-tog span{position:absolute;inset:0;background:var(--line-2);border-radius:99px;transition:.18s}
.tl-tog span::after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:.18s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.tl-tog input:checked+span{background:var(--blue)}
.tl-tog input:checked+span::after{transform:translateX(20px)}
.tl-tog input:focus-visible+span{outline:3px solid var(--blue);outline-offset:2px}

/* ===== dual ledger ===== */
.ledger{background:#fff;border:1px solid var(--line);border-radius:var(--r-feat);overflow:hidden}
.ledger-head{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line)}
.ledger-head div{padding:1.1rem 1.25rem}
.ledger-head div:first-child{background:linear-gradient(180deg,#FBF6EA,#fff);border-right:1px solid var(--line)}
.ledger-head b{display:block;font-family:var(--serif);font-weight:600;font-size:1.15rem;color:var(--navy)}
.ledger-head span{font-size:var(--t-cap);color:var(--muted)}
.ledger-head .lk-f b{color:var(--gold-dk)}
.ledger-row{padding:1rem 1.25rem;border-bottom:1px solid var(--line)}
.ledger-row:last-child{border-bottom:0}
.ledger-name{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;margin-bottom:.55rem}
.ledger-name b{color:var(--navy);font-weight:600}
.ledger-name small{color:var(--muted);font-size:var(--t-cap)}
.ledger-bars{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.lb{display:grid;gap:.3rem}
.lb-track{height:10px;border-radius:99px;background:var(--mist);overflow:hidden}
.lb-fill{height:100%;border-radius:99px;transition:width .5s var(--ease)}
.lb-f .lb-fill{background:linear-gradient(90deg,#B08A45,#D9B874)}
.lb-e .lb-fill{background:linear-gradient(90deg,#1D4ED8,#5B82E6)}
.lb-val{display:flex;justify-content:space-between;font-size:var(--t-sm);color:var(--ink-2)}
.lb-val strong{color:var(--navy);font-variant-numeric:tabular-nums}
.lb-zero .lb-val strong{color:#B4452F}
.ledger-gap{margin-top:.5rem;font-size:var(--t-cap);color:#B4452F}
.ledger-sum{display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding:1rem 1.25rem;background:var(--mist);font-size:var(--t-sm);color:var(--ink-2)}
.ledger-empty{padding:2.5rem 1.5rem;text-align:center;color:var(--muted)}
@media(max-width:640px){.ledger-bars,.ledger-head,.ledger-sum{grid-template-columns:1fr}.ledger-head div:first-child{border-right:0;border-bottom:1px solid var(--line)}}

.tl-callout{border-left:3px solid var(--gold);background:var(--ivory);border-radius:0 var(--r) var(--r) 0;padding:1rem 1.15rem;margin:1.25rem 0 0;color:var(--ink-2);font-size:var(--t-sm);line-height:1.6}
.tl-callout b{color:var(--navy)}
.tl-callout--warn{border-color:#C0563B;background:#FDF3EF}
.tl-notes{margin:1.25rem 0 0;padding:0 0 0 1.1rem;color:var(--ink-2);font-size:var(--t-sm);line-height:1.6}
.tl-notes li{margin-bottom:.35rem}
.tl-cta{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;margin-top:1.5rem}
.tl-disclaim{font-size:var(--t-cap);color:var(--muted);margin-top:1.25rem;line-height:1.55}

/* ===== nikah checker ===== */
.nc{max-width:760px;margin:0 auto}
.nc-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-feat);padding:clamp(1.5rem,4vw,2.5rem)}
.nc-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem;color:var(--muted);font-size:var(--t-sm)}
.nc-trail{display:flex;gap:6px}
.nc-trail span{width:28px;height:5px;border-radius:99px;background:var(--line)}
.nc-trail span.on{background:var(--blue)}
.nc h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.35rem,2.4vw,1.75rem);line-height:1.25;color:var(--navy);margin:0 0 .5rem;outline:none}
.nc .nc-help{color:var(--ink-2);font-size:var(--t-sm);margin:0 0 1.25rem;line-height:1.6}
.nc-opts{display:grid;gap:.7rem}
.nc-opt{display:flex;gap:.9rem;align-items:flex-start;text-align:left;width:100%;background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:1rem 1.1rem;cursor:pointer;font:inherit;color:var(--ink)}
.nc-opt:focus-visible{border-color:var(--blue);background:var(--tint)}@media (hover:hover){.nc-opt:hover{border-color:var(--blue);background:var(--tint)}}
.nc-opt b{display:block;color:var(--navy);font-weight:600}
.nc-opt small{display:block;color:var(--muted);font-size:var(--t-sm);margin-top:.15rem}
.nc-opt .dot{flex:none;width:20px;height:20px;border-radius:50%;border:2px solid var(--line-2);margin-top:.15rem}
.nc-back{background:none;border:0;color:var(--ink-2);font:inherit;font-size:var(--t-sm);cursor:pointer;padding:.5rem 0;margin-top:1rem;min-height:44px}
@media (hover:hover){.nc-back:hover{color:var(--blue)}}
.nc-verdict{display:flex;gap:1rem;align-items:flex-start;padding:1.1rem 1.2rem;border-radius:14px;margin:0 0 1.25rem}
.nc-verdict .ic{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:1.1rem}
.nc-verdict b{display:block;font-family:var(--serif);font-size:1.25rem;font-weight:600;line-height:1.25}
.nc-verdict span{display:block;font-size:var(--t-sm);margin-top:.25rem;line-height:1.55}
.nc-yes{background:#EEF8F2;color:#185F38}.nc-yes .ic{background:#1A7A43;color:#fff}
.nc-maybe{background:#FEF7EA;color:#7A5210}.nc-maybe .ic{background:#B4790A;color:#fff}
.nc-no{background:#FDF1EC;color:#8A2F1D}.nc-no .ic{background:#B4452F;color:#fff}
.nc h3{font-family:var(--serif);font-weight:600;font-size:1.1rem;color:var(--navy);margin:1.4rem 0 .5rem}
.nc ul{margin:0;padding-left:1.1rem;color:var(--ink-2);line-height:1.65}
.nc li{margin-bottom:.35rem}

/* ===== prenup builder ===== */
.pb-steps{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.25rem}
.pb-steps button{border:1.5px solid var(--line-2);background:#fff;border-radius:var(--r-pill);padding:.45rem .9rem;font:inherit;font-size:var(--t-sm);color:var(--ink-2);cursor:pointer}
.pb-steps button[aria-current="step"]{background:var(--navy);border-color:var(--navy);color:#fff}
.pb-pane[hidden]{display:none}
.pb-clause{display:flex;gap:.85rem;align-items:flex-start;padding:.9rem 0;border-bottom:1px solid var(--line)}
.pb-clause:last-child{border-bottom:0}
.pb-clause input[type=checkbox]{width:20px;height:20px;margin-top:.2rem;accent-color:var(--blue);flex:none}
.pb-clause b{display:block;color:var(--navy);font-weight:600}
.pb-clause small{display:block;color:var(--muted);font-size:var(--t-sm);line-height:1.5;margin-top:.15rem}
.pb-clause .tl-input{margin-top:.5rem;max-width:140px}
.pb-nav{display:flex;justify-content:space-between;gap:1rem;margin-top:1.5rem}
.doc{background:var(--ivory);border:1px solid #E7DCC2;border-radius:var(--r-feat);padding:clamp(1.5rem,4vw,2.75rem);font-family:var(--serif);color:#2A2419;position:sticky;top:96px;max-height:calc(100vh - 120px);overflow:auto}
.doc h2{text-align:center;font-weight:600;font-size:1.45rem;margin:0 0 .25rem;color:var(--navy)}
.doc .doc-ar{text-align:center;font-family:var(--arabic);font-size:1.15rem;color:var(--gold-dk);margin:0}
.doc .doc-draft{text-align:center;font-family:var(--sans);font-size:var(--t-cap);letter-spacing:.08em;color:#B4452F;margin:.5rem 0 1.25rem}
.doc h3{font-size:1.02rem;font-weight:600;color:var(--navy);margin:1.25rem 0 .4rem}
.doc p,.doc li{font-size:.98rem;line-height:1.7;margin:0 0 .5rem}
.doc ol{padding-left:1.2rem;margin:0}
.doc .blank{border-bottom:1px solid #B9A98A;display:inline-block;min-width:8ch;color:#8A7A5A}
.doc .sig{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:1.75rem}
.doc .sig div{border-top:1px solid #B9A98A;padding-top:.4rem;font-family:var(--sans);font-size:var(--t-cap);color:#6B5E45}
@media(max-width:1024px){.doc{position:static;max-height:none}}
@media print{
  body *{visibility:hidden}
  .doc,.doc *{visibility:visible}
  .doc{position:absolute;left:0;top:0;width:100%;max-height:none;overflow:visible;border:0;background:#fff;padding:0}
}

/* tools hub */
.tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.5rem)}
.tool-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r-feat);padding:clamp(1.4rem,3vw,2rem);text-decoration:none;color:inherit;transition:border-color .18s,transform .18s,box-shadow .18s}
.tool-card:focus-visible{border-color:var(--gold);transform:translateY(-2px);box-shadow:var(--shadow-sm)}@media (hover:hover){.tool-card:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:var(--shadow-sm)}}
.tool-ic{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:var(--ivory);color:var(--gold-dk);border:1px solid #E7DCC2}
.tool-ic svg{width:24px;height:24px}
.tool-card h2{font-family:var(--serif);font-weight:600;font-size:var(--t-h4);color:var(--navy);margin:1.1rem 0 .45rem}
.tool-card p{color:var(--ink-2);font-size:var(--t-sm);line-height:1.6;margin:0 0 1.25rem}
.tool-go{margin-top:auto;color:var(--blue);font-weight:600;font-size:var(--t-sm)}
@media(max-width:1024px){.tools-grid{grid-template-columns:1fr}}
.tl-row[hidden],.pb-pane[hidden],[hidden].tl-row{display:none!important}

/* ===== platform ===== */
.pf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.5rem)}
.pf-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-feat);padding:clamp(1.4rem,3vw,2rem);text-decoration:none;color:inherit;background:linear-gradient(180deg,#fff,var(--ivory));transition:border-color .18s,transform .18s}
.pf-card:focus-visible{border-color:var(--gold);transform:translateY(-2px)}@media (hover:hover){.pf-card:hover{border-color:var(--gold);transform:translateY(-2px)}}
.pf-num{font-family:var(--serif);font-size:1.6rem;color:var(--gold-dk)}
.pf-card h2{font-family:var(--serif);font-weight:600;font-size:var(--t-h4);color:var(--navy);margin:.6rem 0 .45rem}
.pf-card p{color:var(--ink-2);font-size:var(--t-sm);line-height:1.6;margin:0 0 1.25rem}
@media(max-width:1024px){.pf-grid{grid-template-columns:1fr}}
.pf-head{max-width:52rem;margin:0 0 clamp(1.5rem,3vw,2.25rem)}
.pf-head h2{font-family:var(--serif);font-weight:600;font-size:var(--t-h2);color:var(--navy);margin:.8rem 0 .75rem;line-height:1.15}
.pf-head p{color:var(--ink-2);line-height:1.65;margin:0}
.pf-h3{font-family:var(--serif);font-weight:600;font-size:1.15rem;color:var(--navy);margin:0 0 .3rem}
.pf-qn{font-size:var(--t-cap);letter-spacing:.01em;text-transform:none;color:var(--blue);font-weight:700;margin:0 0 .4rem}
.pf-q{font-family:var(--serif);font-weight:600;font-size:1.2rem;color:var(--navy);margin:0 0 1rem;line-height:1.3}
.pf-case{background:#fff;border:1px solid var(--line);border-radius:var(--r-feat);padding:clamp(1.25rem,3vw,1.75rem)}
.pf-case-top{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;padding-bottom:1rem;border-bottom:1px solid var(--line);margin-bottom:1rem}
.pf-case-top small{display:block;color:var(--muted);font-size:var(--t-cap);text-transform:none;letter-spacing:.01em}
.pf-case-top b{color:var(--navy);font-variant-numeric:tabular-nums}
.pf-status{background:var(--tint);color:var(--blue);font-size:var(--t-cap);font-weight:700;border-radius:99px;padding:.35rem .75rem;white-space:nowrap}
.pf-flag{border-left:4px solid;border-radius:0 10px 10px 0;padding:.75rem .9rem;margin-bottom:.6rem;font-size:var(--t-sm)}
.pf-flag b{display:block;color:var(--navy)}
.pf-flag span{color:var(--ink-2);line-height:1.5}
.pf-red{border-color:#B4452F;background:#FDF1EC}.pf-green{border-color:#1A7A43;background:#EEF8F2}.pf-blue{border-color:var(--blue);background:var(--tint)}.pf-amber{border-color:#B4790A;background:#FEF7EA}
.pf-steps{list-style:none;padding:0;margin:1rem 0 0;counter-reset:s}
.pf-steps li{counter-increment:s;position:relative;padding:.45rem 0 .45rem 2.2rem;color:var(--muted);font-size:var(--t-sm)}
.pf-steps li::before{content:counter(s);position:absolute;left:0;top:.35rem;width:1.5rem;height:1.5rem;border-radius:50%;border:1.5px solid var(--line-2);display:grid;place-items:center;font-size:.75rem;font-weight:700}
.pf-steps li.done{color:var(--navy)}.pf-steps li.done::before{content:"✓";background:#1A7A43;border-color:#1A7A43;color:#fff}
.pf-steps li.on{color:var(--navy);font-weight:600}.pf-steps li.on::before{border-color:var(--blue);color:var(--blue)}
.pf-code{font-family:var(--sans);font-size:.85rem;line-height:1.55}
textarea.pf-code{min-height:260px}
.pf-out{background:#0B1F3A;color:#E3EAF6;border-radius:var(--r);padding:1rem;margin:0;overflow:auto;max-height:420px;white-space:pre}
/* verify */
.cert{margin:0;background:var(--ivory);border:1px solid #E7DCC2;border-radius:var(--r-feat);padding:clamp(1.5rem,4vw,2.5rem);font-family:var(--serif);color:#2A2419;box-shadow:var(--shadow-sm)}
.cert-kicker{font-family:var(--sans);font-size:var(--t-cap);letter-spacing:.01em;text-transform:none;color:#B4452F;margin:0 0 .75rem;text-align:center}
.cert h2{text-align:center;font-weight:600;font-size:1.5rem;color:var(--navy);margin:0}
.cert-ar{text-align:center;font-family:var(--arabic);color:var(--gold-dk);font-size:1.2rem;margin:.2rem 0 1rem}
.cert p{line-height:1.7}
.cert dl{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:1rem 0}
.cert dt,.vf-dl dt{font-family:var(--sans);font-size:var(--t-cap);color:var(--muted);text-transform:none;letter-spacing:.01em}
.cert dd,.vf-dl dd{margin:.15rem 0 0;font-weight:600;color:var(--navy)}
.cert-foot{display:flex;gap:1rem;align-items:center;border-top:1px solid #E7DCC2;padding-top:1rem;margin-top:1rem}
.cert-foot .qr{width:96px;height:96px;flex:none}
.cert-foot small{display:block;font-family:var(--sans);color:var(--muted);font-size:var(--t-cap)}
.cert-foot b{font-family:var(--sans);color:var(--navy);letter-spacing:.04em}
.vf-dl{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:1.1rem;margin:0}
#vf-res{margin-top:1.25rem}