/* Inner pages (About, Services, Web Applications, Mobile, Website, Tools, Downloads, Contact, Privacy) — Concept B language */

/* Client logos: fully visible grid, no clipped marquee */
.client-grid{list-style:none;display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:22px}
.client-grid li{aspect-ratio:3/2;display:grid;place-items:center;padding:14px;background:#fff;border-radius:18px;box-shadow:0 0 0 1px var(--line);transition:transform .35s var(--ease),box-shadow .35s;transition-delay:calc(var(--i)*25ms)}
.client-grid li:hover{transform:translateY(-4px);box-shadow:0 0 0 1px var(--line),0 20px 40px -26px rgba(14,19,32,.4)}
.client-grid img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;filter:grayscale(1);opacity:.75;mix-blend-mode:multiply;transition:.3s}
.client-grid li:hover img{filter:none;opacity:1}
@media (max-width:1080px){.client-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:640px){.client-grid{grid-template-columns:repeat(3,1fr);gap:8px}.client-grid li{padding:10px;border-radius:14px}}

/* About */
.about-block,.topic{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,56px);align-items:center}
.lead-lg{font-size:clamp(20px,1.9vw,26px);line-height:1.5;font-weight:600;color:var(--ink)}
.about-img{margin:0;border-radius:28px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--line),0 40px 70px -40px rgba(14,19,32,.45)}
.about-img img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.about-card{position:relative;background:#fff;border-radius:28px;padding:32px;box-shadow:0 0 0 1px var(--line);overflow:hidden}
.about-card h2{font-size:clamp(28px,3vw,40px);letter-spacing:-.03em;margin:8px 0 12px}
.about-card p{font-size:17px;color:var(--ink-2)}
.about-card.dark{background:var(--ink);color:#fff}.about-card.dark p{color:#b8bfcd}.about-card.dark .eyebrow{color:#8fc1f5}
.about-card-img{width:100%;border-radius:18px;margin-top:22px;aspect-ratio:16/8;object-fit:cover}
.ticks li{position:relative;padding:9px 0 9px 30px;font-weight:700;border-bottom:1px solid var(--line)}
.ticks li::before{content:"";position:absolute;left:0;top:13px;width:18px;height:18px;border-radius:6px;background:var(--brand-soft);box-shadow:inset 0 0 0 5px #fff,inset 0 0 0 9px var(--brand)}
.steps{list-style:none;display:grid;gap:8px;margin-top:14px}
.steps li{display:flex;gap:14px;align-items:center;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.06);font-weight:700}
.steps li span{font-size:13px;font-weight:800;color:var(--accent)}
.why3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.why3 article{background:#fff;border-radius:26px;padding:28px;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:12px}
.why3 article:nth-child(2){background:var(--grad);color:#fff}.why3 article:nth-child(2) p{color:rgba(255,255,255,.88)}
.why3 h3{font-size:26px;letter-spacing:-.02em}
.why3 p{color:var(--ink-2);flex:1}
.why3 .pill{align-self:flex-start;padding:11px 18px;font-size:14px}
.impl .prod{text-decoration:none}

/* Services overview */
.svc-jump{grid-template-columns:repeat(5,1fr)!important}
.svc-group{margin-bottom:46px;scroll-margin-top:170px}
.svc-group header{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.svc-group header .no{font-size:15px;font-weight:800;color:var(--accent)}
.svc-group header h2{font-size:clamp(26px,2.8vw,38px);letter-spacing:-.03em}
.svc-group header .pill{margin-left:auto;padding:10px 16px;font-size:14px}
.ov-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.ov{display:flex;flex-direction:column;gap:8px;background:#fff;border-radius:20px;padding:20px 22px;box-shadow:0 0 0 1px var(--line);transition:transform .35s var(--ease),box-shadow .35s;scroll-margin-top:150px}
a.ov:hover{transform:translateY(-4px);box-shadow:0 0 0 1px var(--ink)}
.ov b{font-size:18px;letter-spacing:-.01em}
.ov p{font-size:14.5px;color:var(--ink-2);flex:1}
.ov span{font-size:13.5px;font-weight:800;color:var(--brand)}
@media (max-width:1180px){.svc-jump{grid-template-columns:repeat(3,1fr)!important}}
@media (max-width:560px){.svc-jump{grid-template-columns:repeat(2,1fr)!important}}

/* Topic pages (web / mobile / website) */
.topic-text p{font-size:17.5px;line-height:1.75;color:var(--ink-2);margin-bottom:16px}
.topic-sub{font-size:20px;margin:22px 0 12px}
.site-links{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.site-links a{display:block;background:#fff;border-radius:16px;padding:14px 16px;box-shadow:0 0 0 1px var(--line);transition:.25s}
.site-links a:hover{box-shadow:0 0 0 1px var(--ink);transform:translateY(-2px)}
.site-links b{display:block;font-size:15px}
.site-links span{font-size:13px;font-weight:700;color:var(--brand)}

/* Web applications grid */
.wa-filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.wa-filter button{border:0;background:#fff;box-shadow:0 0 0 1px var(--line);border-radius:999px;padding:9px 16px;font:700 14px var(--sans);cursor:pointer;color:var(--ink-2)}
.wa-filter button b{margin-left:6px;color:var(--brand)}
.wa-filter button[aria-pressed=true]{background:var(--ink);color:#fff;box-shadow:none}.wa-filter button[aria-pressed=true] b{color:#8fc1f5}
.wa-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.wa-card{display:flex;flex-direction:column;background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 0 0 1px var(--line);transition:transform .35s var(--ease),box-shadow .35s}
.wa-card:hover{transform:translateY(-4px);box-shadow:0 0 0 1px var(--ink)}
.wa-card .th{aspect-ratio:16/10;background:linear-gradient(150deg,#eef4fb,#f7f9fc);overflow:hidden;display:grid;place-items:center}
.wa-card .th img{width:100%;height:100%;object-fit:cover}
.wa-card .th.noimg::after{content:attr(data-initial);font-size:44px;font-weight:800;color:rgba(28,111,192,.35)}
.wa-card .b{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.wa-card small{font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.wa-card b{font-size:16px;line-height:1.25}
.wa-card .acts{margin-top:auto;display:flex;flex-wrap:wrap;gap:6px;padding-top:8px}
.wa-card .acts a{font-size:13px;font-weight:800;color:#fff;background:var(--brand);padding:7px 11px;border-radius:999px}
.wa-card .acts a.alt{background:var(--bg);color:var(--ink);box-shadow:0 0 0 1px var(--line)}
.wa-note{margin-top:22px;font-size:14px;color:var(--muted)}.wa-note a{color:var(--brand);font-weight:700}

/* Tools */
.tools2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.tool-card{display:grid;grid-template-columns:180px 1fr;gap:22px;align-items:center;background:#fff;border-radius:26px;padding:24px;box-shadow:0 0 0 1px var(--line);scroll-margin-top:120px}
.tool-card figure{margin:0;aspect-ratio:1;border-radius:18px;background:var(--bg);display:grid;place-items:center;overflow:hidden}
.tool-card img{max-width:85%;max-height:85%;object-fit:contain}
.tool-card h2{font-size:26px;letter-spacing:-.02em;margin-bottom:8px}
.tool-card p{color:var(--ink-2)}

/* Downloads */
.dl-group{background:#fff;border-radius:28px;box-shadow:0 0 0 1px var(--line);padding:26px;margin-bottom:22px;scroll-margin-top:120px}
.dl-group header{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:center;margin-bottom:18px}
.dl-group header figure{margin:0;border-radius:18px;overflow:hidden;aspect-ratio:4/3}
.dl-group header img{width:100%;height:100%;object-fit:cover}
.dl-group h2{font-size:clamp(24px,2.6vw,34px);letter-spacing:-.03em}
.dl-group header p{color:var(--muted);font-weight:700}
.dl-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.dl-list a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:var(--bg);box-shadow:0 0 0 1px var(--line);transition:.25s}
.dl-list a:hover{background:var(--brand-soft);box-shadow:0 0 0 1px var(--brand)}
.dl-ic{flex:none;width:38px;height:38px;border-radius:12px;background:var(--brand);color:#fff;display:grid;place-items:center}
.dl-ic svg{width:20px;height:20px}
.dl-list b{flex:1;font-size:15px}
.dl-list small{font-size:11px;font-weight:800;color:var(--muted);letter-spacing:.06em}

/* Contact */
.contact-wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;align-items:start}
.contact-cards{display:grid;grid-template-columns:1fr;gap:12px}
.cc-card{display:grid;grid-template-columns:auto 1fr;column-gap:16px;align-items:center;padding:20px 22px;border-radius:24px;background:#fff;box-shadow:0 0 0 1px var(--line);transition:.3s}
.cc-card:hover{transform:translateY(-3px);box-shadow:0 0 0 1px var(--ink)}
.cc-ic{grid-row:span 3;width:54px;height:54px;border-radius:16px;display:grid;place-items:center;color:#fff;background:var(--brand)}
.cc-ic svg{width:26px;height:26px}
.cc-card.wa .cc-ic{background:#25D366}.cc-card.phone .cc-ic{background:var(--ink)}
.cc-card small{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.cc-card b{font-size:clamp(18px,1.8vw,22px);letter-spacing:-.01em}
.cc-card span{font-size:13.5px;font-weight:800;color:var(--brand)}
.offices{display:grid;gap:12px}
.office{background:var(--ink);color:#fff;border-radius:24px;padding:24px 26px}
.office:nth-child(2){background:#fff;color:var(--ink);box-shadow:0 0 0 1px var(--line)}
.office .eyebrow{color:#8fc1f5}.office:nth-child(2) .eyebrow{color:var(--brand)}
.office address{font-style:normal;font-size:20px;font-weight:700;line-height:1.45;margin:10px 0 12px}
.map-link{font-size:14px;font-weight:800;color:#8fc1f5}.office:nth-child(2) .map-link{color:var(--brand)}
.cform{background:#fff;border-radius:28px;padding:28px;box-shadow:0 0 0 1px var(--line);display:grid;gap:14px}
.cform h2{font-size:28px;letter-spacing:-.02em}
.cform label{display:grid;gap:6px;font-size:13px;font-weight:800;color:var(--ink-2)}
.cform input,.cform textarea{font:600 15px var(--sans);padding:12px 14px;border:0;border-radius:14px;background:var(--bg);box-shadow:0 0 0 1px var(--line);outline:0;resize:vertical}
.cform input:focus,.cform textarea:focus{box-shadow:0 0 0 2px var(--brand)}
.cform .pill{justify-self:start;border:0;cursor:pointer}
.form-note{font-size:13px;color:var(--muted)}
.contact-wrap .partners{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.partner{background:#fff;border-radius:20px;padding:18px;box-shadow:0 0 0 1px var(--line)}
.partner small{font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.partner h3{font-size:17px;margin:4px 0 6px}
.partner p{font-size:13.5px;color:var(--ink-2)}
.partner a{display:inline-block;margin-top:8px;font-weight:800;font-size:14px;color:var(--brand)}

/* Privacy */
.legal-doc{display:grid;grid-template-columns:280px 1fr;gap:34px;align-items:start}
.toc{position:sticky;top:100px;background:#fff;border-radius:22px;padding:20px;box-shadow:0 0 0 1px var(--line);max-height:calc(100vh - 130px);overflow:auto}
.toc b{display:block;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.toc ol{padding-left:18px;display:grid;gap:6px;font-size:14px;font-weight:700}
.toc a:hover{color:var(--brand)}
.legal-body section{background:#fff;border-radius:22px;padding:24px 28px;box-shadow:0 0 0 1px var(--line);margin-bottom:14px;scroll-margin-top:100px}
.legal-body h2{font-size:22px;letter-spacing:-.02em;margin-bottom:10px}
.legal-body p{color:var(--ink-2);margin-bottom:10px;line-height:1.7}
.legal-body ul{list-style:disc;padding-left:22px;color:var(--ink-2);display:grid;gap:6px;margin:8px 0 12px}

@media (max-width:1080px){.about-block,.topic,.two-col,.contact-wrap,.legal-doc,.tools2{grid-template-columns:1fr}.why3{grid-template-columns:1fr}.toc{position:static;max-height:none}}
@media (max-width:640px){.site-links,.contact-wrap .partners{grid-template-columns:1fr}.tool-card{grid-template-columns:1fr}.tool-card figure{max-width:160px}.dl-group header{grid-template-columns:90px 1fr}}
.cc-card .cc-ic{color:#fff}
.app-rows{overflow:hidden;max-width:100%}html,body{overflow-x:clip}
.grp-divider{margin:10px 0 24px;padding-top:10px;scroll-margin-top:170px}

/* Web application cards as buttons + demo-login panel */
button.app{font:inherit;text-align:left;border:0;padding:0;cursor:pointer;color:inherit}
.wa-open{display:block;width:100%;border:0;padding:0;background:none;cursor:pointer}
.wa-login{font:800 13px var(--sans);color:#fff;background:var(--brand);border:0;padding:8px 13px;border-radius:999px;cursor:pointer}
.wa-login:hover{background:var(--ink)}
.wa-card .down,.am-acts .down{font-size:12.5px;font-weight:800;color:#b42318;background:#fdecea;padding:6px 10px;border-radius:999px}
.wa-card.is-down{opacity:.75}
.app-modal{position:fixed;inset:0;z-index:420;background:rgba(14,19,32,.6);backdrop-filter:blur(4px);display:grid;place-items:center;padding:16px}
.app-modal[hidden]{display:none}
.am-panel{position:relative;width:min(760px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:26px;display:grid;grid-template-columns:.9fr 1.1fr;box-shadow:0 40px 90px -30px rgba(0,0,0,.55)}
.am-x{position:absolute;right:14px;top:14px;width:38px;height:38px;border-radius:50%;border:0;background:#fff;box-shadow:0 0 0 1px var(--line);cursor:pointer;font-size:16px;z-index:2}
.am-img{background:linear-gradient(150deg,#eef4fb,#f7f9fc);min-height:100%;display:grid;place-items:center}
.am-img img{width:100%;height:100%;object-fit:cover}
.am-img.noimg::after{content:attr(data-initial);font-size:84px;font-weight:800;color:rgba(28,111,192,.3)}
.am-body{padding:28px 26px}
.am-grp{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.am-body h3{font-size:26px;letter-spacing:-.02em;margin:4px 0 12px}
.am-lead{font-size:14.5px;font-weight:700;color:var(--ink-2);margin-bottom:10px}
.am-field{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 10px;background:var(--bg);border-radius:14px;padding:10px 12px;box-shadow:0 0 0 1px var(--line);margin-bottom:8px}
.am-field small{grid-column:1/-1;font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.am-field code{font:700 15px ui-monospace,Consolas,monospace;word-break:break-all;color:var(--ink)}
.am-field button{border:0;background:var(--ink);color:#fff;font:800 12.5px var(--sans);padding:7px 11px;border-radius:999px;cursor:pointer;white-space:nowrap}
.am-field button.ok{background:#16a34a}
.am-more{margin:6px 0 4px;font-size:13.5px}
.am-more summary{cursor:pointer;font-weight:800;color:var(--brand)}
.am-more ul{margin:8px 0 0;padding-left:18px;color:var(--ink-2);display:grid;gap:3px}
.am-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.am-acts .pill{padding:12px 18px;font-size:14px}
.am-note{font-size:12.5px;color:var(--muted);margin-top:12px}
@media (max-width:640px){.am-panel{grid-template-columns:1fr}.am-img{max-height:180px}}
/* demo-details panel sections */
.am-panel{width:min(860px,100%)}
.am-sec{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.am-sec h4{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--brand);margin-bottom:8px}
.am-sec h4 span{font-size:11px;background:var(--brand);color:#fff;border-radius:999px;padding:2px 8px;letter-spacing:0}
.am-info{font-size:14px;color:var(--ink-2)}
.am-roles{display:grid;gap:8px;max-height:280px;overflow:auto;padding-right:4px}
.am-role{background:var(--bg);border-radius:14px;padding:10px 12px;box-shadow:0 0 0 1px var(--line)}
.am-role>b{display:block;font-size:14px;margin-bottom:6px}
.am-kv{display:grid;grid-template-columns:78px 1fr auto;align-items:center;gap:8px;padding:3px 0}
.am-kv small{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.am-kv code{font:700 13.5px ui-monospace,Consolas,monospace;word-break:break-all}
.am-kv button{border:0;background:#fff;box-shadow:0 0 0 1px var(--line);font:800 12px var(--sans);padding:5px 10px;border-radius:999px;cursor:pointer}
.am-kv button.ok{background:#16a34a;color:#fff;box-shadow:none}
.am-notes{list-style:disc;padding-left:18px;font-size:14px;color:var(--ink-2);display:grid;gap:4px}
.am-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.am-links a{font-size:13px;font-weight:800;color:var(--brand);background:var(--brand-soft);padding:6px 11px;border-radius:999px}
.am-img{align-self:stretch}
.am-panel{grid-template-columns:.7fr 1.3fr}.am-img img{object-fit:contain;max-height:420px;padding:16px}
/* ---- Round 10: Mobile Application page ---- */
.phone{margin:0;flex:none;border-radius:34px;padding:8px;background:var(--ink);box-shadow:0 30px 60px -30px rgba(14,19,32,.55),inset 0 0 0 1px rgba(255,255,255,.08)}
.phone img{display:block;width:100%;height:auto;border-radius:26px}
.mhero{position:relative;height:440px;min-width:420px}
.mhero .phone{position:absolute;width:190px;top:0}
.mhero .p1{left:0;top:40px;transform:rotate(-7deg)}
.mhero .p2{left:120px;z-index:2}
.mhero .p3{left:240px;top:40px;transform:rotate(7deg)}
.mcaps{background:#fff;border-radius:28px;padding:26px 28px;box-shadow:0 0 0 1px var(--line),0 40px 70px -45px rgba(14,19,32,.45)}
.mcaps h3{font-size:22px;letter-spacing:-.02em;margin-bottom:14px}
.mcaps ul{list-style:none;display:grid;gap:10px}
.mcaps li,.mapp li{display:flex;gap:12px;align-items:flex-start;font-weight:700;color:var(--ink);line-height:1.4}
.mcaps li>span,.mapp li>span{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:var(--brand-soft);color:var(--brand)}
.mcaps li svg,.mapp li svg{width:14px;height:14px}
.mcaps p{margin-top:16px;font-size:14px;color:var(--muted);font-weight:600}
.mapp{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,48px);align-items:center;background:#fff;border-radius:32px;padding:clamp(22px,3vw,40px);margin-bottom:28px;box-shadow:0 0 0 1px var(--line);border-top:6px solid var(--app,var(--brand));scroll-margin-top:150px}
.mapp-no{display:inline-grid;place-items:center;min-width:46px;height:46px;padding:0 10px;border-radius:14px;background:var(--app);color:#fff;font-weight:800;font-size:18px}
.mapp h3{font-size:clamp(28px,3vw,40px);letter-spacing:-.035em;line-height:1.05;margin:14px 0 10px}
.mapp-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.mapp-tags span{font-size:13px;font-weight:800;padding:6px 12px;border-radius:999px;background:var(--bg);box-shadow:0 0 0 1px var(--line);color:var(--ink-2)}
.mapp-text>p{font-size:16.5px;line-height:1.7;color:var(--ink-2)}
.mapp h4{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:20px 0 10px}
.mapp ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:9px 18px;font-size:15px}
.mapp li>span{background:color-mix(in srgb,var(--app) 14%,#fff);color:var(--app)}
.mapp-shots{min-width:0}
.rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 4px 16px;scrollbar-width:thin;scrollbar-color:var(--app) transparent}
.rail .phone{width:210px;scroll-snap-align:start}
.rail:focus-visible{outline:2px solid var(--brand);outline-offset:4px;border-radius:12px}
.rail-hint{font-size:13px;font-weight:700;color:var(--muted);margin-top:4px}
.mapp:nth-of-type(even) .mapp-shots{order:-1}
.mapp-more{--app:var(--ink);border-top-color:var(--brand)}
.mapp-wide{margin:0;border-radius:24px;overflow:hidden;background:var(--bg);box-shadow:0 0 0 1px var(--line)}
.mapp-wide img{display:block;width:100%;height:auto}
.mapp-wide figcaption{padding:10px 16px;font-size:14px;font-weight:800;color:var(--ink-2)}
@media (max-width:1080px){.mapp{grid-template-columns:1fr}.mapp:nth-of-type(even) .mapp-shots{order:0}.mhero{height:400px;min-width:0;width:430px;max-width:100%;margin:10px auto 0;justify-self:center}}
@media (max-width:600px){.mapp ul{grid-template-columns:1fr}.rail .phone{width:170px}.mhero{height:300px;width:320px}.mhero .phone{width:140px}.mhero .p2{left:90px}.mhero .p3{left:180px}}
