/* Direction C · Bright corporate — white + navy blocks, large real photos, big verified numbers. */

.eyebrow { font-weight: 600; font-size: var(--step--1); letter-spacing: .12em; text-transform: uppercase; color: var(--slate); margin-bottom: var(--s-4); }
.lede { font-size: var(--step-1); line-height: 1.5; }
.btn--sand { background: var(--sand); border-color: var(--sand); color: var(--ink); }
.btn--sand:hover { background: var(--white); border-color: var(--white); color: var(--navy); }
.btn--line { background: transparent; border-color: rgba(255, 255, 255, .55); color: var(--white); }
.btn--line:hover { background: var(--white); color: var(--navy); border-color: var(--white); }
.c-head { display: grid; grid-template-columns: 5fr 7fr; gap: var(--s-7); align-items: end; margin-bottom: var(--s-8); }
.c-head h2 { font-size: var(--step-5); }
.c-head p { color: var(--muted); font-size: var(--step-1); max-width: 44ch; justify-self: end; }
@media (max-width: 900px) { .c-head { grid-template-columns: 1fr; gap: var(--s-4); } .c-head p { justify-self: start; } }

/* ---------- Hero: navy block + rig photo with scroll scale ---------- */
.c-hero-in { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); min-height: min(calc(100vh - 77px), 860px); }
.c-hero .block { background: var(--navy); color: #dfe4ea; padding: var(--s-9) var(--gutter) var(--s-8) max(var(--gutter), calc((100vw - var(--maxw)) / 2 + var(--gutter))); display: flex; flex-direction: column; justify-content: flex-end; }
.c-hero .eyebrow { color: var(--sand); }
.c-hero h1 { color: var(--white); font-size: clamp(2.2rem, 1.4rem + 2.6vw, 4.1rem); max-width: 16ch; margin-bottom: var(--s-6); }
.c-hero .lede { color: #dfe4ea; max-width: 38ch; }
.c-hero .ctas { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-top: var(--s-6); }
.c-hero .photo { overflow: hidden; position: relative; background: #dfe4ea; }
.c-hero .photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; transform: scale(var(--hs, 1)); transform-origin: 60% 30%; will-change: transform; }
@media (max-width: 900px) {
  .c-hero-in { grid-template-columns: 1fr; min-height: 0; }
  .c-hero .photo { order: -1; aspect-ratio: 4 / 3; }
  .c-hero .block { padding: var(--s-7) var(--gutter); }
}

/* ---------- Numbers ---------- */
.c-nums { padding-block: var(--s-9); border-bottom: 1px solid var(--line); }
.c-nums dl { margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); }
.c-nums dl > div { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: var(--s-3); padding: 0 var(--s-6); min-width: 0; border-left: 1px solid var(--line); }
.c-nums dl > div:first-child { padding-left: 0; border-left: 0; }
.c-nums dd { margin: 0; font-family: var(--font-display); font-weight: 800; font-size: clamp(2.8rem, 1.6rem + 4.4vw, 6.4rem); line-height: .9; color: var(--navy); letter-spacing: -.04em; }
.c-nums dt { color: var(--muted); max-width: 18ch; }
@media (max-width: 900px) {
  .c-nums dl { grid-template-columns: 1fr 1fr; row-gap: var(--s-7); }
  .c-nums dl > div:nth-child(3) { padding-left: 0; border-left: 0; }
}

/* ---------- Services ---------- */
.c-svc { padding-block: var(--s-9); }
.feats { display: grid; grid-template-columns: 7fr 5fr; gap: var(--s-6); align-items: start; }
.feat img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.feat:nth-child(2) img { aspect-ratio: 4 / 4.2; }
.feat > div { padding-top: var(--s-5); }
.feat .no { color: var(--slate); font-weight: 600; margin-bottom: var(--s-2); }
.feat h3 { font-size: var(--step-3); margin-bottom: var(--s-3); }
.feat p { color: var(--muted); max-width: 46ch; }
.feat a { display: inline-block; margin-top: var(--s-4); font-weight: 600; color: var(--navy); text-decoration: none; border-bottom: 2px solid var(--sand); }
.rest { margin-top: var(--s-8); border-top: 2px solid var(--navy); }
.rest a { display: grid; grid-template-columns: 64px 4fr 6fr 32px; gap: var(--s-5); align-items: baseline; padding: var(--s-5) var(--s-4); border-bottom: 1px solid var(--line); text-decoration: none; transition: background var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.rest .no { color: var(--slate); font-weight: 600; }
.rest .t { font-family: var(--font-display); font-weight: 700; font-size: var(--step-2); color: var(--navy); line-height: 1.1; }
.rest .s { color: var(--muted); }
.rest .arr { color: var(--navy); font-size: var(--step-1); }
.rest a:hover { background: var(--navy); }
.rest a:hover .t, .rest a:hover .s, .rest a:hover .arr, .rest a:hover .no { color: var(--white); }
@media (max-width: 900px) {
  .feats { grid-template-columns: 1fr; gap: var(--s-7); }
  .feat:nth-child(2) img { aspect-ratio: 4 / 3; }
  .rest a { grid-template-columns: 40px 1fr; row-gap: var(--s-2); padding-inline: 0; }
  .rest .s { grid-column: 2; } .rest .arr { display: none; }
}

/* ---------- Equipment ---------- */
.c-equip { background: var(--navy); color: #dfe4ea; }
.c-equip .wrap { display: grid; grid-template-columns: 6fr 6fr; gap: var(--s-8); align-items: center; padding-block: var(--s-9); }
.c-equip figure { margin: 0; }
.c-equip img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; }
.c-equip .eyebrow { color: var(--sand); }
.c-equip h2 { color: var(--white); font-size: var(--step-4); margin-bottom: var(--s-7); }
.eq li { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-4); padding-block: var(--s-4); border-top: 1px solid rgba(255, 255, 255, .2); }
.eq b { color: var(--white); font-weight: 600; }
@media (max-width: 900px) { .c-equip .wrap { grid-template-columns: 1fr; gap: var(--s-6); } .eq li { grid-template-columns: 1fr; gap: 2px; } }

/* ---------- Novo ---------- */
.c-new { background: var(--paper); padding-block: var(--s-9); }
.c-new .wrap { border-left: 4px solid var(--sand); padding-left: calc(var(--gutter) + var(--s-6)); }
.c-new .eyebrow { color: var(--navy); }
.c-new h2 { font-size: var(--step-4); margin-bottom: var(--s-4); }
.c-new p:not(.eyebrow) { font-size: var(--step-1); max-width: 52ch; }
.c-new .btn { margin-top: var(--s-6); }

/* ---------- Projects (filterable) ---------- */
.c-proj { padding-block: var(--s-9); }
.filters { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.filters button { min-height: 44px; padding: 0 18px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); color: var(--navy); font: 600 var(--step-0)/1 var(--font-text); cursor: pointer; transition: background var(--dur-1) var(--ease), color var(--dur-1) var(--ease); }
.filters button:hover { border-color: var(--navy); }
.filters button[aria-pressed="true"] { background: var(--navy); border-color: var(--navy); color: var(--white); }
.count { color: var(--muted); margin: var(--s-5) 0 var(--s-6); }
.pgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-7) var(--s-6); }
.pgrid li[hidden] { display: none; }
.pgrid img, .pgrid .noimg { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.pgrid .noimg { display: flex; align-items: center; justify-content: center; background: #eef0f3; color: var(--slate); }
.pgrid div { padding-top: var(--s-4); }
.pgrid h3 { font-size: var(--step-1); margin-bottom: 4px; letter-spacing: -.01em; }
.pgrid p { color: var(--muted); font-size: var(--step--1); }
.pgrid p span { color: var(--navy); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }
@media (max-width: 1000px) { .pgrid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .pgrid { grid-template-columns: 1fr; } }

/* ---------- Reference ---------- */
.c-ref { padding-block: var(--s-9); border-top: 1px solid var(--line); }
.c-ref h2 { font-size: var(--step-4); margin-bottom: var(--s-7); }
.ref-cols { display: grid; grid-template-columns: 7fr 5fr; gap: var(--s-8); }
.ref-cols h3 { font-size: var(--step-1); margin-bottom: var(--s-4); color: var(--slate); font-weight: 600; }
.ref-cols p { font-size: var(--step-2); line-height: 1.35; color: var(--navy); font-family: var(--font-display); font-weight: 500; }
.ref-cols li { padding-block: var(--s-3); border-bottom: 1px solid var(--line); font-weight: 600; color: var(--navy); }
@media (max-width: 900px) { .ref-cols { grid-template-columns: 1fr; gap: var(--s-6); } }

/* ---------- CTA ---------- */
.c-cta { background: var(--navy); padding-block: var(--s-9); }
.c-cta .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s-6); }
.c-cta h2 { color: var(--white); font-size: var(--step-4); max-width: 18ch; }
.c-cta p { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-5); }
.c-cta .tel { color: var(--white); font-weight: 600; font-size: var(--step-1); text-decoration: none; border-bottom: 1px solid var(--sand); }

