/* ============ BABY — páginas internas ============ */
/* Depende de style.css (variáveis, cursor, nav, menu, footer, grain) */

/* ---- cabeçalho de página ---- */
.page-head{padding:24vh 6vw 8vh;border-bottom:1px solid var(--line)}
.page-head .eyebrow{margin-bottom:1.2rem}
.page-head__title{font-weight:800;font-size:clamp(2.4rem,8vw,6rem);
  letter-spacing:-.03em;line-height:.98}
.page-head__title em{color:var(--caramel)}
.page-head__lead{margin-top:1.6rem;max-width:46ch;font-size:clamp(1rem,1.8vw,1.2rem);
  line-height:1.6;color:var(--charcoal)}

/* breadcrumb */
.crumbs{display:flex;gap:.5rem;align-items:center;font-size:.72rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--charcoal);margin-bottom:2rem}
.crumbs a:hover{color:var(--caramel)}
.crumbs span{opacity:.5}

/* ---- bloco de conteúdo editorial ---- */
.prose{max-width:760px;margin:0 auto;padding:10vh 6vw}
.prose h2{font-weight:800;font-size:clamp(1.5rem,4vw,2.4rem);letter-spacing:-.02em;
  line-height:1.1;margin:3rem 0 1rem}
.prose h2:first-child{margin-top:0}
.prose h2 em{color:var(--caramel)}
.prose p{font-size:1.05rem;line-height:1.75;color:var(--charcoal);margin-bottom:1.2rem}
.prose ul{list-style:none;margin:0 0 1.5rem}
.prose ul li{position:relative;padding-left:1.6rem;margin-bottom:.7rem;
  font-size:1.02rem;line-height:1.6;color:var(--charcoal)}
.prose ul li::before{content:'✳';position:absolute;left:0;color:var(--caramel)}
.prose a{color:var(--obsidian);border-bottom:1px solid var(--caramel)}
.prose a:hover{color:var(--caramel)}
.prose strong{font-weight:600;color:var(--obsidian)}

/* ---- página de produto ---- */
.product{display:grid;grid-template-columns:1.1fr .9fr;gap:4vw;
  padding:18vh 6vw 10vh;align-items:start}

.gallery{position:sticky;top:12vh;display:flex;flex-direction:column;gap:1rem}
.gallery__main{aspect-ratio:3/4;overflow:hidden;background:var(--charcoal)}
.gallery__main img{transition:transform 1.1s var(--ease);filter:grayscale(.12)}
.gallery__main:hover img{transform:scale(1.04)}
.gallery__thumbs{display:flex;gap:.8rem}
.gallery__thumbs button{flex:1;aspect-ratio:1/1;overflow:hidden;border:1px solid transparent;
  background:var(--charcoal);cursor:none;padding:0;transition:border-color .3s,opacity .3s;opacity:.6}
.gallery__thumbs button.active{border-color:var(--obsidian);opacity:1}
.gallery__thumbs button:hover{opacity:1}

.pinfo{padding-top:1rem}
.pinfo__tag{display:inline-block;background:var(--obsidian);color:var(--ivory);
  font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;padding:.4rem .7rem;
  font-weight:600;margin-bottom:1.4rem}
.pinfo__name{font-weight:800;font-size:clamp(2rem,5vw,3.4rem);letter-spacing:-.03em;line-height:1}
.pinfo__price{display:flex;align-items:baseline;gap:.8rem;margin:1.4rem 0 .3rem}
.pinfo__price .amount{font-size:1.8rem;font-weight:600;color:var(--caramel)}
.pinfo__price .vat{font-size:.78rem;letter-spacing:.06em;color:var(--charcoal)}
.pinfo__desc{font-size:1.02rem;line-height:1.7;color:var(--charcoal);margin:1.8rem 0 2.4rem}

/* seletor de tamanho */
.sizes{margin-bottom:2rem}
.sizes__label{display:flex;justify-content:space-between;align-items:center;
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--charcoal);margin-bottom:.9rem}
.sizes__label a{border-bottom:1px solid var(--line)}
.sizes__label a:hover{color:var(--caramel)}
.sizes__grid{display:flex;flex-wrap:wrap;gap:.6rem}
.size{min-width:52px;padding:.8rem 1rem;border:1px solid var(--line);background:none;
  font-family:inherit;font-size:.9rem;font-weight:500;cursor:none;
  transition:border-color .3s,background .3s,color .3s}
