:root {
  --ink: #171514;
  --paper: #fbf8f3;
  --orange: #ff7139;
  --muted: #655d55;
  --line: #ded5ca;
}
body { margin: 0; color: var(--ink); background: var(--paper); }
body, p { font-family: "DM Sans", system-ui, sans-serif; }
h1, h2, h3 { font-family: "Instrument Sans", system-ui, sans-serif; color: inherit; letter-spacing: -.05em; }
a:focus-visible { outline: 3px solid #9a390a; outline-offset: 4px; }
.r-container { width: min(1280px, calc(100% - 56px)); max-width: none; margin-inline: auto; }
.section { padding: clamp(54px, 8vw, 112px) 0; }
.kravo-header, .kravo-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: 20px; }
.kravo-header nav { display: flex; gap: 30px; }
.kravo-header a, .kravo-footer a { color: var(--ink); text-decoration: none; }
.wordmark { display: inline-flex; align-items: center; gap: 9px; font-size: 1.15rem; font-weight: 850; letter-spacing: .14em; }
.header-contact, .eyebrow, .hero-foot, .card-why-choose > span, .figure-bar, figcaption { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.header-contact { border: 1px solid var(--line); border-radius: 100px; padding: 7px 11px; }
.header-contact:hover { background: #f1e8dc; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; }
.eyebrow i { width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }
.kravo-hero { padding-top: 8px; padding-bottom: 0; }
.kravo-hero .bg-banner { background: #201c19; color: white; border-radius: 26px; padding: clamp(26px, 5vw, 72px); display: grid; grid-template-columns: 1fr .93fr; align-items: center; gap: clamp(26px, 4vw, 70px); min-height: auto; }
.kravo-hero .bg-banner h1 { color: #fff6eb; margin: 22px 0; font-size: clamp(3rem, 6.3vw, 6.2rem); line-height: .97; font-weight: 700; }
.hero-copy em { display: block; color: var(--orange); font-style: normal; }
.kravo-hero .bg-banner p { color: #e8d8c9; max-width: 35ch; margin: 0 0 25px; }
.kravo-button { display: inline-flex; align-items: center; gap: 20px; background: var(--orange); color: #21130b; text-decoration: none; padding: 13px 18px; border-radius: 10px; font-weight: 750; width: fit-content; }
.kravo-button:hover { background: #ff9c70; color: #21130b; }
.site-figure { margin: 0; border: 1px solid #685347; border-radius: 17px; overflow: hidden; background: #2b231e; min-width: 0; }
.figure-bar { display: flex; justify-content: space-between; gap: 12px; padding: 13px; color: #f2c3a9; }
.figure-canvas { padding: clamp(17px, 3vw, 39px); background: repeating-linear-gradient(135deg,#f8aa78 0 2px,#ffbe8a 2px 16px); }
.mini-site { padding: clamp(15px, 3vw, 34px); border-radius: 10px; background: #222421; color: #f4f5e7; box-shadow: 0 15px 24px #552a2860; }
.mini-top { font-size: .75rem; font-weight: 800; letter-spacing: .1em; border-bottom: 1px solid #75786e; padding-bottom: 10px; }
.mini-top span, .mini-eyebrow { color: #dfec9f; }
.mini-eyebrow { margin-top: 25px; font-size: .6rem; letter-spacing: .13em; }
.mini-title { margin: 8px 0 16px; font-size: clamp(1.55rem, 3.4vw, 3.5rem); line-height: .98; letter-spacing: -.06em; font-weight: 750; }
.mini-cta { display: inline-block; background: #dfec9f; color: #24291a; padding: 6px 9px; border-radius: 4px; font-size: .68rem; font-weight: 800; }
figcaption { padding: 13px; color: #ead6c9; }
.hero-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; border-bottom: 1px solid var(--line); color: var(--muted); padding: 15px 0; }
h2 { font-size: clamp(2rem, 4.5vw, 4.25rem); line-height: 1.02; font-weight: 700; margin: 12px 0 20px; }
.services .card-title { align-items: start; text-align: left; gap: 0; margin-bottom: 14px; }
.services .card-why-choose, .services .card-why-choose:hover { color: var(--ink); background: #fffdf9; border: 1px solid var(--line); border-radius: 15px; padding: 25px; gap: 10px; height: 100%; }
.card-why-choose > span { color: #9d3d13; }
h3 { font-size: 1.45rem; font-weight: 700; margin: 0; }
.services p, .process p { color: var(--muted); margin: 0; }
.process { background: #f1e8dc; }
.process-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.process ol { padding: 0; margin: 0; list-style: none; }
.process li { display: grid; grid-template-columns: 34px 1fr; gap: 10px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.process li > span { font-weight: 800; color: #9d3d13; }
.contact { padding-bottom: 30px; }
.contact-box { padding: clamp(25px, 5vw, 60px); border-radius: 22px; background: #211b17; color: #fff6eb; display: flex; justify-content: space-between; gap: 20px; align-items: center; }
.contact-box p { margin: 0; color: #ead6c9; }
.contact-box .kravo-button { flex-shrink: 0; }
.kravo-footer { border-top: 1px solid var(--line); color: var(--muted); }
@media (max-width: 800px) {
  .kravo-hero .bg-banner, .process-grid { grid-template-columns: 1fr; }
  .contact-box { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 540px) {
  .r-container { width: calc(100% - 32px); }
  .kravo-header nav { display: none; }
  .kravo-hero .bg-banner { border-radius: 17px; padding: 23px; }
  .kravo-hero .bg-banner h1 { font-size: clamp(2.35rem, 11vw, 3.6rem); }
  .kravo-footer { flex-wrap: wrap; }
}