:root{color-scheme:dark;--bg:#080b0a;--panel:#101513;--panel2:#141a17;--line:#25312b;--text:#f0f5f1;--muted:#9aa9a0;--green:#84c83f;--blue:#6db8ff;--max:1160px;--mono:'DM Mono',monospace;--sans:'Manrope',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:82px}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.65 var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}.topbar{height:76px;padding:0 max(24px,calc((100% - var(--max))/2));display:flex;align-items:center;justify-content:space-between;gap:24px;position:sticky;top:0;z-index:10;background:#080b0aef;border-bottom:1px solid #ffffff10;backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:11px;font-size:16px;font-weight:800;letter-spacing:-.04em}.brand-mark{width:36px;height:36px;border:1px solid #84c83f70;border-radius:9px;display:grid;place-items:center;color:var(--green);font:500 12px var(--mono);background:#84c83f0d}.brand small{display:block;margin-top:-3px;color:#77857d;font:400 8px var(--mono);letter-spacing:.06em}.topbar nav{display:flex;align-items:center;gap:28px}.topbar nav a{color:#a8b3ac;font:400 11px var(--mono);transition:color .2s}.topbar nav a:hover{color:var(--green)}.topbar nav .contact-link{padding:9px 13px;border:1px solid #84c83f55;border-radius:5px;color:var(--green)}
.hero{width:min(var(--max),calc(100% - 48px));margin:auto;min-height:610px;padding:86px 0 67px;position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center;overflow:hidden}.hero:before{content:"";position:absolute;width:680px;height:680px;border-radius:50%;background:radial-gradient(circle,#84c83f10,transparent 67%);top:-320px;right:-170px;pointer-events:none}.hero:after{content:"";position:absolute;z-index:0;inset:0;opacity:.12;pointer-events:none;background-image:linear-gradient(#53625820 1px,transparent 1px),linear-gradient(90deg,#53625820 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,black,transparent 88%)}.hero-copy,.hero-visual,.hero-foot{position:relative;z-index:1}.eyebrow{display:flex;align-items:center;gap:9px;margin:0;color:var(--green);font:400 10px var(--mono);letter-spacing:.1em}.status-dot,.window-state i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px #84c83f90}.hero h1{max-width:620px;margin:22px 0;font-size:clamp(45px,5.8vw,72px);line-height:1.06;letter-spacing:-.065em;font-weight:700}.hero h1 span,.closing h2 span{color:var(--green)}.intro{max-width:490px;margin:0;color:#aab6ad;font-size:15px;line-height:1.85}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin-top:29px}.hero-button{display:inline-flex;align-items:center;justify-content:center;gap:13px;padding:13px 17px;border:1px solid var(--green);border-radius:5px;background:var(--green);color:#081008;font:500 11px var(--mono);transition:transform .2s,background .2s}.hero-button:hover{transform:translateY(-2px);background:#a0dc67}.hero-button span{font-size:15px}.live-link{color:#aab6ad;font:400 10px var(--mono);transition:color .2s}.live-link:hover{color:var(--green)}.live-link span{padding-left:5px;color:var(--green)}
.hero-visual{min-width:0;padding:15px;border:1px solid var(--line);border-radius:12px;background:linear-gradient(145deg,#111814,#090c0b);box-shadow:0 25px 80px #0008}.window-top{height:26px;padding:0 2px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid #ffffff10;color:#748078;font:9px var(--mono);letter-spacing:.04em}.dots{display:flex;gap:5px}.dots i{width:6px;height:6px;border-radius:50%;background:#46524a}.dots i:first-child{background:#8aac65}.window-state{display:flex;align-items:center;gap:6px;color:#9aaa9f;font-size:8px}.window-state i{width:5px;height:5px}.hero-visual>a{display:block;margin:15px 0 12px;overflow:hidden;border:1px solid #ffffff12;border-radius:4px;background:#fff}.hero-visual img{width:100%;height:auto;max-height:310px;display:block;object-fit:cover;object-position:top;transition:transform .5s}.hero-visual>a:hover img{transform:scale(1.025)}.visual-foot{display:flex;justify-content:space-between;gap:10px;color:#748078;font:8px var(--mono);letter-spacing:.06em}.hero-foot{position:absolute;bottom:22px;left:0;right:0;display:flex;justify-content:space-between;color:#748078;font:8px var(--mono);letter-spacing:.08em}.hero-foot a{color:#9aa9a0}.hero-foot a:hover{color:var(--green)}.hero-foot b{margin-left:6px;color:var(--green);font-size:13px}
.work{padding:76px 24px 94px;background:var(--panel);border-top:1px solid #ffffff08}.section-heading,.project-grid{width:min(var(--max),100%);margin-left:auto;margin-right:auto}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:32px}.section-heading h2{margin:10px 0 0;font-size:clamp(28px,4vw,39px);line-height:1.2;letter-spacing:-.045em}.count{margin:0 0 4px;color:#829087;font:10px var(--mono)}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.project-card{min-width:0;padding:12px;border:1px solid var(--line);border-radius:9px;background:linear-gradient(160deg,#121815,#0e1210);transition:transform .25s,border-color .25s,box-shadow .25s}.project-card:hover{transform:translateY(-3px);border-color:#84c83f60;box-shadow:0 16px 45px #0005}.project-image{height:clamp(245px,30vw,360px);padding:10px;display:block;position:relative;overflow:hidden;border:1px solid #ffffff0c;border-radius:5px;background:#141a17;text-decoration:none}.image-wedding{background:linear-gradient(145deg,#202a24,#111713)}.image-classic{background:linear-gradient(145deg,#2a1819,#111111)}.image-simple{background:linear-gradient(145deg,#292022,#141214)}.project-image:before{content:"";position:absolute;z-index:1;top:10px;left:10px;right:10px;height:20px;background:#0c100eed;border-bottom:1px solid #ffffff10}.project-image:after{content:"•••";position:absolute;z-index:2;top:9px;left:18px;color:#65736a;font:11px var(--mono);letter-spacing:2px}.project-image img{width:100%;height:100%;display:block;object-fit:cover;object-position:top center;border-radius:3px;box-shadow:0 12px 35px #0006;transition:transform .55s cubic-bezier(.2,.7,.2,1)}.project-image:hover img{transform:scale(1.025)}.image-caption{position:absolute;z-index:2;top:38px;left:22px;padding:5px 7px;background:#080b0aba;border:1px solid #ffffff20;border-radius:3px;color:#dce5de;font:8px var(--mono);letter-spacing:.07em}.view-project{position:absolute;z-index:3;right:19px;bottom:19px;padding:11px 13px;border:1px solid #84c83f55;border-radius:4px;background:#101713f2;color:var(--green);font:9px var(--mono);letter-spacing:.08em;opacity:0;transform:translateY(5px);transition:.25s}.project-image:hover .view-project,.project-image:focus-visible .view-project{opacity:1;transform:none}.view-project span{margin-left:10px;color:var(--green)}.project-meta{display:flex;align-items:end;justify-content:space-between;margin-top:17px}.project-type{margin:0 0 6px;color:#8b9a90;font:8px var(--mono);letter-spacing:.08em}.project-meta h3{margin:0;font-size:20px;letter-spacing:-.025em}.project-number{color:var(--green);font:11px var(--mono)}.project-desc{max-width:420px;margin:8px 0 2px;color:#9aa9a0;font-size:11px;line-height:1.7}
.closing{padding:80px 24px 87px;text-align:center;border-top:1px solid #ffffff0b}.closing .eyebrow{justify-content:center}.closing h2{margin:16px 0 24px;font-size:clamp(32px,5vw,50px);line-height:1.14;letter-spacing:-.05em}.closing .hero-button{font-size:10px}.closing .hero-button span{color:#081008}footer{padding:21px max(24px,calc((100% - var(--max))/2));border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;color:#748078;font:9px var(--mono)}footer a{color:#9aa9a0}footer a:hover{color:var(--green)}
@media(max-width:900px){.hero{grid-template-columns:1fr 0.9fr;gap:30px}.hero h1{font-size:clamp(42px,6vw,60px)}.hero-visual{padding:11px}.project-grid{gap:16px}.project-card{padding:9px}.project-image{padding:8px}.project-image:before{top:8px;left:8px;right:8px}.project-image:after{top:7px;left:16px}}
@media(max-width:680px){html{scroll-padding-top:68px}.topbar{height:68px;padding:0 18px}.topbar nav{gap:16px}.topbar nav a{font-size:10px}.topbar nav .site-link{display:none}.brand{font-size:15px}.brand-mark{width:33px;height:33px}.brand small{font-size:7px}.hero{width:calc(100% - 36px);min-height:0;padding:62px 0 66px;grid-template-columns:1fr;gap:34px}.hero h1{font-size:clamp(42px,11vw,62px);margin:18px 0}.intro{font-size:13px}.hero-visual{max-width:520px;width:100%;justify-self:center}.hero-visual img{max-height:260px}.hero-foot{bottom:19px;font-size:7px}.hero-foot>span{max-width:52%;line-height:1.6}.work{padding:58px 18px 68px}.section-heading{margin-bottom:24px}.section-heading h2{font-size:29px}.project-grid{grid-template-columns:1fr;gap:15px}.project-card{padding:10px}.project-image{height:66vw;max-height:340px;padding:9px}.project-image:before{top:9px;left:9px;right:9px}.project-image:after{top:8px;left:17px}.image-caption{top:36px;left:19px}.view-project{right:16px;bottom:16px;opacity:1;transform:none}.closing{padding:64px 20px}.closing h2{font-size:36px}footer{padding:18px;flex-wrap:wrap;font-size:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}

.brand{flex:none;display:flex;align-items:center}
.brand-logo{display:block;width:206px;max-width:100%;height:auto;mix-blend-mode:screen}
@media(max-width:680px){.brand-logo{width:clamp(118px,37vw,154px)}}

.hero-visual img{height:310px;object-fit:cover;object-position:top center;opacity:1;transition:opacity .18s ease,transform .5s}
.hero-visual img.is-changing{opacity:0}
.slide-controls{display:flex;align-items:center;gap:8px;color:var(--blue);font:8px var(--mono)}
.slide-controls button{width:25px;height:25px;padding:0;display:grid;place-items:center;border:1px solid var(--line);border-radius:4px;background:#101713;color:#aab6ad;cursor:pointer;transition:border-color .2s,color .2s}
.slide-controls button:hover,.slide-controls button:focus-visible{border-color:var(--green);color:var(--green);outline:none}
.slide-controls svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:680px){.hero-visual img{height:230px}}
@media(prefers-reduced-motion:reduce){.hero-visual img{transition:none}}

/* Small blue details carry the secondary Ping2Ops accent. */
.topbar nav .site-link,.visual-foot span:last-child{color:var(--blue)}
.project-card:nth-child(3) .project-number{color:var(--blue)}
@media(max-width:680px){.topbar{padding-left:12px;padding-right:12px;gap:8px}.topbar nav{gap:10px}.topbar nav a{font-size:8px}.topbar nav .site-link{display:inline}.topbar nav .contact-link{padding:7px 8px}.brand{font-size:13px;gap:7px}.brand-mark{width:30px;height:30px}.brand small{display:none}}
