/* Contato — page-specific styles ported verbatim from home-html/contato.html inline <style>.
   base.css supplies chrome + tokens + the .reg base; only the .page bg URL is rewritten to
   resolve from this file's location (assets/css/pages/ → assets/img/). */

/* ===== Body (flow) — black canvas + microscopy bleed image (like material) ===== */
/* microscopy bleed on .page so it aligns 1:1 with the canvas (header/footer sit opaque on top);
   putting it on .contato (main) offset it down by the header height and dropped the bottom blob. */
.page{background:#000 url('../../img/contato-fundo.webp') top center / 100% auto no-repeat}
.contato{background:transparent}

/* ===== Section title (canvas y637) — .reg base handles top; rules per-page ===== */
/* short rule over line1 "Fale", long rule under line2 "conosco" */
.reg__rule--left{top:12.75rem;right:calc(100% - var(--inset) + 2.5rem);left:0;width:auto}
.reg__rule--right{top:16.8rem;left:calc(var(--inset) + 21rem);right:calc(-1 * (50vw - 56.25rem));}

/* ===== Subtitle (canvas y821) ===== */
.contato__subtitle{margin:3.375rem var(--inset) 0;max-width:65.75rem;font-family:var(--font);font-weight:300;font-style:italic;font-size:1.81rem;line-height:1.29;color:#fff;letter-spacing:var(--track)}

/* ===== Contact cards (canvas: row top y1068, panels 419x382, x 259/738/1217, ~47px gaps) ===== */
.contato__cards{display:grid;grid-template-columns:repeat(3,26.19rem);column-gap:2.9375rem;margin:12.625rem var(--inset) 0;padding:0;list-style:none}
.contato__card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;min-height:23.875rem;background:var(--green);border-radius:0 0 2.875rem 0;padding:5.5rem 2rem 2.5rem;color:#fff;text-decoration:none}
/* text top-anchored to the PSD y-offsets per card (panel top y1098): phone +189px, email +168px */
.contato__cards > li:nth-child(1) > .contato__card{padding-top:11.8125rem}
.contato__cards > li:nth-child(2) > .contato__card{padding-top:10.5rem}
/* icon circle floats over the panel top-left corner */
.contato__card-icon{position:absolute;top:-1.875rem;left:-0.8125rem;width:7.75rem;height:7.75rem;border-radius:50%;background:#4FBBAE;display:flex;align-items:center;justify-content:center}
.contato__card-icon svg{width:3.5rem;height:3.5rem;color:#fff}

.contato__card-phone{font-family:var(--font);font-weight:700;font-size:2.08rem;letter-spacing:var(--track);line-height:1.2}
.contato__card-email{font-family:var(--font);font-weight:700;font-size:1.82rem;letter-spacing:var(--track);line-height:1.35;margin:0}

.contato__card--address{justify-content:flex-start;padding-top:7.1875rem;padding-left:1rem;padding-right:1rem}
.contato__addr-run1{font-family:var(--font);font-weight:700;font-size:1.46rem;line-height:1.05;letter-spacing:var(--track);margin:0}
.contato__addr-run2{font-family:var(--font);font-weight:400;font-style:italic;font-size:1.365rem;line-height:1.05;letter-spacing:var(--track);margin:0.55rem 0 0}
.contato__addr-divider{border:0;border-top:0.125rem solid rgba(255,255,255,0.45);width:16.25rem;max-width:100%;margin:1.5rem auto}
.contato__addr-run3{font-family:var(--font);font-weight:400;font-style:italic;font-size:1.22rem;line-height:1.1;letter-spacing:var(--track);margin:0}
.contato__addr-run3 strong{font-weight:700}

/* ===== Diretoria block (canvas: left inset x261, top y1609, ~1.6rem) ===== */
.contato__diretoria{margin:8.0625rem var(--inset) 18.75rem;font-family:var(--font);font-size:1.6rem;line-height:1.33;letter-spacing:var(--track)}
.contato__diretoria p{margin:0}
/* Design renders the diretoria/servidores labels and names in uppercase (the CMS
   data stays Title Case; text-transform handles the display). */
.contato__dir-heading{text-transform:uppercase;font-weight:700}
.contato__dir-name{text-transform:uppercase}
.contato__dir-heading{font-weight:400;color:var(--teal)}
.contato__dir-name{font-weight:700;color:#fff}
.contato__dir-gap{height:1.55rem}

/* ===== Responsive ===== */
@media (max-width:60rem){
  .contato{background-position:center top;background-size:cover}
  .reg{padding-top:3rem}
  .reg__rule--left{display:none}
  .reg__rule--right{position:static;display:block;width:100%;margin-top:1rem;left:auto;right:auto}
  .reg__line2{padding-left:1.5rem}
  .contato__subtitle{margin-inline:6%;max-width:none}
  .contato__cards{grid-template-columns:1fr;row-gap:4rem;margin:5rem 6% 0}
  .contato__card{min-height:0;padding-top:4rem}
  .contato__card--address{padding-top:5.5rem}
  .contato__diretoria{margin-inline:6%}
}
@media (min-width:60.0625rem) and (max-width:75rem){
  .contato__cards{grid-template-columns:repeat(3,1fr)}
}