/* KadaAI — /ai (KadaAI Intelligence) page styles. Loaded after site.css; page-only classes use .pg-.
   1 hero · 2 overview cards · 3 capability rows · 4 example cards · 5 how it works (dark) · 6 control
   7 counter vs admin · 8 tiers table · 9 privacy */

/* 1. Hero: stronger AI wash, big screenshot, floating notes */
.pg-hero{padding-bottom:clamp(3rem, 1.5rem + 5vw, 6.5rem)}
.pg-hero::before{background:radial-gradient(42% 38% at 50% 0%, rgba(30,107,240,.16), transparent 72%), radial-gradient(36% 34% at 92% 46%, rgba(20,200,168,.15), transparent 72%), radial-gradient(34% 34% at 6% 52%, rgba(18,184,200,.12), transparent 72%), radial-gradient(40% 30% at 18% 100%, rgba(217,98,59,.07), transparent 70%);-webkit-mask-image:none;mask-image:none}
.pg-hero .hero__title{font-size:clamp(2.375rem, 1.5rem + 3.4vw, 4.5rem);line-height:1.03;letter-spacing:-.045em}
.pg-hero .hero__lead{max-width:36em}
.pg-nowrap{white-space:nowrap}
.pg-hero__media{position:relative;max-width:1080px;margin:clamp(2.5rem, 1.75rem + 3vw, 4.5rem) auto 0}
.pg-hero__media .frame--ai::before{inset:-3% -1% -9%;opacity:.42;filter:blur(64px)}
.pg-hero__floats{display:grid;gap:1rem;margin-top:1.5rem;text-align:left}
.pg-hero__floats .float-card{box-shadow:var(--shadow-md)}
@media (min-width: 640px) and (max-width: 1359.98px) {.pg-hero__floats {grid-template-columns:repeat(2, minmax(0, 1fr))} }
/* from 1360px there is room beside the 1080px shot: the notes sit over the sidebar and an empty patch of the chat */
@media (min-width: 1360px) {
  .pg-hero__floats {display:block;margin:0}
  .pg-hero__floats .float-card {position:absolute;z-index:2;box-shadow:var(--shadow-lg)}
  /* the shot is always 1080 × 641 here, so fixed offsets land on the same spots */
  .pg-float--insight {left:-96px;top:328px;width:268px}
  .pg-float--lang {right:-104px;top:184px;width:300px;padding:.85rem 1rem .9rem}
}
@media (max-width: 639.98px) {
  /* zoom past the admin sidebar so the conversation is larger on a phone */
  .pg-hero__shot .frame__body img {width:125%;max-width:none;margin-left:-23%}
}
.pg-langs{display:flex;flex-wrap:wrap;gap:.4rem}
.pg-lang{display:inline-flex;align-items:center;min-height:1.875rem;padding:0 .7rem;border-radius:var(--r-pill);font-size:.875rem;font-weight:700;color:var(--ink);background:var(--surface-3)}
.pg-lang:lang(ml), .pg-lang:lang(ta){line-height:1.3}
.pg-float__label{display:flex;align-items:center;gap:.4rem;margin-bottom:.55rem;font-size:.8125rem;font-weight:700;color:var(--ink)}
.pg-float__label .icon{width:1.05rem;height:1.05rem;color:var(--blue)}
.pg-float__note{display:flex;align-items:center;gap:.4rem;margin-top:.6rem;font-size:.8125rem;color:var(--text-muted)}
.pg-float__note .icon{width:1rem;height:1rem;color:var(--blue-ink)}

/* 2. Overview cards (jump links to each capability) */
.pg-overview{margin-bottom:clamp(4rem, 3rem + 4vw, 7rem)}
.pg-mini{gap:.5rem}
.pg-mini .icon-tile{margin-bottom:.5rem}
.pg-mini__title{font-size:1.125rem;font-weight:700;line-height:1.3;letter-spacing:-.01em;color:var(--ink)}
.pg-mini p:not(.pg-mini__title){font-size:.9375rem;color:var(--ink-2)}
.pg-mini .card__foot{padding-top:.75rem}
@media (max-width: 639.98px) {
  /* phones: a compact 2 × 2 jump grid (the rows below carry the detail) */
  .pg-overview {grid-template-columns:repeat(2, minmax(0, 1fr));gap:.75rem}
  .pg-mini {padding:1rem}
  .pg-mini .icon-tile {margin-bottom:.25rem}
  .pg-mini__title {font-size:1rem}
  .pg-mini p:not(.pg-mini__title):not(.card__foot) {display:none}
  .pg-mini .card__foot {padding-top:.25rem}
}

