/* ==========================================================
   GALERIA IMPERIAL — páginas de família
   24H Draft · Daily Shot Solutions
   Regra desta página: todos os títulos ao centro.
   ========================================================== */

.pf h1,.pf h2,.pf h3,.pf h4,
.pf .etiq,.pf .chapeu,.pf .migalhas,.pf .lead{text-align:center}
.pf .etiq{justify-content:center}
.pf .migalhas{justify-content:center}
.pf .chapeu{max-width:62ch;margin-left:auto;margin-right:auto}
.pf .lead{max-width:62ch;margin:22px auto 0;color:var(--cinza);font-size:17px}
.pf .sec--verde .lead{color:#B9B2A2}

/* ---------- abertura ---------- */
.fhero{position:relative;background:var(--verde-esc);color:var(--marfim);overflow:hidden;
  padding:clamp(44px,6vw,78px) 0 0}
.fhero::before{content:'';position:absolute;inset:0;background:radial-gradient(115% 130% at 50% 0%,#1D4A33 0%,#123424 46%,#0A2017 100%)}
.fhero::after{content:'';position:absolute;inset:0;opacity:.13;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cg fill='none' stroke='%23C29B52' stroke-width='.7'%3E%3Cpath d='M30 4 L44 18 L30 32 L16 18 Z'/%3E%3Cpath d='M30 12 L36 18 L30 24 L24 18 Z'/%3E%3Cpath d='M0 34 L14 48 L0 62 M60 34 L46 48 L60 62'/%3E%3C/g%3E%3C/svg%3E")}
.fhero .wrap{position:relative;z-index:2}
.fhero h1{font-size:clamp(38px,5.6vw,72px);font-weight:400;color:var(--marfim);letter-spacing:-.02em;max-width:17ch;margin:0 auto}
.fhero h1 em{font-style:italic;color:var(--ouro-cl)}
.fhero__lead{font-size:clamp(16px,1.5vw,19px);color:#C3BCAC;margin:26px auto 32px;max-width:58ch;text-align:center}
.fhero__cta{display:flex;gap:13px;flex-wrap:wrap;justify-content:center}
.fhero__foto{margin-top:clamp(38px,5vw,62px);position:relative;overflow:hidden;aspect-ratio:21/9;
  border:12px solid transparent;border-image:linear-gradient(150deg,#C29B52,#7A5D2A 50%,#E0C08A) 1;background:#0A2017}
.fhero__foto img{width:100%;height:100%;object-fit:cover}

/* ---------- fichas de topo ---------- */
.chips{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--linha);border:1px solid var(--linha);margin-top:44px}
.chip{background:var(--la);padding:28px 22px;text-align:center}
.chip b{display:block;font-family:var(--d);font-size:clamp(26px,3vw,36px);font-weight:500;color:var(--verde);line-height:1.05}
.chip b small{font-size:.42em;color:var(--ouro-esc);font-family:var(--m);letter-spacing:.06em;display:block;margin-top:6px}
.chip span{display:block;font-family:var(--m);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--cinza);margin-top:12px}

/* ---------- tabela ---------- */
.tab{width:100%;border-collapse:collapse;margin-top:40px;font-size:15px}
.tab caption{font-family:var(--m);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--cinza);padding-bottom:14px;text-align:center}
.tab th,.tab td{text-align:left;padding:15px 16px;border-bottom:1px solid var(--linha);vertical-align:top}
.tab thead th{font-family:var(--m);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--marfim);
  background:var(--verde);border-bottom:0;font-weight:400}
.tab tbody tr{background:var(--la)}
.tab tbody tr:nth-child(even){background:#fff}
.tab tbody tr:hover{background:var(--marfim-esc)}
.tab td:first-child{font-family:var(--d);font-size:19px;color:var(--verde);line-height:1.2;white-space:nowrap}
.tab td small{display:block;font-family:var(--b);font-size:13px;color:var(--cinza);margin-top:4px;white-space:normal}
.sec--verde .tab tbody tr{background:rgba(244,237,224,.05)}
.sec--verde .tab tbody tr:nth-child(even){background:rgba(244,237,224,.09)}
.sec--verde .tab tbody tr:hover{background:rgba(194,155,82,.16)}
.sec--verde .tab th,.sec--verde .tab td{border-color:var(--linha-esc);color:#D5CEBE}
.sec--verde .tab td:first-child{color:var(--ouro-cl)}
.sec--verde .tab thead th{background:var(--ouro);color:var(--verde-esc)}
.sec--verde .tab td small{color:#9A9384}

.tab-rolo{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ---------- gráfico de barras ---------- */
.gr{margin-top:40px;display:grid;gap:16px}
.gr__linha{display:grid;grid-template-columns:minmax(120px,180px) 1fr auto;gap:16px;align-items:center}
.gr__rot{font-family:var(--m);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--cinza);text-align:right}
.gr__pista{height:14px;background:var(--marfim-esc);border-radius:2px;overflow:hidden;position:relative}
.gr__barra{height:100%;width:0;background:linear-gradient(90deg,#9B7838,#C29B52 60%,#E0C08A);border-radius:2px;
  transition:width 1.1s cubic-bezier(.2,.7,.3,1)}
.gr.in .gr__barra{width:var(--v)}
.gr__linha--eu .gr__barra{background:linear-gradient(90deg,#6E1B28,#8C2334 55%,#A8394A)}
.gr__linha--eu .gr__rot{color:var(--granada);font-weight:700}
.gr__val{font-family:var(--m);font-size:11.5px;color:var(--verde);min-width:96px;text-align:left}
.gr__linha--eu .gr__val{color:var(--granada);font-weight:700}
.gr__nota{margin-top:22px;font-size:13px;color:var(--cinza);text-align:center}

.sec--verde .gr__pista{background:rgba(244,237,224,.12)}
.sec--verde .gr__rot{color:#9A9384}
.sec--verde .gr__val{color:var(--ouro-cl)}
.sec--verde .gr__linha--eu .gr__rot,.sec--verde .gr__linha--eu .gr__val{color:var(--ouro-cl)}
.sec--verde .gr__linha--eu .gr__barra{background:linear-gradient(90deg,#C29B52,#E0C08A)}
.sec--verde .gr__nota{color:#8D8676}

/* perfil (barras curtas 0–5) */
.perfil{margin-top:40px;display:grid;grid-template-columns:repeat(2,1fr);gap:26px 44px}
.perfil__item b{display:block;font-family:var(--d);font-size:20px;color:var(--verde);margin-bottom:4px;text-align:center}
.perfil__item p{font-size:13.5px;color:var(--cinza);text-align:center;margin-bottom:12px}
.pontinhos{display:flex;gap:6px;justify-content:center}
.pontinhos i{width:100%;max-width:34px;height:8px;background:var(--marfim-esc);border-radius:1px;transform:skewX(-18deg)}
.pontinhos i.on{background:var(--granada)}

/* ---------- processo ---------- */
.fluxo{display:grid;grid-template-columns:repeat(3,1fr);gap:30px 26px;margin-top:48px;counter-reset:f}
.fluxo__p{text-align:center;position:relative;padding-top:34px}
.fluxo__p::before{counter-increment:f;content:counter(f,decimal-leading-zero);
  position:absolute;top:0;left:50%;transform:translateX(-50%);
  font-family:var(--m);font-size:11px;letter-spacing:.2em;color:var(--granada)}
.fluxo__p::after{content:'';position:absolute;top:22px;left:50%;transform:translateX(-50%);width:26px;height:1px;background:var(--ouro)}
.fluxo__p h3{font-size:21px;color:var(--verde);margin-bottom:9px}
.fluxo__p p{font-size:14.5px;color:var(--cinza)}
.sec--verde .fluxo__p h3{color:var(--ouro-cl)}
.sec--verde .fluxo__p p{color:#B9B2A2}
.sec--verde .fluxo__p::before{color:var(--ouro)}

/* ---------- vantagens ---------- */
.vant{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--linha);border:1px solid var(--linha);margin-top:48px}
.vant__c{background:var(--la);padding:32px 26px;text-align:center;transition:.25s}
.vant__c:hover{background:var(--verde)}
.vant__c b{display:block;font-family:var(--d);font-size:22px;color:var(--verde);margin-bottom:9px;transition:color .25s}
.vant__c:hover b{color:var(--ouro-cl)}
.vant__c p{font-size:14.5px;color:var(--cinza);transition:color .25s}
.vant__c:hover p{color:#C3BCAC}

/* ---------- faça / evite ---------- */
.duplo{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:44px}
.cart{border:1px solid var(--linha);border-radius:2px;padding:32px 30px;background:var(--la)}
.cart--sim{border-top:3px solid var(--verde)}
.cart--nao{border-top:3px solid var(--granada)}
.cart h3{font-size:24px;color:var(--verde);margin-bottom:20px}
.cart--nao h3{color:var(--granada)}
.cart ul{list-style:none;display:grid;gap:13px}
.cart li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:flex-start;font-size:15px;color:var(--cinza);text-align:left}
.cart li::before{font-family:var(--m);font-size:14px;line-height:1.4;flex:none}
.cart--sim li::before{content:'✓';color:var(--verde);font-weight:700}
.cart--nao li::before{content:'✕';color:var(--granada);font-weight:700}

/* ---------- outras famílias ---------- */
.outras{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
.outra{display:flex;flex-direction:column;border:1px solid var(--linha);border-radius:2px;overflow:hidden;background:var(--la);transition:.25s}
.outra:hover{border-color:var(--ouro);box-shadow:var(--sombra-sm);transform:translateY(-4px)}
.outra__foto{aspect-ratio:16/10;overflow:hidden;background:var(--verde-esc)}
.outra__foto img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.3,1)}
.outra:hover .outra__foto img{transform:scale(1.07)}
.outra__c{padding:22px 22px 26px;text-align:center;flex:1;display:flex;flex-direction:column}
.outra__c span{font-family:var(--m);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--granada)}
.outra__c b{display:block;font-family:var(--d);font-size:23px;color:var(--verde);margin:8px 0 8px}
.outra__c p{font-size:14px;color:var(--cinza);flex:1}
.outra__c em{display:block;font-style:normal;font-family:var(--m);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ouro-esc);margin-top:16px}

/* ---------- galeria curta ---------- */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:44px}
.trio .peca{grid-column:auto;grid-row:auto;aspect-ratio:4/3}

@media (max-width:1000px){
  .chips,.vant,.fluxo,.outras,.trio{grid-template-columns:repeat(2,1fr)}
  .fhero__foto{aspect-ratio:16/9}
}
@media (max-width:760px){
  .duplo,.perfil{grid-template-columns:1fr}
  .gr__linha{grid-template-columns:1fr;gap:7px}
  .gr__rot{text-align:left}
  .gr__val{text-align:left}
  .trio{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .chips,.vant,.fluxo,.outras{grid-template-columns:1fr}
  .fhero__foto{aspect-ratio:4/3;border-width:8px}
  .tab td:first-child{font-size:17px}
}
