/* ==========================================================
   GrowixHR – styles for secondary pages
   (login, about, customers, security, help centre, legal, 404)
   ========================================================== */

/* Generic page hero */
.page-hero{background:linear-gradient(180deg,#eaf5f0 0%,#fff 100%);padding:4.5rem 0 3.5rem}
.page-hero h1{font-size:clamp(2.1rem,4.4vw,3.2rem);line-height:1.1;max-width:680px}
.page-hero p.lead-sm{max-width:560px}
.page-hero.center{text-align:center}
.page-hero.center h1,.page-hero.center p.lead-sm{margin-left:auto;margin-right:auto}

/* ---------- Login ---------- */
.auth{background:var(--pf-bg);padding:3rem 0 4.5rem}
.auth-shell{background:#fff;border:1px solid var(--pf-border);border-radius:20px;overflow:hidden;box-shadow:var(--pf-shadow)}
.auth-form{padding:3rem clamp(1.5rem,5vw,3.5rem)}
.auth-form h1{font-size:clamp(1.7rem,3vw,2.2rem);margin-bottom:.5rem}
.auth-side{background:var(--pf-navy);color:#fff;padding:3rem clamp(1.5rem,5vw,3.5rem);display:flex;flex-direction:column;justify-content:center;height:100%}
.auth-side h2{color:#fff;font-size:1.6rem;margin-bottom:1rem}
.auth-side p{color:rgba(255,255,255,.72)}
.auth-side .check-list li{color:#fff}
.auth-side .check-list i{background:rgba(79,209,165,.18);color:var(--pf-accent)}
.auth-side .mini-quote{border-top:1px solid rgba(255,255,255,.15);margin-top:2rem;padding-top:1.5rem;font-size:.9rem;color:rgba(255,255,255,.85)}
.auth-side .mini-quote b{display:block;color:#fff;font-size:.8rem;margin-top:.6rem}
.sso-btn{display:flex;align-items:center;justify-content:center;gap:.6rem;width:100%;background:#fff;border:1px solid var(--pf-border);border-radius:12px;padding:.7rem;font-weight:700;font-size:.85rem;color:var(--pf-navy);transition:.2s}
.sso-btn:hover{border-color:var(--pf-green);color:var(--pf-green)}
.divider{display:flex;align-items:center;gap:.8rem;color:var(--pf-muted);font-size:.72rem;margin:1.4rem 0}
.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--pf-border)}
.pw-wrap{position:relative}
.pw-wrap .form-control{padding-right:2.8rem}
.pw-toggle{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);border:0;background:transparent;color:var(--pf-muted);padding:.4rem .55rem}
.pw-toggle:hover{color:var(--pf-green)}

/* ---------- About ---------- */
.value-card{padding:1.5rem;height:100%}
.value-card h6{font-size:1rem;font-weight:700;margin:1rem 0 .35rem}
.value-card p{font-size:.85rem;margin:0}
.big-stat{text-align:center}
.big-stat b{display:block;font-size:2.4rem;font-weight:800;color:var(--pf-navy);letter-spacing:-.03em}
.big-stat span{font-size:.8rem;color:var(--pf-muted)}
.timeline{position:relative;padding-left:1.6rem;border-left:2px solid var(--pf-border);margin-left:.4rem}
.tl-item{position:relative;padding-bottom:1.8rem}
.tl-item:last-child{padding-bottom:0}
.tl-item:before{content:"";position:absolute;left:calc(-1.6rem - 7px);top:.25rem;width:12px;height:12px;border-radius:50%;background:var(--pf-green);border:3px solid #fff;box-shadow:0 0 0 2px var(--pf-green)}
.tl-item .yr{font-size:.75rem;font-weight:800;color:var(--pf-green);letter-spacing:.04em}
.tl-item h6{font-size:1rem;font-weight:700;margin:.15rem 0 .25rem}
.tl-item p{font-size:.85rem;margin:0}
.team-card{text-align:center;padding:1.6rem 1rem;height:100%}
.avatar{width:72px;height:72px;border-radius:50%;background:var(--pf-mint);color:var(--pf-green);display:grid;place-items:center;font-weight:800;font-size:1.3rem;margin:0 auto 1rem}
.team-card h6{font-weight:700;font-size:.95rem;margin-bottom:.15rem}
.team-card span{font-size:.78rem;color:var(--pf-muted)}

/* ---------- Customers ---------- */
.case-card{padding:1.5rem;height:100%;display:flex;flex-direction:column;transition:box-shadow .25s ease,border-color .25s ease}
.case-card:hover{box-shadow:var(--pf-shadow);border-color:#c5d8d3}
.case-card .logo{font-weight:800;letter-spacing:.14em;font-size:.82rem;color:#7d8d95}
.case-card .tagline{font-size:.7rem;color:var(--pf-green);font-weight:700;margin:.2rem 0 1rem}
.case-card .result{font-size:2rem;font-weight:800;color:var(--pf-navy);letter-spacing:-.03em;line-height:1}
.case-card .result-l{font-size:.8rem;color:var(--pf-muted);margin:.3rem 0 1rem}
.case-card p{font-size:.85rem}
.case-card .more{margin-top:auto;font-weight:700;font-size:.82rem}
.filter-row{display:flex;flex-wrap:wrap;gap:.5rem}
.filter-btn{border:1px solid var(--pf-border);background:#fff;color:var(--pf-muted);font-size:.78rem;font-weight:600;padding:.45rem 1rem;border-radius:999px;transition:.15s}
.filter-btn.on,.filter-btn:hover{background:var(--pf-mint);border-color:var(--pf-green);color:var(--pf-green)}

/* ---------- Security ---------- */
.badge-card{padding:1.3rem;text-align:center;height:100%}
.badge-card i{font-size:1.8rem;color:var(--pf-green)}
.badge-card b{display:block;font-size:.9rem;margin-top:.6rem}
.badge-card span{font-size:.75rem;color:var(--pf-muted)}
.doc-row{display:flex;align-items:center;gap:1rem;padding:1rem 1.2rem;background:#fff;border:1px solid var(--pf-border);border-radius:12px}
.doc-row .info{flex:1;min-width:0}
.doc-row b{display:block;font-size:.88rem}
.doc-row small{color:var(--pf-muted);font-size:.72rem}

/* ---------- Help centre ---------- */
.help-search{position:relative;max-width:560px;margin:1.6rem auto 0}
.help-search i{position:absolute;left:1.1rem;top:50%;transform:translateY(-50%);color:var(--pf-muted)}
.help-search input{padding:1rem 1rem 1rem 2.9rem;border-radius:14px;font-size:.95rem;box-shadow:var(--pf-shadow)}
.cat-card{display:block;padding:1.4rem;height:100%;color:inherit;transition:box-shadow .25s ease,border-color .25s ease}
.cat-card:hover{box-shadow:var(--pf-shadow);border-color:#c5d8d3;color:inherit}
.cat-card h6{font-weight:700;font-size:1rem;margin:1rem 0 .3rem}
.cat-card p{font-size:.82rem;margin-bottom:.6rem}
.cat-card small{color:var(--pf-green);font-weight:700;font-size:.72rem}
.article-list{list-style:none;padding:0;margin:0;background:#fff;border:1px solid var(--pf-border);border-radius:14px;overflow:hidden}
.article-list li a{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.3rem;border-bottom:1px solid var(--pf-border);color:var(--pf-navy);font-size:.88rem;font-weight:600}
.article-list li:last-child a{border-bottom:0}
.article-list li a:hover{background:var(--pf-mint-2);color:var(--pf-green)}
.article-list small{color:var(--pf-muted);font-weight:500;font-size:.72rem;white-space:nowrap}

/* ---------- Legal ---------- */
.legal-toc{list-style:none;padding:0;margin:0;font-size:.85rem}
.legal-toc a{display:block;color:var(--pf-muted);padding:.4rem 0 .4rem .9rem;border-left:2px solid var(--pf-border);font-weight:500}
.legal-toc a:hover{color:var(--pf-green);border-color:var(--pf-green)}
@media (min-width:992px){.legal-side{position:sticky;top:96px}}
.legal h2{font-size:1.3rem;margin:2.4rem 0 .8rem;scroll-margin-top:100px}
.legal h2:first-of-type{margin-top:0}
.legal p,.legal li{font-size:.92rem;line-height:1.75;color:var(--pf-muted)}
.legal ul{padding-left:1.2rem}
.legal-note{background:var(--pf-mint-2);border:1px solid var(--pf-border);border-radius:12px;padding:1rem 1.2rem;font-size:.82rem;color:var(--pf-navy)}
.legal-table{font-size:.85rem}
.legal-table th{background:#f3f7f6;font-size:.78rem;color:var(--pf-muted)}

/* ---------- 404 ---------- */
.nf{padding:6rem 0;text-align:center;background:linear-gradient(180deg,#eaf5f0,#fff)}
.nf .code{font-size:clamp(5rem,16vw,10rem);font-weight:800;letter-spacing:-.06em;line-height:1;background:linear-gradient(135deg,var(--pf-green),var(--pf-accent));-webkit-background-clip:text;background-clip:text;color:transparent}
.nf h1{font-size:clamp(1.6rem,3vw,2.2rem);margin:1rem 0 .6rem}

/* ---------- Server-rendered form helpers ---------- */
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.topic{position:relative;display:inline-block}
.topic input{position:absolute;opacity:0;pointer-events:none}
.topic:has(input:checked){background:var(--pf-mint);border-color:var(--pf-green);color:var(--pf-green)}
.topic:has(input:focus-visible){outline:3px solid rgba(10,122,102,.4);outline-offset:2px}
.form-control.is-invalid,.form-select.is-invalid{border-color:#dc3545}

.region-selector{display:flex;align-items:center;gap:6px;margin:0}.region-selector select{min-width:115px;max-width:150px;font-size:.78rem;border-color:var(--pf-border);color:var(--pf-navy)}.region-selector button{padding:.38rem .55rem;font-size:.72rem}.nav-actions{flex-wrap:wrap}
.catalog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}.catalog-card{background:#fff;border:1px solid var(--pf-border);border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:22px}.catalog-card h2{font-size:1.5rem}.catalog-price{font-weight:800;font-size:2rem;color:var(--pf-navy);margin:12px 0 0}.catalog-capacity{font-size:.85rem;line-height:1.8;margin:0}.catalog-features{list-style:none;padding:0;margin:0}.catalog-features li{display:flex;align-items:center;gap:9px;padding:9px 0;border-bottom:1px solid var(--pf-border);font-size:.8rem}.catalog-features i{color:var(--pf-green)}.catalog-features .excluded,.catalog-features .excluded i{color:var(--pf-muted)}.feature-state{margin-left:auto;font-size:.65rem;white-space:nowrap}.catalog-seats{max-width:110px}.catalog-card .small{font-size:.77rem}@media(max-width:400px){.catalog-grid{grid-template-columns:1fr}.catalog-card{padding:22px}}

.pf-nav .region-selector{margin-left:auto;margin-right:12px}.js .region-selector button{display:none}@media(max-width:575.98px){.pf-nav .region-selector select{min-width:100px;max-width:112px;padding-left:8px}.pf-nav .brand-wordmark strong{font-size:18px}.pf-nav .brand-wordmark small{font-size:6px}.pf-nav .brand-logo{width:30px;height:30px;flex-basis:30px}.pf-nav .navbar-brand{margin-right:8px}.pf-nav .region-selector{margin-right:8px}}