/* Panana Cloud — local light-home concept, 2026-09-03 */
.home-light {
  --home-blue: #0868f7;
  --home-blue-2: #2f8cff;
  --home-navy: #071b40;
  --home-body: #41506a;
  --home-muted: #78849a;
  --home-line: #dbe5f3;
  --home-soft: #f4f8ff;
  --home-white: #fff;
  color: var(--home-navy);
  background: #fff;
  font-family: "Poppins", system-ui, sans-serif;
  overflow-x: clip;
}

.home-light::before,
.home-light::after { display: none; }
.home-light main { overflow-x: clip; }
.home-light main > .section,
.home-light .site-footer { content-visibility: visible; contain-intrinsic-size: none; }
.home-light .ambient,
.home-light .motion-intro { display: none !important; }
.home-light .section { width: min(1360px, calc(100% - 80px)); margin-inline: auto; padding: 112px 0; }
.home-light .section-kicker,
.home-light .eyebrow { color: var(--home-blue); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.home-light .eyebrow { width: auto; padding: 0; border: 0; border-radius: 0; background: transparent; }
.home-light h1,
.home-light h2,
.home-light h3,
.home-light p { margin-top: 0; }
.home-light h2 { color: var(--home-navy); font-size: clamp(42px, 4.4vw, 72px); line-height: 1.04; letter-spacing: -.055em; }
.home-light p { color: var(--home-body); }

/* Header */
.home-light .site-header { position: fixed; inset: 0 0 auto; z-index: 30; padding: 16px 40px 0; background: linear-gradient(#fff 65%, transparent); }
.home-light .nav-shell { width: min(1360px, 100%); min-height: 68px; margin: 0 auto; padding: 0 22px; border: 1px solid rgba(214,225,240,.92); border-radius: 18px; background: rgba(255,255,255,.92); box-shadow: 0 12px 36px rgba(7,27,64,.06); backdrop-filter: blur(18px); }
.home-light .site-header.is-scrolled .nav-shell { min-height: 62px; box-shadow: 0 14px 42px rgba(7,27,64,.11); }
.home-light .site-header.is-scrolled .nav-shell { border-color: rgba(214,225,240,.96); background: rgba(255,255,255,.95); }
.home-light .brand { color: var(--home-navy); font-size: 20px; font-weight: 600; letter-spacing: -.04em; }
.home-light .brand-mark { width: 48px; height: 34px; padding: 0; background: none; }
.home-light .brand-mark img { width: 100%; height: 100%; object-fit: contain; }
.home-light .brand.has-custom-logo > span:last-child { display: inline !important; }
.home-light .nav-links { gap: 28px; }
.home-light .nav-links a { color: #35425a; font-size: 13px; font-weight: 500; }
.home-light .nav-links a:hover,
.home-light .nav-links a.is-active { color: var(--home-blue); }
.home-light .nav-links a::after { background: var(--home-blue); }
.home-light .nav-submenu { border-color: var(--home-line); background: #fff; box-shadow: 0 18px 50px rgba(7,27,64,.12); }
.home-light .header-cta { min-height: 44px; padding: 0 18px; border: 0; border-radius: 10px; color: #fff; background: var(--home-blue); font-size: 12px; font-weight: 600; }
.home-light .header-cta:hover { color: #fff; background: #0057da; transform: translateY(-2px); }
.home-light .menu-toggle { border-color: var(--home-line); background: #fff; }
.home-light .menu-toggle span { background: var(--home-navy); }

/* Hero */
.home-light .hero { min-height: 820px; padding-top: 156px; display: grid; grid-template-columns: .88fr 1.12fr; gap: 66px; align-items: center; }
.home-light .hero::before { content: ""; position: absolute; z-index: -1; width: 580px; height: 580px; right: -70px; top: 50px; border-radius: 50%; background: radial-gradient(circle, rgba(47,140,255,.12), transparent 68%); }
.home-light .hero-copy { align-self: center; }
.home-light .hero .eyebrow { margin-bottom: 24px; }
.home-light .hero h1 { color: var(--home-navy); max-width: 760px; font-size: clamp(52px, 5.3vw, 82px); line-height: .99; letter-spacing: -.068em; }
.home-light .hero h1 .hero-line { display: block; overflow: visible; }
.home-light .hero h1 .hero-line-inner { display: block; }
.home-light .hero h1 .hero-line-accent { color: var(--home-blue); }
.home-light .hero-text { max-width: 650px; margin: 32px 0; color: var(--home-body); font-size: 18px; line-height: 1.75; }
.home-light .hero-actions { display: flex; gap: 14px; align-items: center; }
.home-light .button { min-height: 52px; border-radius: 10px; font-size: 13px; font-weight: 600; letter-spacing: -.01em; }
.home-light .button-primary { border-color: var(--home-blue); background: var(--home-blue); color: #fff; box-shadow: 0 12px 24px rgba(8,104,247,.18); }
.home-light .button-primary:hover { background: #0057da; color: #fff; transform: translateY(-2px); }
.home-light .button-secondary { border-color: var(--home-line); color: var(--home-blue); background: #fff; }
.home-light .button-secondary:hover { border-color: var(--home-blue); color: var(--home-blue); background: var(--home-soft); }
.home-light .hero-proof { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 30px; color: var(--home-muted); font-size: 11px; }
.home-light .hero-proof strong { color: var(--home-navy); }
.home-light .proof-dot { width: 8px; height: 8px; border-radius: 50%; background: #38c996; box-shadow: 0 0 0 5px rgba(56,201,150,.12); }

/* ERP media */
.home-light .erp-preview { border: 1px solid #cfdbea; border-radius: 18px; background: #fff; box-shadow: 0 36px 80px rgba(23,62,119,.16); transform: perspective(1200px) rotateY(-2deg) rotateX(1deg); overflow: hidden; }
.home-light .erp-browser-bar { height: 42px; display: flex; align-items: center; gap: 6px; padding: 0 16px; border-bottom: 1px solid var(--home-line); background: #f9fbfe; }
.home-light .erp-browser-bar > span { width: 8px; height: 8px; border-radius: 50%; background: #d0d9e6; }
.home-light .erp-browser-bar small { margin-left: auto; margin-right: auto; color: #8b97aa; font-size: 9px; }
.home-light .erp-shell { min-height: 510px; display: grid; grid-template-columns: 132px 1fr; }
.home-light .erp-sidebar { padding: 20px 12px; background: #071b40; color: #fff; }
.home-light .erp-brand { display: flex; align-items: center; gap: 5px; margin: 0 4px 28px; font-size: 11px; }
.home-light .erp-brand img { width: 26px; }
.home-light .erp-sidebar > a { display: block; padding: 10px 12px; margin-bottom: 4px; border-radius: 7px; color: #aebbd1; font-size: 9px; }
.home-light .erp-sidebar > a.active { color: #fff; background: var(--home-blue); }
.home-light .erp-content { padding: 25px; background: #f7f9fd; }
.home-light .erp-top { display: flex; justify-content: space-between; align-items: start; }
.home-light .erp-top small { color: var(--home-muted); font-size: 9px; }
.home-light .erp-top h2 { margin: 4px 0 0; font-size: 22px; letter-spacing: -.04em; }
.home-light .erp-top > span { padding: 7px 10px; border: 1px solid var(--home-line); border-radius: 6px; background: #fff; color: var(--home-body); font-size: 8px; }
.home-light .erp-quick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 24px 0; }
.home-light .erp-quick article { padding: 17px 13px; border: 1px solid #e3eaf5; border-radius: 9px; background: #fff; }
.home-light .erp-quick i { display: grid; width: 28px; height: 28px; place-items: center; margin-bottom: 18px; border-radius: 7px; background: #edf5ff; color: var(--home-blue); font-size: 8px; font-style: normal; }
.home-light .erp-quick strong,
.home-light .erp-quick small { display: block; }
.home-light .erp-quick strong { font-size: 10px; }.home-light .erp-quick small { margin-top: 4px; color: var(--home-muted); font-size: 8px; }
.home-light .erp-table { border: 1px solid #e3eaf5; border-radius: 9px; background: #fff; overflow: hidden; }
.home-light .erp-table-head { display: flex; justify-content: space-between; padding: 16px; font-size: 10px; }.home-light .erp-table-head span { color: var(--home-blue); font-size: 8px; }
.home-light .erp-row { display: grid; grid-template-columns: .8fr 1.5fr .5fr .5fr; gap: 8px; align-items: center; padding: 12px 16px; border-top: 1px solid #edf1f7; color: #35425a; font-size: 8px; }
.home-light .erp-row.labels { color: var(--home-muted); background: #fbfcfe; }.home-light .erp-row em { justify-self: start; padding: 4px 7px; border-radius: 10px; color: #168862; background: #e7faf3; font-style: normal; }

/* Pain */
.home-light .pain-section { width: 100%; padding-inline: max(40px, calc((100vw - 1360px)/2)); background: linear-gradient(180deg,#f8fbff,#fff); border-block: 1px solid #e5edf8; }
.home-light .pain-heading { max-width: 780px; margin: 0 auto 70px; text-align: center; }
.home-light .pain-heading h2 { margin-bottom: 22px; }.home-light .pain-heading > p:last-child { max-width: 630px; margin: auto; font-size: 17px; line-height: 1.7; }
.home-light .pain-layout { display: grid; grid-template-columns: .84fr 1.16fr; gap: 54px; align-items: center; }
.home-light .pain-item { display: grid; grid-template-columns: 46px 1fr 26px; gap: 15px; align-items: center; padding: 25px 10px; border-bottom: 1px solid var(--home-line); color: var(--home-navy); }
.home-light .pain-item:first-child { border-top: 1px solid var(--home-line); }.home-light .pain-item span { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--home-line); border-radius: 50%; color: var(--home-muted); font-size: 10px; }
.home-light .pain-item strong { font-size: 17px; line-height: 1.4; }.home-light .pain-item i { color: var(--home-blue); font-size: 20px; font-style: normal; transition: transform .25s ease; }
.home-light .pain-item:hover,
.home-light .pain-item.is-active { margin-inline: -14px; padding-inline: 24px; border: 1px solid #9bc5ff; border-radius: 12px; background: #fff; box-shadow: 0 16px 36px rgba(7,27,64,.06); }
.home-light .pain-item:hover i { transform: translateX(5px); }
.home-light .pain-item.is-active span { color: #fff; border-color: var(--home-blue); background: var(--home-blue); }
.home-light .invoice-preview { padding: 28px; border: 1px solid var(--home-line); border-radius: 14px; background: #fff; box-shadow: 0 22px 70px rgba(17,54,109,.09); }
.home-light .preview-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 22px; border-bottom: 1px solid var(--home-line); }.home-light .preview-head small,.home-light .preview-head strong { display: block; }.home-light .preview-head small { color: var(--home-muted); font-size: 10px; }.home-light .preview-head strong { margin-top: 4px; font-size: 18px; }.home-light .preview-head button,.home-light .product-ui button { border: 0; border-radius: 7px; padding: 10px 14px; color: #fff; background: var(--home-blue); font: 600 10px Poppins; }
.home-light .preview-fields { display: grid; grid-template-columns: 1.35fr 1.35fr 1fr 1fr; gap: 12px; padding: 24px 0; }.home-light .preview-fields label { color: var(--home-muted); font-size: 9px; }.home-light .preview-fields span { display: block; margin-top: 7px; padding: 11px; border: 1px solid var(--home-line); border-radius: 6px; color: var(--home-body); background: #fbfcff; font-size: 9px; }
.home-light .preview-lines > div { display: grid; grid-template-columns: 2fr .6fr 1fr 1fr; gap: 10px; padding: 12px; border-bottom: 1px solid #e7edf6; font-size: 9px; }.home-light .preview-lines > div:first-child { color: var(--home-muted); background: #f7f9fd; }.home-light .preview-total { display: flex; justify-content: flex-end; gap: 30px; padding-top: 24px; font-size: 14px; }

/* Products */
.home-light .products-section { position: relative; }.home-light .products-intro { max-width: 700px; margin-bottom: 56px; }.home-light .products-intro h2 { margin-bottom: 20px; }.home-light .products-intro > p:last-child { font-size: 17px; }
.home-light .featured-product { display: grid; grid-template-columns: .76fr 1.24fr; gap: 70px; align-items: center; padding: 58px; border-radius: 24px; background: var(--home-soft); }
.home-light .product-icon { display: grid; width: 54px; height: 54px; place-items: center; margin-bottom: 24px; border-radius: 12px; color: #fff; background: var(--home-blue); font-size: 25px; }
.home-light .product-copy h3 { margin-bottom: 18px; color: var(--home-navy); font-size: clamp(32px,3vw,48px); letter-spacing: -.05em; }.home-light .product-copy p { font-size: 16px; line-height: 1.7; }.home-light .product-copy > strong { display: block; margin: 28px 0; color: var(--home-navy); font-weight: 500; }.home-light .product-copy b { color: var(--home-blue); font-size: 20px; }
.home-light .product-ui { padding: 28px; border: 1px solid #cfdbed; border-radius: 14px; background: #fff; box-shadow: 0 28px 70px rgba(17,54,109,.12); }.home-light .product-ui-top { display: flex; justify-content: space-between; align-items: center; font-size: 14px; }.home-light .product-tabs { display: flex; gap: 22px; margin: 22px 0 12px; border-bottom: 1px solid var(--home-line); }.home-light .product-tabs span { padding-bottom: 10px; color: var(--home-muted); font-size: 9px; }.home-light .product-tabs span.active { color: var(--home-blue); border-bottom: 2px solid var(--home-blue); }
.home-light .product-doc-row { display: grid; grid-template-columns: .6fr 1fr 1.5fr .8fr .7fr; gap: 10px; padding: 13px 4px; border-bottom: 1px solid #edf1f7; color: #35425a; font-size: 8px; }.home-light .product-doc-row.labels { color: var(--home-muted); background: #fbfcfe; }.home-light .product-doc-row em { width: fit-content; padding: 4px 7px; border-radius: 10px; color: #168862; background: #e7faf3; font-style: normal; }
.home-light .payroll-product { display: flex; justify-content: space-between; align-items: center; margin: 24px 0 0 32%; padding: 32px 36px; border: 1px solid var(--home-line); border-radius: 18px; }.home-light .payroll-product > div { display: flex; gap: 20px; align-items: center; }.home-light .payroll-product .product-icon { width: 48px; height: 48px; margin: 0; background: var(--home-navy); }.home-light .payroll-product small { color: var(--home-blue); font-weight: 600; }.home-light .payroll-product h3 { margin: 4px 0; font-size: 24px; }.home-light .payroll-product p { margin: 0; font-size: 13px; }.home-light .payroll-product > a { color: var(--home-blue); font-size: 12px; font-weight: 600; }

/* Services */
.home-light .services { width: 100%; padding-inline: max(40px, calc((100vw - 1360px)/2)); display: grid; grid-template-columns: .68fr 1.32fr; gap: 80px; background: #f7faff; border-block: 1px solid #e5edf8; }
.home-light .services-lead { position: sticky; top: 130px; align-self: start; }.home-light .services-lead h2 { max-width: 570px; margin-bottom: 25px; }.home-light .services-lead > p:not(.section-kicker) { max-width: 480px; font-size: 16px; line-height: 1.75; }.home-light .service-note { max-width: 420px; margin-top: 35px; padding: 18px 20px; border-left: 3px solid var(--home-blue); color: var(--home-body); background: #fff; font-size: 12px; line-height: 1.65; }
.home-light .service-grid { display: block; }.home-light .glass-card { display: grid; grid-template-columns: 56px 1fr auto; gap: 20px; align-items: center; min-height: auto; padding: 28px 6px; border: 0; border-bottom: 1px solid #ccd9eb; border-radius: 0; background: transparent; box-shadow: none; transform: none !important; }.home-light .glass-card:first-child { border-top: 1px solid #ccd9eb; }.home-light .glass-card:hover { padding-inline: 18px; border-color: #80b4ff; background: #fff; }.home-light .glass-card .card-icon { width: 48px; height: 48px; border-radius: 10px; color: var(--home-blue); border-color: #bfdbff; background: #edf5ff; }.home-light .glass-card h3 { margin: 0 0 6px; color: var(--home-navy); font-size: 18px; }.home-light .glass-card p { margin: 0; color: var(--home-muted); font-size: 12px; }.home-light .service-card-link { align-self: center; color: var(--home-blue); font-size: 11px; font-weight: 600; white-space: nowrap; }.home-light .services-products-link { display: none; }

/* Proof */
.home-light .proof-section { display: grid; grid-template-columns: .7fr 1.3fr; gap: 70px; align-items: center; }.home-light .proof-copy h2 { max-width: 590px; }.home-light .proof-copy > p { max-width: 530px; font-size: 16px; line-height: 1.7; }.home-light .proof-points { margin: 38px 0; }.home-light .proof-points > div { display: grid; grid-template-columns: 32px 1fr; gap: 2px 14px; margin: 22px 0; }.home-light .proof-points span { grid-row: 1 / 3; color: var(--home-blue); font: 600 10px Poppins; }.home-light .proof-points strong { font-size: 14px; }.home-light .proof-points p { margin: 4px 0 0; color: var(--home-muted); font-size: 11px; }.home-light .text-link { color: var(--home-blue); font-size: 12px; font-weight: 600; }
.home-light .erp-proof { padding: 0; border: 1px solid var(--home-line); border-radius: 18px; background: #f7f9fd; box-shadow: 0 30px 80px rgba(17,54,109,.12); overflow: hidden; }.home-light .proof-appbar { display: flex; justify-content: space-between; padding: 14px 18px; background: #fff; border-bottom: 1px solid var(--home-line); font-size: 9px; }.home-light .proof-appbar strong { display: flex; align-items: center; gap: 7px; }.home-light .proof-appbar strong span { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: #fff; background: #76507d; font-size: 8px; }.home-light .proof-appbar nav { color: var(--home-muted); }
.home-light .proof-panels { min-height: 510px; position: relative; padding: 32px; }.home-light .proof-panels article { position: absolute; width: 54%; padding: 18px; border: 1px solid var(--home-line); border-radius: 10px; background: #fff; box-shadow: 0 16px 32px rgba(7,27,64,.08); }.home-light .proof-panels article:nth-child(1){top:28px;left:28px}.home-light .proof-panels article:nth-child(2){top:62px;right:25px;width:39%}.home-light .proof-panels article:nth-child(3){top:235px;left:80px}.home-light .proof-panels article:nth-child(4){bottom:25px;right:18px;width:41%}.home-light .proof-panels header { display: flex; justify-content: space-between; margin-bottom: 14px; }.home-light .proof-panels header strong { font-size: 10px; }.home-light .proof-panels header span { padding: 4px 7px; color: #fff; background: var(--home-blue); border-radius: 4px; font-size: 7px; }
.home-light .mini-list p { display: grid; grid-template-columns: .7fr 1.3fr .7fr; gap: 8px; padding: 8px 0; margin: 0; border-top: 1px solid #edf1f7; font-size: 7px; }.home-light .mini-list em { color: #168862; font-style: normal; }.home-light .project-bars p { margin: 10px 0; font-size: 8px; }.home-light .project-bars i { display: block; width: var(--bar); height: 4px; margin-top: 5px; background: var(--home-blue); }.home-light .inventory-grid p { display: grid; grid-template-columns: 1fr auto; margin: 0; padding: 7px 0; border-top: 1px solid #edf1f7; font-size: 7px; }
.home-light .partner-strip { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 10px; padding: 30px 0; border-block: 1px solid var(--home-line); color: var(--home-body); font-size: 11px; }.home-light .partner-strip img { filter: grayscale(1); }.home-light .partner-strip strong { color: var(--home-navy); }

/* Diagnostic + FAQ + CTA */
.home-light .solution-lab { width: 100%; padding-inline: max(40px, calc((100vw - 1360px)/2)); background: #f6f9fe; }.home-light .solution-stage { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; padding: 0; border: 0; background: transparent; }.home-light .solution-stage::before,.home-light .solution-number { display: none; }.home-light .solution-copy h2 { max-width: 580px; }.home-light .solution-copy p { color: var(--home-body); }.home-light .solution-copy h2 span { color: var(--home-blue); }.home-light .solution-points span { color: var(--home-body); border-color: var(--home-line); background: #fff; }.home-light .solution-form { padding: 32px; border: 1px solid var(--home-line); border-radius: 18px; background: #fff; box-shadow: 0 22px 60px rgba(17,54,109,.08); }.home-light .solution-form label { color: var(--home-navy); }.home-light .solution-form textarea,.home-light .solution-name-form input { border-color: var(--home-line); color: var(--home-navy); background: #f9fbfe; }.home-light .solution-answer { border-color: var(--home-line); background: #fff; }.home-light .solution-bubble.is-bot { color: var(--home-body); background: var(--home-soft); }
.home-light .solution-copy,.home-light .solution-form { grid-column: auto; }
.home-light .solution-stage { min-height: 0; border-radius: 0; box-shadow: none; }
.home-light .solution-stage::after { display:none; }
.home-light .faq-section { display: grid; grid-template-columns: .7fr 1.3fr; gap: 80px; }.home-light .faq-heading h2 { max-width: 570px; }.home-light .faq-list details { border-top: 1px solid var(--home-line); }.home-light .faq-list details:last-child { border-bottom: 1px solid var(--home-line); }.home-light .faq-list summary { display: flex; justify-content: space-between; align-items: center; padding: 27px 2px; color: var(--home-navy); font-size: 17px; font-weight: 600; cursor: pointer; list-style: none; }.home-light .faq-list summary::-webkit-details-marker { display:none; }.home-light .faq-list summary span { color: var(--home-blue); font-size: 23px; font-weight: 400; transition: transform .2s; }.home-light .faq-list details[open] summary span { transform: rotate(45deg); }.home-light .faq-list details p { max-width: 740px; padding: 0 42px 27px 2px; margin: 0; font-size: 14px; line-height: 1.75; }
.home-light .final-cta { box-sizing: border-box; width: 100%; max-width: 100%; display: flex; justify-content: center; gap: 100px; align-items: center; padding-inline: max(40px, calc((100vw - 1360px)/2)); color: #fff; background: var(--home-blue); }.home-light .final-cta > div:first-child { max-width: 720px; }.home-light .final-cta .section-kicker { color: #bcd8ff; }.home-light .final-cta h2 { margin-bottom: 18px; color: #fff; }.home-light .final-cta p { margin: 0; color: #e2efff; font-size: 15px; line-height: 1.7; }.home-light .final-actions { display: flex; gap: 12px; flex: 0 0 auto; }.home-light .button-light { color: var(--home-blue); background: #fff; }.home-light .button-outline-light { color: #fff; border: 1px solid rgba(255,255,255,.55); background: transparent; }

/* Footer and floating action */
.home-light .site-footer { padding: 68px max(40px, calc((100vw - 1360px)/2)); border-top: 0; color: var(--home-body); background: #fff; }.home-light .site-footer::before { display: none; }.home-light .site-footer h3,.home-light .site-footer .brand { color: var(--home-navy); }.home-light .site-footer p,.home-light .site-footer a,.home-light .site-footer span { color: var(--home-body); }.home-light .site-footer a:hover { color: var(--home-blue); }.home-light .whatsapp-float { box-shadow: 0 14px 35px rgba(0,166,103,.22); }

/* Light, compositor-friendly reveal */
.home-light [data-home-reveal] { opacity: 0; transform: translate3d(0,22px,0); transition: opacity .65s ease, transform .65s cubic-bezier(.2,.8,.2,1); }
.home-light [data-home-reveal].is-home-visible { opacity: 1; transform: none; }
.home-light .proof-section { color: var(--home-navy); background: #fff; }
.home-light .proof-section { margin: 0 auto; border: 0; border-radius: 0; box-shadow: none; }
.home-light .proof-section::before,.home-light .erp-proof::before,.home-light .erp-proof::after { display:none; }
.home-light .erp-proof { min-height: 0; }
.home-light .reveal { filter: none; }

@media (max-width: 1120px) {
  .home-light .section { width: min(100% - 48px, 980px); }
  .home-light .site-header { padding-inline: 24px; }.home-light .header-cta { display: none; }
  .home-light .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 150px; }.home-light .hero-copy { max-width: 850px; }.home-light .hero-erp { max-width: 850px; margin-left: auto; }
  .home-light .pain-section,.home-light .services,.home-light .solution-lab,.home-light .final-cta { padding-inline: 24px; }
  .home-light .pain-layout,.home-light .proof-section,.home-light .solution-stage,.home-light .faq-section { grid-template-columns: 1fr; }
  .home-light .services { grid-template-columns: 1fr; }.home-light .services-lead { position: static; }.home-light .featured-product { grid-template-columns: 1fr; }.home-light .payroll-product { margin-left: 0; }.home-light .proof-section { width: min(100% - 48px,980px); }.home-light .partner-strip { flex-wrap: wrap; justify-content: flex-start; }
}

@media (max-width: 800px) {
  .home-light .section { width: calc(100% - 32px); padding: 78px 0; }.home-light h2 { font-size: clamp(36px,11vw,52px); }
  .home-light .site-header { padding: 10px 10px 0; }.home-light .nav-shell { min-height: 60px; padding: 0 14px; border-radius: 15px; }.home-light .brand { font-size: 17px; }.home-light .brand-mark { width: 39px; }
  .home-light .nav-links { top: 70px; border-color: var(--home-line); background: #fff; box-shadow: 0 20px 50px rgba(7,27,64,.14); }.home-light .nav-links a { color: var(--home-navy); }
  .home-light .hero { gap: 40px; padding-top: 125px; }.home-light .hero h1 { font-size: clamp(43px,13vw,62px); line-height: 1.02; }.home-light .hero .eyebrow { display: block; }.home-light .hero-text { margin: 24px 0; font-size: 15px; line-height: 1.65; }.home-light .hero-actions { align-items: stretch; flex-direction: column; }.home-light .hero-actions .button { width: 100%; }.home-light .hero-proof { align-items: flex-start; }
  .home-light .erp-preview { transform: none; }.home-light .erp-shell { min-height: 370px; grid-template-columns: 80px 1fr; }.home-light .erp-sidebar { padding: 12px 7px; }.home-light .erp-brand strong { display: none; }.home-light .erp-sidebar > a { padding: 8px 6px; font-size: 7px; }.home-light .erp-content { padding: 14px; }.home-light .erp-top h2 { font-size: 15px; }.home-light .erp-top > span { display: none; }.home-light .erp-quick { grid-template-columns: repeat(3,1fr); }.home-light .erp-quick article { padding: 10px 7px; }.home-light .erp-quick i { margin-bottom: 10px; }.home-light .erp-quick small { display: none; }.home-light .erp-row { grid-template-columns: 1fr 1fr .7fr; font-size: 6px; }.home-light .erp-row > *:nth-child(3) { display: none; }
  .home-light .pain-section,.home-light .services,.home-light .solution-lab,.home-light .final-cta { width: 100%; padding-inline: 16px; }.home-light .pain-heading { text-align: left; }.home-light .pain-layout { gap: 35px; }.home-light .pain-item,.home-light .pain-item:hover,.home-light .pain-item.is-active { margin: 0; padding: 21px 4px; border-width: 0 0 1px; border-radius: 0; box-shadow: none; background: transparent; }.home-light .pain-item:first-child { border-top: 1px solid var(--home-line); }.home-light .pain-item strong { font-size: 14px; }.home-light .invoice-preview { padding: 18px; overflow: hidden; }.home-light .preview-fields { grid-template-columns: 1fr 1fr; }.home-light .preview-lines { min-width: 0; }.home-light .preview-lines > div { grid-template-columns: 1.6fr .45fr .8fr; font-size: 7px; }.home-light .preview-lines > div > *:nth-child(4) { display:none; }
  .home-light .featured-product { gap: 38px; padding: 28px 20px; border-radius: 16px; }.home-light .product-ui { padding: 16px; overflow: hidden; }.home-light .product-ui > * { min-width: 0; }.home-light .product-doc-row { grid-template-columns: .65fr 1.15fr 1.4fr; font-size: 6px; }.home-light .product-doc-row > *:nth-child(4),.home-light .product-doc-row > *:nth-child(5) { display:none; }.home-light .payroll-product { align-items: flex-start; flex-direction: column; gap: 22px; padding: 25px 20px; }
  .home-light .services { gap: 40px; }.home-light .glass-card { grid-template-columns: 48px 1fr; }.home-light .service-card-link { grid-column: 2; white-space: normal; }.home-light .proof-section { width: calc(100% - 32px); }.home-light .erp-proof { overflow: hidden; }.home-light .proof-appbar nav { display: none; }.home-light .proof-panels { min-height: 450px; padding: 12px; }.home-light .proof-panels article { width: 77%; }.home-light .proof-panels article:nth-child(1){left:12px}.home-light .proof-panels article:nth-child(2){right:10px;width:52%;top:125px}.home-light .proof-panels article:nth-child(3){left:18px;top:240px}.home-light .proof-panels article:nth-child(4){right:8px;width:58%}.home-light .partner-strip span { width: calc(50% - 10px); }
  .home-light .solution-stage { gap: 35px; }.home-light .solution-form { padding: 22px 18px; }.home-light .faq-section { gap: 34px; }.home-light .faq-list summary { gap: 15px; font-size: 15px; }.home-light .final-cta { align-items: flex-start; flex-direction: column; gap: 35px; }.home-light .final-actions { width: 100%; flex-direction: column; }.home-light .final-actions .button { width: 100%; }.home-light .site-footer { padding: 55px 20px; }
}

/* Final typography pass: preserve breathing room instead of oversized stacking. */
.home-light .hero h1 {
  max-width: 680px;
  font-size: clamp(46px, 4.25vw, 66px);
  line-height: 1.055;
  letter-spacing: -.052em;
}
.home-light .products-intro h2 { max-width: 760px; line-height: 1.08; letter-spacing: -.045em; }
.home-light .product-copy h3 { line-height: 1.08; }

/* Product details on HOME reuse the live Products page and its admin data. */
.home-product-overlay { position: fixed; inset: 0; z-index: 190; display: grid; place-items: center; padding: 18px; }
.home-product-overlay[hidden] { display: none; }
.home-product-backdrop { position: absolute; inset: 0; border: 0; background: rgba(7,27,64,.5); backdrop-filter: blur(10px); }
.home-product-dialog { position: relative; width: min(1180px,100%); height: min(90dvh,920px); overflow: hidden; border: 1px solid rgba(190,218,255,.55); border-radius: 24px; background: #fff; box-shadow: 0 34px 100px rgba(7,27,64,.3); }
.home-product-frame { display: block; width: 100%; height: 100%; border: 0; background: #fff; }
.home-product-close { position: absolute; top: 14px; right: 14px; z-index: 3; display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid #d7e3f3; border-radius: 13px; color: #071b40; background: rgba(255,255,255,.94); box-shadow: 0 8px 24px rgba(7,27,64,.12); font-size: 25px; }
.home-product-open { overflow: hidden; }

@media (max-width: 800px) {
  .home-light .hero h1 { max-width: 100%; font-size: clamp(34px, 9.2vw, 41px); line-height: 1.08; letter-spacing: -.045em; }
  .home-light h2 { font-size: clamp(30px, 8.4vw, 40px); line-height: 1.1; }
  .home-light .product-copy h3 { font-size: clamp(29px, 8vw, 38px); }
  .home-light .payroll-product h3 { font-size: 21px; line-height: 1.15; }
  .home-product-overlay { padding: 8px; }
  .home-product-dialog { height: calc(100dvh - 16px); border-radius: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .home-light [data-home-reveal] { opacity: 1; transform: none; transition: none; }
  .home-light * { scroll-behavior: auto !important; }
}

@media (max-width: 800px) {
  html,
  body.home-light {
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }
  .home-light .final-cta::after { display: none; }
}

/* Approved refinement pass — navigation, interactive pain selector and layout fixes */
.home-light h1,
.home-light h2,
.home-light h3 {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
  text-wrap: balance;
}

.home-light .site-header {
  background: linear-gradient(rgba(255,255,255,.96) 65%, transparent);
}
.home-light .nav-shell,
.home-light .site-header.is-scrolled .nav-shell {
  border-color: rgba(123,157,210,.25);
  background: rgba(7,27,64,.98);
  box-shadow: 0 14px 38px rgba(7,27,64,.18);
}
.home-light .brand { color: #fff; }
.home-light .nav-links a { color: rgba(255,255,255,.76); }
.home-light .nav-links a:hover,
.home-light .nav-links a.is-active { color: #6ab4ff; }
.home-light .nav-submenu {
  border-color: rgba(123,157,210,.25);
  background: #0a214a;
  box-shadow: 0 18px 50px rgba(7,27,64,.24);
}
.home-light .menu-toggle {
  border-color: rgba(255,255,255,.25);
  background: rgba(255,255,255,.06);
}
.home-light .menu-toggle span { background: #fff; }
.home-light .hero { min-height: 100svh; padding-top: 128px; }

.home-light .pain-item {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--home-line);
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.home-light .preview-action,
.home-light .product-ui button,
.home-light .product-ui-action {
  border: 0;
  border-radius: 7px;
  padding: 10px 14px;
  color: #fff;
  background: var(--home-blue);
  font: 600 10px "Panana", sans-serif;
}
.home-light .preview-total {
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
}
.home-light .preview-total a {
  color: var(--home-blue);
  font-size: 11px;
  font-weight: 600;
  text-align: right;
}
.home-light .invoice-preview {
  transition: opacity .12s ease, transform .12s ease;
}
.home-light .invoice-preview.is-switching {
  opacity: .35;
  transform: translate3d(8px,0,0);
}

.home-light .partner-strip {
  display: grid;
  grid-template-columns: .7fr 1.1fr repeat(4,1fr);
  align-items: stretch;
  gap: 0;
  padding: 0;
}
.home-light .partner-strip a {
  display: flex;
  min-height: 76px;
  align-items: center;
  justify-content: center;
  padding: 14px 18px;
  color: var(--home-body);
  text-align: center;
  transition: color .2s ease, background .2s ease;
}
.home-light .partner-strip a:hover {
  color: var(--home-blue);
  background: var(--home-soft);
}
.home-light .partner-strip .partner-primary {
  color: var(--home-navy);
  font-weight: 600;
}

.home-light .solution-lab { min-height: 125svh; }
.home-light .solution-stage { position: sticky; top: 120px; }

.home-light .site-footer {
  width: 100%;
  max-width: none;
  grid-template-columns: minmax(280px,1.6fr) repeat(3,minmax(150px,1fr));
  gap: clamp(36px,5vw,76px);
  margin: 0;
}
.home-light .footer-brand { max-width: 420px; }
.home-light .site-footer .brand { margin-bottom: 28px; }
.home-light .footer-description { max-width: 390px; line-height: 1.7; }

@media (max-width: 1120px) {
  .home-light .partner-strip { grid-template-columns: repeat(3,1fr); }
  .home-light .solution-lab { min-height: auto; }
  .home-light .solution-stage { position: static; }
  .home-light .site-footer { grid-template-columns: 1.4fr repeat(3,1fr); }
}

@media (max-width: 800px) {
  .home-light .site-header {
    background: linear-gradient(rgba(255,255,255,.96) 72%,transparent);
  }
  .home-light.menu-open { overflow: hidden; }
  .home-light .nav-links {
    position: fixed;
    inset: 0 0 0 auto;
    z-index: 50;
    display: flex;
    width: min(88vw,380px);
    padding: 102px 24px 32px;
    border: 0;
    border-radius: 24px 0 0 24px;
    background: #071b40;
    box-shadow: -24px 0 70px rgba(7,27,64,.3);
    transform: translate3d(105%,0,0);
    opacity: 0;
    visibility: hidden;
    transition: transform .34s cubic-bezier(.2,.8,.2,1), opacity .2s ease, visibility .34s;
  }
  .home-light .nav-links.is-open {
    transform: none;
    opacity: 1;
    visibility: visible;
  }
  .home-light .nav-links a {
    justify-content: flex-start;
    padding: 15px 12px;
    border-bottom: 1px solid rgba(255,255,255,.1);
    color: rgba(255,255,255,.82);
    font-size: 16px;
    text-align: left;
  }
  .home-light .nav-links a.is-active { color: #6ab4ff; }
  .home-light .menu-toggle { position: relative; z-index: 60; }
  .home-light .nav-submenu { padding: 6px 0 8px; background: rgba(255,255,255,.04); }
  .home-light .nav-submenu a { padding: 11px 16px; border: 0; color: rgba(255,255,255,.66); font-size: 13px; }

  .home-light .hero { display: block; min-height: auto; gap: 0; padding-top: 0; }
  .home-light .hero-copy {
    display: flex;
    min-height: 100svh;
    flex-direction: column;
    justify-content: center;
    padding: 104px 0 34px;
  }
  .home-light .hero h1 {
    max-width: 100%;
    font-size: clamp(37px,10.8vw,48px);
    line-height: 1.01;
    letter-spacing: -.055em;
  }
  .home-light .hero .eyebrow { margin-bottom: 16px; font-size: 9px; line-height: 1.5; }
  .home-light .hero-text { margin: 20px 0; font-size: 13px; line-height: 1.55; }
  .home-light .hero-actions { gap: 9px; }
  .home-light .hero-actions .button { min-height: 46px; }
  .home-light .hero-proof { align-items: center; margin-top: 18px; font-size: 9px; line-height: 1.4; }
  .home-light .hero-erp { margin-top: 40px; }

  .home-light .pain-section,
  .home-light .services,
  .home-light .proof-section,
  .home-light .solution-lab,
  .home-light .faq-section,
  .home-light .final-cta {
    width: 100%;
    max-width: none;
    padding-inline: 16px;
  }
  .home-light .preview-total { align-items: flex-start; flex-direction: column; gap: 12px; }
  .home-light .preview-total a { text-align: left; }
  .home-light .partner-strip { grid-template-columns: 1fr; }
  .home-light .partner-strip a {
    min-height: 58px;
    justify-content: space-between;
    border-bottom: 1px solid var(--home-line);
    text-align: left;
  }
  .home-light .partner-strip a::after { content: "→"; color: var(--home-blue); }
  .home-light .partner-strip .partner-logo { justify-content: flex-start; }
  .home-light .partner-strip .partner-logo::after { margin-left: auto; }
  .home-light .partner-strip a:last-child { border-bottom: 0; }
  .home-light .site-footer {
    grid-template-columns: 1fr 1fr;
    gap: 36px 24px;
    padding: 55px 20px;
  }
  .home-light .footer-brand { grid-column: 1 / -1; max-width: none; }
  .home-light .footer-description { max-width: 34rem; }
  .home-light .site-footer > div:last-child { grid-column: 1 / -1; }
}

@media (max-width: 430px) {
  .home-light .hero h1 { font-size: clamp(35px,10.5vw,44px); }
  .home-light .site-footer { grid-template-columns: 1fr; }
  .home-light .footer-brand,
  .home-light .site-footer > div:last-child { grid-column: auto; }
}

.home-light .dashboard-shot { margin: 0; aspect-ratio: 1800 / 989; }
.home-light .dashboard-shot img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; }

/* Stable brand artwork, real UI previews and polished glass controls */
.home-light .brand-full { display: inline-flex; width: 184px; height: 39px; align-items: center; }
.home-light .brand-full > img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: left center; }
.home-light .site-header .brand-full > img { filter: none; }
.home-light .site-footer .brand-full { width: 184px; height: 40px; }
.home-light .dashboard-shot {
  position: relative;
  overflow: hidden;
  background: #fff url('assets/product-ui/panana-dashboard-demo.svg') center top / cover no-repeat;
}
.home-light .dashboard-shot .dashboard-art { position: relative; z-index: 1; }
.home-light .dashboard-shot .dashboard-brand-logo {
  position: absolute;
  z-index: 2;
  top: 3.1%;
  left: 1.55%;
  width: 10.4%;
  height: auto;
  object-fit: contain;
  pointer-events: none;
  filter: none;
}
.home-light .product-system-icon svg { width: 29px; height: 29px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.home-light .enterprise-icon { background-image: url('assets/icons/enterprise.svg') !important; }
.home-light .code-icon { background-image: url('assets/icons/code.svg') !important; }
.home-light .node-icon { background-image: url('assets/icons/integrations.svg') !important; }
.home-light .bolt-icon { background-image: url('assets/icons/automation.svg') !important; }
.home-light .target-icon { background-image: url('assets/icons/consulting.svg') !important; }
.home-light .glass-card .card-icon {
  width: 40px;
  height: 40px;
  border-radius: 9px;
  background-size: 25px;
  background-position: center;
  background-repeat: no-repeat;
}
.home-light .partner-logo img { display: block; width: 88px; height: 32px; object-fit: contain; }

.home-light .site-header {
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.home-light .site-header.is-scrolled {
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.home-light .site-header.is-scrolled .nav-shell {
  border-color: rgba(255,255,255,.24);
  background: linear-gradient(135deg, rgba(7,27,64,.82), rgba(14,48,96,.68));
  box-shadow: 0 14px 42px rgba(7,27,64,.17);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
  backdrop-filter: blur(18px) saturate(145%);
}
.home-light .button,
.home-light .header-cta,
.home-light .preview-action {
  border: 1px solid rgba(255,255,255,.46);
  background-image: linear-gradient(145deg, rgba(255,255,255,.22), rgba(255,255,255,.04));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 12px 28px rgba(7,27,64,.14);
  -webkit-backdrop-filter: blur(12px) saturate(140%);
  backdrop-filter: blur(12px) saturate(140%);
}
.home-light .button:hover,
.home-light .header-cta:hover,
.home-light .preview-action:hover {
  transform: translateY(-2px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.52), 0 16px 34px rgba(7,27,64,.2);
}
.home-light .button:focus-visible,
.home-light .header-cta:focus-visible,
.home-light .preview-action:focus-visible {
  outline: 3px solid rgba(80,161,255,.42);
  outline-offset: 3px;
}

html:has(.home-light),
body.home-light { overflow-x: clip; }

.home-light [data-home-reveal] { opacity: 1; transform: none; }
.home-light.is-motion-ready .home-motion-target {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition:
    opacity .7s cubic-bezier(.2,.75,.25,1) var(--motion-delay, 0ms),
    transform .7s cubic-bezier(.2,.75,.25,1) var(--motion-delay, 0ms),
    box-shadow .35s ease,
    border-color .35s ease,
    background-color .35s ease;
  will-change: opacity, transform;
}
.home-light.is-motion-ready .home-motion-target.is-home-visible {
  opacity: 1;
  transform: none;
  will-change: auto;
}

.home-light h2 { font-size: clamp(36px, 3.75vw, 60px); }
.home-light .hero h1 { max-width: 700px; font-size: clamp(48px, 4.7vw, 72px); }

@keyframes panana-soft-rise {
  from { opacity: .01; transform: translate3d(0, 14px, 0); }
  to { opacity: 1; transform: none; }
}
@keyframes panana-soft-scale {
  from { opacity: .01; transform: translate3d(0, 10px, 0) scale(.988); }
  to { opacity: 1; transform: none; }
}
.home-light .hero-copy { animation: panana-soft-rise .72s cubic-bezier(.2,.75,.25,1) both; }
.home-light .hero-erp { animation: panana-soft-scale .86s .1s cubic-bezier(.2,.75,.25,1) both; }
.home-light .glass-card,
.home-light .featured-product,
.home-light .product-ui,
.home-light .partner-strip {
  transition: transform .35s cubic-bezier(.2,.75,.25,1), box-shadow .35s ease, border-color .35s ease, background-color .35s ease;
}
.home-light .glass-card:hover { transform: translate3d(6px,0,0) !important; }
.home-light .glass-card:hover .card-icon { transform: translate3d(0,-2px,0); }
.home-light .card-icon { transition: transform .35s cubic-bezier(.2,.75,.25,1); }
.home-light .dashboard-shot img { transition: transform .8s cubic-bezier(.2,.75,.25,1); }
.home-light .dashboard-shot:hover img { transform: scale(1.012); }

@media (max-width: 800px) {
  .home-light .brand-full { width: 164px; height: 36px; }
  .home-light .nav-links:not(.is-open) { display: none; }
  .home-light .nav-links.is-open { display: flex; }
  .home-light .site-header.is-scrolled { background: transparent !important; }
}

@media (max-width: 360px) {
  .home-light .brand-full { width: 148px; }
}

@media (max-width: 800px) {
  .home-light h2 { font-size: clamp(31px, 9vw, 43px); }
  .home-light .hero h1 { font-size: clamp(33px, 9.6vw, 42px); }
  .home-light .glass-card:hover { transform: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .home-light.is-motion-ready .home-motion-target {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .home-light .hero-copy,
  .home-light .hero-erp { animation: none; }
  .home-light .dashboard-shot img,
  .home-light .glass-card,
  .home-light .card-icon { transition: none; }
}

@media (max-width: 800px) {
  .home-light .nav-links {
    position: absolute;
    inset: -10px -10px auto auto;
    height: 100dvh;
    max-height: 100dvh;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .home-light .dashboard-shot { aspect-ratio: 16 / 10; }
}

/* Final cascade guard for headline rhythm and horizontal containment. */
.home-light .final-cta::after { display: none; }
.home-light .hero h1 {
  max-width: 680px;
  font-size: clamp(46px, 4.1vw, 64px);
  line-height: 1.07;
  letter-spacing: -.05em;
}
.home-light h2 { line-height: 1.1; letter-spacing: -.045em; }

@media (max-width: 800px) {
  .home-light .hero h1 { font-size: clamp(34px, 9.2vw, 41px); line-height: 1.09; letter-spacing: -.042em; }
  .home-light h2 { font-size: clamp(30px, 8.4vw, 40px); line-height: 1.12; }
}
