/* =============================================================================
   Taloventra tv/hrms.css — HRMS landing (/hrms), product pages, ecosystem diagram, /features
   Package D (REDESIGN-BRIEF §4.2). Consumes core.css tokens only (no hex literals), logical
   properties only, no importance overrides, nothing below 12 px, hover under (hover:hover).
   ============================================================================= */

/* ---------- 1. Hero media: screen frame + two static glows (20 s drift under no-preference) ---------- */
.tv-hrms-hero__media{position:relative;isolation:isolate}
.tv-hrms-hero__frame{position:relative;z-index:1}
.tv-hrms-glow{position:absolute;inset-block-start:50%;inset-inline-start:50%;inline-size:min(70vw,28rem);block-size:min(70vw,28rem);border-radius:50%;filter:blur(64px);opacity:.5;pointer-events:none;z-index:0;translate:-50% -50%}
.tv-hrms-glow--a{background:color-mix(in oklab,var(--tv-apricot) 60%,transparent);margin-inline-start:-22%;margin-block-start:18%}
.tv-hrms-glow--b{background:color-mix(in oklab,var(--tv-deep) 92%,transparent);margin-inline-start:24%;margin-block-start:-20%}
@media (prefers-reduced-motion:no-preference){
  .tv-hrms-glow--a{animation:tv-hrms-drift-a 20s var(--tv-ease-in-out) infinite alternate}
  .tv-hrms-glow--b{animation:tv-hrms-drift-b 20s var(--tv-ease-in-out) infinite alternate}
}
@keyframes tv-hrms-drift-a{to{translate:-38% -62%}}
@keyframes tv-hrms-drift-b{to{translate:-62% -38%}}
.tv-hrms-hero .tv-hero__meta .tv-badge{max-inline-size:100%;white-space:normal;text-align:start}
.tv-hrms-mock{display:block}

/* ---------- 1b. Legacy neutralisation while TV_LEGACY_PUBLIC is on: site.css `header{…}` (sticky, 94px, flex) leaks into
   every <header> element; reset it for the section heads and stage heads on this area's pages. ---------- */
.tv-page header.tv-section-head,.tv-page .tv-hrms-eco__stage-head{position:static;display:grid;block-size:auto;gap:0;padding:0;border:0;background:none;backdrop-filter:none;z-index:auto}
.tv-page header.tv-section-head{display:block}
@media (width>=900px){.tv-page header.tv-section-head--split{display:grid}}
.tv-page .tv-hrms-eco__stage-head{gap:.25rem}
.tv-hrms-life .tv-steps .tv-btn--sm{min-block-size:44px}
.tv-page .tv-breadcrumb a,.tv-page .tv-breadcrumb span{display:inline-flex;align-items:center;min-block-size:44px;padding-block:0}

/* ---------- 2. Proof strip directly under the hero ---------- */
.tv-hrms-proof .tv-proof{border-block-start:0}
@media (width<600px){.tv-hrms-proof .tv-proof{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--tv-sp-m) var(--tv-sp-s)}}

