/* Squiggle – mall portfolio site */
@font-face{font-family:'Poppins';src:url(../fonts/poppins-Light.woff2) format('woff2');font-weight:300;font-style:normal;font-display:swap;}
@font-face{font-family:'Poppins';src:url(../fonts/poppins-Regular.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Poppins';src:url(../fonts/poppins-Medium.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Poppins';src:url(../fonts/poppins-Bold.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Poppins';src:url(../fonts/poppins-Bold.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap;}
:root{
  --ink:#231F20; --lime:#A8D912; --lime-dark:#7FA80A; --bg:#FCFCFC; --alt:#F4F4F2;
  --muted:#6E6E6E; --line:#E4E4E4; --tint:#F2F8E0; --hero:#EBEBEB;
  --bs-body-font-family:'Poppins',sans-serif; --bs-body-color:#3a3637; --bs-body-bg:var(--bg);
}
html{ scroll-padding-top:80px; }
body{ overflow-x:clip; font-family:'Poppins',sans-serif; color:#3a3637; background:var(--bg); }
h1,h2,h3,h4{ color:var(--ink); font-weight:700; letter-spacing:-.02em; }
h2{ font-size:clamp(1.9rem,3.6vw,2.8rem); line-height:1.12; margin:.6rem 0 1.4rem; }
p{ line-height:1.7; }
.dot{ color:var(--lime); }
.kicker{ font-size:.75rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--lime-dark); }
.kicker-grey{ color:var(--muted); }
.lead-sm{ font-size:1.12rem; font-weight:300; color:var(--ink); }
.mw-h{ max-width:820px; } .mw-p{ max-width:820px; }
.section{ padding:110px 0; }
.section-alt{ background:var(--alt); }

/* Buttons */
.btn{ font-weight:500; border-radius:999px; padding:.6rem 1.4rem; }
.btn-lg{ padding:.8rem 1.8rem; font-size:1rem; }
.btn-lime{ background:var(--lime); color:var(--ink); border:none; }
.btn-lime:hover,.btn-lime:focus{ background:#95c30c; color:var(--ink); }
.btn-dark{ background:var(--ink); border-color:var(--ink); }

/* Nav */
.navbar{ background:rgba(252,252,252,.92); backdrop-filter:blur(8px); transition:box-shadow .2s; padding:.8rem 0; }
.navbar.scrolled{ box-shadow:0 2px 18px rgba(0,0,0,.07); }
.nav-link{ font-size:.92rem; font-weight:500; color:var(--ink); }
.nav-link:hover,.nav-link.active{ color:var(--lime-dark)!important; }

/* Hero */
.hero{ background:var(--hero) url(../img/hero-bg.jpg) no-repeat right top / cover; margin-top:68px; min-height:calc(100vh - 68px); display:flex; align-items:center; padding:60px 0; }
.hero h1{ font-size:clamp(2.4rem,5.2vw,4.4rem); line-height:1.06; margin:1.2rem 0 1.6rem; }
.hero .lead{ font-size:1.2rem; font-weight:400; max-width:540px; }
.hero-meta{ margin-top:3rem; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
@media (max-width:991.98px){
  .hero{ background-image:none; min-height:auto; padding-top:40px; }
}

/* Stats */
.stats{ display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--line); }
.stat{ padding:2rem 1.5rem 1.8rem 0; border-bottom:1px solid var(--line); }
.stat:nth-child(odd){ border-right:1px solid var(--line); }
.stat:nth-child(even){ padding-left:2rem; }
.stat .n{ font-size:clamp(2.6rem,5vw,3.8rem); font-weight:700; line-height:1; color:var(--ink); letter-spacing:-.03em; }
.stat .n small{ font-size:.42em; color:var(--lime); margin-left:.15em; }
.stat .l{ font-size:.9rem; color:var(--muted); margin-top:.7rem; }

/* Services */
.svc{ border-top:3px solid var(--lime); padding-top:1.2rem; height:100%; }
.svc span{ font-size:.75rem; font-weight:600; color:var(--lime-dark); letter-spacing:.1em; }
.svc h3{ font-size:1.2rem; margin:.4rem 0 .6rem; }
.svc p{ color:#555; margin:0; }

/* Malls */
.mall{ padding:70px 0; border-bottom:1px solid var(--line); }
.mall:last-child{ border-bottom:none; padding-bottom:0; }
.mall-num{ font-size:.75rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--lime-dark); }
.mall h3{ font-size:clamp(1.8rem,3vw,2.4rem); margin:.4rem 0 .2rem; }
.loc{ color:var(--muted); }
.kpis{ display:flex; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin:1.4rem 0; }
.kpis div{ flex:1; padding:.9rem 0; }
.kpis div+div{ padding-left:1rem; border-left:1px solid var(--line); }
.kpis b{ display:block; font-size:1.6rem; color:var(--ink); line-height:1.1; letter-spacing:-.02em; }
.kpis span{ font-size:.75rem; color:var(--muted); }
.mall blockquote{ font-size:1.2rem; font-weight:500; color:var(--ink); border-left:3px solid var(--lime); padding-left:1rem; margin:0 0 1rem; }
.chips{ margin-top:1.2rem; }
.chips span{ display:inline-block; font-size:.8rem; padding:.3rem .8rem; border-radius:999px; background:var(--tint); color:#3d4a12; margin:0 .35rem .45rem 0; }

/* Process */
.step{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:1.6rem 1.4rem; height:100%; }
.step i{ font-style:normal; width:34px; height:34px; border-radius:50%; background:var(--lime); color:var(--ink); font-weight:700; display:flex; align-items:center; justify-content:center; }
.step h3{ font-size:1.2rem; margin:1.1rem 0 .5rem; }
.step p{ font-size:.92rem; color:#555; margin:0; }
.gains{ margin-top:3rem; padding-top:2.4rem; border-top:1px solid var(--line); }
.gains h4{ font-size:1.05rem; }
.gains h4::before{ content:''; display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--lime); margin-right:.5rem; }
.gains p{ font-size:.92rem; color:#555; }

/* Work */
.tile{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:1rem; height:200px; display:flex; align-items:center; justify-content:center; }
.tile.tall{ height:290px; } .tile.short{ height:140px; }
.tile img{ max-width:100%; max-height:100%; object-fit:contain; }
.clients{ margin-top:2rem; padding-top:1.5rem; border-top:1px solid var(--line); }
.clients ul{ list-style:none; padding:0; margin:.8rem 0 0; display:flex; flex-wrap:wrap; gap:.3rem 0; }
.clients li{ font-weight:600; color:var(--ink); white-space:nowrap; }
.clients li:not(:last-child)::after{ content:'·'; color:var(--lime); margin:0 .55rem; }

/* Contact */
.contact{ background:var(--ink); color:#cfcfcf; position:relative; overflow:hidden; }
.contact h2{ color:#fff; }
.contact .lead-sm{ color:#cfcfcf; }
.contact-squig{ position:absolute; right:-120px; bottom:-60px; width:560px; opacity:.9; pointer-events:none; }
.contact-details{ margin-top:2rem; line-height:2; }
.contact-details strong{ color:#fff; }
.contact-details span{ color:#a9a9a9; font-size:.92rem; }
.contact-details a{ color:#fff; text-decoration:none; } .contact-details a:hover{ color:var(--lime); }
.contact-form{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); border-radius:16px; padding:2rem; backdrop-filter:blur(4px); }
.contact-form .form-label{ color:#e6e6e6; font-size:.88rem; }
.contact-form .form-control{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.15); color:#fff; border-radius:10px; padding:.7rem .9rem; }
.contact-form .form-control:focus{ background:rgba(255,255,255,.1); border-color:var(--lime); box-shadow:0 0 0 .2rem rgba(168,217,18,.2); color:#fff; }
.contact-form .form-control.is-invalid{ border-color:#ff7b7b; }
.hp{ position:absolute!important; left:-9999px; width:1px; height:1px; overflow:hidden; }
.form-status{ font-size:.92rem; }
.form-status.ok{ color:var(--lime); } .form-status.err{ color:#ff9b9b; }

.footer{ background:#1a1718; color:#8c8c8c; font-size:.85rem; padding:1.4rem 0; }
.footer a{ color:#8c8c8c; text-decoration:none; } .footer a:hover{ color:var(--lime); }

@media (max-width:575.98px){ .container{ padding-left:20px; padding-right:20px; } }
@media (max-width:767.98px){
  .section{ padding:80px 0; }
  .stat:nth-child(even){ padding-left:1rem; }
  .contact-squig{ width:380px; opacity:.35; }
  .contact-form{ padding:1.3rem; }
}
