/* Data-driven multi-page layer */
:root { --reading: 70ch; }
body { min-width: 320px; }
main { min-height: 72vh; padding-block-start: 76px; }
.site-header .nav { max-width: 1440px; }
.breadcrumb { display:flex; align-items:center; gap:10px; padding-block:24px; color:var(--muted); font-size:.86rem; overflow:auto; white-space:nowrap; }
.breadcrumb a:hover { color:var(--gold-text); }
.listing-hero { padding-block:70px 54px; text-align:center; }
.listing-hero h1 { margin:0; font-size:clamp(2.8rem,8vw,6.5rem); line-height:1.05; letter-spacing:-.055em; }
html[lang=ar] .listing-hero h1 { line-height:1.3; letter-spacing:0; }
.listing-hero p { max-width:720px; margin:18px auto 0; color:var(--muted); font-size:1.15rem; }
.module-glyph,.module-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:15px; background:linear-gradient(135deg,var(--gold-1),var(--gold-2)); color:var(--on-gold); font-weight:900; flex:0 0 auto; }
.module-glyph { width:30px;height:30px;border-radius:9px;font-size:.8rem; }
.module-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr)); gap:16px; }
.module-card { min-height:300px; padding:28px; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--surface) 70%,transparent)); display:flex; flex-direction:column; transition:.3s var(--ease); }
.module-card:hover { transform:translateY(-7px); border-color:var(--gold-3); box-shadow:var(--shadow); }
.module-card h2,.module-card h3 { margin:28px 0 8px;font-size:1.45rem; }
.module-card p { color:var(--muted);margin:0 0 22px; }
.module-card b { margin-block-start:auto;color:var(--gold-text); }
.site-footer { margin-block-start:100px; border-block-start:1px solid var(--line);padding-block:48px; }
.footer-grid { display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px; }
.footer-grid p { color:var(--muted); }
.footer-grid nav { display:flex;flex-wrap:wrap;gap:18px; }
.home-hero { min-height:calc(100vh - 76px); text-align:center; padding-block:90px 0; overflow:hidden; background:radial-gradient(circle at 50% 20%,var(--surface-2),transparent 55%); }
.home-hero h1 { max-width:1050px;margin:10px auto 20px;font-size:clamp(3rem,9vw,7.2rem);line-height:.98;letter-spacing:-.07em; }
html[lang=ar] .home-hero h1 { line-height:1.25;letter-spacing:0; }
.home-hero h1 span { display:block; }.home-hero h1 em { color:var(--gold-text);font-style:normal; }
.home-hero>div>p:not(.eyebrow) { max-width:780px;margin-inline:auto;color:var(--muted);font-size:1.18rem; }
.home-hero .screen-frame { max-width:1150px;margin:58px auto 0;padding:8px;border:1px solid var(--screen-edge);border-radius:24px;background:var(--surface);box-shadow:var(--shadow);transform:perspective(1300px) rotateX(5deg); }
.home-hero .screen-frame img { border-radius:17px; }
.map-section { overflow:hidden; }.system-map { max-width:1000px;text-align:center; }.system-map svg { width:100%;height:auto;overflow:visible; }
.map-edges line { stroke:var(--line-strong);stroke-width:2;stroke-dasharray:10 8;stroke-dashoffset:100;transition:.35s;animation:draw-map 2.4s var(--ease) forwards; }
.map-edges line.active { stroke:var(--gold-1);stroke-width:4;filter:drop-shadow(0 0 5px var(--gold-2)); }
.map-node { cursor:pointer;outline:none; }.map-node circle { fill:var(--surface);stroke:var(--line-strong);stroke-width:2;transition:.25s; }.map-node text,.map-core text { fill:var(--text);font:700 14px "IBM Plex Sans Arabic",sans-serif;pointer-events:none; }.map-node.active circle,.map-node:hover circle { fill:var(--gold-2);stroke:var(--gold-1); }.map-node.active text,.map-node:hover text { fill:var(--on-gold); }.map-core circle { fill:var(--surface-2);stroke:var(--gold-2);stroke-width:3; }.map-caption { min-height:2em;color:var(--gold-text);font-weight:700; }
@keyframes draw-map { to { stroke-dashoffset:0; } }
.number-bars { display:grid;gap:18px;max-width:880px; }.number-row { display:grid;grid-template-columns:minmax(110px,210px) 1fr;gap:14px;align-items:center; }.bar-value { width:calc(var(--bar) * 100%);min-width:54px;display:flex;align-items:center;gap:10px;transform:scaleX(0);transform-origin:inline-start;transition:1.2s var(--ease); }.number-row i { flex:1;display:block;height:18px;border-radius:20px;background:linear-gradient(90deg,var(--gold-2),var(--gold-1)); }.number-row.in .bar-value,.static .number-row .bar-value { transform:scaleX(1); }.number-row b { flex:0 0 auto;color:var(--gold-text); }
.flow-strip { display:grid;grid-template-columns:repeat(3,1fr);gap:16px; }.flow-mini { padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface); }.flow-mini>span { color:var(--gold-text);font-weight:800; }.flow-mini h3 { font-size:1.35rem;margin:28px 0 10px; }.flow-mini p { color:var(--muted); }
.video-section video { display:block;width:min(calc(100% - 32px),1100px);margin:auto;border-radius:24px;box-shadow:var(--shadow); }
.demo-panel { text-align:center;background:var(--surface);margin-block:70px 0; }.demo-panel h2 { font-size:clamp(2rem,6vw,5rem);margin:0; }.demo-panel p { color:var(--muted); }.demo-panel .button { margin-top:20px; }
.module-hero { padding-block:95px 70px;text-align:center;background:radial-gradient(circle at 50% 10%,var(--surface-2),transparent 64%); }.hero-icon { width:78px;height:78px;margin:0 auto 26px;font-size:1.7rem;border-radius:24px; }.module-hero h1 { font-size:clamp(3rem,9vw,7.5rem);line-height:1;margin:8px 0 24px;letter-spacing:-.065em; }.module-hero .lead { max-width:760px;margin:auto;color:var(--muted);font-size:1.24rem; }.module-stats { display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-block-start:45px; }.module-stats>div { min-width:170px;padding:24px;border:1px solid var(--line);background:var(--surface);border-radius:20px; }.module-stats strong { display:block;font-size:2.6rem;color:var(--gold-text);line-height:1.2; }.module-stats span { color:var(--muted);font-size:.9rem; }
.shot-rail { display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px max(16px,calc((100vw - var(--max))/2)) 34px;scrollbar-color:var(--gold-2) var(--surface); }.shot { flex:0 0 min(78vw,980px);scroll-snap-align:center;border:1px solid var(--line);border-radius:22px;padding:7px;background:var(--surface);box-shadow:var(--shadow); }.shot img { border-radius:15px;aspect-ratio:16/9;object-fit:cover;object-position:top; }
.feature-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:18px; }.feature-card { padding:30px;border:1px solid var(--line);border-radius:24px;background:var(--surface); }.feature-card:hover { border-color:var(--gold-3); }.feature-card h3 { margin:0 0 10px;font-size:1.4rem; }.feature-card p,.feature-card li { color:var(--muted); }.feature-card ul { padding-inline-start:20px;margin-block-end:0; }
.workflow-section { background:var(--surface); }.timeline { display:flex;overflow-x:auto;gap:0;padding-block:40px;scroll-snap-type:x mandatory; }.timeline-step { position:relative;flex:0 0 min(290px,80vw);padding:74px 20px 20px;scroll-snap-align:start;border-block-start:2px solid var(--line-strong); }.timeline-step::before { content:"";position:absolute;inset-block-start:-2px;inset-inline-start:0;width:0;height:2px;background:var(--gold-1);transition:1s var(--ease); }.timeline-step.in::before,.static .timeline-step::before { width:100%; }.timeline-step i { position:absolute;inset-block-start:-25px;inset-inline-start:15px;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:var(--bg);border:2px solid var(--gold-2);color:var(--gold-text);font-style:normal;font-weight:800; }.timeline-step p { color:var(--muted); }.timeline-step b { display:inline-block;padding:4px 10px;border-radius:20px;background:var(--gold-glow);color:var(--gold-text);font-size:.78rem; }
.lifecycle-grid { display:grid;gap:18px; }.lifecycle-card { padding:28px;border:1px solid var(--line);border-radius:24px;background:var(--surface);overflow:hidden; }.diagram-scroll { overflow-x:auto; }.lifecycle-card svg { min-width:560px;width:100%; }.lifecycle-card line { stroke:var(--gold-3);stroke-width:2; }.lifecycle-card marker path { fill:var(--gold-3); }.lifecycle-card circle { fill:var(--bg);stroke:var(--gold-2);stroke-width:2; }.lifecycle-card text { fill:var(--text);font-size:13px;font-weight:700; }.lifecycle-card>p { color:var(--muted); }
.integration-grid,.report-grid,.method-groups { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:16px; }.integration-card,.report-grid article,.method-groups article { padding:26px;border:1px solid var(--line);border-radius:22px;background:var(--surface); }.integration-card p,.report-grid p { color:var(--muted); }.module-cta { text-align:center;background:linear-gradient(135deg,var(--surface),var(--surface-2)); }.module-cta h2 { font-size:clamp(2rem,6vw,4.5rem); }.module-pager,.article-pager { display:flex;justify-content:space-between;gap:16px;padding-block:36px; }.module-pager a,.article-pager a { min-height:48px;padding:12px 18px;border:1px solid var(--line);border-radius:14px; }
.lightbox { width:min(94vw,1400px);max-width:none;padding:10px;border:1px solid var(--line);border-radius:22px;background:var(--bg);box-shadow:var(--shadow); }.lightbox::backdrop,.guided-dialog::backdrop { background:rgba(0,0,0,.82);backdrop-filter:blur(8px); }.lightbox img { width:100%;max-height:86vh;object-fit:contain;border-radius:14px; }.lightbox button { position:absolute;inset-block-start:18px;inset-inline-end:18px;width:48px;height:48px;border:0;border-radius:50%;background:var(--gold-1);color:var(--on-gold);font-size:1.5rem; }
.workflows-list { display:grid;gap:24px; }.swim-card { padding:28px;border:1px solid var(--line);background:var(--surface);border-radius:24px;overflow:hidden; }.swim-card h2 { font-size:clamp(1.7rem,4vw,3rem); }.swim-card svg { min-width:800px;width:100%; }.swim-card line { stroke:var(--line); }.swim-card text { fill:var(--text);font:600 13px "IBM Plex Sans Arabic",sans-serif; }.swim-path { stroke:var(--gold-2);stroke-width:3;fill:none; }.swim-step circle { fill:var(--surface-2);stroke:var(--gold-2);stroke-width:3; }.swim-effect circle,.flow-ball { fill:var(--gold-1); }.flow-ball { offset-path:path("M190 100 H750");animation:flow 5s linear infinite; }.static .flow-ball { animation:none; } @keyframes flow { to { offset-distance:100%; } }
.docs-search { display:flex;align-items:center;gap:12px;width:min(100%,720px);margin:36px auto 0;padding:0 20px;border:1px solid var(--line-strong);border-radius:16px;background:var(--field); }.docs-search input { width:100%;min-height:56px;border:0;outline:0;background:transparent; }.search-results { width:min(100%,720px);margin:auto;text-align:start;background:var(--surface);border-radius:0 0 16px 16px; }.search-results a { display:block;padding:14px 18px;border-block-start:1px solid var(--line); }.search-results small { display:block;color:var(--muted); }.docs-module-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px; }.doc-module-card { display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:22px;border:1px solid var(--line);border-radius:20px;background:var(--surface); }.doc-module-card h2 { font-size:1.15rem; }.doc-module-card>b { color:var(--gold-text); }.doc-list { max-width:800px;display:grid;gap:12px; }.doc-list a { padding:20px;border:1px solid var(--line);border-radius:15px;background:var(--surface); }
.docs-layout { display:grid;grid-template-columns:230px minmax(0,var(--reading)) 210px;justify-content:center;gap:48px;padding-block:45px;align-items:start; }.docs-sidebar,.toc { position:sticky;inset-block-start:105px; }.docs-sidebar button { display:none; }.docs-sidebar nav,.toc { display:grid;gap:7px; }.docs-sidebar a,.toc a { color:var(--muted);padding:7px 10px;border-inline-start:2px solid transparent; }.docs-sidebar a.active,.docs-sidebar a:hover,.toc a:hover { color:var(--text);border-color:var(--gold-2); }.doc-article { min-width:0; }.doc-article h1 { font-size:clamp(2.4rem,6vw,4.5rem);line-height:1.12;margin:0 0 20px;letter-spacing:-.045em; }.doc-article>.lead { font-size:1.2rem;color:var(--muted);padding-block-end:35px;border-block-end:1px solid var(--line); }.doc-article section { padding-block:25px; }.doc-article h2 { font-size:1.75rem;scroll-margin-top:110px; }.doc-article p,.doc-article li { color:var(--muted); }.doc-article li+li { margin-top:7px; }
.method-steps { max-width:900px;position:relative; }.method-steps::before { content:"";position:absolute;inset-inline-start:31px;inset-block:30px;width:2px;background:linear-gradient(var(--gold-1),var(--gold-2)); }.method-step { position:relative;display:grid;grid-template-columns:64px 1fr;gap:24px;padding-block:24px; }.method-step i { z-index:1;width:64px;height:64px;display:grid;place-items:center;border-radius:50%;background:var(--surface);border:2px solid var(--gold-2);font-style:normal;font-weight:800;color:var(--gold-text); }.method-step h2 { margin:0; }.method-step p { color:var(--muted); }.method-groups { margin-block-start:70px; }.method-groups li { color:var(--muted); }.method-output { margin-block-start:22px;padding:14px;border-radius:12px;background:var(--gold-glow);color:var(--gold-text);font-weight:700; }
.whatsapp { position:fixed;z-index:95;inset-block-end:22px;inset-inline-end:22px;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#25D366;color:#fff;box-shadow:0 10px 28px rgba(0,0,0,.3);animation:wa-pulse 2.8s infinite; }.whatsapp svg { width:31px;height:31px;fill:currentColor; }.guided-dialog[open]~.whatsapp { display:none; } @keyframes wa-pulse { 50% { box-shadow:0 10px 28px rgba(0,0,0,.3),0 0 0 9px rgba(37,211,102,0); } 0%,100% { box-shadow:0 10px 28px rgba(0,0,0,.3),0 0 0 0 rgba(37,211,102,.3); } }
.guided-dialog { width:min(95vw,1200px);max-width:none;padding:14px;border:1px solid var(--line);border-radius:24px;background:var(--bg);color:var(--text); }.guided-close { position:absolute;z-index:2;inset-block-start:20px;inset-inline-end:20px;background:var(--bg);border:1px solid var(--line); }.guided-slide { display:none;grid-template-columns:minmax(0,2fr) minmax(250px,1fr);gap:28px;align-items:center;min-height:60vh; }.guided-slide.active { display:grid; }.guided-slide img { border-radius:18px;border:1px solid var(--line); }.guided-slide h3 { font-size:2rem; }.guided-slide p { color:var(--muted); }.guided-dialog>footer { display:flex;justify-content:space-between;align-items:center;gap:12px;padding-block-start:14px; }
.empty { color:var(--muted);text-align:center;font-size:2rem; }
.reveal { opacity:1;transform:none; }.js:not(.static) .reveal { opacity:0;transform:translateY(25px);transition:.7s var(--ease); }.js:not(.static) .reveal.in { opacity:1;transform:none; }
@media (min-width:1000px) {
  .nav-links { display:flex;align-items:center;gap:22px; }.menu-button { display:none; }.mega { position:relative; }.mega-panel { display:none;position:absolute;inset-block-start:100%;inset-inline-start:-20px;width:620px;padding:18px;grid-template-columns:repeat(2,1fr);gap:6px;background:var(--bg);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow); }.mega:hover .mega-panel,.mega:focus-within .mega-panel { display:grid; }.mega-panel a { display:flex;align-items:center;gap:10px;padding:8px;border-radius:12px; }.mega-panel a:hover { background:var(--surface); }
}
@media (max-width:999px) {
  .desktop-demo,.nav-actions .tour-launch { display:none; }.nav-links.open .mega-panel { display:grid;gap:7px;padding:10px 0; }.nav-links.open .mega>a { display:none; }.nav-links.open .mega-panel a { display:flex;align-items:center;gap:12px;font-size:1rem!important;padding:6px!important; }.footer-grid { grid-template-columns:1fr;text-align:center;justify-items:center; }.docs-layout { grid-template-columns:minmax(0,var(--reading)); }.toc { display:none; }.docs-sidebar { position:relative;inset:0;z-index:3; }.docs-sidebar button { width:100%;display:flex;justify-content:space-between;min-height:48px;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface); }.docs-sidebar nav { display:none;position:absolute;inset-inline:0;inset-block-start:52px;padding:12px;background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow); }.docs-sidebar.open nav { display:grid; }.guided-slide { grid-template-columns:1fr;padding-block-start:45px; }.flow-strip { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  main { padding-block-start:70px; }.section { padding-block:70px; }.listing-hero { padding-block:45px; }.module-card { min-height:250px; }.home-hero { padding-block-start:65px; }.home-hero h1 { font-size:2.8rem; }.home-hero .screen-frame { margin-top:36px; }.section-head { margin-block-end:30px; }.section-head h2 { font-size:2.2rem; }.system-map { width:740px;margin-inline-start:calc((100% - 740px)/2);transform:scale(.78);transform-origin:center; }.map-section { min-height:620px; }.number-row { grid-template-columns:95px 1fr 26px;gap:8px;font-size:.82rem; }.module-hero { padding-block:65px 45px; }.module-hero h1 { font-size:3rem; }.module-stats>div { min-width:145px;flex:1; }.shot { flex-basis:92vw; }.lifecycle-card,.swim-card { padding:18px; }.docs-layout { padding-block:20px;gap:20px; }.doc-article h1 { font-size:2.35rem; }.module-pager { font-size:.82rem; }.guided-dialog { padding:10px; }.guided-slide h3 { font-size:1.4rem; }.whatsapp { inset-block-end:16px;inset-inline-end:16px;width:56px;height:56px; }
}

