/* Flalmibi — folha de estilo única */

:root{
  --paper:#f1f2f0;
  --paper-alt:#e3e5e2;
  --dark:#141614;
  --ink:#171917;
  --ink-soft:#6a6e6a;
  --green:#2a6b3c;
  --brass:#8a6a20;
  --step:84px;
  --sans: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --serif: Georgia, "Times New Roman", serif;
}

*,*::before,*::after{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--serif);
  font-size:18px;
  line-height:1.7;
  overflow-x:hidden;
}

img{max-width:100%;height:auto;display:block;}

a{color:var(--green);text-underline-offset:3px;text-decoration-thickness:1px;}
a:hover{text-decoration-thickness:2px;}
a:focus-visible,
:focus-visible{outline:2px solid var(--green);outline-offset:3px;}

h1,h2,h3{font-family:var(--sans);font-weight:800;color:inherit;margin:0;}

/* ---------- grelha ---------- */

.wrap{width:min(1200px, 100% - 64px);margin-inline:auto;}

.grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  column-gap:28px;
}

/* ---------- cabeçalho ---------- */

.top{border-bottom:1px solid #cfd3cf;background:var(--paper);}
.top__in{
  display:flex;flex-wrap:wrap;align-items:baseline;
  gap:16px 28px;padding:20px 0;
}
.brand{
  font-family:var(--sans);font-weight:800;font-size:19px;
  letter-spacing:-0.02em;color:var(--ink);text-decoration:none;
}
.brand span{color:var(--brass);font-weight:700;}
.nav{margin-left:auto;}
.nav ul{display:flex;flex-wrap:wrap;gap:14px 22px;list-style:none;margin:0;padding:0;}
.nav a{
  font-family:var(--sans);font-size:14px;font-weight:600;
  color:var(--ink);text-decoration:none;padding-bottom:2px;
  border-bottom:1px solid transparent;
}
.nav a:hover{border-bottom-color:var(--green);}
.nav a[aria-current="page"]{border-bottom-color:var(--green);color:var(--green);}

/* ---------- abertura ---------- */

.hero{padding:calc(var(--step) * 0.9) 0 calc(var(--step) * 0.65);}
.hero h1{
  grid-column:1 / 9;
  font-size:clamp(34px, 6.1vw, 68px);
  line-height:0.98;
  letter-spacing:-0.035em;
}
.hero .lead{
  grid-column:1 / 7;
  margin:34px 0 0;
  font-size:20px;
  color:var(--ink);
}
.hero .lead + .lead{margin-top:18px;font-size:18px;color:var(--ink-soft);}

/* ---------- coluna-índice ---------- */

.index{
  grid-column:10 / 13;
  grid-row:1 / span 3;
  font-family:var(--sans);
  font-size:13px;
  line-height:1.45;
  border-top:1px solid var(--ink);
  padding-top:10px;
}
.index p{margin:0 0 14px;color:var(--ink-soft);font-size:12px;letter-spacing:0.02em;}
.index ol{list-style:none;margin:0;padding:0;counter-reset:idx;}
.index li{display:flex;gap:10px;padding:5px 0;border-bottom:1px solid #d3d7d3;}
.index li::before{
  counter-increment:idx;
  content:counter(idx,decimal-leading-zero);
  color:var(--brass);font-weight:700;font-size:11px;padding-top:2px;
}
.index a{color:var(--ink);text-decoration:none;}
.index a:hover{color:var(--green);text-decoration:underline;}

/* ---------- secções ---------- */

.sec{padding:calc(var(--step) / 2) 0;}
.sec--alt{background:var(--paper-alt);}
.sec__body{
  grid-column:1 / 8;
  border-top:1px solid var(--ink);
  padding-top:14px;
}
.sec__mark{
  grid-column:10 / 13;
  border-top:1px solid #c6cbc6;
  padding-top:14px;
  font-family:var(--sans);
  font-size:12px;
  line-height:1.5;
  color:var(--ink-soft);
}
.sec__mark b{display:block;color:var(--brass);font-size:13px;letter-spacing:0.04em;}
.sec h2{
  font-size:clamp(24px, 2.7vw, 33px);
  line-height:1.08;
  letter-spacing:-0.02em;
  margin:0 0 18px;
}
.sec h3{
  font-size:18px;letter-spacing:-0.01em;margin:30px 0 8px;
}
.sec p{margin:0 0 18px;}
.sec p:last-child{margin-bottom:0;}

/* listas de trabalho */

.list{list-style:none;margin:0 0 18px;padding:0;}
.list li{position:relative;padding-left:22px;margin-bottom:9px;}
.list li::before{
  content:"";position:absolute;left:0;top:0.72em;
  width:9px;height:1px;background:var(--green);
}
.list--num{counter-reset:n;}
.list--num li::before{
  content:counter(n) ".";counter-increment:n;
  background:none;width:auto;height:auto;top:0;
  color:var(--brass);font-family:var(--sans);font-size:13px;font-weight:700;
}

/* ---------- imagem principal ---------- */

.figure{padding:calc(var(--step) / 2) 0;}
.figure__img{grid-column:1 / 9;}
.figure__img img{width:100%;}
.figure figcaption{
  grid-column:10 / 13;
  align-self:end;
  font-family:var(--sans);
  font-size:12px;line-height:1.55;color:var(--ink-soft);
  border-top:1px solid #c6cbc6;padding-top:10px;
}

/* ---------- secção contrastada ---------- */

.dark{background:var(--dark);color:var(--paper);padding:var(--step) 0;}
.dark .sec__body{border-top-color:#3a3f3a;}
.dark h2{color:var(--paper);}
.dark p{margin:0 0 18px;}
.dark .list li::before{background:#5d9b6f;}
.dark a{color:#8fc39c;}
.dark__text{grid-column:1 / 7;border-top:1px solid #3a3f3a;padding-top:14px;}
.dark__fig{grid-column:8 / 13;margin:0;}
.dark__fig img{width:100%;}
.dark__fig figcaption{
  margin-top:10px;font-family:var(--sans);font-size:12px;
  line-height:1.5;color:#9aa19a;
}

/* ---------- páginas interiores ---------- */

.plain .sec__body h2{margin-top:0;}
.note{
  grid-column:1 / 8;
  margin-top:26px;
  font-size:16px;color:var(--ink-soft);
}

/* ---------- rodapé ---------- */

.foot{background:var(--paper);border-top:1px solid #cfd3cf;padding:44px 0 56px;}
.foot__top{align-items:start;}
.foot__name{grid-column:1 / 7;}
.foot__name .brand{font-size:24px;display:inline-block;}
.foot__name p{
  margin:12px 0 0;font-size:16px;color:var(--ink-soft);max-width:44ch;
}
.foot__links{grid-column:9 / 13;font-family:var(--sans);font-size:13px;}
.foot__links ul{list-style:none;margin:0;padding:0;}
.foot__links li{padding:4px 0;border-bottom:1px solid #d3d7d3;}
.foot__links a{color:var(--ink);text-decoration:none;}
.foot__links a:hover{color:var(--green);text-decoration:underline;}
.foot__rule{border:0;border-top:1px solid var(--ink);margin:32px 0 20px;}
.foot__end{display:flex;flex-wrap:wrap;gap:8px 32px;font-size:15px;color:var(--ink-soft);}
.foot__end .mail{font-family:var(--sans);font-size:15px;}

/* ---------- adaptação ---------- */

@media (max-width: 900px){
  :root{--step:50px;}
  .wrap{width:min(1200px, 100% - 40px);}
  .grid{column-gap:20px;}

  .hero{padding-top:34px;}
  .hero .grid{display:flex;flex-direction:column;}
  .hero h1,.hero .lead{grid-column:auto;}
  .hero .lead{margin-top:22px;}

  .index{
    grid-column:auto;grid-row:auto;order:-1;
    margin-bottom:26px;border-top:1px solid var(--ink);
  }
  .index ol{display:flex;flex-wrap:wrap;gap:0 18px;}
  .index li{border-bottom:none;padding:4px 0;}

  .sec .grid,.figure .grid,.dark .grid,.foot__top{display:block;}
  .sec__body,.sec__mark,.figure__img,.figure figcaption,
  .dark__text,.dark__fig,.foot__name,.foot__links{grid-column:auto;}
  .sec__mark{margin-top:26px;border-top:none;padding-top:0;}
  .sec__mark b{display:inline;margin-right:8px;}
  .figure figcaption{margin-top:12px;}
  .dark__fig{margin-top:30px;}
  .dark__fig img{max-width:420px;}
  .foot__links{margin-top:28px;}
}

@media (max-width: 520px){
  body{font-size:17px;}
  .hero .lead{font-size:18px;}
  .top__in{padding:16px 0;}
  .nav{margin-left:0;width:100%;}
}