/* Rekakita — Designer page shared styles.
   Scoped to designer pages only. Base tokens/reset/header/footer live inline on each page. */

/* ---------- Container ---------- */
.designer-wrap{max-width:980px;margin:0 auto;padding:0 22px}
@media (max-width:860px){.designer-wrap{padding:0 18px}}

/* ---------- Breadcrumb ---------- */
.designer-breadcrumb{
  font-family:'Inter',sans-serif;font-size:13px;
  color:#8A7F75;letter-spacing:.02em;
  margin:40px 0 28px;
}
.designer-breadcrumb a{color:#B84A2C;text-decoration:none}
.designer-breadcrumb a:hover{text-decoration:underline}
.designer-breadcrumb span[aria-current="page"]{color:#1A1614}

/* ---------- Minimal hero ---------- */
.designer-hero{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;padding:32px 0 48px;
  border-bottom:1px solid rgba(26,22,20,.08);
  margin-bottom:56px;
}
.designer-hero-avatar{
  width:96px;height:96px;border-radius:50%;
  object-fit:cover;
  border:1px solid rgba(26,22,20,.1);
  box-shadow:0 12px 28px -12px rgba(26,22,20,.3);
  margin-bottom:22px;
}
.designer-name{
  font-family:'Fraunces',serif;font-weight:400;
  font-size:clamp(38px,5.6vw,58px);
  line-height:1.02;letter-spacing:-.015em;
  margin:0 0 10px;text-wrap:balance;
}
.designer-specialty-tag{
  font-family:'Inter',sans-serif;
  font-size:11px;font-weight:500;letter-spacing:.22em;
  text-transform:uppercase;color:#B8923F;margin:0 0 14px;
}
.designer-tagline{
  font-family:'Fraunces',serif;font-style:italic;font-weight:400;
  font-size:clamp(19px,2vw,22px);color:#3D342E;
  max-width:44ch;margin:0;line-height:1.35;
}

/* ---------- Section headings ---------- */
.section-heading{
  font-family:'Fraunces',serif;font-weight:500;
  font-size:clamp(26px,3.5vw,34px);line-height:1.1;
  letter-spacing:-.01em;margin:0 0 28px;
}

/* ---------- Work gallery ---------- */
.work-gallery-section{margin:0 0 72px}
.work-gallery{
  display:grid;grid-template-columns:repeat(2,1fr);gap:20px;
}
.work-gallery-item{
  margin:0;background:#EFE4D2;
  border:1px solid rgba(26,22,20,.06);border-radius:4px;
  overflow:hidden;
}
.work-gallery-item img{
  width:100%;aspect-ratio:1/1;object-fit:cover;display:block;
  transition:transform .35s ease;
}
.work-gallery-item:hover img{transform:scale(1.02)}
.work-gallery-caption{
  font-family:'Inter',sans-serif;font-size:13px;color:#6B5E55;
  letter-spacing:.02em;padding:14px 16px 16px;margin:0;
  background:#F5EDE0;
  border-top:1px solid rgba(26,22,20,.06);
}
.work-gallery-note{
  margin-top:24px;font-family:'Fraunces',serif;font-style:italic;
  font-size:15px;color:#6B5E55;text-align:center;
}

/* ---------- Bio section ---------- */
.designer-bio-section{margin:0 0 72px}
.designer-bio-layout{
  display:grid;grid-template-columns:1fr 1.4fr;gap:56px;align-items:start;
}
.designer-portrait-large{
  width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center 20%;
  border-radius:4px;border:1px solid rgba(26,22,20,.08);
  box-shadow:0 30px 60px -30px rgba(26,22,20,.3);
  background:#E4D5BA;
}
.designer-bio-text p{
  margin:0 0 20px;font-size:17px;line-height:1.7;color:#3D342E;
  max-width:52ch;
}
.designer-bio-text p:first-child::first-letter{
  font-family:'Fraunces',serif;font-weight:400;
  font-size:3.4em;float:left;line-height:.9;
  padding:4px 8px 0 0;color:#1A1614;
}

/* ---------- Best for ---------- */
.designer-best-for{margin:0 0 64px}
.best-for-tags{display:flex;flex-wrap:wrap;gap:10px}
.best-for-tag{
  font-family:'Inter',sans-serif;font-size:13px;font-weight:500;
  color:#3D342E;background:#EFE4D2;
  border:1px solid rgba(184,146,63,.35);
  padding:10px 16px;border-radius:999px;
  letter-spacing:.01em;
}

/* ---------- Signatures + cultural lineage ---------- */
.designer-signatures{margin:0 0 72px;max-width:720px}
.designer-signatures h3{
  font-family:'Fraunces',serif;font-weight:500;font-size:22px;
  margin:0 0 10px;letter-spacing:-.005em;
}
.designer-signatures h3:not(:first-child){margin-top:36px}
.designer-signatures p{
  margin:0;font-size:16px;line-height:1.7;color:#3D342E;max-width:56ch;
}

/* ---------- How to brief ---------- */
.designer-how-to{margin:0 0 72px;padding:56px 0;border-top:1px solid rgba(26,22,20,.08);border-bottom:1px solid rgba(26,22,20,.08)}
.how-to-steps{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:32px;
}
.how-to-step{padding:0}
.how-to-step .step-number{
  display:block;font-family:'JetBrains Mono',monospace;
  font-size:12px;letter-spacing:.12em;
  color:#B8923F;margin-bottom:12px;
}
.how-to-step p{
  margin:0;font-family:'Fraunces',serif;font-weight:400;
  font-size:19px;line-height:1.4;color:#1A1614;
  max-width:26ch;
}

/* ---------- Designer CTA ---------- */
.designer-cta-box{
  margin:0 0 80px;padding:56px 22px;
  background:#EFE4D2;border-radius:6px;
  text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:14px;
}
.designer-cta-box .btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:16px 26px;border-radius:999px;
  font-family:'Inter',sans-serif;font-size:15px;font-weight:500;
  text-decoration:none;transition:background .2s,transform .2s,border-color .2s;
}
.designer-cta-box .btn-primary{background:#B84A2C;color:#F5EDE0;border:none}
.designer-cta-box .btn-primary:hover{background:#9E3E24;transform:translateY(-1px)}
.designer-cta-box .btn-secondary{
  background:transparent;color:#1A1614;
  border:1px solid rgba(26,22,20,.25);
}
.designer-cta-box .btn-secondary:hover{background:rgba(26,22,20,.04)}

/* ---------- Related designers ---------- */
.designer-related{margin:0 0 96px}
.designer-related-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:20px;
}
.related-designer-card{
  display:flex;gap:16px;align-items:center;
  padding:18px 20px;background:#EFE4D2;
  border:1px solid rgba(26,22,20,.06);border-radius:4px;
  text-decoration:none;color:inherit;
  transition:transform .25s ease, box-shadow .25s ease;
}
.related-designer-card:hover{transform:translateY(-2px);box-shadow:0 18px 36px -20px rgba(26,22,20,.22)}
.related-designer-card img{
  width:56px;height:56px;border-radius:50%;object-fit:cover;flex-shrink:0;
  border:1px solid rgba(26,22,20,.1);
}
.related-designer-meta h3{
  font-family:'Fraunces',serif;font-weight:500;font-size:18px;
  margin:0 0 3px;color:#1A1614;
}
.related-designer-meta p{
  font-family:'Fraunces',serif;font-style:italic;font-size:14px;
  margin:0;color:#6B5E55;
}

/* ---------- Mobile responsive ---------- */
@media (max-width:768px){
  .work-gallery{grid-template-columns:1fr}
  .designer-bio-layout{grid-template-columns:1fr;gap:28px}
  .designer-portrait-large{max-width:360px;margin:0 auto}
  .designer-bio-text p{max-width:none}
  .how-to-steps{grid-template-columns:1fr;gap:20px}
  .designer-related-grid{grid-template-columns:1fr}
  .designer-cta-box{padding:40px 22px}
  .designer-breadcrumb{margin:24px 0 20px}
}
