/* Contact page — extends css/style.css */
.wrap{padding-top:var(--topbar-h)}
.hero{padding:5.4rem clamp(1rem,5vw,5rem) 1.6rem}.hero h1{font-family:"Cormorant Garamond",serif;font-weight:300;font-size:clamp(3.4rem,10vw,9.5rem);line-height:.85;letter-spacing:-.045em}.hero p{margin-top:.9rem;max-width:38rem;font-family:Inter,system-ui,sans-serif;font-size:clamp(1rem,1.35vw,1.15rem);font-weight:300;line-height:1.9;color:var(--soft);letter-spacing:.01em}
.commission{
  margin:0 clamp(1rem,4vw,4rem);position:relative;min-height:78vh;
  display:grid;grid-template-columns:1fr;justify-items:end;
  align-items:center;padding:clamp(2.5rem,6vw,4.5rem) clamp(1rem,5vw,5rem);
  color:#fff5e6;overflow:hidden;border-radius:70px 0 70px 0;background:#221c17;
}
.commission img{
  position:absolute;inset:0;z-index:0;
  width:100%;height:100%;object-fit:cover;object-position:center;
  filter:brightness(.58) saturate(.95);
}
.commission:after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(circle at 16% 20%,rgba(167,123,69,.22),transparent 34rem),
    linear-gradient(90deg,rgba(20,15,12,.45),rgba(20,15,12,.6) 42%,rgba(20,15,12,.92));
}
.commission > div{position:relative;z-index:2;max-width:46rem}
.eyebrow{font-family:Inter,system-ui,sans-serif;font-size:.58rem;font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:var(--gold)}h2.section-title{font-family:"Cormorant Garamond",serif;font-weight:300;font-size:clamp(2.4rem,5.5vw,5.5rem);line-height:.88;letter-spacing:-.035em}
.commission p{margin-top:1rem;line-height:1.85;color:#eadcc9}
.form-shell{margin-top:1.4rem;max-width:760px;background:rgba(18,14,11,.62);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,244,230,.18);padding:clamp(.9rem,2vw,1.1rem)}
.form-flow{margin-top:0;display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.field,.message,.select{width:100%;border:1px solid rgba(255,244,230,.25);background:rgba(255,244,230,.05);color:#fff4e6;padding:.85rem .75rem;font-family:Inter,sans-serif;transition:border-color .2s ease,background .2s ease}
.field::placeholder,.message::placeholder{color:rgba(255,244,230,.7)}
.field:focus,.message:focus,.select:focus{outline:none;border-color:rgba(233,201,149,.85);background:rgba(255,244,230,.1)}
.select option{background:#2a211a;color:#fff4e6}
.message{grid-column:1/-1;min-height:120px;resize:vertical}
.submit{margin-top:.8rem;border:1px solid rgba(255,244,230,.45);background:#fff4e6;color:#241e18;border-radius:999px;padding:.9rem 1.1rem;text-transform:uppercase;letter-spacing:.17em;font-size:.62rem;cursor:pointer}
.status{margin-top:.75rem;min-height:1.2rem;font-size:.68rem;color:#eadcc9}
.details{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding:1.6rem clamp(1rem,5vw,5rem) 2rem}
.card{border-top:1px solid var(--line);padding-top:1rem}.card p{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}.card strong{display:block;margin-top:.6rem;font-family:"Cormorant Garamond",serif;font-size:1.35rem;font-weight:300}
.note{padding:0 clamp(1rem,5vw,5rem) 2.2rem;color:var(--soft)}
.note p{font-size:.74rem;letter-spacing:.05em}
.note a{color:#6f4d35;font-weight:500}
.footer{padding:0 clamp(1rem,5vw,5rem) 2rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;color:var(--soft);font-size:.65rem;letter-spacing:.14em;text-transform:uppercase}
.footer-social{display:flex;gap:1.2rem}
.footer-social a{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;color:var(--soft);transition:color .2s ease}
.footer-social a:hover{color:var(--gold)}
@media(max-width:980px){
  .form-flow,.details{grid-template-columns:1fr}
  .commission{grid-template-columns:1fr;justify-items:stretch;border-radius:52px 0 52px 0}
  .commission > div{max-width:none}
}
@media(max-width:640px){
  .hero{padding:4.9rem 1rem 1.1rem}
  .hero h1{font-size:clamp(2.45rem,11.4vw,4rem)}
  .hero p{font-size:.98rem;line-height:1.62;margin-top:.75rem}
  .commission{border-radius:24px 0 24px 0;margin:0 .45rem;padding:1.8rem 1rem;min-height:auto}
  .commission .section-title{font-size:clamp(1.95rem,10vw,2.7rem)}
  .commission p{line-height:1.62}
  .form-shell{margin-top:1rem;padding:.7rem}
  .form-flow{gap:.62rem}
  .field,.message,.select{padding:.9rem .68rem;font-size:.98rem}
  .message{min-height:110px}
  .submit{width:100%;padding:.92rem;font-size:.62rem}
  .status{font-size:.64rem}
  .details{padding:1rem .95rem 1.2rem;gap:.7rem}
  .card strong{font-size:1.18rem}
  .note{padding:0 .95rem 1.3rem}
}

@media(max-width:430px){
  .hero{padding:4.5rem .82rem .95rem}
  .hero h1{font-size:clamp(2.12rem,10.6vw,3rem)}
  .hero p{font-size:.93rem;line-height:1.55}
  .commission{margin:0 .35rem;padding:1.5rem .82rem}
  .form-shell{padding:.58rem}
  .field,.message,.select{font-size:.93rem}
  .details{padding:.85rem .8rem 1.05rem}
  .card strong{font-size:1.06rem}
  .note{padding:0 .8rem 1.1rem}
}

@media(max-height:740px) and (max-width:640px){
  .hero{padding-bottom:.75rem}
  .commission{padding-top:1.35rem}
}
