@page {
  size: letter portrait;
  margin: 12mm 15mm;
}
/* Runlean Ops — practical, calm, and owned by the client. */
*,:before,:after{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:32px
}
body{
  margin:0;
  background:var(--rl-paper);
  color:var(--rl-ink);
  font-family:var(--rl-font-sans);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased
}
h1,h2,h3,p{
  margin:0
}
h1,h2,h3{
  font-family:var(--rl-font-display);
  font-weight:500;
  letter-spacing:-.035em;
  line-height:1.12
}
h1{
  font-size:64px;
  font-weight:700
}
h2{
  font-size:40px
}
h3{
  font-size:24px;
  letter-spacing:-.02em
}
p{
  max-width:68ch
}
a{
  color:inherit;
  text-underline-offset:5px
}
img{
  max-width:100%;
  display:block
}
button,a,summary{
  -webkit-tap-highlight-color:transparent
}
:focus-visible{
  outline:2px solid var(--rl-focus-ring);
  outline-offset:4px
}
.container{
  width:calc(100% - 96px);
  max-width:1152px;
  margin-inline:auto
}
.eyebrow{
  font-family:var(--rl-font-mono);
  font-size:12px;
  line-height:1.5;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-weight:500
}
.muted{
  color:var(--rl-ink-muted)
}
.lead{
  font-size:20px;
  line-height:1.55
}
.skip-link{
  position:absolute;
  left:24px;
  top:-100px;
  background:var(--rl-signal);
  padding:12px 20px;
  z-index:10
}
.skip-link:focus{
  top:12px
}
.site-header{
  border-bottom:1px solid var(--rl-line)
}
.header-inner{
  min-height:104px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px
}
.brand{
  flex-shrink:0;
  display:block
}
.brand img{
  object-fit:contain
}
.header-inner nav{
  display:flex;
  gap:32px;
  margin-left:auto;
  font-size:14px
}
.header-inner nav a{
  text-decoration:none;
  padding:12px 0
}
.header-inner nav a:hover{
  text-decoration:underline
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  border:1px solid var(--rl-forest);
  border-radius:4px;
  background:var(--rl-forest);
  color:var(--rl-paper);
  padding:16px 24px;
  font-size:15px;
  font-weight:500;
  line-height:1.4;
  text-decoration:none
}
.button:hover{
  background:var(--rl-paper-raised);
  color:var(--rl-forest)
}
.button-small{
  padding:12px 20px;
  font-size:14px
}
.button span{
  font-size:20px;
  line-height:1
}
.text-link{
  font-size:15px;
  font-weight:500;
  display:inline-flex;
  gap:16px;
  align-items:center;
  padding:12px 0
}
.text-link:hover{
  color:var(--rl-run)
}
.hero{
  padding-block:88px 72px;
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);
  align-items:center;
  gap:64px
}
.hero .eyebrow{
  margin-bottom:24px
}
.hero h1{
  margin-bottom:32px
}
.hero .lead{
  max-width:42ch;
  margin-bottom:16px
}
.hero-description{
  color:var(--rl-ink-muted);
  max-width:47ch
}
.actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px 24px;
  margin-top:32px
}
.work-note{
  background:var(--rl-paper-raised);
  border:1px solid var(--rl-line);
  padding:32px;
  position:relative;
  min-width:0
}
.work-note h2{
  font-size:32px;
  margin-bottom:28px
}
.note-list{
  list-style:none;
  padding:0;
  margin:0 0 32px
}
.note-list li{
  padding:14px 0;
  border-bottom:1px solid var(--rl-line);
  display:flex;
  align-items:center;
  gap:12px;
  font-size:14px
}
.square{
  width:8px;
  height:8px;
  flex-shrink:0;
  background:var(--rl-run)
}
.work-note>p{
  font-size:13px;
  color:var(--rl-ink-muted);
  max-width:25ch
}
.section{
  padding-block:96px
}
.section-heading{
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:48px;
  margin-bottom:48px
}
.section-heading .eyebrow{
  padding-top:8px
}
.section-heading h2{
  margin-bottom:24px
}
.section-heading p:not(.eyebrow){
  color:var(--rl-ink-muted);
  max-width:57ch
}
.service-row{
  display:grid;
  grid-template-columns:64px 1fr 1.4fr;
  gap:32px;
  padding-block:32px;
  border-top:1px solid var(--rl-line)
}
.service-row:last-child{
  border-bottom:1px solid var(--rl-line)
}
.number{
  font-family:var(--rl-font-mono);
  font-size:12px;
  color:var(--rl-ink-muted);
  line-height:2
}
.service-row h3{
  font-size:24px;
  line-height:1.4
}
.service-row p{
  font-size:15px;
  color:var(--rl-ink-muted)
}
.service-example{
  display:block;
  margin-top:12px;
  font-size:13px
}
.ownership{
  background:var(--rl-forest);
  color:var(--rl-paper);
  --rl-focus-ring:var(--rl-signal)
}
.ownership-inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:112px;
  padding-block:80px
}
.ownership .eyebrow{
  color:var(--rl-signal);
  margin-bottom:24px
}
.ownership h2{
  font-size:48px;
  margin-bottom:24px
}
.ownership p{
  color:#A7B6AC
}
.ownership-points article{
  padding-block:24px;
  border-top:1px solid #3A5A4C
}
.ownership-points article:first-child{
  padding-top:0;
  border-top:0
}
.ownership-points article:last-child{
  padding-bottom:0
}
.ownership-points h3{
  font-size:20px;
  margin-bottom:12px
}
.ownership-points p{
  font-size:15px
}
.process{
  list-style:none;
  padding:0;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
  margin:0 0 56px
}
.process li{
  border-top:1px solid var(--rl-line);
  padding-top:24px
}
.process h3{
  font-size:22px;
  margin:20px 0 16px
}
.process p{
  font-size:15px;
  color:var(--rl-ink-muted)
}
.pricing-note{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  align-items:center;
  gap:32px;
  background:var(--rl-paper-raised);
  border:1px solid var(--rl-line);
  padding:32px
}
.pricing-note .eyebrow{
  margin-bottom:12px
}
.pricing-note h3{
  font-size:20px;
  margin-bottom:12px
}
.pricing-note p:not(.eyebrow){
  font-size:13px;
  color:var(--rl-ink-muted)
}
.price{
  padding-left:24px;
  border-left:1px solid var(--rl-line)
}
.price>span{
  font:500 28px/1.4 var(--rl-font-mono)
}
.terms{
  font-size:14px;
  border-bottom:1px solid var(--rl-line)
}
summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  padding:24px 0;
  font-weight:500
}
summary::-webkit-details-marker{
  display:none
}
summary:after{
  content:'+';
  font:24px var(--rl-font-sans);
  flex-shrink:0
}
details[open]>summary:after{
  content:'−'
}
.terms-body{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
  padding-bottom:24px;
  color:var(--rl-ink-muted)
}
.example-section{
  background:var(--rl-paper-raised);
  border-block:1px solid var(--rl-line)
}
.example-inner{
  padding-block:64px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center
}
.example-inner .eyebrow{
  margin-bottom:20px
}
.example-inner h2{
  font-size:32px
}
.example-inner p+p{
  margin-top:20px;
  font-size:14px
}
.about{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  padding-bottom:72px
}
.about .eyebrow{
  margin-bottom:24px
}
.about .lead{
  margin-bottom:24px
}
.about .text-link{
  margin-top:20px
}
.faq{
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:64px;
  border-top:1px solid var(--rl-line);
  padding-top:64px
}
.faq .eyebrow{
  margin-bottom:24px
}
.faq-list details{
  border-bottom:1px solid var(--rl-line)
}
.faq-list details:first-child{
  border-top:1px solid var(--rl-line)
}
.faq-list p{
  font-size:15px;
  color:var(--rl-ink-muted);
  padding-bottom:24px
}
.contact{
  background:var(--rl-forest);
  color:var(--rl-paper);
  --rl-focus-ring:var(--rl-signal)
}
.contact-inner{
  padding-block:80px;
  text-align:center
}
.contact .eyebrow{
  color:#A7B6AC;
  margin-bottom:24px
}
.contact h2{
  font-size:48px;
  margin-bottom:24px
}
.contact p:not(.eyebrow){
  margin-inline:auto;
  color:#A7B6AC
}
.button-signal{
  background:var(--rl-signal);
  border-color:var(--rl-signal);
  color:var(--rl-forest);
  margin-top:32px
}
.contact-email{
  display:block;
  width:fit-content;
  margin:20px auto 0;
  font-size:14px
}
.footer{
  display:flex;
  align-items:center;
  gap:32px;
  padding-block:40px
}
.footer p{
  font-size:13px;
  color:var(--rl-ink-muted)
}
.footer small{
  margin-left:auto;
  color:var(--rl-ink-muted);
  font-size:12px
}
@media(min-width:1400px){
  .hero{
    padding-block:104px 88px
  }
}
@media(max-width:1050px){
  .container{
    width:calc(100% - 64px)
  }
  .hero{
    gap:32px
  }
  h1{
    font-size:52px
  }
  .work-note{
    padding:24px
  }
    .note-list li{
    font-size:13px
  }
    .ownership-inner{
    gap:64px
  }
  .header-inner nav{
    gap:20px
  }
  .header-inner{
    gap:24px
  }
  .brand img{
    width:189px;
    height:28px
  }
}
@media(max-width:780px){
  .container{
    width:calc(100% - 48px)
  }
  .header-inner{
    flex-wrap:wrap;
    gap:0;
    padding-block:20px;
    min-height:0
  }
  .header-inner nav{
    order:3;
    width:100%;
    justify-content:space-between;
    margin:16px 0 -8px
  }
  .header-inner>.button{
    margin-left:auto
  }
  .hero{
    grid-template-columns:1fr;
    padding-block:56px;
    gap:40px
  }
  .hero-copy{
    max-width:620px
  }
  h1{
    font-size:52px
  }
  .hero .lead{
    max-width:48ch
  }
  .work-note{
    max-width:none;
    padding:32px
  }
  .work-note h2 br{
    display:none
  }
  .note-list{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0 24px
  }
    .work-note>p br{
    display:none
  }
  .work-note>p{
    max-width:none
  }
    .section{
    padding-block:64px
  }
  .section-heading{
    grid-template-columns:1fr;
    gap:20px
  }
  .service-row{
    grid-template-columns:32px 1fr;
    gap:12px 16px
  }
  .service-row>div{
    grid-column:2
  }
  .ownership-inner{
    grid-template-columns:1fr;
    gap:48px;
    padding-block:64px
  }
  .ownership h2{
    font-size:40px
  }
  .process{
    gap:24px;
    grid-template-columns:1fr;
    margin-bottom:40px
  }
  .process h3{
    margin-top:12px
  }
  .pricing-note{
    grid-template-columns:1fr 1fr;
    gap:24px;
    padding:24px
  }
  .pricing-note>div:first-child{
    grid-column:1/-1
  }
  .price{
    padding:0;
    border:0
  }
  .terms-body{
    grid-template-columns:1fr;
    gap:20px
  }
  .example-inner,.about,.faq{
    grid-template-columns:1fr;
    gap:32px
  }
  .example-inner{
    padding-block:48px
  }
  .contact h2{
    font-size:40px
  }
  .footer{
    flex-wrap:wrap;
    gap:20px
  }
  .footer small{
    width:100%;
    margin:0
  }
  .faq{
    padding-top:48px
  }
}
@media(max-width:420px){
  h1{
    font-size:40px
  }
  h2{
    font-size:32px
  }
  .hero .eyebrow{
    font-size:10px
  }
  .lead{
    font-size:18px
  }
  .brand img{
    width:162px;
    height:24px
  }
  .button-small{
    padding:10px 12px;
    gap:12px
  }
  .header-inner nav{
    font-size:13px
  }
  .actions{
    align-items:flex-start;
    flex-direction:column
  }
  .actions .button{
    padding:16px;
    font-size:14px;
    gap:12px
  }
  .note-list{
    grid-template-columns:1fr
  }
  .work-note{
    padding:24px
  }
  .work-note h2{
    font-size:28px
  }
          .contact h2{
    font-size:32px
  }
  .contact-inner{
    padding-block:64px
  }
  .service-row h3{
    font-size:22px
  }
  .price>span{
    font-size:24px
  }
  .footer p{
    font-size:12px
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
}
@media print{
  .site-header,.contact,.skip-link{
    display:none
  }
  body{
    font-size:12px
  }
  .container{
    width:100%
  }
  .section{
    padding-block:24px
  }
  details>*{
    display:block
  }
  .hero{
    padding-block:24px
  }
  a{
    color:inherit
  }
  .ownership{
    background:var(--rl-paper);
    color:var(--rl-ink)
  }
  .ownership p{
    color:var(--rl-ink-muted)
  }
}

/* Plain-language running costs: two readable options, separate from build pricing. */
.terms-body h3 { font-size: 18px; margin-bottom: 12px; color: var(--rl-ink); }
.hosting { margin-top: 48px; }
.hosting-intro { max-width: 68ch; margin-bottom: 32px; }
.hosting-intro .eyebrow { margin-bottom: 12px; }
.hosting-intro h3 { margin-bottom: 16px; }
.hosting-intro > p:last-child { color: var(--rl-ink-muted); }
.hosting-options { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.hosting-options article { border-top: 1px solid var(--rl-line); padding-top: 24px; }
.hosting-options h3 { font-size: 22px; margin-bottom: 16px; }
.hosting-options p { font-size: 15px; color: var(--rl-ink-muted); }
.hosting-options p + p { margin-top: 16px; }
.hosting-options .hosting-price { color: var(--rl-ink); font-weight: 600; }
.hosting-footnote { max-width: none; font-size: 13px; color: var(--rl-ink-muted); border-top: 1px solid var(--rl-line); margin-top: 32px; padding-top: 20px; }
@media (max-width: 780px) { .hosting-options { grid-template-columns: 1fr; gap: 32px; } }

/* A single descriptive heading per section, with fewer repeated labels. */
.hero h1 { max-width: 15ch; }
.hero { padding-bottom: 64px; }
.work-note h2 { font-size: 24px; line-height: 1.25; margin-bottom: 16px; }
.note-list { margin-bottom: 0; }
.note-list li:last-child { border-bottom: 0; padding-bottom: 0; }
#services { border-top: 1px solid var(--rl-line); padding-top: 64px; }
.section-heading { grid-template-columns: 1fr 1.4fr; align-items: start; }
.section-heading h2 { margin-bottom: 0; }
.section-heading > p { padding-top: 4px; }
.ownership-inner { gap: 64px; align-items: center; padding-block: 64px; }
.ownership h2 { font-size: 40px; margin-bottom: 0; }
.ownership .text-link { color: var(--rl-paper); margin-top: 16px; }
.ownership .text-link:hover { color: var(--rl-signal); }
.process h3 { margin-top: 8px; }
.faq { display: block; max-width: 880px; padding-block: 48px 64px; }
.faq h2 { font-size: 32px; margin-bottom: 24px; }
.contact h2 { max-width: 24ch; margin-inline: auto; font-size: 40px; }
@media (max-width: 780px) {
  .section-heading { grid-template-columns: 1fr; gap: 20px; margin-bottom: 32px; }
  .ownership-inner { gap: 24px; }
  .hero { padding-bottom: 48px; }
  #services { padding-top: 48px; }
  .contact h2 { font-size: 32px; }
}

/* Concrete handover deliverables, kept as a simple list. */
.handover { margin-bottom: 40px; border-top: 1px solid var(--rl-line); padding-top: 32px; }
.handover h3 { margin-bottom: 24px; }
.handover-list { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 48px; margin: 0; }
.handover-list dt { font-weight: 600; margin-bottom: 8px; }
.handover-list dd { margin: 0; color: var(--rl-ink-muted); font-size: 15px; }
.handover-note { margin-top: 24px; max-width: none; font-size: 13px; color: var(--rl-ink-muted); }
@media (max-width: 780px) { .handover-list { grid-template-columns: 1fr; } }

/* Service pages share the homepage typography and spacing. */
.detail-page { padding-block: 32px 72px; }
.breadcrumbs { font-size: 14px; margin-bottom: 48px; color: var(--rl-ink-muted); }
.detail-intro { max-width: 820px; margin-bottom: 48px; }
.detail-intro .eyebrow { margin-bottom: 20px; }
.detail-intro h1 { margin-bottom: 24px; font-size: clamp(36px, 5vw, 56px); max-width: 22ch; }
.detail-section { border-top: 1px solid var(--rl-line); padding-block: 28px; max-width: 820px; }
.detail-section h2, .related-services h2 { font-size: 26px; margin-bottom: 16px; }
.detail-section p { color: var(--rl-ink-muted); }
.related-services { margin-top: 24px; }
.related-services ul { padding-left: 20px; }
.related-services li + li { margin-top: 12px; }
.detail-page .pricing-note { margin-bottom: 24px; }
@media (max-width: 780px) {
  .breadcrumbs { margin-bottom: 32px; }
  .detail-intro { margin-bottom: 32px; }
  .detail-page { padding-bottom: 48px; }
}