/* Newspring Trade – mobile-first. Base = phone, then min-width breakpoints. */
@font-face{font-family:"Archivo";src:url("assets/archivo.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}

:root{--ink:#000;--paper:#fff;--text:#3A434C;--muted:#5B6670;--soft:#C4CBD1;--accent:#B4532A;--pad:20px;--max:1280px}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-size:17px;line-height:1.5;padding-bottom:env(safe-area-inset-bottom,0px)}
img{display:block;max-width:100%;height:auto}
a{color:var(--ink)}a:hover{color:var(--accent)}
a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--paper);padding:12px 16px;z-index:10}
.skip:focus{left:var(--pad)}

.wrap{max-width:var(--max);margin:0 auto;padding-left:max(var(--pad),env(safe-area-inset-left,0px));padding-right:max(var(--pad),env(safe-area-inset-right,0px))}
.display{font-weight:800;font-stretch:112%;letter-spacing:-.035em;line-height:.96;margin:0}

/* Header */
.site-header .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:max(14px,env(safe-area-inset-top,0px));padding-bottom:14px}
.brand{font-size:19px;font-weight:800;font-stretch:112%;letter-spacing:-.02em;text-decoration:none;color:var(--ink)}
.nav{display:flex;gap:20px;font-size:16px;font-weight:500}
.nav a{text-decoration:none;display:inline-block;padding:12px 0}

/* Hero */
.hero .wrap{padding-top:40px;padding-bottom:44px}
.hero h1{font-size:clamp(40px,11vw,104px);max-width:12ch}
.hero p{margin:20px 0 0;max-width:34ch;color:var(--text)}
.hero-img{width:100%;aspect-ratio:3/2;object-fit:cover}

/* Statement */
.statement .wrap{padding-top:72px;padding-bottom:48px}
.statement h2{font-size:clamp(34px,8.6vw,76px);line-height:1}

/* Services */
.services .wrap{padding-top:16px;padding-bottom:88px}
.label{margin:0 0 28px;font-size:16px;font-weight:600;color:var(--muted)}
.grid{display:grid;gap:36px}
.grid h3{margin:0 0 10px;font-size:26px;font-weight:800;font-stretch:112%;letter-spacing:-.02em}
.grid p{margin:0;color:var(--text);max-width:38ch}

/* Contact */
.contact{background:var(--ink);color:var(--paper)}
.contact .wrap{padding-top:80px;padding-bottom:88px}
.contact h2{font-size:clamp(40px,10vw,88px)}
.contact p{margin:20px 0 32px;max-width:34ch;color:var(--soft)}
.mail{display:inline-block;padding:8px 0;font-size:clamp(21px,6vw,40px);font-weight:600;color:var(--paper);overflow-wrap:anywhere;text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:8px;text-decoration-color:var(--accent)}
.mail:hover{color:var(--soft)}

/* Footer */
.site-footer .wrap{padding-top:48px;padding-bottom:40px;font-size:15px;line-height:1.6;color:var(--text)}
.foot{display:grid;gap:24px}
.foot p{margin:0}
.foot strong{color:var(--ink);font-weight:600}
.foot .brand{font-size:19px}
.foot-links{display:flex;gap:24px}
.foot-links a{display:inline-block;padding:10px 0}
.copy{margin:40px 0 0;font-size:14px;color:var(--muted)}

/* Legal pages */
.legal .wrap{padding-top:40px;padding-bottom:88px}
.legal h1{font-size:clamp(38px,10vw,72px);margin-bottom:32px}
.legal h2{margin:40px 0 10px;font-size:21px;font-weight:800;font-stretch:112%;letter-spacing:-.01em}
.legal p,.legal ul{margin:0 0 14px;color:var(--text);max-width:68ch}
.legal ul{padding-left:20px}
.legal address{font-style:normal}
.updated{font-size:15px;color:var(--muted)}

/* Tablet */
@media (min-width:640px){
  :root{--pad:32px}
  body{font-size:18px}
  .nav{gap:32px}
  .hero .wrap{padding-top:72px;padding-bottom:64px}
  .hero p{font-size:19px}
  .statement .wrap{padding-top:120px;padding-bottom:64px}
  .grid{grid-template-columns:repeat(3,1fr);gap:40px}
  .foot{grid-template-columns:repeat(2,1fr);gap:28px 48px}
}

/* Desktop */
@media (min-width:1024px){
  :root{--pad:40px}
  .site-header .wrap{padding-top:28px;padding-bottom:28px}
  .brand{font-size:22px}
  .hero .wrap{padding-top:96px;padding-bottom:80px}
  .hero p{font-size:20px;max-width:30em}
  .hero-img{aspect-ratio:auto;height:min(52vw,760px);object-position:50% 55%}
  .statement .wrap{padding-top:160px;padding-bottom:72px}
  .services .wrap{padding-bottom:160px}
  .label{margin-bottom:48px;font-size:18px}
  .grid{gap:64px}
  .grid h3{font-size:30px}
  .contact .wrap{padding-top:140px;padding-bottom:140px}
  .contact p{font-size:20px}
  .foot{grid-template-columns:2fr 1.2fr 1.4fr .8fr;gap:28px 64px}
  .foot-links{flex-direction:column;gap:0}
  .foot-links a{padding:2px 0}
  .legal .wrap{padding-top:80px}
}
