/* Management-only refinement, drawing on the existing AI landing page. */
/* Tables must scroll inside the demo, never dictate the grid item's minimum width. */
.management-hero .hero-system,
.management-stage,
.business-app,
#business-panel { min-width:0; max-width:100%; }
.business-table { min-width:0; max-width:100%; }
@media (pointer:coarse) {
  .management-hero .management-stage,.management-hero .management-stage:hover { will-change:auto; transform-style:flat; transform:none; }
  .business-table { touch-action:pan-x pan-y pinch-zoom; overscroll-behavior:auto; }
  .management-aurora i { animation:none !important; }
}
.screen-navigation { display:flex; justify-content:space-between; gap:.5rem; margin-top:.8rem; padding-top:.7rem; border-top:1px solid var(--line); }
.screen-navigation>div { display:flex; gap:.3rem; }
.screen-navigation button { min-height:44px; padding:.5rem .65rem; border:1px solid transparent; background:transparent; border-radius:.5rem; color:var(--muted); font-size:.7rem; }
.screen-navigation button[aria-pressed=true] { background:#d68a5f20; color:var(--accent); border-color:#d68a5f40; }
.screen-navigation button:hover { color:var(--text); background:var(--surface); }
body { --surface:#211a12; --raised:#2a2118; --muted:#b9ad9d; }
main { position:relative; isolation:isolate; overflow:clip; }
body::before { position:fixed; inset:0; height:auto; z-index:4; opacity:.026; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.header { border:1px solid var(--line); border-radius:100px; padding-inline:1.4rem; background:rgba(33,26,18,.85); backdrop-filter:blur(18px); margin-top:1.2rem; }
.management-hero { position:relative; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:3rem; padding-block:6rem 4rem; min-height:650px; }
.management-hero::before { content:''; position:absolute; inset:-8rem -18vw -9rem; z-index:-1; pointer-events:none; background:radial-gradient(ellipse at 18% 22%,#d68a5f30,transparent 53%),radial-gradient(ellipse at 85% 48%,#d9a44117,transparent 50%); }
.management-hero::after { content:''; position:absolute; inset:-5rem 0 0; z-index:-1; background-image:radial-gradient(#e6dfd120 1px,transparent 1.5px); background-size:30px 30px; mask-image:linear-gradient(#000,transparent 75%); pointer-events:none; }
h1 { font-size:clamp(2.7rem,4.1vw,3.65rem); font-weight:500; line-height:1.12; }
h2 { font-size:clamp(2.45rem,4vw,3.85rem); font-weight:500; }
.lead { font-size:1.05rem; max-width:44ch; }
.hero-system { min-height:0; height:auto; display:block; }
.hero-system > :not(.management-stage) { display:none; }
.management-stage { position:relative; padding:1rem; background:linear-gradient(135deg,#30271e,#211a12); border:1px solid #e6dfd12b; border-radius:1.75rem; transform:perspective(1400px) rotateY(-5deg) rotate(-1deg); box-shadow:0 35px 100px -35px #d68a5f50,inset 0 1px #e6dfd112; transition:transform .7s var(--ease); }
.management-stage:hover { transform:perspective(1400px) rotateY(0) rotate(0); }
.management-stage img { border-radius:1rem; width:100%; height:auto; }
.stage-label,.management-stage figcaption { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.45rem .35rem 1.2rem; font-size:.75rem; color:var(--muted); }
.stage-label span:last-child { color:var(--accent); }
.management-stage figcaption { padding:1.2rem .35rem .3rem; }
.management-stage strong { font-weight:500; color:var(--text); }
.management-trust { display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid var(--line); padding-block:1.7rem; }
.management-trust div { display:grid; gap:.35rem; text-align:center; padding-inline:1rem; }
.management-trust div+div { border-left:1px solid var(--line); }
.management-trust strong { font-size:1rem; font-weight:550; }
.management-trust span { font-size:.8rem; color:var(--muted); }
.section { position:relative; padding-block:6rem 2rem; }
.section::before { content:''; position:absolute; inset:0 -10vw auto; height:450px; z-index:-1; pointer-events:none; background:radial-gradient(ellipse at 55% 0,#d68a5f0f,transparent 65%); }
.button { position:relative; overflow:hidden; border-radius:100px; transition:transform .3s var(--ease),box-shadow .4s var(--ease); }
.button:hover { box-shadow:0 14px 44px -12px #d68a5f80; }
.button::after { content:''; position:absolute; inset:0; background:linear-gradient(115deg,transparent 32%,#ffffff45 50%,transparent 68%); transform:translateX(-130%); pointer-events:none; }
.button:hover::after { transform:translateX(130%); transition:transform .9s var(--ease); }
.button:active { transform:scale(.98); }
.friction-lines { gap:1rem; }
.friction-lines p { padding:1.8rem; border:1px solid var(--line); border-radius:1.4rem; background:var(--surface); }
.friction-lines p:last-child { background:#302217; border-color:#d68a5f55; }
.dashboard { padding:.4rem; background:var(--surface); border-radius:1.75rem; box-shadow:0 28px 80px -45px #d68a5f55; }
.custom-examples article { background:var(--surface); border-radius:1.2rem; padding:1.8rem; }
.delivery-grid { counter-reset:step; }
.delivery-grid article { counter-increment:step; position:relative; padding-top:1.5rem; }
.delivery-grid article::before { content:'0' counter(step); display:block; font:2rem 'Instrument Serif',serif; color:var(--accent); margin-bottom:1rem; }
.closing { position:relative; overflow:hidden; text-align:left; padding:4rem; background:#302217; border-radius:1.75rem; }
.closing::after { content:'p.'; position:absolute; right:1rem; bottom:-7rem; font:28rem/1 'Instrument Serif',serif; color:#d68a5f0c; pointer-events:none; }
.closing h2,.closing .button { position:relative; z-index:1; }
@media(prefers-reduced-motion:no-preference) { .management-hero::before { animation:management-light 16s ease-in-out infinite alternate; } @keyframes management-light { to { transform:translate(3%,4%); opacity:.65; } } }
@media(max-width:1000px) { .management-hero { gap:2rem; grid-template-columns:1fr; padding-top:4rem; } .hero-copy { max-width:620px; } .hero-system { width:100%; max-width:720px; margin-inline:auto; } }
@media(max-width:600px) { .header { padding-inline:.8rem; } .management-hero { padding-block:3.5rem 3rem; min-height:0; } h1 { font-size:clamp(2.5rem,9vw,3.3rem); } .management-stage { transform:none; padding:.65rem; border-radius:1.2rem; } .stage-label { font-size:.65rem; } .management-stage figcaption { font-size:.7rem; } .management-trust { grid-template-columns:1fr; gap:1rem; } .management-trust div+div { border-left:0; border-top:1px solid var(--line); padding-top:1rem; } .section { padding-block:4rem 1rem; } .closing { padding:2rem 1.5rem; } }
@media(prefers-reduced-motion:reduce) { .management-stage { transform:none; } }
/* Larger, readable product demo. Only the hero is affected. */
.management-hero { grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr); align-items:center; gap:3rem; padding-top:6rem; }
.management-hero .hero-copy { max-width:530px; }
.management-hero .hero-copy .lead { max-width:46ch; }
.management-hero .meeting-note { margin-top:1rem; max-width:48ch; font-size:.875rem; line-height:1.6; color:var(--muted); }
.management-hero .hero-system { max-width:none; width:100%; }
.management-stage { --demo-rx:1.5deg; --demo-ry:-4deg; --demo-rz:-.45deg; --demo-lift:0px; transform:perspective(1800px) rotateX(var(--demo-rx)) rotateY(var(--demo-ry)) rotate(var(--demo-rz)) translateY(var(--demo-lift)); transform-style:preserve-3d; transition:transform .7s var(--ease),box-shadow .7s var(--ease); will-change:transform; }
.management-stage::before { content:''; position:absolute; inset:-1px; z-index:2; padding:1px; border-radius:inherit; pointer-events:none; background:conic-gradient(from 120deg,transparent 0 52%,#d68a5f33 63%,#e6dfd1a6 76%,transparent 88%); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); mask-composite:exclude; opacity:.5; }
.management-stage.is-playing::before { animation:management-orbit 7s linear infinite; opacity:1; }
.management-stage.is-playing { box-shadow:0 45px 120px -42px #d68a5f88,inset 0 1px #e6dfd116; }
.management-stage.is-playing .business-app { animation:screen-settle 7s var(--ease) infinite alternate; }
@keyframes management-orbit { to { opacity:1; } }
@keyframes screen-settle { from { filter:brightness(.94); } to { filter:brightness(1.06); } }
.business-app { background:#161109; border-radius:1rem; overflow:hidden; font-size:.875rem; }
.business-nav { display:flex; flex-wrap:wrap; align-items:center; gap:1.3rem; padding:1rem 1.5rem; border-bottom:1px solid var(--line); background:#241b12; }
.business-brand { display:flex; align-items:center; gap:.6rem; font-weight:600; }
.business-brand img { width:30px; height:30px; border-radius:0; }
.business-brand small { font-weight:400; font-size:.7rem; color:var(--muted); }
.business-nav [role=tablist] { display:flex; background:#30271c; border:1px solid var(--line); border-radius:3rem; padding:.25rem; gap:.2rem; margin:auto; }
.business-nav button,.business-foot button { color:var(--muted); background:transparent; border:0; border-radius:2rem; padding:.65rem 1.1rem; min-height:44px; }
.business-nav button[aria-selected=true] { background:var(--accent); color:#161109; }
.business-nav button:hover { box-shadow:inset 0 0 0 1px var(--accent); }
.business-email { font-size:.7rem; color:var(--muted); }
#business-panel { padding:2rem; min-height:535px; }
.business-heading p { font-size:.7rem; letter-spacing:.1em; color:var(--accent); }
.business-heading h3 { font-size:1.85rem; margin:.5rem 0; }
.business-heading>span { color:var(--muted); font-size:.85rem; }
.business-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin:1.5rem 0; }
.business-metrics>div { border:1px solid var(--line); border-radius:.9rem; padding:1.2rem; background:#21190f; }
.business-metrics>div:first-child { border-color:#d68a5f70; }
.business-metrics span,.business-metrics small { display:block; color:var(--muted); font-size:.8rem; }
.business-metrics strong { display:block; font-size:2rem; font-weight:550; color:var(--accent); margin:.3rem 0; font-variant-numeric:tabular-nums; }
.business-chart>span { font-size:.8rem; color:var(--muted); }
.business-chart svg { display:block; width:100%; height:105px; margin:.5rem 0; }
.business-grid { fill:none; stroke:#e6dfd110; }.business-line { fill:none; stroke:#92c8aa; stroke-width:2; }.business-area { fill:#92c8aa09; }
.business-chart>div { display:flex; justify-content:space-between; gap:.5rem; font-size:.7rem; color:var(--muted); }
.business-summary { display:flex; justify-content:space-between; align-items:center; gap:1rem; border-top:1px solid var(--line); padding-top:1rem; margin-top:1.5rem; font-size:.85rem; }
.business-summary b { display:block; font-weight:500; margin-bottom:.3rem; }
.business-paid { color:#92c8aa; font-size:.8rem; }
.business-table { overflow:auto; margin-top:1.5rem; }
.business-table table { width:100%; border-collapse:collapse; text-align:left; font-size:.85rem; }
.business-table th { font-weight:500; color:var(--muted); background:#292116; }
.business-table th,.business-table td { padding:.85rem .7rem; border-bottom:1px solid var(--line); font-variant-numeric:tabular-nums; }
.business-foot { display:flex; justify-content:space-between; align-items:center; padding:.5rem 1.5rem; border-top:1px solid var(--line); color:var(--muted); font-size:.7rem; }
.business-foot button { transition:background .25s var(--ease),color .25s var(--ease),transform .25s var(--ease); }
.business-foot button:hover { transform:translateY(-1px); }
@media(max-width:1000px) { .management-hero { grid-template-columns:1fr; padding-top:4rem; }.management-hero .hero-copy { max-width:700px; }.management-hero .hero-system { max-width:760px; } }
@media(max-width:700px) { .business-nav { padding:.8rem; gap:.7rem; }.business-brand small,.business-email { display:none; }.business-nav [role=tablist] { margin:0; width:100%; justify-content:space-between; }.business-nav button { padding:.55rem .8rem; }#business-panel { padding:1rem; min-height:590px; }.business-heading h3 { font-size:1.4rem; }.business-metrics { gap:.5rem; grid-template-columns:1fr; }.business-metrics>div { display:grid; grid-template-columns:1fr auto; gap:.15rem .5rem; padding:.7rem; }.business-metrics strong { font-size:1.35rem; grid-column:2; grid-row:1/3; align-self:center; }.business-metrics small { font-size:.7rem; }.business-chart>div { flex-wrap:wrap; }.business-table table { min-width:560px; }.business-summary { align-items:start; flex-direction:column; }.business-foot { padding:.5rem .8rem; }.business-foot button { padding:.5rem .7rem; }.management-stage,.management-stage.is-playing { transform:none; animation:none; } }
@media(prefers-reduced-motion:reduce) { .management-stage.is-playing,.management-stage.is-playing .business-app { animation:none; } }
/* Same warm light and pointer-driven perspective as the AI page. */
.management-stage,.management-stage:hover { transform:perspective(1400px) rotateX(var(--demo-rx)) rotateY(var(--demo-ry)) rotate(-1deg) translateY(var(--demo-lift)); transition:box-shadow .7s var(--ease); background:rgba(230,223,209,.035); box-shadow:0 40px 120px -40px rgba(214,138,95,.35),inset 0 1px rgba(230,223,209,.06); }
.management-stage::before { content:none; }
.management-stage.is-playing .business-app { animation:none; filter:none; }
.management-hero::before,.management-hero::after { content:none; }
.management-aurora { position:absolute; inset:0; z-index:-1; pointer-events:none; overflow:visible; }
.management-aurora i { position:absolute; border-radius:50%; filter:blur(90px); opacity:.6; mix-blend-mode:screen; }
.management-aurora i:nth-child(1) { width:56vw;height:56vw;left:-14%;top:-18%;background:radial-gradient(circle at 35% 35%,rgba(214,138,95,.55),transparent 62%); }
.management-aurora i:nth-child(2) { width:42vw;height:42vw;right:-8%;top:4%;background:radial-gradient(circle,rgba(217,164,65,.32),transparent 62%); }
.management-aurora i:nth-child(3) { width:38vw;height:38vw;left:34%;bottom:-22%;background:radial-gradient(circle,rgba(226,155,114,.28),transparent 62%); }
.management-aurora b { position:absolute;left:var(--mx,-999px);top:var(--my,-999px);width:520px;height:520px;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(214,138,95,.09),transparent 62%);opacity:0;transition:opacity .6s; }
.management-aurora.on b { opacity:1; }
@media(prefers-reduced-motion:no-preference) { .management-aurora i:nth-child(1) { animation:glow-travel 22s ease-in-out infinite alternate; }.management-aurora i:nth-child(2) { animation:glow-travel 26s ease-in-out infinite alternate-reverse; } }
@keyframes glow-travel { to { transform:translate(14%,22%) scale(1.15); } }
.management-aurora::after { content:''; position:absolute; inset:-4rem -8vw; background:radial-gradient(ellipse at 75% 42%,rgba(214,138,95,.09),transparent 63%); pointer-events:none; }
.section::before { background:radial-gradient(ellipse at 55% 0,rgba(214,138,95,.12),transparent 65%); }
.section:nth-of-type(even)::before { background:radial-gradient(ellipse at 30% 0,rgba(214,138,95,.09),transparent 65%); }
.business-nav button { transition:background .35s var(--ease),color .35s var(--ease),box-shadow .35s var(--ease); }
@media(prefers-reduced-motion:no-preference) {
  .motion-ready .hero-system[data-reveal] { transition:opacity 1.2s var(--ease),transform 1.2s var(--ease); transition-delay:.25s; }
  .motion-ready [data-reveal].is-visible h2 em { animation:serif-light 1.3s ease both; }
  .management-trust>div { animation:trust-arrive 1s var(--ease) backwards; animation-delay:.7s; }
  .management-trust>div:nth-child(2) { animation-delay:.85s; }.management-trust>div:nth-child(3) { animation-delay:1s; }
}
@keyframes serif-light { from { color:var(--text); } to { color:var(--accent); } }
@keyframes trust-arrive { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
@media(max-width:700px),(prefers-reduced-motion:reduce) { .management-stage,.management-stage:hover { transform:none; }.management-aurora i { filter:blur(56px); } }
