/* Floating concept presentation, based on the supplied visual references. */
.hero-showcase { perspective:1800px; padding-bottom:90px; }
.hero-desktop { border:2px solid #bbdaba; border-left:5px solid #8cbd8b; border-bottom:5px solid #a1caa0; transform:rotateY(-9deg) rotateX(3deg) rotate(3deg); box-shadow:0 44px 55px -24px #50934f60,inset 0 0 0 1px #fff; }
.hero-browser-bar { background:linear-gradient(100deg,#fff,#e8f3e8); color:#8bbf8a; }
.hero-browser-bar > span:first-child { font-size:0; display:flex; gap:6px; }
.hero-browser-bar > span:first-child::before { content:""; width:7px; height:7px; border-radius:50%; background:#ff6058; box-shadow:12px 0 #ffbd2e,24px 0 #28c840; }
.hero-demo-nav { background:#fffefa; position:relative; z-index:2; }.hero-demo-nav b { color:#fff; border:0; background:#ff762a; border-radius:999px; padding:12px 17px; }
.hero-demo-body { display:block; position:relative; isolation:isolate; min-height:450px; overflow:hidden; }
.hero-demo-body > img { position:absolute; inset:0; width:100%; height:100%; min-height:100%; object-fit:cover; object-position:60% 65%; z-index:-2; }
.hero-demo-body::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(100deg,#fffdf7 0%,#fffdf7f5 23%,#fffdf7b8 39%,#fffdf730 55%,transparent 70%); }
.hero-demo-copy { width:65%; padding:65px 30px 55px 40px; }.hero-demo-copy h2 { max-width:470px; font-weight:650; font-size:clamp(35px,4.7vw,64px); }.hero-demo-copy small { color:#db591c; letter-spacing:.22em; }.hero-demo-copy p { color:#65756c; }
.demo-fake-button { background:linear-gradient(110deg,#ff651c,#ff8c36); border-radius:999px; box-shadow:0 8px 20px #ff762a26; }
.hero-demo-footer { display:none; }
.hero-phone { bottom:25px; right:-14px; width:210px; transform:rotate(10deg); border-color:#1e311e; box-shadow:3px 0 0 #a7cfa7,0 30px 45px #335c3240; }
.hero-phone > span { background:linear-gradient(110deg,#ff651c,#ff8c36); border-radius:999px; }
.hero-phone img { height:230px; object-position:55% 65%; }.hero-phone h3 { font-weight:600; }.hero-concept-label { margin-top:42px; }
.project-card { overflow:visible; background:transparent; color:white; min-height:0; box-shadow:none; }
.project-card .project-image { height:auto; aspect-ratio:16/10; object-fit:cover; border:2px solid #bddbbc; border-left:4px solid #81b980; border-bottom:4px solid #90c38f; border-radius:15px; box-shadow:0 28px 45px -20px #8fc28e4d; transform:perspective(1400px) rotateY(4deg) rotate(-1deg); transition:transform .6s ease; }
.project-card:nth-child(2) .project-image { transform:perspective(1400px) rotateY(-4deg) rotate(1deg); }
.project-card:hover .project-image { transform:perspective(1400px) rotateY(0) rotate(0) translateY(-4px); }
.project-card .project-info { padding:28px 6px; }.project-card p { color:#b3cbb2; }.project-card h3 { font-size:26px; }.project-grid { gap:38px; }
.ribbon-card,.portfolio-visual { border:2px solid #bcdbbb; border-left:4px solid #8bbd8a; border-bottom:4px solid #9fcb9e; box-shadow:0 30px 46px -17px #57945645; background:#fff; border-radius:16px; }.portfolio-visual { transform:perspective(1400px) rotateY(-5deg) rotate(-1deg); }.portfolio-item:nth-child(even) .portfolio-visual { transform:perspective(1400px) rotateY(5deg) rotate(1deg); }
@media(max-width:760px) { .hero-showcase { padding-bottom:65px; }.hero-demo-body { min-height:280px; }.hero-demo-copy { width:72%; padding:33px 8px 30px 20px; }.hero-demo-copy h2 { font-size:clamp(27px,6.1vw,40px); }.hero-demo-body::after { background:linear-gradient(100deg,#fffdf7 0%,#fffdf7e6 25%,#fffdf780 48%,transparent 78%); }.hero-demo-nav b { padding:8px 10px; }.hero-phone { width:113px; right:0; bottom:18px; }.hero-phone img { height:126px; }.hero-concept-label { margin-top:30px; }.project-grid { gap:24px; }.project-card .project-info { padding:20px 5px; }.project-card h3 { font-size:23px; } }
@media(prefers-reduced-motion:reduce) { .hero-desktop,.hero-phone,.portfolio-visual,.project-card .project-image { transform:none!important; transition:none; } }