.size:hover{border-color:var(--obsidian)}
.size.active{background:var(--obsidian);color:var(--ivory);border-color:var(--obsidian)}
.size:disabled{opacity:.35;text-decoration:line-through;cursor:not-allowed}

/* quantidade + adicionar */
.buy{display:flex;gap:1rem;align-items:stretch}
.qty{display:flex;align-items:center;border:1px solid var(--line)}
.qty button{width:46px;background:none;border:none;font-family:inherit;font-size:1.2rem;
  cursor:none;color:var(--obsidian);transition:color .3s}
.qty button:hover{color:var(--caramel)}
.qty input{width:40px;text-align:center;border:none;background:none;outline:none;
  font-family:inherit;font-size:1rem;font-weight:600;color:var(--obsidian)}
.add-cart{flex:1;background:var(--obsidian);color:var(--ivory);border:none;cursor:none;
  font-family:inherit;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;
  font-weight:600;padding:1.1rem 2rem;transition:background .4s}
.add-cart:hover{background:var(--caramel)}
.add-cart:disabled{opacity:.5;cursor:not-allowed}

.buy-note{margin-top:1rem;font-size:.78rem;color:var(--charcoal);opacity:.8}

/* acordeão de detalhes (também usado na FAQ) */
.accordion{margin-top:2.4rem;border-top:1px solid var(--line)}
.acc{border-bottom:1px solid var(--line)}
.acc__head{width:100%;display:flex;justify-content:space-between;align-items:center;
  gap:1rem;background:none;border:none;cursor:none;font-family:inherit;text-align:left;
  padding:1.3rem 0;font-size:1rem;font-weight:600;color:var(--obsidian)}
.acc__head .ico{position:relative;width:14px;height:14px;flex:0 0 auto}
.acc__head .ico::before,.acc__head .ico::after{content:'';position:absolute;background:var(--caramel);
  transition:transform .4s var(--ease)}
.acc__head .ico::before{top:6px;left:0;width:14px;height:2px}
.acc__head .ico::after{top:0;left:6px;width:2px;height:14px}
.acc.open .acc__head .ico::after{transform:scaleY(0)}
.acc__body{max-height:0;overflow:hidden;transition:max-height .5s var(--ease)}
.acc__body p{padding:0 0 1.4rem;font-size:.98rem;line-height:1.7;color:var(--charcoal)}

/* ---- relacionados ---- */
.related{padding:8vh 6vw 12vh;border-top:1px solid var(--line)}
.related h2{font-weight:800;font-size:clamp(1.5rem,4vw,2.4rem);letter-spacing:-.02em;margin-bottom:4vh}
.related__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}

/* ---- formulário de contacto ---- */
.form-wrap{max-width:680px;margin:0 auto;padding:6vh 6vw 14vh}
.field{margin-bottom:1.8rem}
.field label{display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--charcoal);margin-bottom:.7rem}
.field input,.field select,.field textarea{width:100%;background:none;border:none;
  border-bottom:1px solid var(--obsidian);outline:none;cursor:none;font-family:inherit;
  font-size:1.05rem;padding:.8rem 0;color:var(--obsidian);transition:border-color .3s}
.field textarea{resize:vertical;min-height:120px}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--caramel)}
.field input::placeholder,.field textarea::placeholder{color:var(--charcoal);opacity:.5}
.field--check{display:flex;align-items:flex-start;gap:.8rem}
.field--check input{width:auto;border:none}
.field--check label{margin:0;text-transform:none;letter-spacing:0;font-size:.88rem;color:var(--charcoal)}
.form-submit{background:var(--obsidian);color:var(--ivory);border:none;cursor:none;
  font-family:inherit;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;
  font-weight:600;padding:1.1rem 2.6rem;transition:background .4s}
.form-submit:hover{background:var(--caramel)}
.form-msg{margin-top:1.4rem;font-size:.92rem;color:var(--caramel);min-height:1.2em}

.contact-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;
  max-width:680px;margin:0 auto;padding:0 6vw 10vh}
.contact-meta .item span{display:block}
.contact-meta .item .k{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--caramel);margin-bottom:.5rem}
.contact-meta .item .v{font-size:.95rem;line-height:1.5;color:var(--charcoal)}

/* ---- responsivo ---- */
@media(max-width:860px){
  .product{grid-template-columns:1fr;gap:3rem;padding:16vh 6vw 8vh}
  .gallery{position:static;top:auto}
  .related__grid{grid-template-columns:1fr 1fr}
  .contact-meta{grid-template-columns:1fr;gap:1.6rem}
}
@media(max-width:520px){
  .related__grid{grid-template-columns:1fr}
}
