:root{--cream:#f1eee6;--cream-2:#e5ded2;--ink:#171615;--red:#f04425;--blue:#2648ff;--lime:#d4ff35;--muted:#6d6a65;--line:rgba(23,22,21,.18);--pad:clamp(1.25rem,4vw,4.5rem);--display:"Manrope",sans-serif;--body:"DM Sans",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--body);line-height:1.55;overflow-x:hidden}a{color:inherit}button{font:inherit}.skip-link{position:fixed;z-index:1000;top:1rem;left:1rem;background:var(--ink);color:white;padding:.8rem 1rem;transform:translateY(-150%)}.skip-link:focus{transform:none}:focus-visible{outline:3px solid var(--blue);outline-offset:4px}.site-header{position:fixed;z-index:50;top:0;left:0;width:100%;height:80px;padding:0 var(--pad);display:flex;align-items:center;justify-content:space-between;transition:.25s;background:linear-gradient(var(--cream),transparent)}.site-header.scrolled{height:66px;background:rgba(241,238,230,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.logo{display:flex;align-items:center;gap:.65rem;text-decoration:none;font:800 1.18rem var(--display);letter-spacing:-.05em}.logo-mark{display:flex;gap:2px;align-items:flex-end;width:23px;height:24px}.logo-mark i{display:block;width:6px;background:currentColor;border-radius:5px}.logo-mark i:first-child{height:11px}.logo-mark i:nth-child(2){height:22px}.logo-mark i:last-child{height:16px}.main-nav{display:flex;align-items:center;gap:2rem;font-size:.88rem;font-weight:600}.main-nav a{text-decoration:none}.main-nav>a:not(.nav-cta):hover{text-decoration:underline;text-underline-offset:5px}.nav-cta{background:var(--ink);color:white;padding:.75rem 1rem;border-radius:99px}.nav-cta span{margin-left:.5rem}.menu-button{display:none;border:0;background:none;font-weight:700}.hero{min-height:100vh;padding:clamp(9rem,16vh,12rem) var(--pad) 4rem}.hero-copy{display:grid;grid-template-columns:1.3fr .7fr;gap:4rem}.eyebrow,.section-label{text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;font-weight:700}.eyebrow{grid-column:1/-1;display:flex;gap:.65rem;align-items:center}.eyebrow span{width:8px;height:8px;border-radius:50%;background:var(--red)}.hero h1{font:700 clamp(3.6rem,8.5vw,8.8rem)/.88 var(--display);letter-spacing:-.075em;margin:clamp(2rem,5vw,4.5rem) 0 0}.hero h1 em,.intro h2 em,.statement h2 em,.cta-section h2 em{font-family:Georgia,serif;font-weight:400}.hero-intro{align-self:end;padding-bottom:.7rem}.hero-intro p{font-size:clamp(1rem,1.5vw,1.25rem);max-width:490px;margin:0 0 2rem}.text-link{display:inline-block;font-weight:700;text-underline-offset:5px}.text-link span{margin-left:.5rem}.browser-stage{position:relative;margin-top:5rem;background:var(--red);padding:clamp(2rem,5vw,5rem);min-height:650px;display:grid;place-items:center}.browser-window{width:min(100%,1050px);background:#fff;border:2px solid var(--ink);box-shadow:22px 24px 0 rgba(23,22,21,.25);transform:rotate(-1deg)}.browser-bar{height:42px;border-bottom:2px solid var(--ink);display:flex;align-items:center;gap:7px;padding:0 14px;font-size:.68rem}.browser-bar i{width:9px;height:9px;border:1px solid var(--ink);border-radius:50%;background:var(--cream)}.browser-bar span{margin-left:auto;color:var(--muted)}.browser-content{height:470px;position:relative;background:var(--lime);padding:1.5rem;overflow:hidden}.browser-nav{display:flex;justify-content:space-between;font-size:.75rem;font-weight:700}.browser-message{position:absolute;z-index:2;left:1.5rem;bottom:2rem;font:800 clamp(3.5rem,7vw,7.5rem)/.78 var(--display);letter-spacing:-.08em;text-transform:uppercase}.browser-message em{font-family:Georgia,serif;font-weight:400;text-transform:none}.browser-shape{position:absolute;border:2px solid var(--ink)}.shape-one{width:330px;height:330px;border-radius:50%;right:-60px;top:45px;background:var(--blue)}.shape-two{width:190px;height:190px;border-radius:50%;right:180px;top:155px;background:var(--red)}.browser-sticker{position:absolute;z-index:3;right:45px;bottom:38px;width:120px;height:120px;border-radius:50%;background:var(--cream);border:2px solid var(--ink);display:grid;place-items:center;text-align:center;font-weight:700;line-height:1.1;transform:rotate(9deg)}.browser-footer{position:absolute;right:1.5rem;bottom:1rem;display:flex;gap:1rem;align-items:center;font-size:.68rem;text-transform:uppercase;letter-spacing:.1em}.stage-note{position:absolute;background:var(--cream);border:1px solid var(--ink);padding:.65rem .9rem;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em}.note-left{left:2rem;bottom:2rem;transform:rotate(5deg)}.note-right{right:2rem;top:2rem;transform:rotate(-5deg)}.value-strip{background:var(--ink);color:white;overflow:hidden;padding:1rem 0}.marquee{display:flex;gap:2rem;width:max-content;white-space:nowrap;animation:marquee 22s linear infinite}.marquee span{text-transform:uppercase;letter-spacing:.13em;font-size:.75rem}.marquee b{color:var(--lime)}@keyframes marquee{to{transform:translateX(-50%)}}.section{padding:clamp(6rem,11vw,10rem) var(--pad)}.intro{display:grid;grid-template-columns:.35fr 1.65fr;gap:4rem}.intro-main h2{font:700 clamp(2.8rem,6vw,6.3rem)/.98 var(--display);letter-spacing:-.065em;margin:0;max-width:1150px}.intro-body{display:grid;grid-template-columns:1fr 1fr;gap:3rem;margin:4rem 0 0 auto;max-width:800px;color:var(--muted);font-size:1.04rem}.intro-body p{margin:0}.services{background:var(--ink);color:white}.services-heading{display:grid;grid-template-columns:.35fr 1fr .65fr;gap:4rem;align-items:end;margin-bottom:5rem}.services-heading h2{font:700 clamp(3rem,6vw,6.2rem)/.9 var(--display);letter-spacing:-.065em;margin:0}.services-heading>p:last-child{color:#b7b4ad;max-width:420px;margin:0}.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.service-card{min-height:360px;background:var(--cream);color:var(--ink);padding:2rem;display:flex;flex-direction:column;justify-content:space-between}.service-featured{grid-column:1/-1;min-height:600px;background:var(--lime);display:grid;grid-template-columns:1fr 1fr;gap:4rem}.service-top{grid-column:1/-1;display:flex;justify-content:space-between;text-transform:uppercase;font-size:.68rem;font-weight:700;letter-spacing:.1em}.service-arrow{font-size:2rem}.service-card h3{font:700 clamp(2rem,4vw,4.4rem)/.95 var(--display);letter-spacing:-.055em;margin:0 0 1rem}.service-card p{max-width:620px;margin:0;color:var(--muted)}.service-featured>div:last-child{align-self:end}.service-featured p{font-size:1.05rem}.service-featured ul{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0;margin:1.7rem 0 0}.service-featured li{border:1px solid var(--ink);border-radius:99px;padding:.45rem .8rem;font-size:.78rem;font-weight:600}.service-visual{position:relative;align-self:stretch;min-height:350px}.service-visual div{position:absolute;border:2px solid var(--ink);background:var(--cream)}.service-visual div:first-child{width:70%;height:72%;left:0;top:10%;box-shadow:12px 12px 0 var(--ink)}.service-visual div:nth-child(2){width:47%;height:55%;right:0;bottom:0;background:var(--blue)}.service-visual div:last-child{width:70px;height:70px;border-radius:50%;right:9%;top:0;background:var(--red)}.service-num{font-size:.7rem;font-weight:700;letter-spacing:.1em}.service-dark{background:#262523;color:white}.service-dark p{color:#b7b4ad}.service-red{background:var(--red)}.service-red p{color:#3d160f}.service-outline{background:transparent;color:white;border:1px solid rgba(255,255,255,.4)}.service-outline p{color:#b7b4ad}.statement{background:var(--blue);color:white;text-align:center;padding:clamp(7rem,14vw,14rem) var(--pad)}.statement h2{font:700 clamp(3.8rem,8vw,8.8rem)/.86 var(--display);letter-spacing:-.075em;margin:3rem 0}.statement-note{max-width:510px;margin:0 auto;color:#d9deff;font-size:1.1rem}.approach{display:grid;grid-template-columns:.75fr 1.25fr;gap:8vw}.approach-heading h2{font:700 clamp(3rem,5vw,5.2rem)/.95 var(--display);letter-spacing:-.06em;margin:2rem 0 0}.steps{list-style:none;padding:0;margin:0}.steps li{position:relative;display:grid;grid-template-columns:60px 1fr;padding:2rem 0;border-top:1px solid var(--line);overflow:hidden}.steps li:last-child{border-bottom:1px solid var(--line)}.steps>li>span{font-size:.7rem;font-weight:700}.steps h3{font:700 clamp(1.6rem,2.5vw,2.5rem) var(--display);letter-spacing:-.04em;margin:0}.steps p{margin:.6rem 0 0;max-width:530px;color:var(--muted)}.steps b{position:absolute;right:0;top:-28px;font:800 8rem var(--display);color:rgba(23,22,21,.045)}.cta-section{background:var(--red);padding:clamp(7rem,12vw,12rem) var(--pad)}.cta-section h2{font:700 clamp(3.4rem,7.5vw,8rem)/.92 var(--display);letter-spacing:-.072em;margin:3rem 0}.cta-bottom{display:flex;align-items:flex-end;justify-content:space-between}.cta-bottom>p{max-width:500px;font-size:1.1rem}.round-cta{width:165px;height:165px;border-radius:50%;background:var(--ink);color:white;display:flex;align-items:center;justify-content:center;gap:1.3rem;text-decoration:none;font-weight:700;line-height:1.1;transition:.25s}.round-cta:hover{transform:rotate(-5deg) scale(1.04)}.round-cta b{font-size:1.6rem}footer{background:var(--ink);color:white;padding:4rem var(--pad);display:grid;grid-template-columns:1fr 1fr;gap:2rem}.footer-logo{align-self:start}footer p{margin:0;font:600 1.15rem var(--display)}.footer-links{display:flex;gap:1.5rem;flex-wrap:wrap}.footer-links a{color:#bab7b0;text-decoration:none;font-size:.85rem}.footer-links a:hover{color:white}footer small{grid-column:2;color:#77756f}.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){.hero-copy{grid-template-columns:1fr}.hero-intro{max-width:600px}.browser-stage{min-height:550px}.browser-content{height:390px}.intro,.approach{grid-template-columns:1fr}.intro-main{margin-top:2rem}.services-heading{grid-template-columns:1fr 1fr}.services-heading .section-label{grid-column:1/-1}.service-featured{grid-template-columns:1fr}.service-visual{min-height:250px}.services-heading>p:last-child{align-self:end}.approach-heading{margin-bottom:3rem}}
@media(max-width:700px){.site-header{height:66px}.menu-button{display:block}.main-nav{position:absolute;top:66px;left:0;width:100%;background:var(--cream);border-bottom:1px solid var(--line);padding:1rem var(--pad) 1.5rem;display:none;flex-direction:column;align-items:stretch}.main-nav.open{display:flex}.nav-cta{text-align:center}.hero{padding-top:8rem}.hero h1{font-size:clamp(3.3rem,15vw,5.5rem)}.browser-stage{margin-top:3rem;padding:2.5rem 1rem;min-height:470px}.browser-content{height:330px}.browser-message{font-size:3.2rem}.shape-one{width:230px;height:230px}.shape-two{width:120px;height:120px;right:110px}.browser-sticker{width:90px;height:90px;font-size:.75rem}.stage-note{display:none}.intro-body{grid-template-columns:1fr;gap:1.5rem}.services-heading{grid-template-columns:1fr}.services-grid{grid-template-columns:1fr}.service-featured{grid-column:1;min-height:650px}.service-card{min-height:320px}.service-featured{display:flex}.service-visual{order:2;width:100%}.cta-bottom{display:block}.round-cta{margin:2rem 0 0 auto}footer{grid-template-columns:1fr}footer small{grid-column:1}}
@media(max-width:420px){.hero h1{font-size:3.4rem}.browser-bar span{display:none}.browser-message{font-size:2.7rem}.browser-sticker{right:15px}.service-card{padding:1.5rem}.service-featured{min-height:690px}.statement h2{font-size:3.8rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.marquee{animation:none}.reveal{opacity:1;transform:none;transition:none}*{transition-duration:.01ms!important}}

/* Official Sampalab brand assets */
.logo{display:flex;align-items:center;text-decoration:none;font:inherit;letter-spacing:normal}.logo img{display:block;width:145px;height:auto;max-height:52px}.footer-logo{width:max-content}.footer-logo img{width:155px}

/* Shared interior pages */
.page-shell{min-height:100vh;padding:clamp(9rem,15vh,11rem) var(--pad) clamp(5rem,9vw,8rem)}.page-eyebrow{display:flex;align-items:center;gap:.6rem;text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;font-weight:700}.page-eyebrow:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--red)}.page-title{font:700 clamp(3.5rem,8vw,8.5rem)/.9 var(--display);letter-spacing:-.075em;margin:2.5rem 0}.page-title em,.package-hero h1 em{font-family:Georgia,serif;font-weight:400}.page-lead{max-width:620px;font-size:clamp(1rem,1.5vw,1.22rem);color:var(--muted)}

