@charset "UTF-8";
/* Shared shell for the content and policy pages (About, Contact, Pricing,
   Refunds, Shipping, Privacy, Terms). Same palette and type as the home page
   (css/home.css) so the site reads as one thing, but standalone: these pages
   carry no WebGL, no scroll engine and no content-data dependency, because
   payment-gateway and search crawlers must see the text without running JS. */

@font-face{font-family:'Instrument Serif';src:url('../vendor/serif.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Inter';src:url('../vendor/inter-variable.woff2') format('woff2');font-weight:100 900;font-display:swap}

:root{
  --bg:#0E1424; --card:#151D30; --ink:#F3EEE4; --ink-rgb:243,238,228; --dim:#A9B1C2;
  --rule:rgba(var(--ink-rgb),.1); --rule-2:rgba(var(--ink-rgb),.18);
  --q:#3CC48C; --eu:#7FA6FF; --us:#FF7D6E; --in:#F2B54A; --accent:#FF9D7E;
  --serif:'Instrument Serif',Georgia,'Times New Roman',serif;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{background:var(--bg);color:var(--ink);font:17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2.5px solid var(--eu);outline-offset:3px;border-radius:4px}
.wrap{max-width:1280px;margin:0 auto;padding:0 clamp(20px,3.4vw,44px)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--bg);padding:10px 14px;z-index:200}
.skip:focus{left:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- document-control strip + nav, mirroring the home page ---------- */
.doc-control{border-bottom:1px solid var(--rule);color:var(--dim);font:500 11px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase}
.doc-control .wrap{display:flex;gap:28px;padding:9px clamp(20px,3.4vw,44px);overflow:hidden;white-space:nowrap}
.doc-control .dc-r{margin-left:auto}
@media(max-width:640px){.doc-control span:nth-child(n+3){display:none}}

.nav{position:sticky;top:0;z-index:100;background:rgba(14,20,36,.88);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--rule)}
.nav-in{display:flex;align-items:center;gap:20px;height:70px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:400 20px/1 var(--serif);letter-spacing:-.02em}
.logo svg{width:30px;height:30px;fill:none;stroke:var(--ink);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.logo svg path{stroke:var(--eu)}
.nav .back{margin-left:auto;font:500 14px/1 var(--sans);color:var(--dim);text-decoration:none;white-space:nowrap}
.nav .back:hover{color:var(--ink)}

/* ---------- page body ---------- */
.page{padding:clamp(48px,7vw,96px) 0 clamp(64px,8vw,110px)}
.page .wrap{max-width:860px}
.eyebrow{font:600 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:18px}
h1{font:400 clamp(34px,5.4vw,60px)/1.05 var(--serif);letter-spacing:-.01em;margin-bottom:14px}
.lede{font-size:clamp(18px,2vw,21px);color:var(--dim);max-width:62ch;margin-bottom:10px}
.updated{font:500 13px/1 var(--sans);color:var(--dim);margin:22px 0 40px;padding-top:22px;border-top:1px solid var(--rule)}
h2{font:400 clamp(24px,2.6vw,31px)/1.15 var(--serif);margin:48px 0 14px}
h3{font:600 16px/1.3 var(--sans);margin:28px 0 10px}
p,li{color:rgba(var(--ink-rgb),.82);margin-bottom:14px}
.page ul,.page ol{padding-left:22px;margin-bottom:16px}
.page li{margin-bottom:9px}
strong{color:var(--ink);font-weight:600}
.page a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.fine{font-size:14.5px;color:var(--dim)}

/* definition-style fact table, used for contact and business details */
.facts{width:100%;border-collapse:collapse;margin:8px 0 28px;border-top:1px solid var(--ink)}
.facts th,.facts td{text-align:left;padding:13px 0;border-bottom:1px solid var(--rule);vertical-align:top;font-size:15.5px}
.facts th{width:220px;font:600 11px/1.6 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);padding-right:20px}
@media(max-width:600px){.facts th,.facts td{display:block;width:auto;border-bottom:0;padding:4px 0}.facts td{padding-bottom:16px;border-bottom:1px solid var(--rule)}}

/* cards used by pricing and about */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin:28px 0 8px}
.card{background:var(--card);border:1px solid var(--rule-2);border-radius:14px;padding:24px}
.card h3{margin-top:0}
.card .price{font:400 30px/1 var(--serif);margin:10px 0 6px}
.card .price small{display:block;font:500 12.5px/1.5 var(--sans);color:var(--dim);margin-top:6px}
.card ul{margin:12px 0 0;padding-left:20px}
.card li{font-size:14.5px}
.tag{display:inline-block;font:600 10.5px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;padding:6px 9px;border-radius:999px;background:rgba(var(--ink-rgb),.08);color:var(--dim);margin-bottom:12px}
.tag.on{background:rgba(60,196,140,.16);color:var(--q)}