/* Round 7: readable workflow swimlanes */
.workflows-page .listing-hero { max-width:860px;text-align:center; }
.workflows-page .listing-hero p { max-width:700px;margin-inline:auto;color:var(--muted);font-size:1.08rem; }
.workflows-list { gap:34px;padding-block-end:80px; }
.workflows-page .swim-card { padding:0;overflow:hidden;border-radius:28px;scroll-margin-top:100px; }
.flow-head { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end;padding:30px 32px 26px;border-block-end:1px solid var(--line);background:linear-gradient(135deg,color-mix(in srgb,var(--surface-2) 58%,var(--surface)),var(--surface)); }
.flow-head h2 { margin:7px 0 8px;line-height:1.18;letter-spacing:-.035em; }
.flow-head p { max-width:720px;margin:0;color:var(--muted);line-height:1.75; }
.cycle-number { color:var(--gold-text);font:800 .78rem/1 "Inter",sans-serif;letter-spacing:.11em;text-transform:uppercase; }
.cycle-number b { font:inherit; }
.flow-module-badges,.flow-footer nav { display:flex;flex-wrap:wrap;gap:8px; }
.flow-module-badge,.flow-footer nav a { display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:7px 11px;border:1px solid var(--line-strong);border-radius:999px;background:color-mix(in srgb,var(--bg) 48%,transparent);font-size:.82rem;font-weight:700;line-height:1.2; }
.flow-module-badge:hover,.flow-footer nav a:hover { border-color:var(--gold-2);color:var(--gold-text); }
.workflows-page .swim-card .module-glyph svg { min-width:0;width:17px;height:17px; }
.swim-scroll { position:relative;max-width:100%;overflow-x:visible;padding:28px 30px 34px;background:var(--surface);scrollbar-color:var(--gold-2) var(--surface-2);scrollbar-width:thin; }
.swim-scroll.is-scrollable { overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scroll-padding-inline-start:200px;box-shadow:inset 26px 0 22px -28px var(--text),inset -26px 0 22px -28px var(--text); }
.swim-grid { position:relative;display:grid;grid-template-columns:176px repeat(var(--steps),minmax(0,1fr));grid-template-rows:repeat(var(--lanes),minmax(146px,auto));gap:14px 12px;align-items:stretch;min-width:0; }
.is-scrollable .swim-grid { width:calc(188px + var(--steps) * 240px); }
.lane-label { position:sticky;z-index:5;inset-inline-start:0;align-self:stretch;display:flex;align-items:center;gap:9px;width:176px;padding:16px 14px;border:1px solid var(--line);border-radius:15px;background:var(--surface-2);font-weight:800;line-height:1.35;box-shadow:8px 0 18px color-mix(in srgb,var(--bg) 35%,transparent); }
html[dir=rtl] .lane-label { box-shadow:-8px 0 18px color-mix(in srgb,var(--bg) 35%,transparent); }
.lane-label .module-glyph { flex:0 0 auto;color:var(--on-gold); }
.swim-route { position:relative;z-index:0;align-self:center;height:3px;margin-inline:22px;background:linear-gradient(90deg,var(--gold-2),var(--gold-1),var(--gold-2)); }
.swim-route::before,.swim-route::after { content:"";position:absolute;inset-block-start:50%;width:9px;height:9px;border-radius:50%;background:var(--gold-1);transform:translateY(-50%); }
.swim-route::before { inset-inline-start:0; }.swim-route::after { inset-inline-end:0; }
.swim-route i { position:absolute;z-index:4;inset-block-start:50%;inset-inline-start:0;width:13px;height:13px;border-radius:50%;background:var(--gold-1);box-shadow:0 0 0 5px var(--gold-glow),0 0 18px var(--gold-1);transform:translateY(-50%);animation:workflow-runner 6s linear infinite; }
@keyframes workflow-runner { to { inset-inline-start:calc(100% - 13px); } }
.static .swim-route i { animation:none; }
.swim-step-card { position:relative;z-index:2;align-self:center;min-height:126px;padding:16px 14px 13px;border:1px solid var(--line-strong);border-block-start:3px solid var(--gold-2);border-radius:16px;background:var(--bg);scroll-snap-align:start;scroll-margin-inline-start:200px;box-shadow:0 12px 28px color-mix(in srgb,var(--bg) 38%,transparent); }
.step-number { display:grid;place-items:center;width:30px;height:30px;margin-block-end:9px;border:2px solid var(--gold-2);border-radius:50%;background:var(--surface-2);color:var(--gold-text);font:800 .78rem/1 "Inter",sans-serif; }
.swim-step-card h3,.mobile-flow-step h3 { margin:0 0 5px;font-size:.88rem;line-height:1.35; }
.swim-step-card p { margin:0;color:var(--muted);font-size:.68rem;line-height:1.48;overflow:visible;white-space:normal; }
.auto-badge { position:absolute;inset-block-start:15px;inset-inline-end:12px;display:inline-flex;align-items:center;min-height:25px;padding:3px 8px;border:1px solid var(--gold-2);border-radius:999px;background:var(--gold-glow);color:var(--gold-text);font-size:.64rem;font-weight:800;line-height:1; }
.swim-effect-card { position:relative;align-self:center;min-height:112px;padding:17px 14px 13px;border:1px dashed var(--line-strong);border-radius:15px;background:color-mix(in srgb,var(--surface-2) 58%,var(--surface)); }
.swim-effect-card::before { content:"";position:absolute;inset-inline-start:50%;inset-block-end:100%;height:22px;border-inline-start:2px dotted var(--gold-2); }
.effect-dot { position:absolute;inset-inline-start:calc(50% - 5px);inset-block-start:-27px;width:10px;height:10px;border-radius:50%;background:var(--gold-1);box-shadow:0 0 0 4px var(--gold-glow); }
.swim-effect-card p { margin:0;color:var(--text);font-size:.72rem;line-height:1.55;white-space:normal;overflow:visible; }
.mobile-flow { display:none; }
.flow-footer { display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 32px 28px;border-block-start:1px solid var(--line);background:color-mix(in srgb,var(--surface-2) 35%,var(--surface)); }
.flow-footer>div { display:grid;gap:10px; }
.flow-footer>div>strong { font-size:.84rem;color:var(--muted); }
.flow-footer .button { flex:0 0 auto; }