/* ---------- Usluge page ---------- */
.c-phead { background: var(--navy); color: #dfe4ea; padding-block: var(--s-9) var(--s-8); }
.c-phead .crumbs { color: #aeb7c3; margin-bottom: var(--s-4); }
.c-phead .crumbs a { color: var(--sand); text-decoration: none; }
.c-phead h1 { color: var(--white); font-size: var(--step-6); margin-bottom: var(--s-5); }
.c-phead .lede { max-width: 44ch; }
.c-flow { border-bottom: 1px solid var(--line); }
.c-flow ol { display: grid; grid-template-columns: repeat(4, 1fr); }
.c-flow li { padding: var(--s-6) var(--s-5) var(--s-6) 0; display: grid; gap: 4px; }
.c-flow li + li { padding-left: var(--s-5); border-left: 1px solid var(--line); }
.c-flow .no { font-family: var(--font-display); font-weight: 800; font-size: var(--step-3); color: var(--sand); line-height: 1; }
.c-flow b { color: var(--navy); font-size: var(--step-1); }
.c-flow span:last-child { color: var(--muted); }
@media (max-width: 900px) { .c-flow ol { grid-template-columns: 1fr 1fr; } .c-flow li:nth-child(3) { padding-left: 0; border-left: 0; } .c-flow li:nth-child(n+3) { border-top: 1px solid var(--line); } }
.c-ulist { padding-block: var(--s-9); }
.c-ulist .u { display: grid; grid-template-columns: 6fr 6fr; gap: var(--s-8); align-items: center; padding-block: var(--s-7); scroll-margin-top: 90px; }
.c-ulist .u + .u { border-top: 1px solid var(--line); }
.c-ulist .u:nth-child(even) figure { order: 2; }
.c-ulist figure { margin: 0; }
.c-ulist img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.c-ulist .no { color: var(--slate); font-weight: 600; margin-bottom: var(--s-2); }
.c-ulist h2 { font-size: var(--step-3); margin-bottom: var(--s-4); }
.c-ulist .tags { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-5); }
.c-ulist .tags li { padding: 6px 12px; background: #eef0f3; color: var(--navy); font-weight: 600; font-size: var(--step--1); border-radius: var(--radius); }
@media (max-width: 900px) { .c-ulist .u { grid-template-columns: 1fr; gap: var(--s-5); } .c-ulist .u:nth-child(even) figure { order: 0; } }

.site-footer h2 { color: var(--navy); }