:root {
  --ink: #05080d;
  --ink-2: #0a0f16;
  --ink-3: #121923;
  --paper: #ffffff;
  --mist: #f1f4f1;
  --mist-2: #e6ebe6;
  --text: #151a1e;
  --muted: #667078;
  --muted-dark: #9aa5ad;
  --line: rgba(10, 15, 22, .12);
  --line-dark: rgba(255,255,255,.12);
  --green: #72cf5b;
  --green-bright: #8ee774;
  --green-deep: #2e7a33;
  --warning: #f4c95d;
  --danger: #ef6a6a;
  --radius: 18px;
  --shadow: 0 28px 80px rgba(4, 10, 8, .16);
  --shell: min(1180px, calc(100vw - 40px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--text); background: var(--paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
body::selection { background: var(--green); color: var(--ink); }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
img, svg { display: block; max-width: 100%; }
.shell { width: var(--shell); margin-inline: auto; }
.section-dark { position: relative; overflow: hidden; color: #f8fafb; background: var(--ink); }
.section-light { background: var(--mist); }
.section-white { background: #fff; }

.scroll-progress { position: fixed; inset: 0 0 auto; z-index: 1000; height: 3px; background: transparent; }
.scroll-progress span { display: block; width: 0; height: 100%; background: var(--green); box-shadow: 0 0 18px var(--green); }

.site-header { position: fixed; inset: 3px 0 auto; z-index: 900; background: rgba(5,8,13,.82); backdrop-filter: blur(18px); border-bottom: 1px solid rgba(255,255,255,.08); color: #fff; }
.header-inner { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.brand img { width: 152px; height: 44px; object-fit: contain; object-position: left center; }
.desktop-nav { display: flex; gap: 30px; font-size: 13px; color: #bec7cd; }
.desktop-nav a { transition: color .2s ease; }
.desktop-nav a:hover { color: #fff; }
.desktop-nav .nav-demo-link { color: var(--green); font-weight: 800; }
.desktop-nav .nav-demo-link:hover { color: var(--green-bright); }
.header-actions { display: flex; align-items: center; gap: 10px; }
.icon-button { width: 38px; height: 38px; padding: 9px; border: 1px solid var(--line-dark); border-radius: 50%; background: transparent; cursor: pointer; }
.icon-button svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.button { min-height: 50px; padding: 0 23px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 999px; font-weight: 750; font-size: 14px; transition: transform .22s ease, background .22s ease, border-color .22s ease; }
.button:hover { transform: translateY(-2px); }
.button-small { min-height: 40px; padding: 0 18px; font-size: 12px; }
.button-demo { color: var(--ink); background: var(--green); box-shadow: 0 10px 34px rgba(114,207,91,.18); }
.button-demo:hover { background: var(--green-bright); }
.button-primary { color: var(--ink); background: var(--green); box-shadow: 0 10px 34px rgba(114,207,91,.18); }
.button-primary:hover { background: var(--green-bright); }
.button-ghost { color: #fff; border-color: rgba(255,255,255,.25); background: rgba(255,255,255,.03); }
.button-ghost:hover { border-color: var(--green); }
.button-full { width: 100%; }

.hero { min-height: 930px; padding: 155px 0 100px; }
.hero-grid-bg { position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(to bottom, black, transparent 82%); }
.hero::before { content: ""; position: absolute; width: 540px; height: 540px; right: 4%; top: 100px; border-radius: 50%; background: radial-gradient(circle, rgba(114,207,91,.13), transparent 67%); filter: blur(18px); }
.hero-layout { position: relative; display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; gap: 56px; }
.eyebrow { display: flex; align-items: center; gap: 10px; font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #adb8bf; }
.pulse-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 7px rgba(114,207,91,.1); }
.hero-copy h1 { max-width: 650px; margin: 26px 0; font-size: clamp(54px, 6.1vw, 88px); line-height: .93; letter-spacing: -.065em; }
.hero-copy h1 em { display: block; color: var(--green); font-style: normal; }
.hero-lead { max-width: 600px; margin: 0; color: #b5c0c8; font-size: 18px; line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 35px; }
.hero-meta { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; max-width: 640px; margin: 54px 0 0; border-top: 1px solid var(--line-dark); }
.hero-meta div { padding: 22px 18px 0 0; }
.hero-meta dt { margin-bottom: 7px; color: #7d8a93; font-size: 10px; text-transform: uppercase; letter-spacing: .13em; }
.hero-meta dd { margin: 0; font-size: 13px; font-weight: 700; }

.hero-stage { position: relative; min-width: 0; }
.proposal-stamp { position: absolute; z-index: 4; top: -58px; right: 6px; display: flex; flex-direction: column; align-items: flex-end; color: #839099; text-transform: uppercase; letter-spacing: .12em; font-size: 9px; }
.proposal-stamp strong { margin-top: 5px; color: var(--green); font-size: 13px; }
.browser-frame { position: relative; z-index: 2; overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: 22px; background: #0f151c; box-shadow: 0 50px 120px rgba(0,0,0,.52); transform: perspective(1200px) rotateY(-3deg) rotateX(1deg); }
.browser-topbar { height: 42px; display: flex; align-items: center; justify-content: space-between; padding: 0 14px; border-bottom: 1px solid rgba(255,255,255,.07); background: #10161d; font-size: 8px; color: #6f7c85; }
.browser-dots { display: flex; gap: 5px; }
.browser-dots i { width: 6px; height: 6px; border-radius: 50%; background: #38424a; }
.browser-url { width: 48%; padding: 6px 10px; border-radius: 10px; background: #080c11; text-align: center; }
.secure-pill { color: var(--green); }
.site-demo-hero { min-height: 540px; padding: 20px 28px 0; position: relative; overflow: hidden; background: radial-gradient(circle at 70% 64%, rgba(114,207,91,.14), transparent 30%), #070b10; }
.site-demo-hero::before { content: ""; position: absolute; inset: 0; opacity: .17; background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 34px 34px; }
.demo-nav { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr auto auto auto auto; align-items: center; gap: 18px; color: #86939c; font-size: 8px; }
.demo-brand-mark { width: 26px; height: 26px; display: grid; place-items: center; border: 1px solid var(--green); color: var(--green); font-weight: 900; transform: skew(-9deg); }
.demo-nav b { padding: 8px 13px; border-radius: 999px; color: var(--ink); background: var(--green); }
.demo-copy { position: relative; z-index: 2; width: 62%; margin-top: 68px; }
.demo-copy small { color: var(--green); font-size: 7px; letter-spacing: .2em; }
.demo-copy h2 { margin: 12px 0; font-size: clamp(27px, 3vw, 42px); line-height: 1; letter-spacing: -.05em; }
.demo-copy h2 span { color: var(--green); }
.demo-copy p { max-width: 330px; margin: 0; color: #8e9aa3; font-size: 10px; line-height: 1.5; }
.demo-buttons { display: flex; align-items: center; gap: 18px; margin-top: 20px; font-size: 8px; }
.demo-buttons b { padding: 9px 14px; border-radius: 999px; color: var(--ink); background: var(--green); }
.demo-buttons span { color: #b8c1c7; }
.car-visual { position: absolute; z-index: 1; right: -58px; bottom: 38px; width: 82%; }
.demo-proof { position: absolute; z-index: 2; inset: auto 28px 16px; display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid rgba(255,255,255,.1); }
.demo-proof div { padding: 12px 0; display: flex; align-items: baseline; gap: 7px; }
.demo-proof b { color: #fff; font-size: 10px; }
.demo-proof span { color: #68747c; font-size: 7px; text-transform: uppercase; letter-spacing: .08em; }
.floating-card { position: absolute; z-index: 5; display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 13px; background: rgba(17,24,32,.88); box-shadow: 0 18px 50px rgba(0,0,0,.36); backdrop-filter: blur(14px); }
.floating-card small { display: block; color: #7d8991; font-size: 8px; }
.floating-card strong { display: block; margin-top: 3px; font-size: 9px; }
.floating-card > b { margin-left: 6px; color: var(--green); font-size: 8px; }
.mini-icon { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 8px; color: var(--ink); background: var(--green); font-weight: 900; }
.floating-lead { top: 72px; left: -35px; }
.floating-payment { right: -24px; bottom: 76px; }

.context-band { padding: 110px 0; border-bottom: 1px solid var(--line); }
.context-grid { display: grid; grid-template-columns: 90px 1fr 1fr; gap: 48px; align-items: start; }
.section-index { color: var(--green-deep); font-size: 13px; font-weight: 900; letter-spacing: .12em; }
.section-kicker, .section-label { display: block; color: var(--green-deep); font-size: 10px; font-weight: 850; letter-spacing: .17em; text-transform: uppercase; }
.section-label { margin-bottom: 16px; }
.section-label.dark { color: var(--green-deep); }
.context-grid h2, .section-heading h2, .pricing-heading h2, .why-points h2, .timeline-copy h2 { margin: 10px 0 0; font-size: clamp(38px, 5vw, 65px); line-height: 1.02; letter-spacing: -.055em; }
.context-copy { color: var(--muted); font-size: 16px; line-height: 1.75; }
.context-copy p { margin: 0 0 24px; }
.highlight-line { padding-left: 18px; border-left: 3px solid var(--green); color: var(--text); font-weight: 650; }

.ecosystem-section, .product-section, .roadmap-section, .operations-section, .pricing-section, .why-section, .terms-section { padding: 125px 0; }
.section-heading { display: grid; grid-template-columns: 1.2fr .8fr; gap: 80px; align-items: end; margin-bottom: 72px; }
.section-heading p { max-width: 480px; margin: 0; color: var(--muted); line-height: 1.75; }
.section-heading.inverse p { color: #929ea6; }
.section-heading.compact { margin-bottom: 40px; }

.ecosystem-map { position: relative; min-height: 610px; border: 1px solid var(--line); border-radius: 32px; background: #f8faf8; overflow: hidden; }
.ecosystem-map::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(5,8,13,.08) 1px, transparent 1px); background-size: 22px 22px; opacity: .6; }
.eco-core { position: absolute; z-index: 3; left: 50%; top: 50%; width: 180px; height: 180px; transform: translate(-50%,-50%); display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 50%; background: var(--ink); color: #fff; box-shadow: 0 30px 80px rgba(5,8,13,.22); }
.core-ring { position: absolute; inset: -24px; border: 1px solid rgba(114,207,91,.35); border-radius: 50%; }
.ring-two { inset: -48px; border-color: rgba(114,207,91,.14); }
.core-logo { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 12px; border: 1px solid var(--green); color: var(--green); font-size: 25px; font-weight: 950; transform: skew(-8deg); }
.eco-core strong { font-size: 16px; }
.eco-core span { margin-top: 7px; color: #71808a; font-size: 8px; text-transform: uppercase; letter-spacing: .1em; }
.eco-node { position: absolute; z-index: 3; width: 245px; padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.93); box-shadow: 0 18px 45px rgba(20,30,24,.06); }
.eco-node span { color: var(--green-deep); font-size: 10px; font-weight: 900; }
.eco-node h3 { margin: 14px 0 6px; font-size: 20px; }
.eco-node p { margin: 0; color: var(--muted); font-size: 13px; }
.node-site { left: 55px; top: 65px; }.node-crm { right: 55px; top: 65px; }.node-partner { left: 55px; bottom: 65px; }.node-media { right: 55px; bottom: 65px; }
.eco-lines { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; }
.eco-lines path { fill: none; stroke: rgba(46,122,51,.32); stroke-width: 1.5; stroke-dasharray: 5 8; }

.product-tabs { display: grid; grid-template-columns: repeat(4,1fr); margin-bottom: 22px; border-bottom: 1px solid var(--line-dark); }
.product-tab { padding: 0 12px 18px; border: 0; border-bottom: 2px solid transparent; color: #7e8a93; background: transparent; text-align: left; font-weight: 700; cursor: pointer; }
.product-tab i { margin-right: 8px; color: #48535b; font-style: normal; font-size: 10px; }
.product-tab.is-active { border-bottom-color: var(--green); color: #fff; }
.product-tab.is-active i { color: var(--green); }
.product-showcase { display: grid; grid-template-columns: 310px 1fr; min-height: 610px; border: 1px solid var(--line-dark); border-radius: 24px; overflow: hidden; background: #0a0f15; }
.product-description { padding: 42px 32px; border-right: 1px solid var(--line-dark); }
.product-description .product-count { color: var(--green); font-size: 11px; font-weight: 900; letter-spacing: .12em; }
.product-description h3 { margin: 20px 0 14px; font-size: 31px; line-height: 1.05; letter-spacing: -.04em; }
.product-description > p { color: #8e99a1; line-height: 1.65; font-size: 14px; }
.product-description ul { list-style: none; padding: 0; margin: 30px 0 0; }
.product-description li { position: relative; padding: 11px 0 11px 19px; border-bottom: 1px solid rgba(255,255,255,.07); color: #c0c8ce; font-size: 12px; }
.product-description li::before { content: ""; position: absolute; left: 0; top: 16px; width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.screen-shell { padding: 16px; min-width: 0; }
.screen-toolbar { height: 38px; display: grid; grid-template-columns: 1fr 2fr 1fr; align-items: center; padding: 0 12px; border: 1px solid rgba(255,255,255,.08); border-bottom: 0; border-radius: 13px 13px 0 0; background: #151c24; color: #68747d; font-size: 8px; }
.screen-toolbar > div { display: flex; gap: 5px; }.screen-toolbar i { width: 6px; height: 6px; border-radius: 50%; background: #424d55; }
.screen-toolbar span { text-align: center; }.screen-toolbar b { color: var(--green); text-align: right; letter-spacing: .1em; }
.screen-content { min-height: 520px; padding: 22px; overflow: hidden; border: 1px solid rgba(255,255,255,.08); border-radius: 0 0 13px 13px; background: #eef1ef; color: #111820; }

/* Demo screens */
.demo-dashboard { height: 100%; }
.demo-dashboard-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.demo-dashboard-header h4 { margin: 0; font-size: 18px; }.demo-dashboard-header p { margin: 4px 0 0; color: #768087; font-size: 9px; }
.demo-user { display: flex; align-items: center; gap: 8px; font-size: 9px; font-weight: 750; }.demo-avatar { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; background: #d9e6d7; }
.demo-stat-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin-bottom: 14px; }
.demo-stat { min-height: 78px; padding: 13px; border: 1px solid #dde3de; border-radius: 10px; background: #fff; }.demo-stat small { color: #778078; font-size: 7px; text-transform: uppercase; }.demo-stat b { display: block; margin-top: 8px; font-size: 18px; }.demo-stat em { color: #4d9d42; font-size: 7px; font-style: normal; }
.demo-main-grid { display: grid; grid-template-columns: 1.4fr .7fr; gap: 12px; }
.demo-panel { padding: 15px; border: 1px solid #dde3de; border-radius: 11px; background: #fff; }
.demo-panel-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }.demo-panel-heading b { font-size: 10px; }.demo-panel-heading span { color: #477e3f; font-size: 7px; }
.funnel-row { display: grid; grid-template-columns: 1.3fr .55fr .4fr; align-items: center; padding: 8px 0; border-bottom: 1px solid #eef1ef; font-size: 8px; }.funnel-row:last-child { border: 0; }.funnel-bar { height: 5px; border-radius: 5px; background: #e7ebe8; overflow: hidden; }.funnel-bar i { display: block; height: 100%; border-radius: inherit; background: #72cf5b; }
.invoice-item, .content-item, .ticket-item { display: grid; align-items: center; gap: 8px; padding: 9px 0; border-bottom: 1px solid #edf0ee; font-size: 8px; }.invoice-item { grid-template-columns: 28px 1fr auto; }.invoice-item:last-child, .content-item:last-child, .ticket-item:last-child { border: 0; }
.invoice-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; background: #eef6ec; color: #3d9235; font-weight: 900; }.invoice-item small, .content-item small, .ticket-item small { display: block; margin-top: 3px; color: #8c9590; }.invoice-status { padding: 4px 6px; border-radius: 99px; background: #eaf7e7; color: #367f31; font-size: 6px; }
.invoice-status.warn { background: #fff4d9; color: #976b13; }.invoice-status.late { background: #ffe8e8; color: #b84747; }
.demo-site-mini { height: 100%; overflow: hidden; border-radius: 10px; background: #070b10; color: #fff; }
.mini-nav { display: flex; justify-content: space-between; align-items: center; padding: 14px 18px; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 7px; color: #8b969e; }.mini-nav b { color: #fff; font-size: 11px; letter-spacing: .08em; }.mini-nav span:last-child { padding: 6px 9px; border-radius: 99px; background: #72cf5b; color: #08100a; font-weight: 800; }
.mini-site-hero { position: relative; min-height: 285px; padding: 48px 28px; overflow: hidden; background: radial-gradient(circle at 76% 55%, rgba(114,207,91,.18), transparent 28%); }.mini-site-hero h4 { width: 52%; margin: 0; font-size: 28px; line-height: .98; letter-spacing: -.055em; }.mini-site-hero h4 span { color: #72cf5b; }.mini-site-hero p { width: 45%; color: #8e99a1; font-size: 8px; line-height: 1.5; }.mini-site-hero button { margin-top: 10px; padding: 8px 12px; border: 0; border-radius: 99px; background: #72cf5b; font-size: 7px; font-weight: 850; }.mini-car { position: absolute; right: -4%; bottom: 28px; width: 55%; height: 118px; border-radius: 50% 45% 18% 20%; background: linear-gradient(145deg,#e7ebee,#6d7984); transform: skewX(-8deg); box-shadow: 0 23px 42px rgba(0,0,0,.45); }.mini-car::before { content:""; position:absolute; left:24%; top:-32%; width:52%; height:54%; border-radius:55% 55% 5% 5%; background:#17232b; transform:skewX(15deg); }.mini-car::after { content:""; position:absolute; inset:auto 8% -17px; height:34px; border-radius:50%; border-left:34px solid #12171c; border-right:34px solid #12171c; }
.mini-site-strip { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: rgba(255,255,255,.1); }.mini-site-strip div { padding: 16px; background: #0e151c; }.mini-site-strip b { display: block; font-size: 11px; }.mini-site-strip span { color: #6f7c84; font-size: 7px; }
.partner-top { display: grid; grid-template-columns: 1.4fr .6fr; gap: 12px; margin-bottom: 12px; }.contract-card { position: relative; overflow: hidden; padding: 22px; border-radius: 12px; background: #0a1117; color: #fff; }.contract-card::after { content:""; position:absolute; width:180px; height:180px; right:-40px; top:-65px; border-radius:50%; background:radial-gradient(circle,rgba(114,207,91,.23),transparent 65%); }.contract-card small { color: #7f8b94; font-size: 7px; }.contract-card h4 { margin: 7px 0 18px; font-size: 18px; }.progress-title { display:flex; justify-content:space-between; font-size:7px; color:#a6b0b7; }.contract-progress { height: 7px; margin-top: 8px; border-radius: 8px; background: #29323a; overflow: hidden; }.contract-progress i { display:block; width:42%; height:100%; border-radius:inherit; background:#72cf5b; }.contract-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:18px; }.contract-metrics div { padding-top:9px; border-top:1px solid rgba(255,255,255,.1); }.contract-metrics b { display:block; font-size:10px; }.contract-metrics span { color:#74818a; font-size:6px; }.quick-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }.quick-actions div { min-height:67px; padding:12px; border:1px solid #dde3de; border-radius:10px; background:#fff; }.quick-actions b { display:block; font-size:9px; }.quick-actions span { display:block; margin-top:5px; color:#79837c; font-size:7px; }
.calendar-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:7px; }.calendar-day { min-height:128px; padding:9px; border:1px solid #dde3de; border-radius:9px; background:#fff; }.calendar-day > b { font-size:7px; color:#657069; }.calendar-post { margin-top:8px; padding:7px; border-left:2px solid #72cf5b; border-radius:4px; background:#eef5ec; font-size:6px; }.calendar-post.video { border-left-color:#111820; background:#edf0f2; }.calendar-post.ads { border-left-color:#e0ac3e; background:#fff5dd; }.media-bottom { display:grid; grid-template-columns:1fr .65fr; gap:10px; margin-top:10px; }.content-item { grid-template-columns:24px 1fr auto; }.content-thumb { width:24px; height:24px; border-radius:6px; background:linear-gradient(145deg,#161f25,#72cf5b); }

.phase-one { padding: 130px 0; }
.phase-layout { display: grid; grid-template-columns: .75fr 1.25fr; gap: 92px; align-items: start; }
.phase-sticky { position: sticky; top: 120px; }
.phase-sticky h2 { margin: 12px 0 20px; font-size: clamp(44px,5vw,70px); line-height: .96; letter-spacing: -.06em; }
.phase-sticky > p { max-width: 430px; color: var(--muted); line-height: 1.75; }
.phase-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin-top: 42px; background: var(--line); border: 1px solid var(--line); }
.phase-summary div { padding: 18px 12px; background: #fff; }.phase-summary b { display:block; margin-bottom:9px; color:var(--green-deep); font-size:11px; }.phase-summary span { font-size:10px; line-height:1.35; }
.deliverables-list { border-top: 1px solid var(--line); }
.deliverable { position: relative; display: grid; grid-template-columns: 58px 1fr auto; gap: 26px; padding: 42px 0; border-bottom: 1px solid var(--line); }
.deliverable-number { color: var(--green-deep); font-size: 12px; font-weight: 900; }
.deliverable-body h3 { margin: 0 0 12px; font-size: 25px; letter-spacing: -.025em; }
.deliverable-body > p { max-width: 570px; margin: 0; color: var(--muted); line-height: 1.65; }
.deliverable-body ul { display:grid; grid-template-columns:1fr 1fr; gap:7px 20px; padding:0; margin:24px 0 0; list-style:none; }.deliverable-body li { position:relative; padding-left:14px; color:#4f595f; font-size:11px; }.deliverable-body li::before { content:""; position:absolute; left:0; top:5px; width:5px; height:5px; border-radius:50%; background:var(--green); }
.status-chip { align-self: start; padding: 6px 9px; border: 1px solid rgba(46,122,51,.25); border-radius: 999px; color: var(--green-deep); font-size: 8px; font-weight: 900; letter-spacing: .1em; }

.roadmap-nav { display: grid; grid-template-columns: repeat(4,1fr); margin-bottom: 20px; border-bottom: 1px solid var(--line); }
.roadmap-button { padding: 0 18px 22px; border: 0; border-bottom: 3px solid transparent; background: transparent; text-align: left; cursor: pointer; }.roadmap-button span { display:block; margin-bottom:7px; color:#8a958e; font-size:9px; text-transform:uppercase; letter-spacing:.1em; }.roadmap-button b { font-size:14px; }.roadmap-button.is-active { border-bottom-color:var(--green-deep); }.roadmap-button.is-active span { color:var(--green-deep); }
.roadmap-detail { display: grid; grid-template-columns: .9fr 1.1fr; min-height: 370px; border: 1px solid var(--line); border-radius: 24px; overflow:hidden; background:#fff; }
.roadmap-overview { padding: 45px; background: var(--ink); color:#fff; }.roadmap-overview small { color:var(--green); font-weight:850; letter-spacing:.14em; }.roadmap-overview h3 { margin:18px 0; font-size:38px; line-height:1; letter-spacing:-.045em; }.roadmap-overview p { color:#8e99a1; line-height:1.65; }.roadmap-overview .roadmap-result { margin-top:30px; padding-top:20px; border-top:1px solid var(--line-dark); }.roadmap-result span { display:block; color:#6f7a83; font-size:8px; text-transform:uppercase; }.roadmap-result b { display:block; margin-top:6px; font-size:15px; }
.roadmap-tasks { padding: 38px 42px; }.roadmap-tasks h4 { margin:0 0 18px; font-size:13px; text-transform:uppercase; letter-spacing:.1em; }.roadmap-task-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.roadmap-task { min-height:75px; padding:14px; border:1px solid var(--line); border-radius:10px; }.roadmap-task b { display:block; margin-bottom:5px; font-size:11px; }.roadmap-task span { color:var(--muted); font-size:8px; line-height:1.45; }

.capability-grid { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.capability { min-height: 320px; padding: 34px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.capability-icon { width: 45px; height: 45px; display:grid; place-items:center; margin-bottom:28px; border:1px solid rgba(46,122,51,.25); color:var(--green-deep); font-size:13px; font-weight:900; }
.capability h3 { margin:0 0 12px; font-size:23px; }.capability > p { min-height:70px; margin:0; color:var(--muted); line-height:1.6; font-size:13px; }
.detail-toggle { width:100%; display:flex; justify-content:space-between; padding:15px 0 0; margin-top:24px; border:0; border-top:1px solid var(--line); background:transparent; font-size:11px; font-weight:800; cursor:pointer; }.detail-toggle span { color:var(--green-deep); font-size:18px; transition:transform .2s; }.detail-toggle[aria-expanded="true"] span { transform:rotate(45deg); }
.detail-panel { display:grid; grid-template-rows:0fr; transition:grid-template-rows .25s ease; }.detail-panel > ul { overflow:hidden; list-style:none; padding:0; margin:0; }.detail-panel li { position:relative; padding:7px 0 0 14px; color:#566057; font-size:10px; }.detail-panel li::before { content:""; position:absolute; left:0; top:12px; width:5px; height:5px; border-radius:50%; background:var(--green); }.detail-toggle[aria-expanded="true"] + .detail-panel { grid-template-rows:1fr; }.detail-toggle[aria-expanded="true"] + .detail-panel ul { padding-top:12px; }

.timeline-section { padding: 120px 0; }
.timeline-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; align-items:start; }
.timeline-copy { position:sticky; top:120px; }.timeline-copy p { max-width:440px; color:#919da5; line-height:1.7; }
.delivery-pill { display:inline-flex; flex-direction:column; margin-top:26px; padding:14px 18px; border-left:3px solid var(--green); background:#0d141b; }.delivery-pill span { color:#69767f; font-size:8px; text-transform:uppercase; letter-spacing:.12em; }.delivery-pill b { margin-top:5px; font-size:14px; }
.timeline-list { padding:0; margin:0; list-style:none; border-top:1px solid var(--line-dark); }.timeline-list li { display:grid; grid-template-columns:45px 1fr auto; gap:18px; align-items:center; padding:29px 0; border-bottom:1px solid var(--line-dark); }.timeline-list > li > span { color:var(--green); font-size:10px; font-weight:900; }.timeline-list b { display:block; font-size:16px; }.timeline-list small { display:block; margin-top:6px; color:#7e8a92; }.timeline-list em { color:#aab4bb; font-size:10px; font-style:normal; }

.pricing-heading { max-width: 800px; margin-bottom: 45px; }.pricing-heading > p { max-width:680px; color:var(--muted); line-height:1.7; }
.pricing-switch { width:max-content; display:flex; margin-bottom:22px; padding:5px; border:1px solid var(--line); border-radius:999px; background:#fff; }.pricing-switch-button { padding:12px 17px; border:0; border-radius:999px; background:transparent; color:#67716a; font-size:11px; font-weight:800; cursor:pointer; }.pricing-switch-button span { margin-left:7px; padding:3px 6px; border-radius:99px; background:#dff2da; color:#367f31; font-size:7px; }.pricing-switch-button.is-active { color:#fff; background:var(--ink); }
.pricing-card { display:grid; grid-template-columns:.8fr 1.2fr; min-height:430px; border:1px solid var(--line); border-radius:24px; overflow:hidden; background:#fff; box-shadow:var(--shadow); }
.pricing-primary { position:relative; padding:46px; color:#fff; background:var(--ink); }.pricing-primary::after { content:""; position:absolute; right:-90px; bottom:-100px; width:300px; height:300px; border-radius:50%; background:radial-gradient(circle,rgba(114,207,91,.18),transparent 65%); }.pricing-tag { display:inline-block; padding:6px 9px; border:1px solid rgba(114,207,91,.35); border-radius:99px; color:var(--green); font-size:8px; font-weight:900; letter-spacing:.1em; }.pricing-primary h3 { margin:24px 0 12px; font-size:32px; letter-spacing:-.04em; }.pricing-primary > p { color:#8f9aa2; line-height:1.6; }.pricing-value { margin-top:36px; }.pricing-value small { display:block; color:#70808a; font-size:9px; text-transform:uppercase; }.pricing-value b { display:block; margin-top:5px; font-size:48px; letter-spacing:-.05em; }.pricing-value span { color:#9faab1; font-size:10px; }.pricing-payment { position:relative; z-index:2; margin-top:28px; padding-top:18px; border-top:1px solid var(--line-dark); color:#aab4bb; font-size:9px; line-height:1.5; }
.client-infrastructure { position:relative; z-index:2; margin-top:24px; padding:18px; border:1px solid #5c4730; border-radius:13px; background:#18140f; }.client-infrastructure.is-included { border-color:#466d3c; background:#101a10; }.client-infrastructure>span { color:#efb866; font-size:7px; font-weight:900; letter-spacing:.12em; }.client-infrastructure.is-included>span { color:var(--green); }.client-infrastructure h4 { margin:7px 0; font-size:14px; }.client-infrastructure>p { margin:0; color:#a7b0aa; font-size:8px; line-height:1.55; }.client-infrastructure>strong { display:block; margin-top:12px; color:var(--green); font-size:10px; }.infra-columns { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px; }.infra-columns>div { display:grid; gap:5px; }.infra-columns small { color:#7f8b83; font-size:7px; font-weight:900; text-transform:uppercase; }.infra-columns i { color:#c4ccc7; font-size:7px; font-style:normal; line-height:1.4; }.client-infrastructure>em { display:block; margin-top:13px; padding-top:11px; border-top:1px solid #2b352d; color:#8f9a93; font-size:7px; font-style:normal; line-height:1.5; }
.pricing-features { padding:46px; }.pricing-features h4 { margin:0 0 22px; font-size:13px; text-transform:uppercase; letter-spacing:.1em; }.pricing-feature-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px 28px; }.pricing-feature { display:flex; gap:10px; color:#475149; font-size:11px; line-height:1.45; }.pricing-feature i { flex:0 0 18px; width:18px; height:18px; display:grid; place-items:center; border-radius:50%; background:#e9f5e6; color:#367f31; font-style:normal; font-weight:900; }
.pricing-phases { display:grid; gap:16px; }.pricing-phases>h4 { margin-bottom:2px; }.client-phase { padding:20px; border:1px solid var(--line); border-radius:14px; background:#fff; }.client-phase header>span { color:var(--green-deep); font-size:8px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }.client-phase h5 { margin:6px 0; font-size:16px; }.client-phase header p { margin:0 0 16px; color:var(--muted); font-size:9px; line-height:1.55; }.client-phase-prices { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }.client-phase-prices>div { padding:11px; border-radius:9px; background:var(--mist); }.client-phase-prices small,.client-phase-prices b,.client-phase-prices span { display:block; }.client-phase-prices small { color:#7d8780; font-size:7px; text-transform:uppercase; }.client-phase-prices b { margin-top:4px; font-size:15px; }.client-phase-prices span { color:#7d8780; font-size:7px; }.client-phase-payment { display:grid; gap:4px; margin:12px 0; padding:11px 13px; border-left:3px solid var(--green); background:#f4f8f3; }.client-phase-payment b { font-size:9px; }.client-phase-payment span { color:#68736b; font-size:8px; }
.pricing-addons { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:30px; padding-top:24px; border-top:1px solid var(--line); }.pricing-addon { padding:15px; border:1px solid var(--line); border-radius:10px; }.pricing-addon small { display:block; color:#7b857e; font-size:8px; }.pricing-addon b { display:block; margin-top:6px; font-size:15px; }.pricing-addon span { color:#7b857e; font-size:8px; }
.pricing-notes { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; margin-top:34px; }.pricing-notes b { font-size:12px; }.pricing-notes p { color:var(--muted); font-size:10px; line-height:1.55; }

.why-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:100px; align-items:center; }.why-quote { position:relative; padding:70px 55px 55px; background:var(--ink); color:#fff; }.quote-mark { position:absolute; top:12px; left:42px; color:var(--green); font-family:Georgia,serif; font-size:92px; line-height:1; }.why-quote blockquote { margin:0; font-size:clamp(27px,3.2vw,43px); line-height:1.18; letter-spacing:-.035em; }.why-list { margin-top:38px; border-top:1px solid var(--line); }.why-list > div { display:grid; grid-template-columns:40px 1fr; gap:15px; padding:20px 0; border-bottom:1px solid var(--line); }.why-list span { color:var(--green-deep); font-size:9px; font-weight:900; }.why-list p { margin:0; color:var(--muted); line-height:1.6; font-size:12px; }.why-list b { color:var(--text); }

.terms-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.terms-grid details { border:1px solid var(--line); background:#fff; }.terms-grid summary { padding:22px; font-weight:800; font-size:13px; cursor:pointer; list-style:none; }.terms-grid summary::-webkit-details-marker { display:none; }.terms-grid summary::after { content:"+"; float:right; color:var(--green-deep); font-size:18px; }.terms-grid details[open] summary::after { content:"−"; }.terms-grid details div { padding:0 22px 18px; color:var(--muted); font-size:11px; line-height:1.6; }

.decision-section { padding:120px 0; }.decision-glow { position:absolute; width:600px; height:600px; right:-120px; top:-180px; border-radius:50%; background:radial-gradient(circle,rgba(114,207,91,.16),transparent 65%); }.decision-layout { position:relative; display:grid; grid-template-columns:1.2fr .8fr; gap:100px; align-items:center; }.decision-layout > div:first-child h2 { max-width:760px; margin:15px 0 20px; font-size:clamp(50px,6vw,82px); line-height:.96; letter-spacing:-.06em; }.decision-layout > div:first-child p { max-width:620px; color:#8e99a1; line-height:1.7; }.decision-card { padding:34px; border:1px solid var(--line-dark); border-radius:20px; background:#0e151c; box-shadow:0 30px 80px rgba(0,0,0,.3); }.decision-card > span { color:var(--green); font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:.13em; }.decision-card h3 { margin:13px 0 25px; font-size:25px; line-height:1.1; }.decision-price b { display:block; font-size:45px; letter-spacing:-.05em; }.decision-price small { color:#72808a; }.decision-card > p { color:#9ba6ad; font-size:11px; }.text-button { width:100%; margin-top:18px; border:0; background:transparent; color:#aab4bb; font-size:10px; cursor:pointer; }

.site-footer { padding:40px 0; color:#98a3aa; background:#030509; border-top:1px solid rgba(255,255,255,.07); }.footer-grid { display:grid; grid-template-columns:1.35fr 1fr 1fr 1fr; gap:50px; align-items:start; }.footer-grid img { width:145px; height:42px; object-fit:contain; object-position:left; }.footer-grid p { max-width:280px; margin:12px 0 0; font-size:10px; }.footer-grid > div > span { display:block; color:#5f6b73; font-size:8px; text-transform:uppercase; letter-spacing:.12em; }.footer-grid b { display:block; margin-top:7px; color:#e0e5e8; font-size:12px; }.footer-grid small { display:block; margin-top:5px; font-size:8px; }.footer-actions { display:flex; flex-direction:column; align-items:flex-start; gap:10px; }.footer-actions button, .footer-actions a { padding:0; border:0; background:transparent; color:#b9c2c8; font-size:10px; cursor:pointer; }
.toast { position:fixed; z-index:1000; right:22px; bottom:22px; padding:13px 18px; border-radius:10px; color:var(--ink); background:var(--green); font-size:12px; font-weight:800; opacity:0; transform:translateY(12px); pointer-events:none; transition:.25s ease; }.toast.is-visible { opacity:1; transform:none; }

.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; transition-delay:var(--delay,0ms); }.reveal.is-visible { opacity:1; transform:none; }

@media (max-width: 1050px) {
  .desktop-nav { display:none; }
  .hero-layout, .section-heading, .phase-layout, .timeline-layout, .why-layout, .decision-layout { grid-template-columns:1fr; }
  .hero { min-height:0; }.hero-stage { margin-top:70px; }.hero-copy { max-width:800px; }
  .product-showcase { grid-template-columns:1fr; }.product-description { border-right:0; border-bottom:1px solid var(--line-dark); }.product-description ul { display:grid; grid-template-columns:1fr 1fr; gap:0 25px; }
  .phase-sticky, .timeline-copy { position:static; }.phase-layout, .timeline-layout { gap:65px; }
  .capability-grid { grid-template-columns:1fr 1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .decision-layout { gap:60px; }.decision-card { max-width:520px; }
}

@media (max-width: 760px) {
  :root { --shell: min(100% - 28px, 1180px); }
  .site-header { inset:0 0 auto; }.header-inner { min-height:62px; }.brand img { width:118px; }.icon-button,.header-proposal-button { display:none; }.button-small { min-height:36px; padding:0 13px; }
  .hero { padding:120px 0 70px; }.hero-copy h1 { font-size:50px; }.hero-lead { font-size:15px; }.hero-meta { grid-template-columns:1fr; }.hero-meta div { padding:14px 0; border-bottom:1px solid rgba(255,255,255,.07); }
  .browser-frame { transform:none; }.site-demo-hero { min-height:450px; padding:16px; }.demo-nav span { display:none; }.demo-nav { grid-template-columns:1fr auto; }.demo-copy { width:86%; margin-top:48px; }.demo-copy h2 { font-size:30px; }.car-visual { width:115%; right:-35%; bottom:55px; }.floating-card { display:none; }.proposal-stamp { top:-42px; }
  .context-band, .ecosystem-section, .product-section, .roadmap-section, .operations-section, .pricing-section, .why-section, .terms-section, .phase-one { padding:78px 0; }
  .context-grid { grid-template-columns:1fr; gap:20px; }.section-index { display:none; }.context-grid h2, .section-heading h2, .pricing-heading h2, .why-points h2, .timeline-copy h2 { font-size:40px; }
  .section-heading { gap:20px; margin-bottom:45px; }
  .ecosystem-map { min-height:760px; }.eco-core { width:140px; height:140px; }.node-site,.node-crm,.node-partner,.node-media { left:20px; right:20px; width:auto; }.node-site{top:20px}.node-crm{top:165px}.node-partner{top:auto;bottom:165px}.node-media{bottom:20px}.eco-lines{display:none}
  .product-tabs { display:flex; overflow:auto; gap:6px; padding-bottom:8px; border:0; }.product-tab { flex:0 0 auto; padding:12px 14px; border:1px solid var(--line-dark); border-radius:99px; font-size:10px; }.product-tab.is-active { border-color:var(--green); }.product-showcase { min-height:0; }.screen-shell { padding:8px; }.screen-content { min-height:470px; padding:10px; }.product-description { padding:28px 22px; }.product-description ul { grid-template-columns:1fr; }
  .demo-stat-grid { grid-template-columns:1fr 1fr; }.demo-main-grid,.partner-top,.media-bottom { grid-template-columns:1fr; }.calendar-grid { grid-template-columns:1fr 1fr; }.calendar-day { min-height:100px; }.mini-site-hero h4 { width:80%; font-size:25px; }.mini-site-hero p { width:65%; }.mini-car { opacity:.6; right:-20%; }
  .phase-layout { gap:45px; }.phase-summary { grid-template-columns:1fr; }.deliverable { grid-template-columns:34px 1fr; gap:12px; }.status-chip { display:none; }.deliverable-body ul { grid-template-columns:1fr; }
  .roadmap-nav { display:flex; overflow:auto; gap:8px; border:0; }.roadmap-button { flex:0 0 155px; padding:13px; border:1px solid var(--line); border-radius:10px; }.roadmap-button.is-active { border-color:var(--green-deep); }.roadmap-detail { grid-template-columns:1fr; }.roadmap-overview,.roadmap-tasks { padding:28px 22px; }.roadmap-task-grid { grid-template-columns:1fr; }
  .capability-grid { grid-template-columns:1fr; }.capability { min-height:0; padding:28px 24px; }
  .timeline-section { padding:78px 0; }.timeline-layout { gap:45px; }.timeline-list li { grid-template-columns:32px 1fr; }.timeline-list em { grid-column:2; }
  .pricing-switch { width:100%; }.pricing-switch-button { flex:1; padding:10px; }.pricing-switch-button span { display:none; }.pricing-card { grid-template-columns:1fr; }.pricing-primary,.pricing-features { padding:30px 24px; }.pricing-feature-grid,.pricing-addons,.pricing-notes,.infra-columns { grid-template-columns:1fr; }
  .why-layout { gap:50px; }.why-quote { padding:65px 28px 35px; }.why-quote blockquote { font-size:28px; }.terms-grid { grid-template-columns:1fr; }
  .decision-section { padding:78px 0; }.decision-layout > div:first-child h2 { font-size:49px; }.decision-card { padding:26px 22px; }
  .footer-grid { grid-template-columns:1fr; gap:28px; }
}

@media print {
  .site-header, .scroll-progress, .hero-actions, .product-tabs, .pricing-switch, .decision-card .button, .decision-card .text-button, .footer-actions, .toast { display:none !important; }
  .hero { min-height:auto; padding-top:60px; }.section-dark { print-color-adjust:exact; -webkit-print-color-adjust:exact; }.reveal { opacity:1!important; transform:none!important; }
  section { break-inside:avoid; }.ecosystem-section,.product-section,.roadmap-section,.operations-section,.pricing-section,.why-section,.terms-section,.phase-one { padding:55px 0; }
}

/* =========================================================
   PLANNER DE IMPLANTAÇÃO
   ========================================================= */
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.planner-section { padding:125px 0; overflow:hidden; }
.planner-heading { display:grid; grid-template-columns:1.15fr .85fr; gap:90px; align-items:end; margin-bottom:48px; }
.planner-heading h2 { max-width:760px; margin:10px 0 0; font-size:clamp(42px,5.5vw,72px); line-height:.98; letter-spacing:-.06em; }
.planner-heading-copy > p { margin:0; color:var(--muted); font-size:15px; line-height:1.75; }
.planner-version { display:flex; align-items:center; gap:12px; margin-top:22px; color:#758078; font-size:10px; }
.planner-version > span { padding:8px 11px; border-radius:999px; color:var(--green-deep); background:#e8f4e5; font-weight:850; text-transform:uppercase; letter-spacing:.08em; }
.planner-version b { color:var(--text); }
.planner-version small { margin-left:auto; }

.planner-summary { display:grid; grid-template-columns:repeat(5,1fr); border:1px solid var(--line); border-radius:18px 18px 0 0; background:#fff; }
.planner-summary article { min-height:132px; padding:25px 22px; display:flex; flex-direction:column; justify-content:flex-end; border-right:1px solid var(--line); }
.planner-summary article:last-child { border-right:0; }
.planner-summary article > span { margin-bottom:auto; color:#768079; font-size:9px; font-weight:850; text-transform:uppercase; letter-spacing:.12em; }
.planner-summary article b { font-size:38px; line-height:1; letter-spacing:-.05em; }
.planner-summary article small { margin-top:7px; color:#7d8780; font-size:9px; line-height:1.4; }
.planner-summary .planner-effort { color:#fff; background:var(--ink); }
.planner-summary .planner-effort > span,.planner-summary .planner-effort small { color:#91a099; }
.planner-summary .planner-effort b { color:var(--green); }

.planner-console { border:1px solid var(--line); border-top:0; border-radius:0 0 20px 20px; background:#f8faf8; box-shadow:0 30px 90px rgba(8,18,12,.08); }
.planner-toolbar { padding:18px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); background:#fff; }
.planner-scope-filter,.planner-view-switch { display:flex; gap:5px; padding:4px; border-radius:11px; background:var(--mist); }
.planner-scope-filter button,.planner-view-switch button { min-height:34px; padding:0 13px; border:0; border-radius:8px; background:transparent; color:#69736c; font-size:10px; font-weight:800; cursor:pointer; transition:.2s ease; }
.planner-scope-filter button.is-active,.planner-view-switch button.is-active { color:var(--text); background:#fff; box-shadow:0 4px 16px rgba(5,8,13,.08); }
.planner-tools { display:flex; align-items:center; gap:8px; }
.planner-search { width:min(310px,25vw); min-height:38px; display:flex; align-items:center; gap:8px; padding:0 12px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.planner-search svg { width:15px; height:15px; fill:none; stroke:#819087; stroke-width:1.8; }
.planner-search input { width:100%; border:0; outline:0; background:transparent; color:var(--text); font-size:10px; }
.planner-tools select,.planner-export { min-height:38px; padding:0 11px; border:1px solid var(--line); border-radius:10px; color:#4f5a53; background:#fff; font-size:10px; outline:0; }
.planner-export { color:var(--ink); background:var(--green); border-color:var(--green); font-weight:850; cursor:pointer; }
.planner-export:hover { background:var(--green-bright); }

.planner-viewbar { min-height:62px; padding:12px 18px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); }
.planner-result-count { color:#758079; font-size:10px; font-weight:750; }
.planner-view { min-height:360px; }
.planner-view[hidden] { display:none!important; }

.planner-timeline-scroll { overflow-x:auto; padding:26px 18px 12px; }
.planner-week-axis-row,.planner-timeline-row { min-width:1260px; display:grid; grid-template-columns:240px 1fr; gap:18px; }
.planner-week-axis-row { align-items:end; padding-bottom:12px; }
.planner-axis-spacer { color:#849087; font-size:9px; font-weight:850; text-transform:uppercase; letter-spacing:.1em; }
.planner-week-axis,.planner-track { display:grid; grid-template-columns:repeat(var(--planner-weeks),minmax(28px,1fr)); position:relative; }
.planner-week-axis i { padding-bottom:5px; border-left:1px solid rgba(10,15,22,.07); color:#8a958e; font-size:7px; font-style:normal; text-align:center; }
.planner-timeline-rows { display:grid; gap:8px; }
.planner-timeline-row { width:100%; padding:0; border:0; background:transparent; text-align:left; cursor:pointer; }
.planner-phase-label { min-height:70px; display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:11px; background:#fff; }
.planner-phase-label > i { width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center; border-radius:9px; color:var(--green-deep); background:#edf5eb; font-size:10px; font-style:normal; font-weight:900; }
.planner-phase-label b,.planner-phase-label small { display:block; }
.planner-phase-label b { font-size:11px; }
.planner-phase-label small { margin-top:5px; color:#879189; font-size:8px; }
.planner-track { min-height:70px; align-items:center; background-image:linear-gradient(90deg,rgba(10,15,22,.065) 1px,transparent 1px); background-size:calc(100% / var(--planner-weeks)) 100%; border-radius:9px; }
.planner-phase-bar { position:relative; z-index:2; min-height:44px; padding:8px 13px; display:flex; align-items:center; justify-content:space-between; gap:12px; overflow:hidden; border-radius:9px; color:var(--ink); box-shadow:0 9px 24px rgba(25,60,31,.10); }
.planner-phase-bar::after { content:""; position:absolute; inset:0; opacity:.22; background-image:linear-gradient(120deg,transparent 0 35%,rgba(255,255,255,.8) 35% 40%,transparent 40%); background-size:190px 100%; }
.planner-phase-bar.is-initial { background:linear-gradient(90deg,var(--green),#9be67f); }
.planner-phase-bar.is-future { color:#dce4df; background:linear-gradient(90deg,#1d2931,#35424b); }
.planner-phase-bar b,.planner-phase-bar small { position:relative; z-index:1; white-space:nowrap; }
.planner-phase-bar b { font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.planner-phase-bar small { max-width:62%; overflow:hidden; text-overflow:ellipsis; font-size:8px; }
.planner-milestone-dot { z-index:3; width:13px; height:13px; align-self:start; justify-self:end; margin-top:5px; border:3px solid #fff; background:var(--green-deep); transform:translateX(50%) rotate(45deg); box-shadow:0 3px 10px rgba(0,0,0,.2); }
.planner-milestone-dot span { display:none; }
.planner-timeline-row:hover .planner-phase-label { border-color:rgba(46,122,51,.45); }
.planner-timeline-row:hover .planner-phase-bar { filter:brightness(1.04); }
.planner-timeline-legend { padding:16px 18px 22px; display:flex; align-items:center; gap:22px; color:#657069; font-size:9px; }
.planner-timeline-legend > span { display:flex; align-items:center; gap:7px; }
.planner-timeline-legend i { width:20px; height:7px; border-radius:99px; }
.legend-initial { background:var(--green); }.legend-future { background:#2f3c45; }.legend-milestone { width:9px!important; height:9px!important; border-radius:1px!important; background:var(--green-deep); transform:rotate(45deg); }
.planner-timeline-legend small { margin-left:auto; color:#8a958e; }

.planner-phase-block { padding:30px 28px; border-bottom:1px solid var(--line); }
.planner-phase-block:last-child { border-bottom:0; }
.planner-phase-header { display:flex; align-items:flex-start; justify-content:space-between; gap:30px; margin-bottom:18px; }
.planner-phase-header > div:first-child { display:flex; gap:16px; }
.planner-phase-header > div:first-child > span { width:44px; height:44px; flex:0 0 44px; display:grid; place-items:center; border-radius:12px; color:var(--ink); background:var(--green); font-size:11px; font-weight:900; }
.planner-phase-header small { color:var(--green-deep); font-size:8px; font-weight:900; text-transform:uppercase; letter-spacing:.1em; }
.planner-phase-header h3 { margin:5px 0 7px; font-size:22px; letter-spacing:-.03em; }
.planner-phase-header p { max-width:690px; margin:0; color:var(--muted); font-size:10px; line-height:1.55; }
.planner-phase-stats { display:flex; gap:9px; flex-wrap:wrap; justify-content:flex-end; }
.planner-phase-stats span { padding:8px 10px; border:1px solid var(--line); border-radius:9px; color:#7d8780; background:#fff; font-size:8px; white-space:nowrap; }
.planner-phase-stats b { color:var(--text); }
.planner-phase-milestone { margin-bottom:12px; padding:11px 14px; display:flex; justify-content:space-between; gap:20px; border-left:3px solid var(--green); color:#58645d; background:#eef4ed; font-size:9px; }
.planner-phase-milestone span { text-transform:uppercase; letter-spacing:.08em; font-weight:900; }
.planner-phase-milestone b { color:var(--text); }
.planner-task-list { display:grid; gap:7px; }
.planner-task-card { border:1px solid var(--line); border-radius:11px; background:#fff; }
.planner-task-card summary { min-height:68px; padding:11px 13px; display:grid; grid-template-columns:58px minmax(260px,1fr) auto 42px 22px; gap:12px; align-items:center; cursor:pointer; list-style:none; }
.planner-task-card summary::-webkit-details-marker { display:none; }
.planner-task-code { color:var(--green-deep); font-size:9px; font-weight:900; letter-spacing:.05em; }
.planner-task-main b,.planner-task-main small { display:block; }
.planner-task-main b { font-size:11px; }
.planner-task-main small { margin-top:4px; color:#7d8780; font-size:8px; line-height:1.45; }
.planner-task-badges { display:flex; align-items:center; gap:5px; }
.planner-task-badges i { padding:5px 7px; border-radius:99px; font-size:7px; font-style:normal; font-weight:900; white-space:nowrap; text-transform:uppercase; letter-spacing:.05em; }
.task-scope.initial { color:#2d7132; background:#e7f4e4; }.task-scope.future { color:#5c6870; background:#e9edef; }
.task-status.planned { color:#47544c; background:#edf0ee; }.task-status.backlog { color:#5f6970; background:#e9edef; }.task-status.in_progress { color:#805f0d; background:#fff3d6; }.task-status.review { color:#305a84; background:#e4f1ff; }.task-status.blocked { color:#9c3535; background:#ffe7e7; }.task-status.done { color:#246c2b; background:#e3f5e0; }
.planner-task-time { color:#66716a; font-size:9px; font-weight:800; text-align:right; }
.planner-task-chevron { color:var(--green-deep); font-size:17px; text-align:center; transition:.2s ease; }
.planner-task-card[open] { border-color:rgba(46,122,51,.34); box-shadow:0 12px 35px rgba(8,18,12,.06); }
.planner-task-card[open] .planner-task-chevron { transform:rotate(45deg); }
.planner-task-detail { padding:0 14px 16px 83px; }
.planner-task-meta { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.planner-task-meta span { padding:10px; border-radius:8px; background:var(--mist); }
.planner-task-meta small,.planner-task-meta b { display:block; }
.planner-task-meta small,.planner-task-contract small,.planner-dependencies > small { color:#7d8780; font-size:7px; font-weight:900; text-transform:uppercase; letter-spacing:.09em; }
.planner-task-meta b { margin-top:4px; font-size:9px; }
.planner-task-contract { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:10px; }
.planner-task-contract > div { padding:12px; border:1px solid var(--line); border-radius:9px; }
.planner-task-contract p { margin:6px 0 0; color:#535e57; font-size:9px; line-height:1.55; }
.planner-dependencies { margin-top:10px; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.planner-dependencies > small { margin-right:4px; }
.planner-dependencies span { padding:5px 7px; border-radius:6px; color:#59645d; background:#eef1ef; font-size:7px; }

.planner-milestones-layout { display:grid; grid-template-columns:1.05fr .95fr; gap:0; }
.planner-milestones-list { padding:30px 28px; border-right:1px solid var(--line); }
.planner-milestone-card { display:grid; grid-template-columns:54px 1fr; gap:14px; }
.planner-milestone-index { position:relative; display:flex; flex-direction:column; align-items:center; }
.planner-milestone-index span { width:38px; height:38px; display:grid; place-items:center; border-radius:50%; color:var(--ink); background:var(--green); font-size:9px; font-weight:900; }
.planner-milestone-index i { width:1px; min-height:92px; flex:1; background:linear-gradient(var(--green),var(--line)); }
.planner-milestone-card:last-child .planner-milestone-index i { display:none; }
.planner-milestone-card > div:last-child { padding:3px 0 26px; }
.planner-milestone-card small { color:var(--green-deep); font-size:8px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.planner-milestone-card h3 { margin:6px 0; font-size:18px; }
.planner-milestone-card p { margin:0; color:var(--muted); font-size:9px; line-height:1.5; }
.milestone-gate { margin-top:11px; padding:9px 11px; display:flex; align-items:center; justify-content:space-between; gap:12px; border-radius:8px; background:var(--mist); font-size:8px; }
.milestone-gate span { color:#7c877f; }.milestone-gate b { color:#38433c; text-align:right; }
.planner-dependency-map { padding:36px 28px; background:#f1f4f1; }
.planner-dependency-map > h3 { margin:0 0 22px; font-size:25px; line-height:1.15; letter-spacing:-.035em; }
.planner-dependency-card { display:grid; grid-template-columns:36px 1fr; gap:12px; padding:15px 0; border-top:1px solid var(--line); }
.planner-dependency-card > span { width:32px; height:32px; display:grid; place-items:center; border-radius:8px; color:var(--green-deep); background:#e1eddf; font-size:8px; font-weight:900; }
.planner-dependency-card small { color:#7b867e; font-size:7px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.planner-dependency-card h4 { margin:4px 0; font-size:12px; }
.planner-dependency-card p { margin:0 0 8px; color:#707b73; font-size:8px; }
.planner-dependency-card div div { display:flex; flex-wrap:wrap; gap:4px; }
.planner-dependency-card i { padding:5px 6px; border-radius:5px; color:#5d685f; background:#fff; font-size:7px; font-style:normal; }

.planner-empty { min-height:350px; display:grid; place-items:center; align-content:center; text-align:center; }
.planner-empty b { font-size:18px; }.planner-empty p { margin:7px 0 14px; color:var(--muted); font-size:10px; }.planner-empty button { padding:9px 13px; border:0; border-radius:99px; color:var(--ink); background:var(--green); font-size:9px; font-weight:900; cursor:pointer; }
.planner-note { margin-top:18px; padding:22px 25px; display:grid; grid-template-columns:220px 1fr; gap:30px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.planner-note > span { color:var(--green-deep); font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:.1em; }
.planner-note p { margin:0; color:var(--muted); font-size:10px; line-height:1.65; }
.planner-note b { color:var(--text); }

@media (max-width:1050px) {
  .planner-heading { grid-template-columns:1fr; gap:25px; }
  .planner-summary { grid-template-columns:repeat(3,1fr); }
  .planner-summary article:nth-child(3) { border-right:0; }
  .planner-summary article:nth-child(n+4) { border-top:1px solid var(--line); }
  .planner-summary .planner-effort { grid-column:span 2; }
  .planner-toolbar { align-items:stretch; flex-direction:column; }
  .planner-tools { flex-wrap:wrap; }
  .planner-search { width:100%; flex:1 1 100%; }
  .planner-milestones-layout { grid-template-columns:1fr; }
  .planner-milestones-list { border-right:0; border-bottom:1px solid var(--line); }
}

@media (max-width:760px) {
  .planner-section { padding:78px 0; }
  .planner-heading h2 { font-size:42px; }
  .planner-version { align-items:flex-start; flex-wrap:wrap; }
  .planner-version small { width:100%; margin-left:0; }
  .planner-summary { grid-template-columns:1fr 1fr; }
  .planner-summary article { min-height:112px; padding:18px 16px; }
  .planner-summary article:nth-child(2n) { border-right:0; }
  .planner-summary article:nth-child(n+3) { border-top:1px solid var(--line); }
  .planner-summary .planner-effort { grid-column:1 / -1; }
  .planner-scope-filter,.planner-view-switch { width:100%; overflow:auto; }
  .planner-scope-filter button,.planner-view-switch button { flex:0 0 auto; }
  .planner-tools select { flex:1 1 45%; min-width:0; }
  .planner-export { flex:1 1 100%; }
  .planner-viewbar { align-items:flex-start; flex-direction:column; }
  .planner-result-count { padding-left:5px; }
  .planner-week-axis-row,.planner-timeline-row { grid-template-columns:190px 1fr; min-width:1120px; }
  .planner-timeline-legend { align-items:flex-start; flex-wrap:wrap; }
  .planner-timeline-legend small { width:100%; margin-left:0; }
  .planner-phase-block { padding:24px 16px; }
  .planner-phase-header { flex-direction:column; }
  .planner-phase-stats { justify-content:flex-start; }
  .planner-phase-milestone { align-items:flex-start; flex-direction:column; gap:5px; }
  .planner-task-card summary { grid-template-columns:45px 1fr 30px 18px; gap:8px; }
  .planner-task-badges { grid-column:2 / -1; grid-row:2; }
  .planner-task-time { grid-column:3; grid-row:1; }
  .planner-task-chevron { grid-column:4; grid-row:1; }
  .planner-task-detail { padding:0 12px 14px; }
  .planner-task-meta,.planner-task-contract { grid-template-columns:1fr 1fr; }
  .planner-milestones-list,.planner-dependency-map { padding:24px 16px; }
  .planner-note { grid-template-columns:1fr; gap:8px; }
}

@media print {
  .planner-toolbar,.planner-viewbar,.planner-note { display:none!important; }
  .planner-section { padding:55px 0; }
  .planner-console { box-shadow:none; }
  #plannerTimelineView { display:block!important; }
  #plannerTasksView,#plannerMilestonesView { display:none!important; }
  .planner-timeline-scroll { overflow:visible; zoom:.76; }
}