/* Hisaab's editorial palette. Keep the 36px grid scale aligned with the app. */
.hisaab-paper {
  --bg: #FAF9F6;
  --paper: #F4F2ED;
  --card: #FFFFFF;
  --ink: #231F1A;
  --gray100: #E8E5DE;
  --gray150: #E1DFD6;
  --gray200: #D5D1C8;
  --gray400: #7A766E;
  --gray500: #5E5C56;
  --body: 'Inter', system-ui, sans-serif;
  --display: var(--body);
  --reading: 'Inria Serif', Georgia, serif;
  --color-paper-blue: #D6E6F2;
  --color-paper-sage: #EDEEDB;
  --color-paper-lilac: #ECE3ED;
  --color-paper-peach: #F6EAD0;
}
.hisaab-paper h1,
.hisaab-paper h2,
.hisaab-paper .feature-copy h3 {
  font-family: var(--reading);
  font-weight: 400;
  letter-spacing: -.025em;
  line-height: 1.13;
  text-wrap: balance;
}
.hisaab-paper .section-title .soft-muted { color: var(--gray500); font-weight: 400; }
.hisaab-paper nav { background: rgba(250,249,246,.94); }
.hisaab-paper .product-intro h1 { font-size: clamp(40px, 5.4vw, 66px); }
.hisaab-paper .feature-tag,
.hisaab-paper .split-tag { text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 500; }

.paper-panel {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--panel-paper) !important;
  border: 1px solid color-mix(in srgb, var(--panel-grid-ink) 65%, transparent);
  border-radius: 18px;
}
.paper-panel::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: linear-gradient(var(--panel-grid-ink) 1px, transparent 1px), linear-gradient(90deg, var(--panel-grid-ink) 1px, transparent 1px);
  background-size: 36px 36px;
  -webkit-mask-image: var(--panel-grid-mask);
  mask-image: var(--panel-grid-mask);
}
.paper-blue {
  --panel-paper: var(--color-paper-blue);
  --panel-grid-ink: rgba(70,110,150,.22);
  --panel-grid-mask: linear-gradient(90deg, #000, transparent 42%, transparent 58%, #000);
}
.paper-sage {
  --panel-paper: var(--color-paper-sage);
  --panel-grid-ink: rgba(90,120,70,.22);
  --panel-grid-mask: radial-gradient(ellipse at 50% 55%, transparent 40%, #000 100%);
}
.paper-lilac {
  --panel-paper: var(--color-paper-lilac);
  --panel-grid-ink: rgba(123,93,125,.18);
  --panel-grid-mask: radial-gradient(ellipse at center, transparent 30%, #000 100%);
}
.paper-peach {
  --panel-paper: var(--color-paper-peach);
  --panel-grid-ink: rgba(160,120,50,.22);
  --panel-grid-mask: radial-gradient(ellipse 60% 50% at center, transparent 25%, #000 95%);
}
.hisaab-paper .hero-preview.paper-panel { padding: 30px; }
.hisaab-paper .hero-preview-frame { border-color: var(--gray150); box-shadow: 0 8px 28px rgba(35,31,26,.08); }
.hisaab-paper .feature-visual.paper-panel { padding: 28px; }
.hisaab-paper .feature-visual .shot { box-shadow: 0 4px 16px rgba(35,31,26,.05); }
.hisaab-paper .app-shot.paper-panel { padding: 28px; max-width: 1040px; width: calc(100% - 48px); }
.hisaab-paper .app-shot .app-frame { box-shadow: 0 6px 24px rgba(35,31,26,.07); }
.hisaab-paper .final-cta.paper-panel { margin: 40px auto 64px; width: calc(100% - 48px); max-width: 1160px; padding: 72px 24px; }
.hisaab-paper .final-cta.paper-panel .wrap { padding: 0; }
.hisaab-paper .final-cta .soft-muted { color: var(--gray500); }
@media (max-width: 600px) {
  .hisaab-paper .hero-preview.paper-panel,
  .hisaab-paper .feature-visual.paper-panel { padding: 16px; border-radius: 14px; }
  .hisaab-paper .app-shot.paper-panel { width: calc(100% - 28px); padding: 14px; }
  .hisaab-paper .final-cta.paper-panel { width: calc(100% - 28px); padding: 48px 20px; margin-bottom: 36px; }
  .hisaab-paper .feature-visual .shot .shot-body { padding: 18px; }
}
@media (forced-colors: active) { .paper-panel::before { display: none; } }
.hisaab-paper .footer-links { flex-wrap: wrap; }