/* Sloprepair: getworker layout and type patterns, adapted to a warm workshop identity.
   Self-hosted fonts and Lucide icons: see THIRD_PARTY_NOTICES.md. */
@font-face{font-family:Anton;src:url('/assets/fonts/anton-400.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Darker;src:url('/assets/fonts/darker-900.woff2') format('woff2');font-style:normal;font-weight:900;font-display:swap}
@font-face{font-family:Jakarta;src:url('/assets/fonts/jakarta-400.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Jakarta;src:url('/assets/fonts/jakarta-600.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}


/* Deliberate brand variation: coral/lavender, warm charcoal and a workshop story
   instead of getworker's violet studio and marketplace structure. */
:root { --background:#171512; --text:#fff7e9; --copy:#f3eadb; --primary:#ff9786; --secondary:#c4b5fd; --line:rgba(196,181,253,.24); --gutter:56px; }
* { box-sizing:border-box; }
html { background:var(--background); color:var(--text); font-family:Jakarta,Arial,sans-serif; color-scheme:dark; -webkit-font-smoothing:antialiased; scroll-padding-top:32px; }
body { margin:0; }
a { color:inherit; text-underline-offset:6px; }
a:focus-visible { outline:3px solid var(--secondary); outline-offset:6px; }
p,h1,h2,h3 { margin:0; }
.icon { display:block; width:24px; height:24px; flex:0 0 24px; }
.site-shell { position:relative; width:min(1280px,calc(100% - 2 * var(--gutter))); margin-inline:auto; }
.hero-world { position:absolute; inset:0 0 auto; height:930px; pointer-events:none; background:linear-gradient(90deg,rgba(23,21,18,.94),rgba(23,21,18,.74) 35%,rgba(23,21,18,.12) 73%),linear-gradient(0deg,var(--background),transparent 38%),url('/assets/workshop.webp') center top / cover no-repeat; }
.site-header { min-height:104px; display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid var(--line); }
.brand { display:inline-block; text-decoration:none; font:400 34px/1.2 Anton,sans-serif; letter-spacing:-.015em; }
.brand-dot { color:var(--primary); }
.launch-status { display:flex; align-items:center; gap:12px; font-size:16px; line-height:1.5; font-weight:600; }
.launch-status .icon { color:var(--secondary); width:21px; height:21px; flex-basis:21px; }
.skip-link { position:absolute; top:10px; left:var(--gutter); z-index:10; padding:12px 18px; background:var(--primary); color:var(--background); font-size:16px; transform:translateY(-160%); }
.skip-link:focus { transform:translateY(0); }
.hero { padding-block:64px 72px; }
.eyebrow { display:flex; align-items:center; gap:12px; font-size:16px; line-height:1.5; font-weight:600; color:var(--primary); }
.eyebrow .icon { width:22px; height:22px; flex-basis:22px; }
h1 { max-width:750px; margin-top:26px; font:900 clamp(76px,7.5vw,108px)/.87 Darker,sans-serif; letter-spacing:-.035em; }
h1 em { display:inline-block; margin-top:.14em; font:400 1.12em/1.05 Anton,sans-serif; font-style:normal; text-transform:uppercase; letter-spacing:-.01em; color:var(--primary); }
.hero-description { margin-top:28px; font-size:24px; line-height:1.4; font-weight:600; }
.hero-copy { max-width:43ch; margin-top:16px; font-size:18px; line-height:1.65; color:var(--copy); }
.contact-button { display:inline-flex; align-items:center; gap:14px; min-height:58px; margin-top:28px; padding:14px 20px; background:var(--primary); color:var(--background); text-decoration:none; font-size:17px; font-weight:600; transition:background .18s ease; }
.contact-button .arrow { margin-left:12px; }
.contact-button:hover { background:var(--text); }
.workshop { padding-block:40px 54px; border-top:1px solid var(--line); }
.section-heading { display:grid; grid-template-columns:1fr 2fr; gap:48px; align-items:start; }
.section-heading .eyebrow { padding-top:9px; }
h2 { font:900 clamp(40px,3.7vw,54px)/.98 Darker,sans-serif; letter-spacing:-.02em; }
h2 em { font-style:normal; color:var(--secondary); }
.service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:48px; margin-top:38px; }
.step { display:flex; align-items:center; gap:12px; font-size:16px; font-weight:600; color:var(--primary); }
.step span { color:var(--copy); }
h3 { margin-top:16px; font:900 34px/1 Darker,sans-serif; letter-spacing:-.01em; }
.service-grid article > p:last-child { margin-top:16px; font-size:17px; line-height:1.7; color:var(--copy); }
.team-section { display:grid; grid-template-columns:1fr 1fr; gap:64px; padding-block:48px 56px; border-top:1px solid var(--line); }
.team-section .eyebrow { color:var(--secondary); }
.team-section h2 { margin-top:20px; }
.team-copy { font-size:18px; line-height:1.65; color:var(--copy); }
.team-copy .team-signoff { margin-top:22px; font-weight:600; color:var(--primary); }
.site-footer { display:flex; justify-content:space-between; align-items:center; gap:24px; padding-block:26px 32px; border-top:1px solid var(--line); font-size:16px; line-height:1.5; font-weight:600; }
.footer-status { color:var(--secondary); }
@media(max-width:1100px) {
  :root { --gutter:36px; }
  .hero-world { background-position:center,center,60% top; }
  .service-grid { gap:28px; }
  .section-heading { grid-template-columns:1fr 1.7fr; gap:28px; }
}
@media(max-width:760px) {
  :root { --gutter:24px; }
  .site-header { flex-wrap:wrap; align-content:center; justify-content:flex-start; gap:14px 24px; min-height:122px; padding-block:20px; }
  .brand { font-size:30px; }
  .hero-world { height:900px; background:linear-gradient(90deg,rgba(23,21,18,.88),rgba(23,21,18,.53)),linear-gradient(0deg,var(--background),transparent 48%),url('/assets/workshop.webp') 62% top / auto 840px no-repeat; }
  .hero { padding-block:42px 48px; }
  h1 { font-size:clamp(58px,10.8vw,80px); margin-top:24px; line-height:.91; }
  h1 em { font-size:1.12em; }
  .hero-description { font-size:22px; margin-top:24px; }
  .hero-copy { font-size:18px; }
  .section-heading { grid-template-columns:1fr; gap:18px; }
  .section-heading .eyebrow { padding-top:0; }
  .workshop { padding-block:30px 36px; }
  .service-grid { grid-template-columns:1fr; gap:28px; margin-top:30px; }
  .service-grid article + article { padding-top:26px; border-top:1px solid var(--line); }
  h3 { font-size:34px; }
  h3 br { display:none; }
  .team-section { grid-template-columns:1fr; gap:24px; padding-block:34px 38px; }
  h2 { font-size:42px; }
  .site-footer { flex-direction:column; align-items:flex-start; gap:12px; }
}
@media(max-width:360px) {
  :root { --gutter:20px; }
  h1 { font-size:52px; }
  .contact-button { gap:10px; padding-inline:14px; font-size:16px; }
  .contact-button .arrow { margin-left:0; }
  .eyebrow { gap:10px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; scroll-behavior:auto!important; } }

/* Legal pages share the approved content axis and typography. */
.legal-shell { width:min(1280px,calc(100% - 2 * var(--gutter))); margin-inline:auto; }
.back-link { color:var(--primary); display:inline-block; padding-block:12px; font-size:16px; }
.legal-content { max-width:800px; padding-block:48px 64px; overflow-wrap:anywhere; }
.legal-content h1 { margin:0 0 32px; font-size:clamp(46px,5vw,68px); line-height:1; }
.legal-content h2 { margin:36px 0 14px; font-size:32px; }
.legal-content p { margin:0 0 18px; font-size:17px; line-height:1.7; color:var(--copy); }
.legal-content a { color:var(--primary); }
.site-footer { flex-wrap:wrap; }
.site-footer nav { display:flex; gap:24px; flex-wrap:wrap; }
.site-footer nav a { display:inline-block; padding-block:12px; text-decoration:none; }
.site-footer nav a:hover { color:var(--primary); }