/* ---------- 3. Product tabs (/hrms) ---------- */
.tv-hrms-tabs .tv-tabs__tab .tv-icon{flex:none}
.tv-hrms-tabs__split{align-items:center}
.tv-hrms-tabs__title{margin:0 0 var(--tv-sp-xs);font:500 var(--tv-step-3)/var(--tv-lh-snug) var(--tv-font-display);letter-spacing:-0.015em;color:var(--tv-heading)}
[dir=rtl] .tv-hrms-tabs__title{font-family:var(--tv-font-ui);letter-spacing:0}
.tv-hrms-tabs__copy .tv-lede{margin:0 0 var(--tv-sp-m)}
.tv-hrms-feat-list{list-style:none;margin:0 0 var(--tv-sp-m);padding:0;display:grid;gap:var(--tv-sp-2xs)}
.tv-hrms-feat-list a{display:flex;align-items:center;gap:var(--tv-sp-xs);min-block-size:52px;padding-block:.35rem;padding-inline:.35rem .75rem;border:1px solid var(--tv-border);border-radius:var(--tv-r-s);background:var(--tv-surface);color:var(--tv-heading);font:500 var(--tv-step--1)/1.3 var(--tv-font-ui);text-decoration:none;transition:border-color var(--tv-dur-2),background var(--tv-dur-2)}
.tv-hrms-feat-list a>span:not(.tv-icon-chip){flex:1;min-inline-size:0}
.tv-hrms-feat-list .tv-icon-chip{inline-size:36px;block-size:36px}
.tv-hrms-feat-list .tv-icon--arrow{flex:none;color:var(--tv-text-3);transition:translate var(--tv-dur-2) var(--tv-ease-out),color var(--tv-dur-2)}
@media (width>=600px){.tv-hrms-feat-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (hover:hover) and (pointer:fine){
  .tv-hrms-feat-list a:hover{border-color:var(--tv-text);background:var(--tv-surface-2)}
  .tv-hrms-feat-list a:hover .tv-icon--arrow{color:var(--tv-heading);translate:3px 0}
  [dir=rtl] .tv-hrms-feat-list a:hover .tv-icon--arrow{translate:-3px 0}
}

/* ---------- 4. Lifecycle strip: 6 steps as 3 × 2 from 900 px ---------- */
@media (width>=600px){.tv-hrms-life .tv-steps.tv-hrms-life__steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (width>=900px){.tv-hrms-life .tv-steps.tv-hrms-life__steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
.tv-hrms-life .tv-steps__text{text-wrap:pretty}

/* ---------- 5. Intelligence bento ---------- */
.tv-hrms-tile{gap:var(--tv-sp-xs);color:var(--tv-text-2);text-decoration:none}
.tv-hrms-tile__head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--tv-sp-s);margin-block-end:var(--tv-sp-2xs)}
.tv-hrms-tile__meta{gap:var(--tv-sp-2xs);justify-content:flex-end;padding-inline-end:2.25rem}
.tv-hrms-tile .tv-card__title{padding-inline-end:0}
.tv-hrms-tile__art{margin-block-start:auto;padding-block-start:var(--tv-sp-s)}
.tv-hrms-tile__art .tv-mock{box-shadow:none;border-radius:0;overflow:visible;max-inline-size:36rem}
.tv-bento__tile[data-hero].tv-hrms-tile{justify-content:flex-start}

/* ---------- 6. Planned tile / card (dark, roadmap items, every item badged) ---------- */
.tv-hrms-planned{gap:var(--tv-sp-m);padding:var(--tv-sp-l);border-radius:var(--tv-r-l)}
.tv-hrms-planned__head{display:flex;gap:var(--tv-sp-s);align-items:flex-start}
.tv-hrms-planned__head>div{display:grid;gap:var(--tv-sp-2xs);justify-items:start;min-inline-size:0}
.tv-hrms-planned__head .tv-icon-chip{flex:none}
.tv-hrms-planned__title{margin:0;font-size:var(--tv-step-2)}
.tv-hrms-planned__head .tv-small{margin:0;color:var(--tv-text-2)}
.tv-hrms-planned__list{list-style:none;margin:0;padding:0;display:grid;gap:0 var(--tv-sp-l)}
.tv-hrms-planned__list li{display:flex;gap:var(--tv-sp-xs);align-items:flex-start;padding-block:var(--tv-sp-xs);border-block-start:1px solid var(--tv-border)}
.tv-hrms-planned__list li>span{display:grid;gap:.15rem;min-inline-size:0}
.tv-hrms-planned__list strong{color:var(--tv-heading);font:600 var(--tv-step--1)/1.35 var(--tv-font-ui)}
.tv-hrms-planned__list small{font-size:var(--tv-step--2);line-height:1.45;color:var(--tv-text-3)}
.tv-hrms-planned .tv-badge--planned{flex:none;margin-block-start:.15rem}
.tv-hrms-planned .tv-caption{margin:0}
@media (width>=900px){.tv-hrms-planned__list{grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}}

/* ---------- 7. Start cards, outcomes, related product cards ---------- */
.tv-hrms-start__card,.tv-hrms-product-card{gap:var(--tv-sp-xs)}
.tv-hrms-start__card .tv-card__title,.tv-hrms-product-card .tv-card__title{padding-inline-end:0}
.tv-card__footer.tv-btn{align-self:flex-start}
.tv-hrms-outcome{gap:var(--tv-sp-s);padding:var(--tv-sp-l)}
.tv-hrms-outcome__num{font:600 var(--tv-step--1)/1 var(--tv-font-ui);font-variant-numeric:tabular-nums;letter-spacing:.08em;color:var(--tv-accent-text)}
.tv-hrms-outcome__text{margin:0;font:500 var(--tv-step-1)/1.4 var(--tv-font-ui);color:var(--tv-heading);text-wrap:pretty}
.tv-hrms-outcome__icon{margin-block-end:var(--tv-sp-2xs)}

/* ---------- 8. Ecosystem diagram (hr-payroll) ---------- */
.tv-hrms-eco__map{display:grid;gap:var(--tv-sp-m)}
.tv-hrms-eco__core{display:grid;gap:var(--tv-sp-s);inline-size:100%;max-inline-size:38rem;margin-inline:auto;padding:var(--tv-sp-m);background:var(--tv-surface);border:1px solid var(--tv-border-strong);border-radius:var(--tv-r-l);box-shadow:var(--tv-sh-2)}
.tv-hrms-eco__core-label{display:flex;gap:var(--tv-sp-s);align-items:center}
.tv-hrms-eco__core-label img{flex:none;inline-size:48px;block-size:48px}
.tv-hrms-eco__core-label .tv-eyebrow{margin:0 0 .15rem}
.tv-hrms-eco__core-title{margin:0;font:600 var(--tv-step-1)/1.3 var(--tv-font-ui);color:var(--tv-heading)}
.tv-hrms-eco__bridge{display:flex;flex-direction:column;align-items:center;gap:.25rem;margin:0;text-align:center;font:500 var(--tv-step--1)/1.3 var(--tv-font-ui);color:var(--tv-text-3)}
.tv-hrms-eco__bridge-icon{color:var(--tv-accent-text)}
.tv-hrms-eco__stages{list-style:none;margin:0;padding:0;display:grid;gap:var(--tv-gap)}
@media (width>=600px){.tv-hrms-eco__stages{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (width>=900px){.tv-hrms-eco__stages{grid-template-columns:repeat(4,minmax(0,1fr))}}
.tv-hrms-eco__stage{--eco-accent:var(--tv-navy);--eco-tint:var(--tv-navy-050);--eco-ink:var(--tv-navy);position:relative;display:grid;gap:var(--tv-sp-s);align-content:start;padding:var(--tv-sp-m);background:var(--tv-surface);border:1px solid var(--tv-border);border-block-start:4px solid var(--eco-accent);border-radius:var(--tv-r-m);box-shadow:var(--tv-sh-1)}
.tv-hrms-eco__stage--work{--eco-accent:var(--tv-slate);--eco-tint:var(--tv-ivory);--eco-ink:var(--tv-slate)}
.tv-hrms-eco__stage--pay{--eco-accent:var(--tv-burnt);--eco-tint:var(--tv-apricot-100);--eco-ink:var(--tv-burnt)}
.tv-hrms-eco__stage--grow{--eco-accent:var(--tv-apricot);--eco-tint:var(--tv-apricot-100);--eco-ink:var(--tv-burnt)}
.tv-hrms-eco__stage-head{display:grid;gap:.25rem}
.tv-hrms-eco__stage-head h3{margin:0;font-size:var(--tv-step-1)}
.tv-hrms-eco__stage-head p{margin:0;font-size:var(--tv-step--1);color:var(--tv-text-3)}
.tv-hrms-eco__num{font:600 var(--tv-step--1)/1 var(--tv-font-ui);font-variant-numeric:tabular-nums;letter-spacing:.08em;color:var(--eco-ink)}
.tv-hrms-eco__stage .tv-icon-chip{background:var(--eco-tint);color:var(--eco-ink)}
.tv-hrms-eco__connector{display:none}
@media (width>=900px){.tv-hrms-eco__connector{display:grid;place-items:center;position:absolute;inset-block-start:var(--tv-sp-l);inset-inline-end:calc(-1*var(--tv-gap)/2 - 12px);inline-size:24px;block-size:24px;border-radius:50%;background:var(--tv-surface);border:1px solid var(--tv-border);color:var(--tv-text-3);z-index:1}}
.tv-hrms-eco__list{list-style:none;margin:0;padding:0;display:grid;gap:var(--tv-sp-2xs)}
.tv-hrms-eco__feature{display:flex;align-items:center;gap:var(--tv-sp-xs);min-block-size:52px;padding-block:.35rem;padding-inline:.35rem .6rem;border-radius:var(--tv-r-s);color:var(--tv-heading);text-decoration:none;transition:background var(--tv-dur-2),box-shadow var(--tv-dur-2)}
.tv-hrms-eco__feature .tv-icon-chip{inline-size:36px;block-size:36px;flex:none}
.tv-hrms-eco__feature-text{display:grid;gap:.1rem;flex:1;min-inline-size:0}
.tv-hrms-eco__feature-text strong{font:600 var(--tv-step--1)/1.3 var(--tv-font-ui);color:var(--tv-heading)}
.tv-hrms-eco__feature-text small{font-size:var(--tv-step--2);line-height:1.35;color:var(--tv-text-3)}
.tv-hrms-eco__feature .tv-icon--arrow{flex:none;color:var(--tv-text-3);transition:translate var(--tv-dur-2) var(--tv-ease-out),color var(--tv-dur-2)}
.tv-hrms-eco__layers{display:grid;gap:var(--tv-gap)}
@media (width>=900px){.tv-hrms-eco__layers{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tv-hrms-eco__layer{display:grid;gap:var(--tv-sp-m);align-content:start;padding:var(--tv-sp-m);border-radius:var(--tv-r-l);border:1px solid var(--tv-border)}
.tv-hrms-eco__layer--intel{border-color:transparent}
.tv-hrms-eco__layer--found{background:var(--tv-ivory);border-color:var(--tv-border-strong)}
.tv-hrms-eco__layer--found .tv-icon-chip{background:var(--tv-white);color:var(--tv-slate)}
.tv-hrms-eco__layer-head{display:flex;gap:var(--tv-sp-s);align-items:flex-start}
.tv-hrms-eco__layer-head>div{flex:1;min-inline-size:0}
.tv-hrms-eco__layer-head h3{margin:0 0 .25rem;font-size:var(--tv-step-1)}
.tv-hrms-eco__layer-head p{margin:0;font-size:var(--tv-step--1);color:var(--tv-text-3)}
.tv-hrms-eco__layer-head .tv-badge{flex:none}
.tv-hrms-eco__list--row{grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr))}
.tv-hrms-eco__layer--intel .tv-hrms-eco__feature{background:color-mix(in oklab,var(--tv-ivory) 6%,var(--tv-navy))}
.tv-hrms-eco__layer--found .tv-hrms-eco__feature{background:var(--tv-white)}
@media (hover:hover) and (pointer:fine){
  .tv-hrms-eco__feature:hover{background:var(--tv-bg-3)}
  .tv-hrms-eco__layer--intel .tv-hrms-eco__feature:hover{background:color-mix(in oklab,var(--tv-ivory) 14%,var(--tv-navy))}
  .tv-hrms-eco__layer--found .tv-hrms-eco__feature:hover{background:var(--tv-navy-050)}
  .tv-hrms-eco__feature:hover .tv-icon--arrow{color:var(--tv-heading);translate:3px 0}
  [dir=rtl] .tv-hrms-eco__feature:hover .tv-icon--arrow{translate:-3px 0}
}
.tv-hrms-eco__note{display:flex;flex-wrap:wrap;gap:.35rem .5rem;align-items:center;margin:0;color:var(--tv-text-3)}
.tv-hrms-eco__note-icon{flex:none;color:var(--tv-text-3)}
.tv-hrms-eco__note a{display:inline-flex;align-items:center;min-block-size:44px;color:var(--tv-link);text-decoration:underline;text-underline-offset:.15em;transition:color var(--tv-dur-2)}
@media (hover:hover) and (pointer:fine){.tv-hrms-eco__note a:hover{color:var(--tv-link-hover)}}

/* ---------- 9. Portal panorama (employee-portal) ---------- */
.tv-hrms-panorama__copy .tv-section-head{margin-block-end:var(--tv-sp-m)}
.tv-hrms-panorama__chips{margin-inline:0;padding-inline:0;overflow:visible}
.tv-hrms-panorama__chips ul{flex-wrap:wrap;inline-size:auto}

/* ---------- 10. All capabilities with rail ---------- */
.tv-hrms-caps__main{display:grid;gap:var(--tv-sp-xl);min-inline-size:0}
.tv-hrms-caps .tv-card{scroll-margin-block-start:calc(var(--tv-header-h) + 16px)}
.tv-hrms-caps .tv-section-head--split{max-inline-size:none}
.tv-hrms-caps__grid{--tv-col:15rem}
.tv-hrms-about .tv-prose{margin-inline:0}

/* ---------- 11. /features directory: sticky filter bar, groups, empty state ---------- */
.tv-hrms-feat-bar{position:sticky;inset-block-start:var(--tv-header-h);z-index:6;padding-block:var(--tv-sp-xs);background:color-mix(in oklab,var(--tv-bg) 90%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-block:1px solid var(--tv-border)}
.tv-hrms-feat-bar__inner{display:grid;gap:var(--tv-sp-xs);align-items:center}
@media (width>=900px){.tv-hrms-feat-bar__inner{grid-template-columns:minmax(0,1fr) minmax(16rem,24rem)}}
.tv-hrms-feat-bar__chips ul{padding:.15rem 0}
.tv-hrms-feat-filter{display:grid;gap:.25rem}
.tv-hrms-feat-filter__field{position:relative;display:flex;align-items:center}
.tv-hrms-feat-filter__icon{position:absolute;inset-inline-start:.9rem;color:var(--tv-text-3);pointer-events:none}
.tv-hrms-feat-filter__input{padding-inline-start:2.6rem;min-block-size:44px;background:var(--tv-surface)}
.tv-hrms-feat-filter__status{margin:0;padding-inline-start:.25rem;color:var(--tv-text-3);font-variant-numeric:tabular-nums}
.tv-hrms-feat-group .tv-section-head--split{max-inline-size:none}
.tv-hrms-feat-group .tv-section-head__action .tv-cluster{gap:var(--tv-sp-2xs) var(--tv-sp-s)}
.tv-hrms-feat-empty .tv-notice__body{display:grid;gap:var(--tv-sp-xs);justify-items:start}
.tv-hrms-feat-empty .tv-notice p{margin:0}
[data-tv-feat-group][hidden],[data-tv-feat-empty][hidden],.tv-hrms-feat-grid .tv-card[hidden]{display:none}
@media (width<600px){.tv-hrms-feat-grid{grid-template-columns:minmax(0,1fr)}}