.note{background:rgba(127,166,255,.08);border-left:3px solid var(--eu);border-radius:0 10px 10px 0;padding:16px 18px;margin:24px 0}
.note p:last-child{margin-bottom:0}

.btn{display:inline-flex;align-items:center;gap:8px;font:600 15px/1 var(--sans);padding:14px 22px;border-radius:999px;border:1.5px solid var(--ink);background:var(--ink);color:var(--bg);text-decoration:none;white-space:nowrap}
.btn.line{background:transparent;color:var(--ink)}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 8px}

/* a value the owner still has to supply; razorpay_check.py fails while any remain */
.tbc{color:var(--in);border-bottom:1px dashed var(--in)}

/* ---------- footer, matching the home colophon ---------- */
.foot{border-top:1px solid var(--ink);padding:40px 0 56px;font-size:14.5px}
.colo{width:100%;border-collapse:collapse}
.colo th,.colo td{text-align:left;padding:11px 0;border-bottom:1px solid var(--rule);vertical-align:top}
.colo th{width:190px;font:600 11px/1.6 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
@media(max-width:560px){.colo th{width:112px}}
.foot a{text-decoration:none}
.foot a:hover{text-decoration:underline}
.foot-links{display:flex;flex-wrap:wrap;gap:16px}
.dim{color:var(--dim)}
.card .price.unset{font:600 16px/1.3 var(--sans);color:var(--dim)}

/* ---------- buy flow (js/checkout.js), shared with the home page ---------- */
.buy-dialog{border:0;border-radius:18px;padding:0;width:min(440px,92vw);margin:auto;background:var(--card);color:var(--ink);box-shadow:0 40px 90px -30px rgba(0,0,0,.7)}
.buy-dialog::backdrop{background:rgba(14,20,36,.6);backdrop-filter:blur(3px)}
.buy-dialog form{padding:26px 26px 22px;display:grid;gap:13px}
.buy-dialog h3{font:400 26px/1.1 var(--serif);margin:0}
.buy-dialog .bd-sub{font-size:14px;color:var(--dim);margin:-4px 0 6px}
.buy-dialog label{display:grid;gap:6px;font:600 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.buy-dialog .bd-opt{text-transform:none;letter-spacing:0;font-weight:400}
.buy-dialog input{font:400 16px/1.4 var(--sans);color:var(--ink);background:var(--bg);border:1.5px solid var(--rule-2);border-radius:10px;padding:11px 13px;outline:none}
.buy-dialog input:focus{border-color:var(--eu)}
.buy-dialog .bd-note{min-height:1em;font-size:13.5px;color:var(--us);margin:0}
.buy-dialog .bd-row{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}
#cq-toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,16px);opacity:0;z-index:9999;max-width:min(520px,92vw);background:var(--ink);color:var(--bg);padding:13px 20px;border-radius:999px;font:500 14.5px/1.4 var(--sans);text-align:center;transition:.25s;pointer-events:none}
#cq-toast.on{opacity:1;transform:translate(-50%,0)}
#cq-toast.bad{background:var(--us);color:#fff}

/* ---------- blog / journal (scripts/build-blog.mjs) ---------- */
.posts{display:grid;gap:16px;margin:28px 0 8px}
.post-card{display:block;background:var(--card);border:1px solid var(--rule-2);border-radius:16px;padding:26px 28px;text-decoration:none;transition:border-color .25s,transform .25s}
.post-card:hover{border-color:var(--eu);transform:translateY(-2px)}
.post-card .pc-meta{font:600 11.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin:0 0 10px}
.post-card h2{font:400 clamp(22px,2.4vw,28px)/1.15 var(--serif);margin:0 0 10px;color:var(--ink)}
.post-card p{color:var(--dim);margin:0 0 12px;font-size:15.5px}
.post-card .pc-go{font:600 14px/1 var(--sans);color:var(--eu)}
.post .lede{font-size:clamp(18px,2vw,21px);color:var(--ink);margin-bottom:22px}
.post blockquote{margin:24px 0;padding:14px 22px;border-left:3px solid var(--accent);background:rgba(255,157,126,.07);border-radius:0 10px 10px 0;font:400 19px/1.5 var(--serif);color:var(--ink)}
.post h2{margin-top:40px}
.post ol,.post ul{padding-left:24px}
.post li{margin-bottom:12px}

/* ---------- breadcrumb, used by the blog and service pages ---------- */
.crumb{font:600 12px/1 var(--sans);letter-spacing:.06em;color:var(--dim);margin-bottom:18px}
.crumb a{color:var(--dim)}
.crumb a:hover{color:var(--ink)}