@media (max-width:900px) {
  .flow-head { grid-template-columns:1fr;align-items:start; }
}
@media (max-width:759px) {
  .workflows-list { width:100%;padding-inline:14px;gap:24px; }
  .workflows-page .swim-card { border-radius:22px; }
  .flow-head { padding:24px 20px 20px;gap:18px; }
  .flow-head h2 { font-size:1.8rem; }
  .flow-head p { font-size:.92rem; }
  .flow-module-badges { gap:6px; }
  .flow-module-badge { font-size:.76rem;padding:6px 9px; }
  .swim-scroll { display:none; }
  .mobile-flow { display:grid;padding:25px 20px 10px; }
  .mobile-flow-step { position:relative;margin-inline-start:18px;padding:0 22px 30px;border-inline-start:2px solid var(--gold-2); }
  .mobile-flow-step:last-child { padding-block-end:14px; }
  .mobile-flow-step .step-number { position:absolute;inset-inline-start:-16px;inset-block-start:0;background:var(--surface); }
  .mobile-step-head { min-height:36px;position:relative; }
  .mobile-step-head .auto-badge { position:static;margin-inline-start:25px; }
  .mobile-flow-step h3 { font-size:1.05rem; }
  .mobile-flow-step>p { margin:5px 0 0;color:var(--muted);font-size:.87rem;line-height:1.65; }
  .mobile-effect { position:relative;margin-block-start:15px;padding:14px;border:1px dashed var(--line-strong);border-radius:14px;background:var(--surface-2); }
  .mobile-effect::before { content:"";position:absolute;inset-inline-start:-24px;inset-block-start:20px;width:23px;border-block-start:2px dotted var(--gold-2); }
  .mobile-effect a { display:inline-flex;align-items:center;gap:7px;color:var(--gold-text);font-size:.78rem;font-weight:800; }
  .mobile-effect p { margin:7px 0 0;font-size:.8rem;line-height:1.6; }
  .flow-footer { align-items:stretch;flex-direction:column;padding:20px; }
  .flow-footer .button { width:100%;text-align:center; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important; } .reveal { opacity:1!important;transform:none!important; } }

