/* Visible card materials: product-specific color, layered screens and service surfaces. */
.project-showcase{--project-tone:#56d3a2;--accent2:var(--project-tone);position:relative;border-color:color-mix(in srgb,var(--project-tone) 26%,var(--line));border-radius:22px;box-shadow:0 28px 75px -40px #0005}
.project-showcase[data-project-tone="muhasebe"]{--project-tone:#70b9ff}
.project-showcase[data-project-tone="megpos"]{--project-tone:#edb46c}
.project-showcase[data-project-tone="onchain"]{--project-tone:#b5a0ff}
html[data-theme="light"] .project-showcase{--project-tone:#168461}
html[data-theme="light"] .project-showcase[data-project-tone="muhasebe"]{--project-tone:#347dc2}
html[data-theme="light"] .project-showcase[data-project-tone="megpos"]{--project-tone:#ab6b28}
html[data-theme="light"] .project-showcase[data-project-tone="onchain"]{--project-tone:#7758c9}
.showcase-panel{position:relative;grid-template-columns:.85fr 1.35fr;min-height:470px;background:radial-gradient(ellipse at 93% 20%,color-mix(in srgb,var(--project-tone) 17%,transparent),transparent 63%),linear-gradient(135deg,var(--surface),var(--bg))}
.showcase-panel:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.35;background-image:radial-gradient(color-mix(in srgb,var(--project-tone) 30%,transparent) .7px,transparent .7px);background-size:19px 19px;mask-image:linear-gradient(90deg,transparent 25%,#000)}
.showcase-copy{position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:42px 32px 42px 39px}
.showcase-copy>*{position:relative;z-index:1}
.showcase-copy>.showcase-watermark{position:absolute;right:15px;top:10px;z-index:0;font:700 128px/1 'Manrope',sans-serif;letter-spacing:-.1em;color:var(--project-tone);opacity:.065;pointer-events:none}
.showcase-copy h3{font-size:clamp(31px,3.3vw,43px);margin-top:22px}
.showcase-tags>span{border-color:color-mix(in srgb,var(--project-tone) 22%,var(--line));background:color-mix(in srgb,var(--project-tone) 5%,var(--bg));color:var(--muted)}
.showcase-media{min-height:370px;margin:42px 38px 54px 0;overflow:visible;border:6px solid color-mix(in srgb,var(--project-tone) 15%,var(--surface));border-radius:15px;box-shadow:0 15px 0 -6px color-mix(in srgb,var(--project-tone) 22%,var(--surface)),0 29px 0 -12px color-mix(in srgb,var(--project-tone) 10%,var(--surface)),0 36px 60px -24px #0007;background:#15231f}
.showcase-media>img{border-radius:8px}
.showcase-media.rb-tilt{transform:perspective(1200px) rotateX(calc(var(--rb-rx,0deg) + 2deg)) rotateY(calc(var(--rb-ry,0deg) - 5deg)) rotateZ(1deg)}
.showcase-media.rb-tilt.rb-tilt-active{transform:perspective(1200px) rotateX(calc(var(--rb-rx,0deg) + 2deg)) rotateY(calc(var(--rb-ry,0deg) - 5deg)) rotateZ(1deg) scale(var(--rb-tilt-scale,1.012))}
.showcase-image-label{border-radius:0 0 8px 8px;padding:29px 17px 15px}
.showcase-image-label>b{display:flex;align-items:center;gap:9px}
.showcase-image-label>b:before{content:'';width:5px;height:5px;border-radius:50%;background:var(--project-tone);box-shadow:0 0 12px var(--project-tone)}
.showcase-tabs{background:var(--bg);border-color:color-mix(in srgb,var(--project-tone) 22%,var(--line))}
.showcase-tab{display:grid;grid-template-columns:59px minmax(0,1fr) 17px;align-items:center;gap:12px;min-height:103px;padding:21px 17px;border-top:3px solid transparent}
.showcase-tab[aria-selected="true"]{border-top-color:var(--project-tone);background:color-mix(in srgb,var(--project-tone) 9%,var(--bg))}
.showcase-tab>.showcase-tab-index{position:absolute;left:auto;right:12px;top:6px;margin:0;color:var(--faint);font-size:7px;line-height:1}
.showcase-tab-thumb{position:relative;z-index:2;grid-column:1;grid-row:1;display:block;width:59px;height:46px;object-fit:cover;object-position:top left;border:1px solid var(--line);border-radius:6px;background:var(--surface);filter:saturate(.65);transition:filter .3s,transform .3s}
.showcase-tab[aria-selected="true"] .showcase-tab-thumb{filter:saturate(1);box-shadow:0 5px 15px #0002}
.showcase-tab:hover .showcase-tab-thumb{filter:saturate(1);transform:translateY(-2px)}
.showcase-tab-label{grid-column:2;grid-row:1;min-width:0}
.showcase-tab strong{font-size:11px;white-space:normal;line-height:1.4}
.showcase-tab small{font-size:8px;line-height:1.45}
.showcase-tab-arrow{grid-column:3;grid-row:1;align-self:center;font-size:16px}
.capability{border-radius:21px;box-shadow:0 16px 38px -28px #0004}
.capability-top{font-size:10px;gap:13px}
.capability-icon{width:39px;height:39px;border-radius:12px}
.capability--web{--bg:#102024;--surface:#192d31;--ink:#f5fbf9;--muted:#afc8c2;--faint:#769b90;--line:#9cc9bb29;--accent2:#79edbb;min-height:690px;border-color:#8ed9bb38;background:radial-gradient(ellipse at 90% 65%,#2b715650,transparent 66%),linear-gradient(145deg,#192d31,#0c191f);box-shadow:0 25px 60px -35px #00362888}
.capability--web h3{font-size:clamp(34px,3.5vw,44px)}
.capability--web .capability-icon{background:#72e9ac20;border-color:#72e9ac40;color:#9ffbd1;box-shadow:inset 0 1px #b2fada13}
.interface-scene{min-height:340px;margin-top:25px;background:radial-gradient(ellipse at 65% 62%,#70ebad18,transparent 65%)}
.interface-scene:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#75dca80c 1px,transparent 1px),linear-gradient(90deg,#75dca80c 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(transparent,#000)}
.interface-window{--bg:#f0f6f3;--surface:#fff;--ink:#182e26;--muted:#5b746a;--faint:#8ca89b;--line:#244d3820;--accent2:#16875e;left:8%;top:48px;width:109%;height:305px;border-color:#dcfff54d;border-radius:13px;box-shadow:-12px 25px 65px #0006;transform:rotateY(-10deg) rotateZ(-5deg)}
.capability--web:hover .interface-window{transform:rotateY(-3deg) rotateZ(-2deg) translateY(-5px)}
.interface-float{left:21px;bottom:26px;padding:14px 17px;border-color:#a3e1ca3b;background:#24423e;color:#d5fbed;box-shadow:0 15px 30px #0005;font-size:10px}
.capability--web .capability-bottom{background:#0c191fa8;border-color:#9cc9bb20}
.capability--web .capability-bottom>span{background:#75dca80b;color:#a8c7bc;border-color:#91c8b52b}
.capability--workflow{min-height:340px;background:radial-gradient(ellipse at 100% 0,color-mix(in srgb,var(--accent2) 14%,transparent),transparent 72%),color-mix(in srgb,var(--accent2) 4%,var(--bg));border-color:color-mix(in srgb,var(--accent2) 22%,var(--line))}
.capability--workflow h3{font-size:29px}
.capability--workflow .capability-icon{background:color-mix(in srgb,var(--accent2) 12%,var(--bg));border-color:color-mix(in srgb,var(--accent2) 30%,var(--line))}
.flow-preview{gap:8px;padding:17px 14px;margin-top:23px;border:1px solid color-mix(in srgb,var(--accent2) 22%,var(--line));border-radius:12px;background:var(--surface);box-shadow:0 9px 24px -18px #0005}
.flow-preview>span{flex:1;flex-direction:column;gap:7px;font-size:10px;color:var(--ink)}
.flow-preview i{width:34px;height:34px;border-radius:10px;background:color-mix(in srgb,var(--accent2) 10%,var(--bg));color:var(--accent2);border-color:color-mix(in srgb,var(--accent2) 27%,var(--line));font-size:10px}
.flow-preview>b{flex:.55;margin-bottom:20px;background:color-mix(in srgb,var(--accent2) 18%,var(--line))}
.capability--platform{--accent2:#baa5ff;min-height:310px;background:radial-gradient(ellipse at 100% 50%,#9174db24,transparent 74%),var(--bg);border-color:#9d83d838}
html[data-theme="light"] .capability--platform{--accent2:#7854c0;background:radial-gradient(ellipse at 100% 50%,#b99be830,transparent 78%),#f9f7fd;border-color:#9d83d838}
.capability--platform .capability-icon{background:color-mix(in srgb,var(--accent2) 13%,var(--bg));border-color:color-mix(in srgb,var(--accent2) 30%,var(--line))}
.platform-layout{grid-template-columns:minmax(0,1fr) 200px;gap:6px}
.platform-layout h3{font-size:27px}
.platform-orbit{width:200px;height:180px}
.orbit-track{inset:17px 30px;border-style:solid;border-color:color-mix(in srgb,var(--accent2) 25%,var(--line));box-shadow:0 0 35px color-mix(in srgb,var(--accent2) 6%,transparent)}
.orbit-hub{inset:64px 74px;border-radius:16px;font-size:30px;box-shadow:0 10px 30px color-mix(in srgb,var(--accent2) 15%,transparent),inset 0 1px color-mix(in srgb,var(--ink) 8%,transparent);background:color-mix(in srgb,var(--accent2) 15%,var(--bg))}
.orbit-node{padding:10px 12px;font-size:9px;border-color:color-mix(in srgb,var(--accent2) 25%,var(--line));box-shadow:0 8px 18px #0000000c}
.orbit-node--one{top:25px;left:0}.orbit-node--two{top:56px;right:0}.orbit-node--three{bottom:3px;left:70px}
.workflow-stage{border-color:color-mix(in srgb,var(--accent2) 22%,var(--line));box-shadow:0 24px 55px -37px #0007;background:radial-gradient(ellipse at 100% 0,color-mix(in srgb,var(--accent2) 5%,transparent),transparent 65%),var(--surface)}
.detail-next,.service-output{background:linear-gradient(145deg,color-mix(in srgb,var(--accent2) 9%,var(--bg)),var(--bg));border-color:color-mix(in srgb,var(--accent2) 25%,var(--line));box-shadow:0 15px 35px -28px #0005}
.service-related button{background:linear-gradient(145deg,var(--surface),var(--bg));box-shadow:0 12px 25px -23px #0008}
.service-related img{width:86px;height:60px;border:1px solid var(--line);border-radius:7px}
@media(max-width:1100px){.showcase-copy{padding:34px 24px}.showcase-media{margin:39px 28px 50px 0}.showcase-tab{grid-template-columns:48px minmax(0,1fr) 12px;gap:8px;padding:19px 12px}.showcase-tab-thumb{width:48px;height:42px}.showcase-tab strong{font-size:10px}.platform-layout{grid-template-columns:minmax(0,1fr) 170px}.platform-orbit{width:170px}.orbit-hub{inset:64px 59px}.orbit-node--three{left:55px}.platform-layout h3{font-size:25px}}
@media(max-width:900px){.showcase-panel{grid-template-columns:1fr;min-height:0}.showcase-copy{padding:34px}.showcase-copy>.showcase-watermark{font-size:120px;right:35px;top:15px}.showcase-media{min-height:340px;margin:4px 38px 53px;align-self:auto}.showcase-tab{grid-template-columns:60px 1fr 20px;padding:20px}.showcase-tab-thumb{width:60px;height:48px}.showcase-tab strong{font-size:12px}.platform-layout{grid-template-columns:1fr 200px}.platform-orbit{width:200px}.orbit-hub{inset:64px 74px}.orbit-node--three{left:70px}.capability--web{min-height:650px}.capability--workflow,.capability--platform{min-height:300px}.interface-window{max-width:none;width:95%;left:15%}}
@media(max-width:560px){.project-showcase{border-radius:17px}.showcase-copy{padding:29px 24px}.showcase-copy h3{font-size:33px}.showcase-copy>.showcase-watermark{font-size:95px;right:24px;top:17px}.showcase-media{min-height:210px;margin:3px 25px 45px;border-width:4px;border-radius:11px}.showcase-media>img{border-radius:6px}.showcase-image-label{padding:25px 10px 11px}.showcase-image-label>b{font-size:8px}.showcase-tab{grid-template-columns:43px minmax(0,1fr) 10px;padding:19px 10px;gap:8px;min-height:91px}.showcase-tab-thumb{width:43px;height:40px}.showcase-tab strong{font-size:10px}.showcase-tab small{font-size:7px}.showcase-tab>.showcase-tab-index{font-size:6px;top:6px;right:9px}.showcase-tab-arrow{font-size:12px}.capability{border-radius:17px}.capability--web{min-height:625px}.capability--web h3{font-size:36px}.interface-scene{min-height:315px}.interface-window{left:10%;top:48px;width:125%}.interface-float{left:14px;font-size:8px;padding:11px 13px}.capability--workflow h3{font-size:27px}.flow-preview{padding:15px 8px}.flow-preview i{width:32px;height:32px}.platform-layout{grid-template-columns:minmax(0,1fr) 137px}.platform-layout h3{font-size:24px}.platform-orbit{width:137px;height:165px}.orbit-track{inset:25px 14px}.orbit-hub{inset:61px 47px;font-size:25px;border-radius:12px}.orbit-node{padding:8px 7px;font-size:7px}.orbit-node--one{left:-1px;top:25px}.orbit-node--two{right:0;top:59px}.orbit-node--three{left:43px;bottom:7px}.service-related img{width:65px;height:48px}}
