/* Serviços prestados — ported verbatim from the approved static site's inline <style>.
   Class names kept identical; bg + icon URLs point at theme assets/img. Tokens
   (--track, --teal) come from base.css. */

/* ===== Full-canvas composite bg on .page (microscopy strip + dark panel + graphics) aligns 1:1 with the 1800xH canvas ===== */
.page{background:#000 url('../../img/servicos-prestados-fundo.webp') top center / 100% auto no-repeat}
.serv{background:transparent}

/* ===== Serviços prestados — absolute canvas-px layout (1 CSS px == 1 canvas px at 1800 render) ===== */
.serv__frame{position:relative;height:299.5rem}   /* footer top 5240 - header 465 ... total canvas 5577; frame = canvas below header */

/* --- Section title (bbox l262 t762) : SERVIÇOS (light white) / PRESTADOS (medium teal) --- */
.serv__title{position:absolute;top:18.5625rem;left:16.375rem;margin:0;font-weight:300;font-style:italic;font-size:3.90625rem;line-height:0.9;letter-spacing:var(--track);text-transform:uppercase}
.serv__title span{display:block}
.serv__title--top{color:#fff}
.serv__title--bottom{color:var(--teal)}
/* title decorative rules (Line2 short left, Line3 long right of title) */
.serv__rule{position:absolute;background:#dbede9}
.serv__rule--l{top:19.125rem;left:0;width:15.625rem;height:0.3125rem}                 /* l-115->250 -> visible 0->250 */
.serv__rule--r{top:24.25rem;left:41.3125rem;right:0;height:0.4375rem}                 /* design l661->1818 t853; top = (853-465 header offset)/16 */

/* --- Service block (repeating) --- */
.serv__block{position:absolute;left:0;right:0}

/* header bar: dark-teal rect bleeding off the left edge, rounded right corners; text + divider + icon */
.serv__bar{position:absolute;left:0;right:16.0625rem;height:7.875rem;background:#365358;border-radius:0 0.9375rem 0.9375rem 0} /* r->1542 (=1800-258) */
.serv__bar-title{position:absolute;left:16.3125rem;margin:0;font-weight:700;font-style:italic;font-size:2.61875rem;line-height:1.05;color:#fff;letter-spacing:var(--track)}
.serv__divider{position:absolute;left:12.625rem;right:12.5625rem;height:0.4375rem;background:var(--teal)} /* x202->1599 */
.serv__icon{position:absolute}

/* body prose */
.serv__body{position:absolute;left:16.375rem;width:77.375rem;margin:0;font-weight:300;font-style:italic;font-size:2.08333rem;line-height:1.2;color:#fff;letter-spacing:var(--track)} /* w=1238 (l262->r1500); pitch measured 40px on JPG => lh 1.2 */
.serv__body p{margin:0}
.serv__body .step{font-weight:400}          /* PSD "Medium" run; nearest face -> 400 italic (slightly heavier than 300 prose) */
.serv__subhead{font-weight:500}

/* ===== Block positions (canvas y minus header 465 = frame-local y) ===== */
/* Block 1 "Treinamentos" : bar t1277 title t1331 divider t1398 body t1464 icon t1262 */
.serv__block--1 .serv__bar{top:50.75rem}
.serv__block--1 .serv__bar-title{top:54.125rem}
.serv__block--1 .serv__divider{top:58.375rem}
.serv__block--1 .serv__body{top:62.4375rem}
.serv__block--1 .serv__icon{top:49.8125rem;left:88.5625rem;width:9.8125rem}          /* l1417 t1262 w157 */

/* Block 2 "Uso independente" : bar t1884 title t1936 divider t2006 body t2073 icon t1871 */
.serv__block--2 .serv__bar{top:88.6875rem}
.serv__block--2 .serv__bar-title{top:91.9375rem}
.serv__block--2 .serv__divider{top:96.3125rem}
.serv__block--2 .serv__body{top:100.5rem}
.serv__block--2 .serv__icon{top:87.875rem;left:91.3125rem;width:7.5625rem}           /* l1461 t1871 w121 */

/* Block 3 "Aquisições de imagem" (two-line title) : bar t2732 title t2759 divider t2856 body t2922 icon t2749 */
.serv__block--3 .serv__bar{top:141.6875rem;height:8rem}
.serv__block--3 .serv__bar-title{top:143.375rem;line-height:1.02}
.serv__block--3 .serv__divider{top:149.5rem}   /* 2-line title: divider sits below the whole bar (was 144.4rem, striking through line 1) */
.serv__block--3 .serv__body{top:153.5625rem}
.serv__block--3 .serv__icon{top:142.75rem;left:88.6875rem;width:11rem}               /* Camera Logo l1419 t2749 w176 (no overlay, native colors) */

/* Block 4 "Escaneamento de lâminas" : bar t3317 title t3367 divider t3442 intro t3508 subhead t3822 steps t3921 icon t3328 */
.serv__block--4 .serv__bar{top:178.25rem}
.serv__block--4 .serv__bar-title{top:181.375rem}
.serv__block--4 .serv__divider{top:185.5rem}
.serv__block--4 .serv__body--intro{top:189.6875rem}
.serv__block--4 .serv__body--subhead{top:209.125rem}
.serv__block--4 .serv__body--steps{top:215.6875rem}
.serv__block--4 .serv__icon{top:179.1875rem;left:91.3125rem;width:9.75rem}           /* Group1 l1461 t3328 w156 */

/* --- Bottom CTA pill (Rectangle 17 l259 t4902 w1282 h130 r64 ; text center) --- */
.serv__cta{position:absolute;top:277.3125rem;left:16.1875rem;width:80.125rem;height:8.125rem;background:#365358;border-radius:4rem;display:flex;align-items:center;justify-content:center}
.serv__cta p{margin:0;text-align:center;font-weight:700;font-style:italic;font-size:2.34375rem;line-height:1.05;color:#fff;letter-spacing:var(--track)}

/* ===== Responsive ===== */
@media (max-width:60rem){
  .page{background:#000}
  .serv__frame{height:auto;padding:2rem 6% 4rem}
  .serv__title{position:static;font-size:2.6rem;margin-bottom:2rem}
  .serv__rule{display:none}
  .serv__block{position:static;margin-bottom:3rem}
  .serv__bar{position:static;height:auto;min-height:4rem;right:auto;border-radius:0 0.9375rem 0.9375rem 0;display:flex;align-items:center;padding:0.75rem 4.5rem 0.75rem 1.25rem;margin:0 -6% 1rem 0}
  .serv__bar-title{position:static;font-size:1.5rem}
  .serv__icon{position:absolute;right:1rem;top:50%;transform:translateY(-50%);width:3.5rem !important;left:auto !important}
  .serv__block--2 .serv__bar,.serv__block--3 .serv__bar,.serv__block--4 .serv__bar{height:auto}
  .serv__divider{display:none}
  .serv__body{position:static;width:auto;font-size:1.15rem;margin-bottom:1.25rem;overflow-wrap:anywhere}
  .serv__cta{position:static;width:auto;height:auto;padding:1.5rem;margin-top:2rem}
  .serv__cta p{font-size:1.3rem}
}