/* Round 6: restored home narrative and richer multi-page components */
.module-icon svg,.module-glyph svg { width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.module-glyph svg { width:17px;height:17px; }
.home-page main { padding-block-start:0; }
.home-page .home-hero { padding-block-start:calc(76px + 5rem); }
.home-page .hero-screen { transform-origin:center top; }
.home-page .module-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.home-page .module-card { min-height:280px; }
.map-section .section-head h2 { margin-block-end:.5rem; }
.map-section .section-head p { max-width:650px;margin-inline:auto;color:var(--muted); }
.system-map { display:grid;grid-template-columns:minmax(0,680px) minmax(250px,1fr);align-items:center;gap:38px;max-width:1120px;text-align:start; }
.system-map svg { max-width:680px; }
.map-edges line { stroke:color-mix(in srgb,var(--line-strong) 65%,transparent);stroke-dasharray:none; }
.map-detail { min-height:190px;padding:28px;border:1px solid var(--line);border-radius:22px;background:var(--surface); }
.map-detail h3 { margin:0 0 12px;font-size:1.5rem;color:var(--gold-text); }
.map-caption { color:var(--muted);font-weight:500;line-height:1.85; }
.number-bars { margin-inline:auto; }
.number-row i { transform-origin:inline-start; }
.demo-start { display:flex;flex-direction:column;gap:1.25rem; }
.demo-points { list-style:none;margin:0;padding:0;display:grid;gap:.75rem; }
.demo-points li { position:relative;padding-inline-start:1.75rem;font-weight:500; }
.demo-points li::before { content:"✓";position:absolute;inset-inline-start:0;font-weight:800;color:var(--gold-1); }
.demo-start .button { align-self:flex-start; }
.feature-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.feature-card { position:relative;display:flex;flex-direction:column;border-block-start:3px solid var(--line-strong); }
.feature-card.featured { grid-column:span 2;min-height:270px;background:linear-gradient(135deg,var(--surface),var(--surface-2));border-block-start-color:var(--gold-2); }
.feature-card .feature-number { color:var(--gold-text);font-size:.78rem;font-weight:800;letter-spacing:.12em; }
.feature-card h3 { margin-block-start:18px; }
.feature-card>a { margin-block-start:auto;padding-block-start:18px;border-block-start:1px solid var(--line);color:var(--gold-text);font-weight:700; }
.timeline { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px 0;overflow:visible; }
.timeline-step { min-width:0;padding-inline:18px; }
.life-flow { display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;padding-block:24px; }
.life-state { position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:46px;max-width:220px;padding:10px 20px;border:1px solid var(--gold-2);border-radius:999px;background:var(--bg);font-weight:700;text-align:center;line-height:1.35; }
.life-state:not(:last-child)::after { content:"→";position:absolute;inset-inline-end:-23px;color:var(--gold-text); }
html[dir=rtl] .life-state:not(:last-child)::after { content:"←"; }
.life-state.negative { border-color:color-mix(in srgb,#d66 55%,var(--line));background:color-mix(in srgb,#d66 8%,var(--surface));color:color-mix(in srgb,#f99 75%,var(--text)); }
.shot-wrap { position:relative; }
.gallery-arrow { position:absolute;z-index:3;inset-block-start:50%;transform:translateY(-50%);width:50px;height:50px;border:1px solid var(--line);border-radius:50%;background:var(--bg);color:var(--text);font-size:2rem;box-shadow:var(--shadow); }
.gallery-prev { inset-inline-start:20px; }.gallery-next { inset-inline-end:20px; }
.gallery-dots { display:flex;justify-content:center;gap:8px;margin-block-start:6px; }
.gallery-dots button { width:9px;height:9px;padding:0;border:0;border-radius:50%;background:var(--line-strong); }
.gallery-dots button.active { width:26px;border-radius:9px;background:var(--gold-1); }
.swim-card { overflow-x:auto;scrollbar-color:var(--gold-2) var(--surface); }
.whatsapp { inset-block-end:24px;inset-inline-end:24px;box-shadow:0 14px 36px rgba(0,0,0,.45); }
.tour-open { overflow:hidden; }

/* Round 8: compact wrapping workflow cards */
.workflows-page main,.workflows-page main * { scroll-snap-type:none;scroll-snap-align:none; }
.workflows-page main { overflow-x:clip; }
.workflows-page .listing-hero { padding-block-end:34px; }
.workflow-quick-nav { display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:28px auto 0;max-width:1050px; }
.workflow-quick-nav a { display:inline-flex;align-items:center;min-height:40px;padding:8px 14px;border:1px solid var(--line-strong);border-radius:999px;background:var(--surface);font-size:.84rem;font-weight:700;line-height:1.25; }
.workflow-quick-nav a:hover { border-color:var(--gold-2);color:var(--gold-text); }
.workflows-page .swim-card { overflow:visible; }
.workflow-steps { display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:22px 24px;background:var(--surface); }
.workflow-step { position:relative;min-width:0;padding:15px 16px 16px;border:1px solid var(--line-strong);border-block-start:3px solid var(--gold-2);border-radius:16px;background:var(--bg);box-shadow:0 10px 24px color-mix(in srgb,var(--bg) 32%,transparent);transition-delay:calc(var(--step-delay) * 70ms); }
.workflow-step:not(:last-child)::after { content:"→";position:absolute;z-index:3;inset-inline-end:3px;inset-block-start:38px;width:12px;color:var(--gold-text);font-size:1.05rem;font-weight:800;text-align:center;line-height:1; }
html[dir=rtl] .workflow-step:not(:last-child)::after { content:"←"; }
.workflow-step-head { display:flex;align-items:center;gap:8px;min-height:30px;margin-block-end:10px; }
.workflow-step .step-number { position:static;display:grid;place-items:center;width:29px;height:29px;flex:0 0 29px;border:2px solid var(--gold-2);border-radius:50%;background:var(--surface);color:var(--gold-text);font-size:.75rem;font-weight:800; }
.workflow-step .auto-badge { position:static;display:inline-flex;align-items:center;min-height:24px;padding:3px 8px;border:1px solid color-mix(in srgb,var(--gold-2) 60%,transparent);border-radius:999px;background:var(--gold-glow);color:var(--gold-text);font-size:.66rem;font-weight:800; }
.workflow-step h3 { margin:0 0 6px;font-size:.92rem;line-height:1.4; }
.workflow-step .step-desc { margin:0;color:var(--muted);font-size:.75rem;line-height:1.55; }
.step-effects { display:grid;gap:10px;margin-block-start:13px;padding-block-start:12px;border-block-start:1px dashed var(--line-strong); }
.step-effect { min-width:0; }
.step-effect a { display:flex;align-items:center;gap:7px;color:var(--gold-text);font-size:.72rem;font-weight:800; }
.step-effect .module-glyph { width:24px;height:24px;flex-basis:24px;border-radius:7px; }
.step-effect .module-glyph svg { width:14px!important;height:14px!important; }
.step-effect p { margin:5px 0 0;color:var(--text);font-size:.68rem;line-height:1.5;overflow-wrap:anywhere; }
.workflows-page .flow-head { padding:22px 24px 20px; }
.workflows-page .flow-head h2 { font-size:clamp(1.65rem,3.2vw,2.55rem); }
.workflows-page .flow-footer { padding:16px 24px 19px; }
.workflows-page .flow-footer .button { min-height:42px;padding-block:9px; }

@media (max-width:999px) {
  .home-page .module-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .system-map { grid-template-columns:1fr;max-width:680px; }
  .map-detail { min-height:auto; }
  .feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .timeline { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:600px) {
  .home-page .home-hero { padding-block-start:calc(70px + 3rem); }
  .home-page .module-grid,.feature-grid { grid-template-columns:1fr; }
  .feature-card.featured { grid-column:auto; }
  .system-map { width:auto;margin:0 auto;transform:none; }
  .number-row { grid-template-columns:95px 1fr;gap:8px;font-size:.82rem; }
  .system-map svg { width:680px;max-width:none;margin-inline-start:calc((100% - 680px)/2);transform:scale(.58);transform-origin:center; }
  .map-section { min-height:auto; }
  .map-detail { margin-block-start:-110px; }
  .timeline { display:grid;grid-template-columns:1fr;gap:0;padding-inline-start:24px; }
  .timeline-step { border-block-start:0;border-inline-start:2px solid var(--line-strong);padding:18px 26px 32px; }
  .timeline-step i { inset-block-start:14px;inset-inline-start:-25px; }
  .timeline-step::before { inset-block-start:0;inset-inline-start:-2px;width:2px;height:0; }
  .timeline-step.in::before,.static .timeline-step::before { width:2px;height:100%; }
  .gallery-arrow { width:42px;height:42px; }
  .whatsapp { inset-block-end:24px;inset-inline-end:16px; }
  .workflow-quick-nav { justify-content:flex-start; }
  .workflow-quick-nav a { flex:1 1 calc(50% - 8px);justify-content:center; }
  .workflow-steps { grid-template-columns:1fr;gap:0;padding:24px 18px 8px; }
  .workflow-step { margin-inline-start:16px;padding:0 22px 28px;border:0;border-inline-start:2px solid var(--gold-2);border-radius:0;background:transparent;box-shadow:none; }
  .workflow-step:not(:last-child)::after { display:none; }
  .workflow-step .step-number { position:absolute;inset-inline-start:-16px;inset-block-start:0;background:var(--surface); }
  .workflow-step-head { padding-inline-start:24px; }
  .workflow-step h3 { font-size:1.02rem; }
  .workflow-step .step-desc { font-size:.85rem;line-height:1.65; }
  .step-effect { padding:12px;border:1px dashed var(--line-strong);border-radius:12px;background:var(--surface-2); }
  .step-effect p { font-size:.78rem; }
}