/* 3. Capability rows */
.pg-label{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .75rem}
.pg-cap{display:grid;gap:clamp(2rem, 1.5rem + 2vw, 3.5rem);scroll-margin-top:calc(var(--header-h) + 1.5rem)}
.feature-row.pg-cap{gap:clamp(2rem, 1.5rem + 2.5vw, 4.5rem)}
.pg-cap__head{display:grid;gap:clamp(2rem, 1.5rem + 2.5vw, 4rem);align-items:center}
@media (min-width: 900px) {.pg-cap__head {grid-template-columns:minmax(0, 5fr) minmax(0, 6fr)} }
.pg-cap .feature-row__text > p.pg-small{font-size:.9375rem;color:var(--text-muted)}
.pg-media{display:grid;gap:1.25rem;min-width:0}
.pg-wide-shot .frame--ai::before{inset:-14% 6% -26%;opacity:.26}
@media (max-width: 639.98px) {
  /* phones: zoom into the start of each insight so it can be read; the lightbox shows the whole card */
  .pg-crop .frame__body img {width:300%;max-width:none}
  .pg-crop .frame__body::after {content:"";position:absolute;inset:0 0 0 auto;width:38%;background:linear-gradient(90deg, rgba(255,255,255,0), #fff 85%);pointer-events:none}
}
/* Till offline: the top 1440 × 810, above the status line under the payment panel */
.pg-ar-till{aspect-ratio:16 / 9}
.frame__body.pg-ar-till img{height:100%;object-fit:cover;object-position:top}
.pg-ar-till picture{height:100%}
.pg-tools{display:grid;gap:.6rem;margin-top:.25rem;list-style:none;padding:0}
.pg-tools li{display:grid;grid-template-columns:auto minmax(0, 1fr);gap:.75rem;align-items:start;line-height:1.5}
.pg-tools .icon-tile{width:2rem;height:2rem;border-radius:9px}
.pg-tools .icon-tile .icon{width:1rem;height:1rem}
.pg-tools b{display:block}
.pg-tools span.pg-tools__desc{display:block;font-size:.9375rem;color:var(--text-muted)}
/* spotlight over the till's add-on row (percentages of the 1440 × 900 shot) */
.pg-spot{position:absolute;left:8.6%;top:52.7%;width:70.6%;height:6.2%;border-radius:var(--r-pill);box-shadow:0 0 0 2px var(--blue), 0 0 0 7px rgba(30,107,240,.2), 0 0 0 200vmax rgba(11,31,68,.16);pointer-events:none}
.pg-chip-row{display:flex;flex-wrap:wrap;gap:.5rem}
.pg-chip{display:inline-flex;align-items:center;min-height:2.25rem;padding:.35rem .85rem;border-radius:var(--r-pill);font-size:.875rem;font-weight:600;line-height:1.3;color:var(--ink);background:#fff;border:1px solid var(--border-strong);box-shadow:var(--shadow-xs)}
.pg-chip--cart{background:var(--surface-3);border-color:transparent;box-shadow:none}

.pg-duo{display:grid;gap:1rem;align-items:start}
/* side by side when the media column is wide: a phone/tablet single column, or a wide desktop */
@media (min-width: 560px) and (max-width: 899.98px), (min-width: 1200px) {.pg-duo {grid-template-columns:minmax(0, 1fr) minmax(0, 1fr)} }
.pg-note-text{font-size:1rem;line-height:1.55;color:var(--ink)}
.pg-note-foot{font-size:.8125rem;color:var(--text-muted)}

/* 4. Example cards (AI examples are always badged "Example") */
.pg-example{display:grid;gap:1rem;padding:clamp(1.25rem, 1rem + 1vw, 1.75rem);border:1px solid transparent;border-radius:var(--r-xl);background:linear-gradient(#fff, #fff) padding-box, var(--ai-gradient) border-box;box-shadow:0 24px 48px -28px rgba(30,107,240,.5)}
.pg-example--plain{background:#fff;border-color:var(--border);box-shadow:var(--shadow-sm)}
.pg-example__head{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;font-weight:700;color:var(--ink)}
.pg-example__head .badge{margin-left:auto}
.pg-example__sub{font-size:.8125rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted)}
.pg-example .dot-list{gap:.75rem;font-size:.9375rem;line-height:1.55;color:var(--ink-2)}
.pg-range{display:inline-flex;gap:.2rem;padding:.2rem;border-radius:var(--r-pill);background:var(--surface-3);font-size:.8125rem;font-weight:600;color:var(--text-muted)}
.pg-range span{padding:.3rem .75rem;border-radius:var(--r-pill)}
.pg-range .is-on{color:var(--ink);background:#fff;box-shadow:var(--shadow-pill)}
.pg-chat{padding:clamp(1.1rem, .9rem + 1vw, 1.5rem);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-xl)}
.pg-chat .bubble{max-width:92%}
.pg-chat .bubble--user:lang(ml){font-style:italic}
.pg-gloss{margin-top:.5rem;padding-top:.5rem;border-top:1px dashed var(--border-strong);font-size:.8125rem;line-height:1.5;color:var(--text-muted)}
.pg-calc{width:100%;font-size:.9375rem;font-variant-numeric:tabular-nums}
.pg-calc caption{padding-bottom:.6rem;text-align:left;font-weight:700;color:var(--ink)}
.pg-calc th, .pg-calc td{padding:.5rem 0;border-bottom:1px dashed var(--border-strong);vertical-align:baseline}
.pg-calc th{font-weight:500;text-align:left;color:var(--ink-2)}
.pg-calc td{text-align:right;font-weight:700;color:var(--ink);white-space:nowrap}
.pg-calc td small{display:block;font-size:.75rem;font-weight:500;color:var(--text-muted)}
.pg-calc tr:last-child > *{border-bottom:0;padding-top:.75rem}
.pg-calc tr:last-child th{font-weight:700;color:var(--ink)}
.pg-calc tr:last-child td{font-size:1.25rem;color:var(--green-ink)}
.pg-calc__from{display:block;font-size:.8125rem;font-weight:500;color:var(--text-muted)}
.pg-ai-note{display:grid;gap:.35rem;padding:.9rem 1rem;font-size:.9375rem;line-height:1.5;background:var(--ai-tint);border-radius:var(--r-lg)}
.pg-ai-note .bubble__meta{margin:0}

/* 5. How it works: the one dark, full-bleed AI section */
.pg-how{isolation:isolate;overflow:hidden;color:rgba(255,255,255,.8);background:var(--navy)}
.pg-how::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(42% 60% at 12% 0%, rgba(30,107,240,.5), transparent 70%), radial-gradient(40% 60% at 92% 100%, rgba(20,200,168,.34), transparent 70%)}
.pg-how::after{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(255,255,255,.1) 1px, transparent 1.3px);background-size:24px 24px;-webkit-mask-image:radial-gradient(55% 60% at 50% 40%, #000, transparent);mask-image:radial-gradient(55% 60% at 50% 40%, #000, transparent)}
.pg-how h2, .pg-how h3, .pg-how strong{color:#fff}
.pg-how .section-head > p:not(.eyebrow){color:rgba(255,255,255,.8)}
.pg-how .eyebrow{color:#8FD3FF}
.pg-how .eyebrow .icon{color:#8FD3FF}
.pg-how .ai-text{background-image:linear-gradient(100deg, #6FA8FF, #4FE0D9 60%, #5DEBC6)}
.pg-how .step::before{box-shadow:0 0 0 6px rgba(255,255,255,.07), var(--glow-ai)}
.pg-how .step:not(:last-child)::after{background:rgba(255,255,255,.22)}
.pg-how .step p{color:rgba(255,255,255,.78)}
.pg-models{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.6rem}
.pg-models span{display:inline-flex;align-items:center;min-height:1.75rem;padding:0 .7rem;border-radius:var(--r-pill);font-size:.8125rem;font-weight:700;color:#fff;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18)}
.pg-facts{display:grid;gap:1rem;margin-top:clamp(3rem, 2.5rem + 2vw, 4.5rem);list-style:none;padding:0}
@media (min-width: 900px) {.pg-facts {grid-template-columns:repeat(3, minmax(0, 1fr))} }
.pg-facts li{display:grid;grid-template-columns:auto minmax(0, 1fr);gap:.9rem;align-items:start;padding:1.25rem 1.35rem;font-size:.9375rem;line-height:1.55;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13);border-radius:var(--r-lg)}
.pg-facts .icon{width:1.5rem;height:1.5rem;color:#7FE3D6}
.pg-facts strong{display:block;margin-bottom:.15rem;font-size:1rem}

/* 6. Control cards */
.pg-control .card h3{font-size:1.125rem}
.pg-control .card p{font-size:.9375rem}
@media (max-width: 639.98px) {
  .pg-control .card {display:grid;grid-template-columns:auto minmax(0, 1fr);gap:.6rem 1rem;align-items:start;padding:1.25rem}
  .pg-control .card > * {grid-column:2}
  .pg-control .card > .icon-tile {grid-column:1;grid-row:1 / span 3;margin:0}
}
.pg-quota{display:grid;gap:.35rem;margin-top:.25rem;padding:.75rem .9rem;font-size:.875rem;background:var(--surface-2);border-radius:var(--r)}
.pg-quota div{display:flex;justify-content:space-between;gap:.75rem}
.pg-control .pg-quota__title{font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted)}
.pg-quota b{font-variant-numeric:tabular-nums}
.pg-meter{height:8px;margin-top:.25rem;border-radius:var(--r-pill);background:var(--surface-3);overflow:hidden}
.pg-meter span{display:block;width:62%;height:100%;border-radius:inherit;background:var(--ai-gradient)}
.pg-control-note{max-width:44rem;margin:2rem auto 0}

/* 7. Counter vs admin */
.pg-where{display:grid;gap:1rem;margin-top:.5rem}
@media (min-width: 560px) {.pg-where {grid-template-columns:repeat(2, minmax(0, 1fr))} }
.pg-where > div{display:grid;gap:.6rem;align-content:start;padding:1.1rem 1.2rem;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-lg)}
.pg-where h3{display:flex;align-items:center;gap:.5rem;font-size:1rem}
.pg-where h3 .icon{color:var(--blue-ink)}
.pg-where .check-list{gap:.5rem;font-size:.9375rem}

/* 8. Tiers table */
.pg-tiers .compare-table thead th{font-size:1rem;color:var(--ink)}
.pg-tiers .compare-table thead th .badge{display:flex;width:fit-content;margin:0 auto .5rem}
@media (max-width: 719.98px) {.pg-tiers .compare-table thead th .badge {margin-inline:0} }
.pg-tiers .compare-table td{white-space:nowrap}
.pg-tiers .compare-table tbody th small{display:block;font-size:.8125rem;font-weight:500;color:var(--text-muted)}
.pg-price{font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.pg-price small{font-weight:600;color:var(--text-muted)}
@media (min-width: 720px) {.pg-tiers .compare-table td, .pg-tiers .compare-table thead th:not(:first-child) {text-align:center} .pg-tiers .cell {justify-content:center} }
.pg-tier-cards{display:grid;gap:.875rem;list-style:none;padding:0}
@media (min-width: 720px) {.pg-tier-cards {display:none} }
@media (max-width: 719.98px) {.pg-tiers .compare {display:none} }
.pg-tier{display:grid;gap:.6rem;justify-items:start;padding:1.25rem 1.25rem 1.35rem;background:#fff;border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-xs)}
.pg-tier--pro{border-color:transparent;background:linear-gradient(#fff, #fff) padding-box, var(--ai-gradient) border-box;box-shadow:0 20px 40px -26px rgba(30,107,240,.5)}
.pg-tier__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.25rem 1rem;width:100%}
.pg-tier h3{font-size:1.1875rem}
.pg-tier .pg-price{font-size:1.125rem}
.pg-tier__req{font-size:.875rem;font-weight:600;color:var(--text-muted)}
.pg-tier .check-list{margin-top:.15rem}
.pg-tiers-foot{display:grid;gap:1.5rem;justify-items:center;margin-top:2rem;text-align:center}

/* 9. Privacy */
.pg-privacy{display:grid;gap:clamp(2rem, 1.5rem + 2.5vw, 4rem);align-items:start}
@media (min-width: 960px) {.pg-privacy {grid-template-columns:minmax(0, 5fr) minmax(0, 7fr)} }
.pg-privacy .section-head{margin-bottom:0}
.pg-privacy__lists{display:grid;gap:1rem}
@media (min-width: 640px) {.pg-privacy__lists {grid-template-columns:repeat(2, minmax(0, 1fr))} }
.pg-privacy__lists .card h3{display:flex;align-items:center;gap:.6rem;font-size:1.0625rem}
.pg-privacy__lists .check-list, .pg-privacy__lists .x-list{gap:.65rem;font-size:.9375rem}
.pg-privacy__voice{grid-column:1 / -1}
@media (max-width: 639.98px) {#ai-faq .faq__body {padding-right:.5rem} }