/* Contact */
.contact-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:8vw;align-items:start}.contact-copy{position:sticky;top:110px}.contact-copy .page-title{font-size:clamp(3.5rem,6vw,6.6rem)}.contact-details{display:grid;gap:1.4rem;margin-top:4rem;padding-top:2rem;border-top:1px solid var(--line)}.contact-detail span{display:block;text-transform:uppercase;letter-spacing:.12em;font-size:.66rem;font-weight:700;color:var(--muted);margin-bottom:.35rem}.contact-detail a{font-weight:700;text-underline-offset:4px}.project-form{background:var(--ink);color:white;padding:clamp(2rem,5vw,4.5rem)}.project-form h2{font:700 clamp(2rem,3.5vw,3.6rem)/1 var(--display);letter-spacing:-.05em;margin:0 0 3rem}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}.form-field{position:relative}.form-field-wide{grid-column:1/-1}.form-field label{display:block;font-size:.69rem;font-weight:700;text-transform:uppercase;letter-spacing:.11em;color:#b7b4ad;margin-bottom:.5rem}.form-field input,.form-field textarea,.form-field select{width:100%;border:0;border-bottom:1px solid rgba(255,255,255,.35);border-radius:0;background:transparent;color:white;padding:.75rem 0;outline:none;font:inherit}.form-field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,white 50%),linear-gradient(135deg,white 50%,transparent 50%);background-position:calc(100% - 14px) 55%,calc(100% - 8px) 55%;background-size:6px 6px;background-repeat:no-repeat}.form-field option{background:var(--ink);color:white}.form-field textarea{resize:vertical;min-height:120px}.form-field input:focus,.form-field textarea:focus,.form-field select:focus{border-color:var(--lime);box-shadow:0 2px 0 var(--lime)}.form-field ::placeholder{color:#7e7d78}.form-hidden{position:absolute!important;left:-9999px!important}.form-submit{margin-top:2.5rem;border:0;border-radius:99px;background:var(--lime);color:var(--ink);padding:1rem 1.4rem;font-weight:700;cursor:pointer}.form-submit:hover{background:var(--red)}.form-note{font-size:.76rem;color:#8e8c86;margin-top:1rem}.form-status{min-height:1.4em;color:var(--lime);font-size:.9rem}.form-status.error{color:#ff806c}

/* Package */
.package-hero{padding:clamp(10rem,17vh,13rem) var(--pad) 6rem;background:var(--lime);display:grid;grid-template-columns:1.2fr .8fr;gap:5vw;align-items:end}.package-hero h1{font:700 clamp(3.6rem,7.5vw,8rem)/.88 var(--display);letter-spacing:-.075em;margin:2.5rem 0 0}.package-summary{border-left:1px solid var(--ink);padding-left:2rem}.package-summary p{font-size:1.1rem;margin:0 0 2rem}.package-price span{display:block;text-transform:uppercase;letter-spacing:.12em;font-size:.68rem;font-weight:700}.package-price strong{display:block;font:800 clamp(3rem,5vw,5.5rem) var(--display);letter-spacing:-.07em}.package-content{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw}.package-intro h2{font:700 clamp(2.8rem,5vw,5rem)/.98 var(--display);letter-spacing:-.06em;margin:1.5rem 0}.package-intro>p:last-child{color:var(--muted);max-width:500px}.package-includes{list-style:none;padding:0;margin:0}.package-includes li{display:grid;grid-template-columns:50px 1fr;padding:1.7rem 0;border-top:1px solid var(--line)}.package-includes li:last-child{border-bottom:1px solid var(--line)}.package-includes span{font-size:.68rem;font-weight:700}.package-includes h3{font:700 clamp(1.35rem,2vw,2rem) var(--display);margin:0 0 .45rem}.package-includes p{color:var(--muted);margin:0}.timeline{background:var(--blue);color:white}.timeline-head{display:grid;grid-template-columns:.5fr 1fr;gap:3rem;margin-bottom:5rem}.timeline-head h2{font:700 clamp(3rem,6vw,6.3rem)/.9 var(--display);letter-spacing:-.065em;margin:0}.timeline-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.4)}.timeline-week{padding:1.8rem 1.4rem 0;border-right:1px solid rgba(255,255,255,.25);min-height:250px}.timeline-week:last-child{border-right:0}.timeline-week span{font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:#cfd5ff}.timeline-week h3{font:700 1.5rem var(--display);margin:1.5rem 0 .7rem}.timeline-week p{color:#cfd5ff;margin:0;font-size:.9rem}.package-fit{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.fit-card{padding:clamp(2rem,4vw,4rem);min-height:380px;background:var(--cream-2)}.fit-card:last-child{background:var(--red)}.fit-card h2{font:700 clamp(2.3rem,4vw,4rem)/1 var(--display);letter-spacing:-.055em;margin:0 0 3rem}.fit-card ul{list-style:none;padding:0;margin:0}.fit-card li{padding:.65rem 0;border-bottom:1px solid rgba(23,22,21,.25)}.fit-card li:before{content:"→";margin-right:.7rem;font-weight:700}

@media(max-width:800px){.contact-layout,.package-hero,.package-content{grid-template-columns:1fr}.contact-copy{position:static}.package-summary{border-left:0;border-top:1px solid var(--ink);padding:2rem 0 0}.timeline-head{grid-template-columns:1fr}.timeline-grid{grid-template-columns:1fr 1fr}.timeline-week{border-bottom:1px solid rgba(255,255,255,.25)}.package-fit{grid-template-columns:1fr}}
@media(max-width:560px){.logo img{width:125px}.footer-logo img{width:140px}.form-grid{grid-template-columns:1fr}.form-field-wide{grid-column:1}.project-form{padding:2rem 1.4rem}.timeline-grid{grid-template-columns:1fr}.timeline-week{border-right:0;min-height:auto;padding:1.8rem 0}.page-title{font-size:3.5rem}.package-hero h1{font-size:3.6rem}}
