:root{
    --cream:#F5F1E7;
    --paper:#FBF9F3;
    --ink:#16140F;
    --ink-soft:#4A473F;
    --line:#DFD9C8;
    --yellow:#F0B429;
    --terracotta:#D8622B;
    --pill-radius:999px;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--cream);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  [hidden]{display:none !important;}
  html{overflow-x:clip;}
  .wrap{max-width:1240px;margin:0 auto;padding:0 32px;}

  /* ---------- Header ---------- */
  header{
    position:sticky;top:0;z-index:50;
    background:rgba(245,241,231,0.92);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line);
  }
  .header-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 32px;gap:24px;}
  .brand{display:flex;align-items:center;gap:10px;}
  .brand-mark{width:20px;height:40px;flex-shrink:0;}
  .brand-mark svg{width:100%;height:100%;}
  .brand-mark path{fill:var(--ink);}
  .brand-text{line-height:1;}
  .brand-bn{display:block;font-family:'Tiro Bangla',serif;font-size:13px;color:var(--ink-soft);margin-bottom:2px;}
  .brand-en{display:block;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:19px;letter-spacing:0.5px;}

  nav{display:flex;align-items:center;gap:30px;}
  nav a{
    font-size:14px;font-weight:600;letter-spacing:0.4px;
    color:var(--ink-soft);
    display:flex;align-items:center;gap:6px;
    padding-bottom:4px;border-bottom:2px solid transparent;
  }
  nav a.active{color:var(--ink);border-bottom-color:var(--ink);}
  nav a:hover{color:var(--ink);}
  .soon{
    font-size:9px;font-weight:700;letter-spacing:0.4px;
    background:var(--ink);color:var(--paper);
    padding:2px 6px;border-radius:4px;
    text-transform:uppercase;
  }

  .header-actions{display:flex;align-items:center;gap:16px;}
  .btn{
    display:inline-flex;align-items:center;gap:8px;
    font-family:'Inter',sans-serif;font-weight:700;font-size:13px;letter-spacing:0.6px;
    text-transform:uppercase;
    padding:12px 22px;border-radius:var(--pill-radius);
    border:1px solid var(--ink);
    cursor:pointer;
    white-space:nowrap;
  }
  .btn-primary{background:var(--ink);color:var(--paper);}
  .btn-primary:hover{background:#000;}
  .btn-ghost{background:transparent;color:var(--ink);}
  .btn-ghost:hover{background:var(--ink);color:var(--paper);}
  .btn-arrow{background:var(--ink);color:var(--paper);padding:13px 20px;align-self:center;}
  .btn-arrow svg{width:13px;height:13px;}

  /* ---------- Hero ---------- */
  .hero{padding:72px 0 40px;}
  .hero-grid{display:grid;grid-template-columns:1.15fr 0.85fr;gap:48px;align-items:center;}
  .hero-grid > div:first-child{margin-top:-8px;}
  .eyebrow{
    font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;
    color:var(--terracotta);margin-bottom:18px;
  }
  h1.headline{
    font-family:'Space Grotesk',sans-serif;
    font-weight:700;
    font-size:64px;
    line-height:1.02;
    letter-spacing:-1.5px;
  }
  .headline .accent{position:relative;display:inline-block;}
  .headline .accent svg{position:absolute;left:0;bottom:-14px;width:100%;height:16px;}
  .hero-sub{
    margin-top:26px;max-width:480px;
    font-size:17px;line-height:1.6;color:var(--ink-soft);
  }
  .hero-cta{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap;}

  .art-dots{display:flex;flex-direction:column;align-items:center;gap:6px;}
  .art-dot{width:3px;height:3px;padding:0;border-radius:50%;border:none;background:var(--line);cursor:pointer;transition:background .2s;}
  .art-dot.active{background:var(--terracotta);}
  .art-primary{
    height:min(66vh,600px);border-radius:20px;overflow:hidden;
    background:#fff;
    display:flex;align-items:center;justify-content:center;
    transition:opacity .2s ease;
  }
  .art-primary-fill{width:100%;height:100%;}
  img.art-primary-fill{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;display:block;}

  .art-caption-title{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:16px;}
  .art-caption-artist{
    display:inline-block;margin-top:4px;
    font-size:13px;font-weight:600;color:var(--terracotta);
  }
  .art-caption-artist:hover{text-decoration:underline;}
  .art-caption-meta{font-size:13px;color:var(--ink-soft);margin-top:2px;}

  .art-next-btn{
    flex-shrink:0;width:34px;height:34px;border-radius:50%;
    border:1px solid var(--line);background:var(--paper);color:var(--ink);
    display:flex;align-items:center;justify-content:center;cursor:pointer;
  }
  .art-next-btn svg{width:14px;height:14px;}
  .art-next-btn:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);}

  /* ---------- Contextual CTA banner ---------- */
  .cta-banner{
    margin:56px 0;
    background:var(--ink);color:var(--paper);
    border-radius:24px;
    padding:40px 48px;
    display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;
  }
  .cta-banner h3{
    font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:26px;line-height:1.25;max-width:640px;
  }
  .cta-banner p{margin-top:10px;color:#C9C5B8;font-size:14px;line-height:1.6;max-width:560px;}
  .cta-banner .btn-primary{background:var(--yellow);color:var(--ink);border-color:var(--yellow);}
  .cta-banner .btn-primary:hover{background:#ffc94a;}

  /* ---------- Section headers ---------- */
  .section{padding:20px 0 56px;}
  .section-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:24px;}
  .section-head h2{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:26px;}
  .section-link{font-size:13px;font-weight:600;color:var(--ink-soft);display:flex;align-items:center;gap:4px;}
  .section-link:hover{color:var(--ink);}

  /* ---------- Featured cards ---------- */
  .card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
  .card{
    background:var(--paper);border:1px solid var(--line);border-radius:16px;overflow:hidden;
    display:flex;flex-direction:column;
  }
  .card-thumb{aspect-ratio:4/3;position:relative;}
  .card-thumb .tag{
    position:absolute;top:12px;left:12px;
    background:rgba(22,20,15,0.75);color:var(--paper);
    font-size:10px;font-weight:700;letter-spacing:0.6px;text-transform:uppercase;
    padding:5px 10px;border-radius:999px;
  }
  .card-body{padding:16px 16px 20px;}
  .card-kicker{font-size:10px;font-weight:700;letter-spacing:0.8px;text-transform:uppercase;color:var(--terracotta);margin-bottom:6px;}
  .card-title{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:17px;margin-bottom:4px;}
  .card-meta{font-size:13px;color:var(--ink-soft);line-height:1.5;}

  .thumb-1{background:linear-gradient(135deg,#E7A15C,#C43D3D);}
  .thumb-2{background:linear-gradient(135deg,#2A2622,#5C5648);}
  .thumb-3{background:linear-gradient(135deg,#8C7355,#3E3A32);}
  .thumb-4{background:linear-gradient(135deg,#C4622E,#6B3A2A);}
  .thumb-5{background:linear-gradient(135deg,#4B6E63,#233530);}
  .thumb-6{background:linear-gradient(135deg,#B4894A,#5A3E2B);}
  .thumb-7{background:linear-gradient(135deg,#7A4B6E,#2E1F2C);}
  .thumb-8{background:linear-gradient(135deg,#3E5C76,#1B2A38);}

  /* ---------- Shilpi grid ---------- */
  .shilpi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
  .shilpi-card{
    background:var(--paper);border:1px solid var(--line);border-radius:16px;
    padding:20px;display:flex;gap:16px;align-items:center;
  }
  .avatar{width:64px;height:64px;border-radius:50%;flex-shrink:0;}
  .avatar-1{background:linear-gradient(135deg,#E7A15C,#C43D3D);}
  .avatar-2{background:linear-gradient(135deg,#4B6E63,#233530);}
  .avatar-3{background:linear-gradient(135deg,#7A4B6E,#2E1F2C);}
  .avatar-4{background:linear-gradient(135deg,#3E5C76,#1B2A38);}
  .avatar-5{background:linear-gradient(135deg,#C4622E,#6B3A2A);}
  .avatar-6{background:linear-gradient(135deg,#B4894A,#5A3E2B);}
  .shilpi-name{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:16px;}
  .shilpi-role{font-size:13px;color:var(--terracotta);font-weight:600;margin-top:2px;}
  .shilpi-loc{font-size:12px;color:var(--ink-soft);margin-top:4px;}

  /* ---------- Footer ---------- */
  footer{border-top:1px solid var(--line);margin-top:40px;padding:56px 0 32px;}
  .footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;padding-bottom:40px;}
  .footer-brand .brand{margin-bottom:14px;}
  .footer-brand p{font-size:13px;color:var(--ink-soft);max-width:280px;line-height:1.6;}
  .footer-col h4{font-size:12px;font-weight:700;letter-spacing:0.6px;text-transform:uppercase;color:var(--ink-soft);margin-bottom:14px;}
  .footer-col a{display:block;font-size:14px;margin-bottom:10px;color:var(--ink);}
  .footer-col a:hover{color:var(--terracotta);}

  .partners{border-top:1px solid var(--line);padding-top:28px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
  .partners span{font-size:11px;font-weight:700;letter-spacing:0.6px;text-transform:uppercase;color:var(--ink-soft);margin-right:8px;}
  .partner-logo{
    height:44px;display:flex;align-items:center;
    background:#fff;border:1px solid var(--line);border-radius:8px;
    padding:6px 14px;
  }
  .partner-logo img{height:100%;width:auto;max-width:120px;object-fit:contain;display:block;}

  .footer-right{display:flex;align-items:center;gap:14px;}
  .footer-ig{display:flex;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);align-items:center;justify-content:center;color:var(--ink);transition:background .2s,color .2s;}
  .footer-ig:hover{background:var(--ink);color:var(--paper);}
  .footer-ig svg{width:16px;height:16px;}
  .footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:24px;margin-top:24px;border-top:1px solid var(--line);font-size:12px;color:var(--ink-soft);}

  @media (max-width:980px){
    nav{display:none;}
    .hero-grid{grid-template-columns:1fr;}
    h1.headline{font-size:44px;}
    .card-grid{grid-template-columns:repeat(2,1fr);}
    .shilpi-grid{grid-template-columns:repeat(2,1fr);}
    .footer-top{grid-template-columns:1fr 1fr;}
  }

/* ---------- Directory: page hero ---------- */
.page-hero{padding:56px 0 8px;}
.page-hero h1{
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:44px;letter-spacing:-1px;
}
.page-hero p{margin-top:12px;max-width:520px;font-size:16px;line-height:1.6;color:var(--ink-soft);}

/* ---------- Directory: search + filters ---------- */
.search-row{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap;}
.search-input{
  flex:1;min-width:240px;
  display:flex;align-items:center;gap:10px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--pill-radius);
  padding:14px 20px;
}
.search-input svg{width:16px;height:16px;color:var(--ink-soft);flex-shrink:0;}
.search-input input{
  border:none;outline:none;background:transparent;font-family:'Inter',sans-serif;
  font-size:14px;color:var(--ink);width:100%;
}
.search-input input::placeholder{color:var(--ink-soft);}

.filter-row{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap;}
.filter-chip{
  padding:9px 18px;border-radius:var(--pill-radius);border:1px solid var(--line);
  background:var(--paper);font-size:13px;font-weight:600;color:var(--ink-soft);
  cursor:pointer;white-space:nowrap;
}
.filter-chip.active{background:var(--ink);color:var(--paper);border-color:var(--ink);}

.results-bar{
  display:flex;align-items:center;justify-content:space-between;
  margin:40px 0 20px;font-size:13px;color:var(--ink-soft);
  padding-top:24px;border-top:1px solid var(--line);
}
.sort-select{
  border:1px solid var(--line);background:var(--paper);border-radius:8px;
  padding:8px 12px;font-size:13px;font-family:'Inter',sans-serif;color:var(--ink);
}

/* ---------- Directory: pagination ---------- */
.pagination{display:flex;justify-content:center;align-items:center;gap:8px;margin:48px 0 24px;}
.page-btn{
  width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--line);background:var(--paper);
  font-size:13px;font-weight:600;color:var(--ink-soft);
}
.page-btn.active{background:var(--ink);color:var(--paper);border-color:var(--ink);}

@media (max-width:980px){
  .page-hero h1{font-size:34px;}
}

/* ---------- Shilpi profile ---------- */
.back-link{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13px;font-weight:600;color:var(--ink-soft);
  padding:20px 0 0;
}
.back-link:hover{color:var(--ink);}
.back-link svg{width:14px;height:14px;}

.profile-hero{padding:24px 0 40px;display:flex;gap:40px;align-items:flex-start;flex-wrap:wrap;position:relative;}
.profile-edit{position:absolute;top:24px;right:0;}
@media (max-width:700px){.profile-edit{position:static;}}
.profile-portrait{width:180px;height:180px;border-radius:24px;flex-shrink:0;}
.profile-info{flex:1;min-width:280px;}
.profile-name{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:40px;letter-spacing:-1px;}
.profile-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;}
.tag-pill{
  font-size:12px;font-weight:600;padding:7px 15px;border-radius:999px;
  background:var(--paper);border:1px solid var(--line);color:var(--ink-soft);
}
.profile-loc{margin-top:16px;font-size:14px;color:var(--ink-soft);display:flex;align-items:center;gap:6px;}
.profile-loc svg{width:15px;height:15px;}
.profile-bio{margin-top:18px;max-width:620px;font-size:15px;line-height:1.7;color:var(--ink-soft);}
.profile-links{margin-top:22px;display:flex;gap:10px;flex-wrap:wrap;}
.link-pill{
  display:inline-flex;align-items:center;gap:7px;
  font-size:13px;font-weight:600;padding:9px 16px;border-radius:999px;
  border:1px solid var(--line);color:var(--ink);
}
.link-pill:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.link-pill svg{width:14px;height:14px;}

.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.work-card{border-radius:16px;overflow:hidden;background:var(--paper);border:1px solid var(--line);}
.work-thumb{aspect-ratio:1/1;}
.work-body{padding:14px 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:10px;}
.work-title{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:14px;}
.work-meta{font-size:12px;color:var(--ink-soft);margin-top:2px;}

.buy-btn{
  flex-shrink:0;display:inline-flex;align-items:center;gap:5px;
  font-size:11px;font-weight:700;letter-spacing:0.2px;
  padding:7px 12px;border-radius:999px;
  border:1px solid var(--line);background:var(--cream);color:var(--ink);
  white-space:nowrap;
}
.buy-btn:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.buy-btn svg{width:11px;height:11px;flex-shrink:0;}

@media (max-width:980px){
  .work-grid{grid-template-columns:repeat(2,1fr);}
  .profile-name{font-size:32px;}
  .profile-portrait{width:140px;height:140px;}
}

/* ---------- About page ---------- */
.about-hero{padding:64px 0 0;}
.about-hero-grid{display:grid;grid-template-columns:1.3fr 0.7fr;gap:40px;align-items:end;}
.about-hero-text{padding-bottom:32px;}
.about-hero-img{justify-self:end;max-width:100%;height:auto;display:block;}
.about-hero h1{
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:52px;
  line-height:1.08;letter-spacing:-1px;
}
.about-hero p{margin-top:20px;font-size:17px;line-height:1.6;color:var(--ink-soft);}

.about-statement{padding:8px 0 40px;max-width:800px;}
.about-statement p{
  font-family:'Space Grotesk',sans-serif;font-weight:600;
  font-size:28px;line-height:1.4;letter-spacing:-0.3px;color:var(--ink);
}
.about-statement .accent-word{color:var(--terracotta);}

.about-section{padding:48px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:220px 1fr;gap:48px;}
.about-section h2{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:22px;}
.about-section .about-body{max-width:640px;font-size:15px;line-height:1.75;color:var(--ink-soft);}
.about-body p + p{margin-top:14px;}

.stakeholder-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;max-width:640px;}
.stakeholder-card{
  background:var(--paper);border:1px solid var(--line);border-radius:16px;
  padding:24px;
}
.stake-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(216,98,43,.1);color:var(--terracotta);margin-bottom:14px;}
.stake-icon svg{width:20px;height:20px;}
.stakeholder-card h3{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:16px;}
.stakeholder-card ul{margin-top:12px;padding-left:18px;}
.stakeholder-card li{font-size:13px;color:var(--ink-soft);line-height:1.6;margin-bottom:6px;}
.stakeholder-card li::marker{color:var(--terracotta);}

.partners-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;max-width:640px;}
.partner-card{
  background:var(--paper);border:1px solid var(--line);border-radius:16px;
  padding:24px;display:flex;flex-direction:column;gap:14px;
}
.partner-card .partner-logo{height:33px;align-self:flex-start;background:none;border:0;border-radius:0;padding:0;}
.partner-card .partner-logo img{max-width:180px;mix-blend-mode:multiply;}
.partner-card p{font-size:13px;color:var(--ink-soft);line-height:1.5;}

.contact-block{display:flex;flex-direction:column;gap:14px;max-width:640px;}
.contact-row{display:flex;align-items:center;gap:12px;font-size:15px;}
.contact-row svg{width:18px;height:18px;color:var(--terracotta);flex-shrink:0;}
.contact-row a{font-weight:600;}
.contact-row a:hover{color:var(--terracotta);}

@media (max-width:980px){
  .about-hero h1{font-size:36px;}
  .about-hero-grid{grid-template-columns:1fr;}
  .about-hero-img{display:none;}
  .about-section{grid-template-columns:1fr;gap:16px;}
  .partners-grid{grid-template-columns:1fr;}
  .stakeholder-grid{grid-template-columns:1fr;}
}

/* ---------- Art detail page ---------- */
.art-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;padding:24px 0 0;}
.art-detail-frame{
  background:#fff;border:1px solid var(--line);border-radius:20px;
  padding:32px;display:flex;align-items:center;justify-content:center;
  height:560px;
}
.art-detail-frame img{max-width:100%;max-height:100%;object-fit:contain;display:block;}
.art-detail-title{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:34px;letter-spacing:-0.5px;line-height:1.15;}
.art-detail-meta{margin-top:8px;font-size:14px;color:var(--ink-soft);}
.art-detail-desc{margin-top:22px;padding-top:22px;border-top:1px solid var(--line);font-size:15px;line-height:1.75;color:var(--ink-soft);max-width:440px;}

.artist-panel{
  display:flex;gap:16px;align-items:flex-start;
  background:var(--paper);border:1px solid var(--line);border-radius:16px;
  padding:24px;
}
.artist-panel .avatar{width:56px;height:56px;flex-shrink:0;}
.artist-panel-name{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:18px;}
.artist-panel-role{font-size:13px;color:var(--terracotta);font-weight:600;margin-top:2px;}
.artist-panel-loc{font-size:12px;color:var(--ink-soft);margin-top:2px;}
.artist-panel-bio{margin-top:10px;font-size:14px;color:var(--ink-soft);line-height:1.65;max-width:560px;}

@media (max-width:980px){
  .art-detail-grid{grid-template-columns:1fr;gap:24px;}
  .art-detail-frame{height:420px;}
  .artist-panel{flex-direction:column;}
}

/* ---------- Impact page ---------- */
.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;max-width:560px;}
.stat-tile{
  background:var(--paper);border:1px solid var(--line);border-radius:16px;
  padding:24px;
}
.stat-num{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:36px;letter-spacing:-0.5px;color:var(--ink);}
.stat-label{margin-top:8px;font-size:13px;color:var(--ink-soft);}

@media (max-width:980px){
  .stat-grid{grid-template-columns:1fr 1fr;max-width:none;}
}

/* ---------- Shared form + UI bits ---------- */
.btn[disabled]{opacity:.35;cursor:not-allowed;}
.btn-sm{padding:9px 16px;font-size:12px;}
.field{display:block;margin-top:20px;}
.field-label{display:flex;justify-content:space-between;font-size:13px;font-weight:600;margin-bottom:8px;}
.field-label small{font-weight:500;color:var(--ink-soft);}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.input{
  width:100%;padding:13px 16px;border:1px solid var(--line);border-radius:12px;background:#fff;
  font:15px 'Inter',sans-serif;color:var(--ink);outline:none;transition:border-color .2s,box-shadow .2s;
}
.input::placeholder{color:#A8A395;}
.input:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(22,20,15,0.06);}
textarea.input{resize:vertical;min-height:100px;line-height:1.55;}
select.input{appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234A473F' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center/16px;}
.input-affix{display:flex;align-items:center;border:1px solid var(--line);border-radius:12px;background:#fff;transition:border-color .2s,box-shadow .2s;}
.input-affix:focus-within{border-color:var(--ink);box-shadow:0 0 0 3px rgba(22,20,15,0.06);}
.input-affix span{padding:0 0 0 16px;font-weight:600;color:var(--ink-soft);}
.input-affix .input{border:none;box-shadow:none;padding-left:6px;}
.chip-wrap{display:flex;flex-wrap:wrap;gap:8px;}
.filter-chip{transition:background .2s,color .2s,border-color .2s,transform .15s;}
.filter-chip:active{transform:scale(.96);}
.chip-add{
  padding:9px 18px;border-radius:999px;border:1px dashed #CFC8B4;background:transparent;cursor:pointer;
  font:600 13px 'Inter',sans-serif;color:var(--ink-soft);transition:border-color .2s,color .2s;
}
.chip-add:hover{border-color:var(--terracotta);color:var(--terracotta);}
.chip-input{
  width:160px;padding:8px 16px;border-radius:999px;border:1px solid var(--ink);background:#fff;outline:none;
  font:600 13px 'Inter',sans-serif;color:var(--ink);box-shadow:0 0 0 3px rgba(22,20,15,0.06);
}

.portrait-up{display:flex;align-items:center;gap:18px;}
.portrait-up-btn{
  width:96px;height:96px;border-radius:24px;flex-shrink:0;cursor:pointer;
  border:1.5px dashed #CFC8B4;background:#fff center/cover no-repeat;color:var(--ink-soft);
  display:flex;align-items:center;justify-content:center;transition:border-color .2s,color .2s;
}
.portrait-up-btn:hover{border-color:var(--terracotta);color:var(--terracotta);}
.portrait-up-btn svg{width:26px;height:26px;}
.portrait-up-btn.has{border:1px solid var(--line);}
.portrait-up-btn.has svg{display:none;}
.portrait-up b{display:block;font-size:14px;}
.portrait-up small{display:block;font-size:12px;color:var(--ink-soft);margin-top:3px;}

.switch-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-top:1px solid var(--line);}
.switch-row b{display:block;font-size:14px;}
.switch-row small{display:block;font-size:12px;color:var(--ink-soft);margin-top:3px;line-height:1.4;}
.switch{position:relative;width:46px;height:28px;flex-shrink:0;}
.switch input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:1;}
.switch span{position:absolute;inset:0;border-radius:999px;background:#D9D2BF;transition:background .25s;}
.switch span::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .25s cubic-bezier(.2,.7,.2,1);}
.switch input:checked + span{background:var(--terracotta);}
.switch input:checked + span::after{transform:translateX(18px);}
.switch input:focus-visible + span{outline:2px solid var(--ink);outline-offset:2px;}

.map-pick svg{display:block;width:100%;height:auto;}
.map-pt{cursor:default;}
.map-pick.interactive .map-pt{cursor:pointer;}
.map-dot{fill:#D6CFBB;transition:fill .3s,r .3s;}
.map-pt:hover .map-dot{fill:#C2B9A0;}
.map-pt.on .map-dot{fill:var(--terracotta);}
.map-ring{fill:none;stroke:var(--terracotta);stroke-width:3;opacity:0;transform-box:fill-box;transform-origin:center;}
.map-pt.on .map-ring{animation:mapRing 1.8s ease-out infinite;}
@keyframes mapRing{from{opacity:.9;transform:scale(1);}to{opacity:0;transform:scale(3.4);}}
.map-credit{font-size:10px;color:#A8A395;text-align:right;margin-top:6px;}

.spinner{width:18px;height:18px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--ink);animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

.toast{
  position:fixed;left:50%;bottom:28px;z-index:300;transform:translate(-50%,20px);
  display:flex;align-items:center;gap:10px;padding:13px 20px;border-radius:999px;
  background:var(--ink);color:var(--paper);font-size:14px;font-weight:500;
  opacity:0;pointer-events:none;transition:opacity .35s,transform .35s cubic-bezier(.2,.7,.2,1);
  box-shadow:0 12px 30px rgba(22,20,15,.25);max-width:calc(100% - 32px);
}
.toast.on{opacity:1;transform:translate(-50%,0);}
.toast i{width:8px;height:8px;border-radius:50%;background:var(--yellow);flex-shrink:0;}

/* ---------- Sign up ---------- */
.su{display:grid;grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);min-height:100vh;}
.su-art{
  position:sticky;top:0;height:100vh;background:var(--ink);color:var(--paper);
  display:flex;flex-direction:column;padding:32px 44px 40px;overflow:hidden;
}
.su-art .brand-mark path{fill:var(--paper);}
.su-art .brand-bn{color:#C9C5B8;}
.su-art-stage{position:relative;flex:1;margin:28px 0;}
.su-art-slide{
  position:absolute;inset:0;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;
  opacity:0;transform:scale(.985);transition:opacity 1s ease,transform 1.2s ease;
}
.su-art-slide.on{opacity:1;transform:none;}
.su-art-slide img{
  max-width:82%;max-height:calc(100% - 56px);object-fit:contain;background:#fff;padding:14px;border-radius:4px;
  box-shadow:0 40px 80px rgba(0,0,0,.5);
}
.su-art-cap{font-size:13px;color:#A9A495;text-align:center;}
.su-art-cap strong{color:var(--paper);font-family:'Space Grotesk',sans-serif;font-weight:600;}
.su-art-quote{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:24px;line-height:1.3;max-width:420px;letter-spacing:-.3px;}
.su-art-quote span{color:var(--yellow);}

.su-main{display:flex;flex-direction:column;padding:28px 48px;min-width:0;}
.su-top{display:flex;justify-content:space-between;align-items:center;min-height:40px;}
.su-top .brand{visibility:hidden;}
.su-top-link{font-size:13px;font-weight:600;color:var(--ink-soft);}
.su-top-link:hover{color:var(--ink);}
.su-body{flex:1;display:flex;align-items:center;justify-content:center;padding:32px 0 48px;}
.su-panel{width:100%;max-width:460px;}

.su-progress{display:flex;align-items:center;gap:14px;margin-bottom:32px;}
.su-progress[hidden]{display:none;}
.su-back{border:none;background:none;padding:0;cursor:pointer;display:inline-flex;align-items:center;gap:2px;font:600 13px 'Inter',sans-serif;color:var(--ink-soft);}
.su-back:hover{color:var(--ink);}
.su-back svg{width:16px;height:16px;}
.su-bars{flex:1;display:flex;gap:6px;}
.su-bars i{flex:1;height:3px;border-radius:2px;background:var(--line);transition:background .4s;}
.su-bars i.on{background:var(--terracotta);}
.su-count{font-size:12px;font-weight:600;color:var(--ink-soft);white-space:nowrap;}

.su-step{display:none;}
.su-step.on{display:block;animation:suIn .55s cubic-bezier(.2,.7,.2,1);}
@keyframes suIn{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}
.su-h{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:42px;line-height:1.06;letter-spacing:-1.2px;text-wrap:balance;}
.su-h-sm{font-size:34px;}
.su-sub{margin-top:14px;font-size:16px;line-height:1.6;color:var(--ink-soft);}
.su-step .portrait-up{margin-top:30px;}
.su-step .chip-wrap{margin-top:28px;}

.su-google{
  margin-top:34px;width:100%;display:flex;align-items:center;justify-content:center;gap:12px;
  padding:16px 20px;border-radius:999px;border:1px solid var(--line);background:#fff;cursor:pointer;
  font:600 15px 'Inter',sans-serif;color:var(--ink);transition:box-shadow .25s,transform .25s,border-color .25s;
}
.su-google:hover{box-shadow:0 10px 28px rgba(22,20,15,.09);transform:translateY(-1px);border-color:#D2CBB8;}
.su-google svg{width:20px;height:20px;}
.su-google[disabled]{cursor:wait;transform:none;box-shadow:none;}
.su-fine{margin-top:14px;font-size:12px;color:var(--ink-soft);text-align:center;}
.su-proof{margin-top:44px;padding-top:24px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:center;gap:14px;font-size:13px;color:var(--ink-soft);}
.su-faces{display:flex;}
.su-faces span{width:30px;height:30px;border-radius:50%;border:2px solid var(--cream);margin-left:-9px;}
.su-faces span:first-child{margin-left:0;}
.su-proof strong{color:var(--ink);}

.su-actions{margin-top:36px;display:flex;align-items:center;gap:14px;}
.su-actions .btn{padding:15px 26px;}
.su-map{margin-top:24px;background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:16px 16px 10px;}
.su-map svg{max-height:300px;width:auto;max-width:100%;margin:0 auto;}
.su-city{margin-top:16px;}

.su-done{text-align:center;}
.su-done .map-pick{max-width:260px;margin:0 auto 8px;}
.su-done .map-pick svg{max-height:320px;width:auto;max-width:100%;margin:0 auto;}
.su-h-welcome{font-size:36px;}
.su-done .su-h{margin-top:8px;}
.su-done .su-sub{max-width:400px;margin-left:auto;margin-right:auto;}
.su-done .su-actions{justify-content:center;flex-wrap:wrap;}
.su-card{
  margin:28px auto 0;max-width:360px;display:flex;align-items:center;gap:14px;text-align:left;
  background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;
  box-shadow:0 18px 40px rgba(22,20,15,.08);
}
.su-card .avatar{width:56px;height:56px;background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;font:700 18px 'Space Grotesk',sans-serif;color:var(--paper);}

/* ---------- Dashboard ---------- */
.dash-head{display:grid;grid-template-columns:168px 1fr;gap:40px;padding:48px 0 28px;align-items:start;}
.dash-avatar{
  width:168px;height:168px;border-radius:28px;background:var(--paper) center/cover no-repeat;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;font:700 52px 'Space Grotesk',sans-serif;color:var(--paper);
  cursor:pointer;position:relative;overflow:hidden;
}
.dash-avatar::after{
  content:"Change";position:absolute;inset:auto 0 0 0;padding:8px;font:600 12px 'Inter',sans-serif;text-align:center;
  color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.55));opacity:0;transition:opacity .2s;
}
.dash-avatar:hover::after{opacity:1;}
.dash-name-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.dash-name{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:38px;letter-spacing:-.8px;line-height:1.1;}
.live-badge{display:inline-flex;align-items:center;gap:7px;font-size:10px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;background:var(--ink);color:var(--paper);padding:6px 11px;border-radius:999px;}
.live-badge.off{background:transparent;color:var(--ink-soft);border:1px solid var(--line);}
.live-badge.off i{display:none;}
.live-badge i{width:6px;height:6px;border-radius:50%;background:var(--yellow);animation:blink 2s ease-in-out infinite;}
@keyframes blink{50%{opacity:.25;}}
.dash-head .profile-tags{margin-top:12px;}
.dash-head .profile-loc{margin-top:12px;}
.dash-bio{margin-top:14px;max-width:580px;font-size:15px;line-height:1.65;color:var(--ink-soft);white-space:pre-line;}
.dash-bio.empty{color:#A8A395;}
.dash-links{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px;font-size:13px;font-weight:600;}
.dash-links a{color:var(--terracotta);}
.dash-links a:hover{text-decoration:underline;}
.dash-stats{display:flex;gap:28px;margin-top:18px;font-size:14px;color:var(--ink-soft);}
.dash-stats strong{font-family:'Space Grotesk',sans-serif;font-size:20px;color:var(--ink);margin-right:5px;}
.dash-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;}

.dash-meter{
  display:flex;align-items:center;gap:24px;margin-bottom:8px;padding:18px 22px;
  background:var(--paper);border:1px solid var(--line);border-radius:16px;
}
.dash-meter-main{flex:1;min-width:0;}
.dash-meter-top{display:flex;justify-content:space-between;font-size:13px;font-weight:600;}
.dash-meter-top span{color:var(--terracotta);}
.dash-meter-bar{height:5px;border-radius:3px;background:var(--line);margin-top:10px;overflow:hidden;}
.dash-meter-bar i{display:block;height:100%;background:var(--terracotta);border-radius:3px;transition:width .8s cubic-bezier(.2,.7,.2,1);}
.dash-meter-tip{
  flex-shrink:0;border:1px solid var(--ink);background:transparent;border-radius:999px;padding:9px 16px;cursor:pointer;
  font:600 12px 'Inter',sans-serif;color:var(--ink);display:inline-flex;align-items:center;gap:6px;
}
.dash-meter-tip:hover{background:var(--ink);color:var(--paper);}
.dash-meter[hidden]{display:none;}
.dash-meter-x{
  flex-shrink:0;width:30px;height:30px;margin-right:-6px;border-radius:50%;border:none;background:transparent;cursor:pointer;
  display:flex;align-items:center;justify-content:center;color:var(--ink-soft);
}
.dash-meter-x:hover{background:var(--line);color:var(--ink);}
.dash-meter-x svg{width:14px;height:14px;}

.dash-tabs{display:flex;gap:30px;border-bottom:1px solid var(--line);margin-top:28px;}
.dash-tab{
  border:none;background:none;padding:14px 0;margin-bottom:-1px;cursor:pointer;border-bottom:2px solid transparent;
  font:600 14px 'Inter',sans-serif;color:var(--ink-soft);
}
.dash-tab span{font-weight:500;color:#A8A395;margin-left:4px;}
.dash-tab.on{color:var(--ink);border-bottom-color:var(--ink);}

.dash-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:22px;padding:28px 0 72px;}
.dash-add{
  aspect-ratio:1;border:1.5px dashed #CFC8B4;border-radius:16px;background:transparent;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  font:600 14px 'Inter',sans-serif;color:var(--ink-soft);transition:border-color .2s,background .2s,color .2s;
}
.dash-add:hover{border-color:var(--terracotta);background:#fff;color:var(--ink);}
.dash-add small{font-weight:500;font-size:12px;color:#A8A395;}
.dash-add .plus{width:46px;height:46px;border-radius:50%;background:var(--ink);color:var(--paper);display:flex;align-items:center;justify-content:center;transition:transform .25s;}
.dash-add:hover .plus{transform:rotate(90deg);}
.dash-add .plus svg{width:20px;height:20px;}
.dash-add.pulse .plus{animation:plusPulse 1.6s ease-in-out infinite;}
@keyframes plusPulse{0%,100%{box-shadow:0 0 0 0 rgba(216,98,43,.5);}50%{box-shadow:0 0 0 12px rgba(216,98,43,0);}}
.dash-tile{border:none;background:none;padding:0;text-align:left;cursor:pointer;font:inherit;color:inherit;animation:suIn .45s cubic-bezier(.2,.7,.2,1) both;}
.dash-tile-frame{
  position:relative;aspect-ratio:1;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;
  display:flex;align-items:center;justify-content:center;padding:14px;transition:border-color .2s,box-shadow .25s,transform .25s;
}
.dash-tile:hover .dash-tile-frame{border-color:#CFC8B4;box-shadow:0 14px 30px rgba(22,20,15,.08);transform:translateY(-2px);}
.dash-tile-frame img{max-width:100%;max-height:100%;object-fit:contain;display:block;}
.dash-tile-badge{
  position:absolute;left:10px;bottom:10px;display:inline-flex;align-items:center;gap:5px;
  background:rgba(22,20,15,.82);color:var(--paper);font-size:11px;font-weight:700;padding:5px 10px;border-radius:999px;
}
.dash-tile-badge svg{width:11px;height:11px;}
.dash-tile-edit{
  position:absolute;top:10px;right:10px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.95);
  border:1px solid var(--line);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s;
}
.dash-tile-edit svg{width:14px;height:14px;}
.dash-tile:hover .dash-tile-edit{opacity:1;}
.dash-tile-title{margin-top:12px;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:14px;}
.dash-tile-meta{font-size:12px;color:var(--ink-soft);margin-top:2px;}
.dash-empty{grid-column:1/-1;text-align:center;padding:48px 0;color:var(--ink-soft);font-size:14px;}

/* ---------- Drawer ---------- */
.drawer-back{position:fixed;inset:0;z-index:90;background:rgba(22,20,15,.38);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .35s;}
.drawer-back.on{opacity:1;pointer-events:auto;}
.drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:100;width:min(500px,100%);background:var(--cream);
  display:flex;flex-direction:column;transform:translateX(100%);visibility:hidden;
  transition:transform .45s cubic-bezier(.2,.7,.2,1),visibility 0s linear .45s;box-shadow:-24px 0 60px rgba(22,20,15,.16);
}
.drawer.on{transform:none;visibility:visible;transition:transform .45s cubic-bezier(.2,.7,.2,1),visibility 0s;}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:22px 28px;border-bottom:1px solid var(--line);}
.drawer-title{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:20px;}
.drawer-x{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--paper);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--ink);}
.drawer-x:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.drawer-x svg{width:16px;height:16px;}
.drawer-body{flex:1;overflow-y:auto;padding:6px 28px 32px;}
.drawer-foot{display:flex;align-items:center;gap:10px;padding:16px 28px;border-top:1px solid var(--line);}
.drawer-foot .spacer{flex:1;}
.link-danger{border:none;background:none;padding:0;cursor:pointer;font:600 13px 'Inter',sans-serif;color:#B3261E;}
.link-danger:hover{text-decoration:underline;}
.drawer-section{margin-top:30px;padding-top:20px;border-top:1px solid var(--line);}
.drawer-section h4{font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--ink-soft);}
.drawer-account{display:flex;gap:18px;margin-top:14px;}
.link-muted{border:none;background:none;padding:0;cursor:pointer;font:600 13px 'Inter',sans-serif;color:var(--ink-soft);}
.link-muted:hover{color:var(--ink);text-decoration:underline;}

.drop{
  margin-top:20px;height:280px;border:1.5px dashed #CFC8B4;border-radius:16px;background:#fff;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:18px;text-align:center;
  font-size:14px;font-weight:600;color:var(--ink);transition:border-color .2s,background .2s;position:relative;
}
.drop:hover,.drop.over{border-color:var(--terracotta);background:#FFFDF8;}
.drop small{font-size:12px;font-weight:500;color:var(--ink-soft);}
.drop .drop-icon{width:48px;height:48px;border-radius:50%;background:var(--cream);display:flex;align-items:center;justify-content:center;color:var(--terracotta);}
.drop .drop-icon svg{width:22px;height:22px;}
.drop img{max-width:100%;max-height:100%;object-fit:contain;}
.drop.has{border:1px solid var(--line);}
.drop.has > :not(img):not(.drop-change){display:none;}
.drop-change{display:none;position:absolute;right:12px;bottom:12px;background:rgba(22,20,15,.82);color:var(--paper);font-size:11px;font-weight:700;padding:6px 11px;border-radius:999px;}
.drop.has .drop-change{display:block;}
.drop.shake{animation:shake .4s;border-color:#B3261E;}
@keyframes shake{25%{transform:translateX(-6px);}75%{transform:translateX(6px);}}

.sale-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.2,.7,.2,1);}
.sale-panel > div{overflow:hidden;}
.sale-panel.on{grid-template-rows:1fr;}
.sale-panel .field{margin-top:4px;margin-bottom:6px;}
.pill-preview{
  display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 18px;padding:14px 16px;
  background:var(--paper);border:1px solid var(--line);border-radius:12px;font-size:12px;color:var(--ink-soft);
}
.pill-preview .buy-btn{pointer-events:none;}

/* ---------- Public profile (owner view) ---------- */
.profile-portrait.initials{display:flex;align-items:center;justify-content:center;font:700 52px 'Space Grotesk',sans-serif;color:var(--paper);}
.cta-avatar{
  width:24px;height:24px;border-radius:50%;margin:-6px 2px -6px -12px;flex-shrink:0;
  background:var(--terracotta) center/cover no-repeat;border:1.5px solid var(--paper);
  display:inline-flex;align-items:center;justify-content:center;font:700 10px 'Space Grotesk',sans-serif;color:var(--paper);
}
.you-badge{display:inline-block;margin-left:6px;vertical-align:2px;font-size:9px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;background:var(--yellow);color:var(--ink);padding:2px 7px;border-radius:999px;}
.avatar.initials{display:flex;align-items:center;justify-content:center;font:700 20px 'Space Grotesk',sans-serif;color:var(--paper);}

@media (max-width:980px){
  .su{grid-template-columns:1fr;}
  .su-art{display:none;}
  .su-main{padding:20px;}
  .su-top .brand{visibility:visible;}
  .su-h{font-size:32px;}
  .su-h-sm{font-size:28px;}
  .dash-head{grid-template-columns:1fr;gap:20px;padding-top:32px;}
  .dash-avatar{width:112px;height:112px;font-size:36px;}
  .dash-name{font-size:30px;}
  .dash-meter{flex-wrap:wrap;gap:14px;}
  .dash-meter-main{flex-basis:calc(100% - 40px);}
  .dash-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
}

  /* Salon wall — mixed sizes like a gallery wall; art never cropped */
  .salon-item{display:block;}
  /* Wall always ends on a straight line: capped height, fade to the page, then Show all */
  /* Full-bleed: one big wall, edge to edge of the page */
  .salon-clip{position:relative;max-height:760px;overflow:hidden;width:100vw;margin-left:calc(50% - 50vw);padding:0 4px;}
  .strip-frame{position:relative;overflow:hidden;border:1px solid var(--line);background:#fff;}
  .strip-frame img{width:100%;height:auto;}
  .strip-info{position:absolute;inset:auto 0 0;padding:48px 18px 16px;color:#fff;background:linear-gradient(transparent,rgba(22,20,15,.85));opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s;}
  .salon-item:hover .strip-info,.salon-item:focus-visible .strip-info{opacity:1;transform:none;}
  .strip-title{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:16px;}
  .strip-artist{font-size:13px;font-weight:600;color:var(--yellow);margin-top:4px;}
  .strip-meta{font-size:12px;opacity:.8;margin-top:2px;}


/* ---------- Art gallery ---------- */
.page-hero .eyebrow{display:block;}
.gallery{columns:3;column-gap:28px;}
.g-item{display:block;break-inside:avoid;margin-bottom:36px;}
.g-frame{position:relative;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;}
.g-frame img{width:100%;height:auto;transition:transform .4s;}
.g-item:hover .g-frame img{transform:scale(1.02);}
.g-frame .buy-btn{position:absolute;right:12px;bottom:12px;}
.g-by{display:flex;align-items:center;gap:8px;margin-top:14px;font-size:13px;}
.g-by .avatar{width:22px;height:22px;}
.g-artist{font-weight:600;color:var(--terracotta);}
.g-loc{color:var(--ink-soft);}
.g-loc:before{content:"· ";}
.g-title{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:18px;margin-top:6px;}
.g-meta{font-size:13px;color:var(--ink-soft);margin-top:2px;}
.gallery-empty{padding:40px 0;color:var(--ink-soft);}
@media (max-width:980px){.gallery{columns:2;column-gap:16px;}}

/* ---------- About: core contributors (compact — built for hundreds) ---------- */
.contributors-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 20px;margin-top:20px;}
.contributor{display:flex;align-items:center;gap:10px;min-width:0;}
.contributor .avatar{width:36px;height:36px;}
.c-name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.c-role{font-size:12px;color:var(--ink-soft);}
.contrib-more{margin-top:24px;}
@media (max-width:980px){.contributors-grid{grid-template-columns:repeat(2,1fr);}}


.private-note{margin-top:20px;padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--paper);font-size:13px;color:var(--ink-soft);}

/* ---------- Header: Discover dropdown ---------- */
.nav-drop{position:relative;}
.nav-caret{width:12px;height:12px;transition:transform .2s;}
.nav-drop:hover .nav-caret,.nav-drop:focus-within .nav-caret{transform:rotate(180deg);}
.nav-menu{position:absolute;top:100%;left:-16px;padding-top:14px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .18s,transform .18s,visibility .18s;z-index:60;}
.nav-drop:hover .nav-menu,.nav-drop:focus-within .nav-menu{opacity:1;visibility:visible;transform:none;}
.nav-menu::before{content:"";position:absolute;inset:14px 0 0;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 40px rgba(22,20,15,.12);z-index:-1;}
.nav-menu{display:flex;flex-direction:column;gap:2px;width:330px;}
.nav-menu .nav-menu-item{display:flex;align-items:center;gap:14px;margin:0 8px;padding:10px;border-radius:12px;border:0;color:var(--ink);letter-spacing:0;}
.nav-menu .nav-menu-item:first-child{margin-top:8px;}
.nav-menu .nav-menu-item:last-child{margin-bottom:8px;}
.nav-menu .nav-menu-item:hover{background:var(--cream);}
.nav-menu-item b{display:block;font-family:'Space Grotesk',sans-serif;font-size:15px;}
.nav-menu-item small{display:block;font-size:12px;font-weight:500;color:var(--ink-soft);margin-top:2px;}
.nav-menu-thumb{width:52px;height:52px;border-radius:10px;overflow:hidden;background:#fff;border:1px solid var(--line);flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.nav-menu-thumb img{width:100%;height:100%;object-fit:contain;}
.nav-menu-thumb.faces i{width:22px;height:22px;border-radius:50%;border:2px solid #fff;margin-left:-8px;}
.nav-menu-thumb.faces i:first-child{margin-left:0;}

/* ---------- Concept: salon wall as the hero (index-wall.html) ---------- */
.wall-hero-clip{position:relative;height:min(62vh,600px);overflow:hidden;width:100vw;margin-left:calc(50% - 50vw);}
.wall-hero-clip::after{content:"";position:absolute;inset:auto 0 0;height:45%;pointer-events:none;background:linear-gradient(rgba(245,241,231,0),var(--cream) 90%);}
.wall-track{display:flex;gap:4px;padding-right:4px;width:max-content;align-items:flex-start;animation:wall-drift var(--dur,120s) linear infinite;}
@media (hover:hover) and (pointer:fine){.wall-hero-clip:hover .wall-track{animation-play-state:paused;}}
.wall-col{display:flex;flex-direction:column;gap:4px;flex:none;}
.wall-col .strip-frame img{width:100%;height:auto;}
@keyframes wall-drift{to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.wall-track{animation:none;}}
.wall-hero-text{position:relative;margin-top:8px;padding-bottom:40px;}
@media (max-width:700px){.wall-hero-clip{height:52vh;}}
.wall-hero-text .headline{font-size:clamp(40px,5vw,64px);}
@media (min-width:981px){.wall-hero-text .headline{white-space:nowrap;}}

/* ---------- Concept: text left, art rising on the right (index-wall2.html) ---------- */
.split-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:center;height:min(86vh,780px);}
.split-hero .headline{font-size:clamp(44px,5vw,68px);}
.rise-wall{position:relative;height:100%;overflow:hidden;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-right:calc(-1 * ((100vw - min(100vw, 1240px)) / 2 + 32px));
  -webkit-mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(transparent,#000 12%,#000 88%,transparent);}
.rise-col{overflow:hidden;}
.rise-col:nth-child(2){margin-top:-80px;}
.rise-track{display:flex;flex-direction:column;gap:6px;padding-bottom:6px;animation:rise var(--dur,80s) linear infinite;}
@media (hover:hover) and (pointer:fine){.rise-wall:hover .rise-track{animation-play-state:paused;}}
.rise-track .strip-frame img{width:100%;height:auto;}
@keyframes rise{to{transform:translateY(-50%);}}
@media (prefers-reduced-motion:reduce){.rise-track{animation:none;}}
@media (max-width:980px){.split-hero{grid-template-columns:1fr;height:auto;gap:24px;padding-top:32px;}.rise-wall{height:60vh;margin-right:0;}}
.wall-browse{position:absolute;right:24px;bottom:24px;z-index:2;font-size:13px;font-weight:600;color:var(--ink);background:rgba(245,241,231,.85);backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:999px;padding:9px 16px;transition:background .2s,color .2s;}
.wall-browse:hover{background:var(--ink);color:var(--paper);}
.wall-hero-text .hero-sub{max-width:none;}
.wall-hero-text{border-bottom:1px solid var(--line);padding-bottom:36px;margin-bottom:8px;}

/* Shilpi feed (index-wall.html): profile left, their work right */
.feed-row{display:grid;grid-template-columns:260px minmax(0,1fr);gap:32px;align-items:center;padding:20px 0;border-top:1px solid var(--line);}
.feed-row:first-child{border-top:0;padding-top:0;}
.feed-who{display:flex;align-items:center;gap:14px;}
.feed-who .avatar{width:56px;height:56px;}
.feed-works{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;}
.feed-works::-webkit-scrollbar{display:none;}
.feed-works .salon-item{flex:none;}
.feed-works .strip-frame img{height:200px;width:auto;}
@media (max-width:700px){.feed-row{grid-template-columns:1fr;gap:12px;}.feed-works .strip-frame img{height:150px;}}
/* Homepage "Fresh from the studios" as a drifting wall */
/* Pause for a real mouse only — on touch screens a tap counts as "hover" and would freeze the wall */
/* Homepage wall: keeps sliding on hover; first click pauses it and shows the piece's details, second click opens it */
.salon-clip.drift.paused .wall-track{animation-play-state:paused;}
.art-strip .salon-item:hover .strip-info{opacity:0;transform:translateY(8px);}
.art-strip .salon-item.picked .strip-info{opacity:1;transform:none;}
.strip-go{display:none;margin-top:10px;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;}
.art-strip .strip-go{display:block;}
#contribCount{max-width:none;}
.work-credit{font-size:11px;color:#A8A395;margin-top:4px;}
.work-empty{color:var(--ink-soft);font-size:14px;}

/* ---------- Profile: artwork lightbox ---------- */
.work-thumb:has(img){cursor:zoom-in;}
.lightbox{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100vw;height:100vh;display:none;align-items:center;justify-content:center;gap:16px;}
.lightbox[open]{display:flex;animation:lb-in .25s ease;}
.lightbox::backdrop{background:rgba(245,241,231,.78);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);}
.lightbox figure{margin:0;display:flex;flex-direction:column;align-items:center;max-width:min(1100px,82vw);}
.lightbox img{max-width:100%;max-height:78vh;object-fit:contain;background:#fff;box-shadow:0 24px 60px rgba(22,20,15,.18);}
.lightbox figcaption{margin-top:16px;text-align:center;color:var(--ink);display:flex;flex-direction:column;gap:3px;}
.lightbox figcaption b{font-family:'Space Grotesk',sans-serif;font-size:18px;}
.lightbox figcaption span{font-size:14px;color:var(--ink-soft);}
.lightbox figcaption small{font-size:11px;color:#A8A395;}
.lb-close{position:fixed;top:20px;right:24px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink);font-size:16px;cursor:pointer;}
.lb-nav{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink);font-size:26px;line-height:1;cursor:pointer;flex:none;}
.lb-close:hover,.lb-nav:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.lightbox.single .lb-nav{visibility:hidden;}
@keyframes lb-in{from{opacity:0;transform:scale(.97);}}
@media (max-width:700px){.lightbox{gap:4px;}.lb-nav{width:36px;height:36px;font-size:20px;}.lightbox figure{max-width:78vw;}}

/* ---------- Phones ---------- */
.menu-btn{display:none;}
.nav-cta{display:none;}
@keyframes menu-in{from{opacity:0;transform:translateY(-6px);}}
@media (max-width:980px){
  .menu-btn{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;flex-shrink:0;}
  .menu-btn svg{width:20px;height:20px;}
  .header-inner{gap:10px;}
  .header-actions{margin-left:auto;}
  /* Full-screen menu under the header */
  header.nav-open nav{display:flex;flex-direction:column;align-items:stretch;gap:0;position:absolute;top:100%;left:0;right:0;
    height:calc(100svh - var(--hh,80px));overflow-y:auto;background:var(--cream);padding:12px 20px 28px;animation:menu-in .25s ease;}
  header.nav-open nav > a:not(.nav-cta),header.nav-open .nav-drop > a{padding:18px 0;font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:600;letter-spacing:-.3px;border-bottom:1px solid var(--line);}
  header.nav-open .nav-cta{display:flex;justify-content:center;margin-top:auto;padding:16px;font-size:13px;}
  html.menu-open{overflow:hidden;}
  header.nav-open nav a.active{border-bottom-color:var(--line);}
  /* Discover is an accordion in the phone menu: closed until tapped */
  header.nav-open .nav-drop > a{display:flex;justify-content:space-between;align-items:center;}
  header.nav-open .nav-drop .nav-caret{width:22px;height:22px;transform:none;transition:transform .25s;}
  header.nav-open .nav-drop.open .nav-caret{transform:rotate(180deg);}
  header.nav-open .nav-menu{display:none;position:static;opacity:1;visibility:visible;transform:none;width:auto;padding:4px 0 8px;}
  header.nav-open .nav-drop.open .nav-menu{display:flex;animation:menu-in .2s ease;}
  header.nav-open .nav-menu::before{display:none;}
  header.nav-open .nav-menu .nav-menu-item{margin:0;padding:8px 0;}
}
@media (max-width:700px){
  .wrap,.header-inner{padding-left:16px;padding-right:16px;}
  .header-actions .btn{padding:10px 14px;font-size:11px;}
  .header-actions{display:none;}   /* phones: the call to action lives at the bottom of the menu */
  .menu-btn{margin-left:auto;}
  .header-actions .btn.has-avatar{padding:3px;gap:0;}
  .header-actions .btn.has-avatar .cta-label{display:none;}
  .header-actions .btn.has-avatar .cta-avatar{width:36px;height:36px;margin:0;font-size:13px;}
  .shilpi-grid,.work-grid,.stat-grid{grid-template-columns:1fr;}
  .shilpi-grid{gap:8px;}
  .shilpis-home{padding-top:28px;}
  .g-loc{display:none;}
  .g-artist{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .g-by{min-width:0;}
  .cta-banner{padding:28px 22px;border-radius:20px;}
  .cta-banner h3{font-size:22px;}
  .section-head{gap:16px;}
  .section-head h2{font-size:22px;}
  .section-link{white-space:nowrap;}
}

/* ---------- Homepage: wall → headline → Featured Works band → Shilpis ---------- */
/* Desktop masthead: big one-line title with "Browse art" at the far right, the wall as a wide band below. */
.home-hero{display:flex;flex-direction:column;}
/* Title + buttons sit above the wall, centred */
.home-head{order:-1;display:block;text-align:center;padding:76px 32px 38px;width:100vw;margin-left:calc(50% - 50vw);}
.art-strip{position:relative;}
/* Masthead + wall fill ~95% of the screen, leaving a peek of the next section */
.art-strip .salon-clip.drift{max-height:none;height:max(1000px,160vh);
  /* no fades: clean edges all round */
  -webkit-mask-image:none;mask-image:none;}
.art-strip .wall-browse{bottom:36px;right:0;}
.home-bn{display:none;}
.home-head .headline{font-size:clamp(34px,4vw,58px);letter-spacing:-1.5px;line-height:1.05;white-space:nowrap;}
.home-kinds{display:none;}
.home-head .d-br{display:none;}
.home-head .m-br{display:inline;}
.home-head .headline .accent svg{bottom:-.3em;height:.2em;}
.nowrap{white-space:nowrap;}
.hl-art{color:var(--terracotta);}
.home-meta{display:flex;justify-content:center;gap:12px;margin-top:30px;}
.art-strip .wall-browse{display:none;}
.home-kinds{font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--ink-soft);}
.home-browse{flex-shrink:0;}
/* Floating buttons over the wall: pop up from the bottom, frosted pill */
.wall-cta{position:fixed;left:50%;bottom:28px;z-index:40;display:flex;gap:10px;padding:8px;border-radius:999px;
  background:rgba(245,241,231,.93);   /* solid enough to need no live blur over the moving wall */
  box-shadow:0 12px 36px rgba(22,20,15,.18);border:1px solid rgba(22,20,15,.08);
  opacity:0;pointer-events:none;transform:translate(-50%,24px) scale(.96);
  transition:opacity .35s ease,transform .45s cubic-bezier(.2,.9,.25,1.2);}
.wall-cta.show{opacity:1;pointer-events:auto;transform:translate(-50%,0) scale(1);}
.wall-cta .btn{white-space:nowrap;}
.wall-cta .btn-ghost{background:transparent;}
@media (max-width:700px){.wall-cta{bottom:20px;}.wall-cta .btn{padding:11px 16px;font-size:12px;}}
/* Soft warm glow that breathes behind the pill, and a light sheen that sweeps the main button now and then.
   Both animate only opacity/transform, so the graphics chip slides them without redrawing the page. */
.wall-cta::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;opacity:0;
  box-shadow:-12px 0 26px 8px rgba(240,180,41,.5),12px 0 26px 8px rgba(216,98,43,.42);}
.wall-cta.show::before{animation:cta-glow 3.2s ease-in-out infinite;}
@keyframes cta-glow{0%,100%{opacity:.4;transform:scale(.96);}50%{opacity:.9;transform:scale(1.04);}}
.wall-cta .btn-primary{position:relative;overflow:hidden;}
.wall-cta .btn-primary::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:translateX(-150%) skewX(-20deg);}
.wall-cta.show .btn-primary::after{animation:cta-sheen 4.5s ease-in-out 1s infinite;}
@keyframes cta-sheen{0%{transform:translateX(-150%) skewX(-20deg);}30%,100%{transform:translateX(325%) skewX(-20deg);}}
@media (prefers-reduced-motion:reduce){.wall-cta{transition:opacity .2s;}.wall-cta.show::before,.wall-cta.show .btn-primary::after{animation:none;}}

.featured-band{background:transparent;border-top:1px solid var(--line);width:100vw;margin-left:calc(50% - 50vw);padding:96px 0;}
.featured-inner{max-width:1240px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:56px;align-items:center;}
.featured-title{display:none;}
.featured-art .art-primary{height:min(72vh,680px);background:transparent;border-radius:0;}
.featured-art img.art-primary-fill{border:1px solid rgba(22,20,15,.35);}
.featured-label{font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:14px;}
.featured-info .art-caption-title{font-size:30px;letter-spacing:-.4px;}
.featured-info .art-caption-artist{color:var(--ink);font-size:15px;margin-top:8px;}
.featured-info .art-caption-meta{font-size:14px;color:#2C2C2A;}
.featured-controls{display:flex;align-items:center;gap:10px;margin-top:28px;}
.featured-band .art-next-btn{background:transparent;border-color:var(--ink);width:40px;height:40px;}
.featured-band .art-next-btn:hover{background:var(--ink);color:#B3D493;}
/* Desktop: the caption and arrows give way to an index of all featured works */
.featured-info > .art-caption-title,.featured-info > .art-caption-artist,.featured-info > .art-caption-meta,.featured-controls{display:none;}
.featured-index{list-style:none;border-bottom:1px solid rgba(22,20,15,.3);}
.featured-index li{border-top:1px solid rgba(22,20,15,.3);transition:opacity .25s;opacity:.45;}
.featured-index li.on{opacity:1;border-top-color:var(--ink);}
.featured-index a{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:baseline;gap:12px;width:100%;
  padding:14px 0;background:none;border:0;cursor:pointer;text-align:left;font:inherit;color:var(--ink);}
.fi-n{font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:600;}
.fi-t{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:600;letter-spacing:-.3px;}
.fi-a{font-size:13px;font-weight:600;}
.featured-index li.on .fi-t::after{content:" →";}
.fi-m{display:none;padding:0 0 14px 56px;margin-top:-6px;font-size:13px;color:#2C2C2A;}
.featured-index li.on .fi-m{display:block;}

@media (max-width:700px){
  .home-head{display:block;}
  /* Tall and immersive: the wall nearly fills a phone screen once you scroll onto it */
  .art-strip .salon-clip.drift{height:max(760px,150svh);width:100vw;margin-left:calc(50% - 50vw);margin-right:0;padding:0 4px;
    -webkit-mask-image:none;mask-image:none;}
  .home-head{position:relative;left:auto;bottom:auto;background:none;width:auto;margin-left:0;
    text-align:center;margin-top:0;padding:44px 0 24px;border-bottom:0;}
  .home-bn,.home-kinds{display:none;}
  .home-meta{display:flex;justify-content:center;gap:10px;margin-top:22px;padding:0;border:0;}
  .home-meta .btn{padding:11px 16px;font-size:12px;}
  .home-browse{margin-top:0;}
  .art-strip .wall-browse{display:none;}
  .home-head .headline{font-size:34px;letter-spacing:-1px;line-height:1.1;}
  .home-head .m-br{display:inline;}
  .home-head .d-br{display:none;}
  .featured-band{padding:32px 0 28px;}
  .featured-inner{grid-template-columns:1fr;gap:0;padding:0 16px;}
  .featured-title{display:block;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:26px;text-align:center;margin-bottom:20px;}
  /* Phones: the moving wall is just to look at — tapping a piece doesn't open it */
  .art-strip .salon-item{-webkit-tap-highlight-color:transparent;}
  .art-strip .strip-info{padding:36px 11px 11px;}
  .art-strip .strip-title{font-size:14px;}
  .art-strip .strip-artist{font-size:12px;}
  .art-strip .strip-meta{font-size:11px;}
  .art-strip .strip-go{margin-top:7px;font-size:10px;}
  /* Fixed-height frame so the band never jumps when a tall piece swaps for a wide one */
  .featured-art .art-primary{height:min(56svh,460px);}
  .featured-label,.featured-index{display:none;}
  .featured-info > .art-caption-title,.featured-info > .art-caption-artist,.featured-info > .art-caption-meta{display:block;}
  /* ← caption → */
  .featured-info{display:grid;grid-template-columns:40px 1fr 40px;align-items:center;text-align:center;gap:0 8px;margin-top:18px;}
  .featured-info > *:not(.featured-controls){grid-column:2;}
  .featured-controls{display:contents;}
  #artPrev{grid-column:1;grid-row:1 / span 3;}
  #artNext{grid-column:3;grid-row:1 / span 3;}
  .featured-info .art-caption-title{font-size:18px;}
  .featured-info .art-caption-artist{font-size:13px;margin-top:2px;}
  .featured-info .art-caption-meta{font-size:13px;}
}

/* ---- Homepage masthead: editorial cover ---- */
.home-head .headline{font-size:clamp(52px,7vw,112px);line-height:.98;letter-spacing:-.045em;white-space:nowrap;}
.home-head .headline .ln{display:block;animation:ln-rise .9s cubic-bezier(.2,.8,.2,1) both;}
.home-head .headline .ln + .ln{animation-delay:.12s;}
.serif{font-family:'Instrument Serif',serif;font-style:italic;font-weight:400;letter-spacing:-.02em;}
.home-head .serif{font-size:1.12em;line-height:.8;}
.home-head .hl-art{position:relative;display:inline-block;color:var(--terracotta);}
.home-dek{font-family:'Instrument Serif',serif;font-style:italic;font-size:clamp(18px,1.6vw,23px);color:var(--ink-soft);margin:26px auto 0;white-space:nowrap;animation:mast-in .9s .35s both;}
.home-head .home-meta{margin-top:30px;animation:mast-in .9s .45s both;}
@keyframes ln-rise{from{opacity:0;transform:translateY(.35em);}to{opacity:1;transform:none;}}
@keyframes mast-in{from{opacity:0;}to{opacity:1;}}
@media (max-width:700px){
      .home-head .headline{font-size:clamp(40px,12.4vw,60px);letter-spacing:-.04em;white-space:normal;}
  .home-dek{font-size:18px;margin:18px 24px 0;white-space:normal;}
}
@media (prefers-reduced-motion:reduce){
  .home-head .headline .ln,.home-dek,.home-head .home-meta{animation:none;}
  }

/* Thin full-width line above "Shilpis to discover", matching the one above Featured Works */
.shilpis-home{position:relative;}
.shilpis-home::before{content:"";position:absolute;top:0;left:50%;width:100vw;margin-left:-50vw;border-top:1px solid var(--line);}
/* Tighter "Shilpis to discover": title closer to the cards, cards closer together, banner pulled up (112px → 34px) */
.shilpis-home .section-head{margin-bottom:14px;}
.shilpis-home .shilpi-grid{gap:10px;}
.shilpis-home:has(+ .cta-banner){padding-bottom:0;}
.shilpis-home + .cta-banner{margin-top:34px;}
@media (max-width:700px){.shilpis-home .shilpi-grid{gap:8px;}}
@media (max-width:980px){.more-shilpi{display:none;}}   /* extra two rows are desktop-only */

/* Header turns glassy while the art wall is behind it, so the art shows through */
/* Apple-style glass over the wall: a light dark tint, heavy blur, white logo and links */
/* The two looks live on two fixed layers that crossfade: the blur itself never animates (that was the stutter).
   The header itself carries no blur, so its layers can each blur what's behind the page. */
header{background:transparent !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;transition:border-color .35s;}
header::before,header::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;transition:opacity .35s ease,visibility 0s linear .35s;}
header::before{background:rgba(245,241,231,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}
header::after{background:rgba(18,16,12,.16);backdrop-filter:blur(16px) saturate(1.5);-webkit-backdrop-filter:blur(16px) saturate(1.5);opacity:0;visibility:hidden;}
header.over-art:not(.nav-open)::before{opacity:0;visibility:hidden;}
header.over-art:not(.nav-open)::after{opacity:1;visibility:visible;transition:opacity .35s ease,visibility 0s;}
header:not(.over-art)::before,header.nav-open::before{transition:opacity .35s ease,visibility 0s;}
header.over-art:not(.nav-open){border-bottom-color:rgba(255,255,255,.18);}
header .brand-mark path,header .brand-bn,header .brand-en,header nav > a,header .nav-drop > a,header .menu-btn{transition:color .35s,fill .35s,background-color .35s,border-color .35s;}
header.over-art:not(.nav-open) .brand-mark path{fill:#fff;}
header.over-art:not(.nav-open) .brand-en{color:#fff;}
header.over-art:not(.nav-open) .brand-bn{color:rgba(255,255,255,.8);}
header.over-art:not(.nav-open) nav > a,header.over-art:not(.nav-open) .nav-drop > a{color:rgba(255,255,255,.88);text-shadow:0 1px 8px rgba(0,0,0,.25);}
header.over-art:not(.nav-open) nav > a:hover,header.over-art:not(.nav-open) .nav-drop > a:hover{color:#fff;}
header.over-art:not(.nav-open) nav a.active{color:#fff;border-bottom-color:#fff;}
header.over-art:not(.nav-open) .soon{background:rgba(255,255,255,.9);color:var(--ink);text-shadow:none;}
header.over-art:not(.nav-open) .header-actions .btn{background:rgba(255,255,255,.92);color:var(--ink);border-color:transparent;}
header.over-art:not(.nav-open) .menu-btn{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.35);color:#fff;}
/* Discover menu thumbnails: a slow crossfade through art (Art) and portraits (Shilpis) */
.nav-menu-thumb.cycle{position:relative;display:block;}
.nav-menu-thumb.cycle img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s ease;}
.nav-menu-thumb.cycle img.on{opacity:1;}

/* ---------- Directory: families row + Filters sheet ---------- */
.fam-row{display:flex;align-items:center;gap:10px;margin-top:16px;}
.fam-scroll{flex:1;min-width:0;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-right:24px;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);}
.fam-scroll::-webkit-scrollbar{display:none;}
.filter-chip small{font-weight:500;opacity:.55;font-size:11px;margin-left:2px;}
.filter-chip.empty{opacity:.45;}
.filters-btn{position:relative;flex-shrink:0;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 18px;border-radius:var(--pill-radius);
  border:1px solid var(--ink);background:var(--paper);color:var(--ink);font:700 12px 'Inter',sans-serif;letter-spacing:.6px;text-transform:uppercase;cursor:pointer;}
.filters-btn svg{width:16px;height:16px;}
.filters-btn .n{background:var(--terracotta);color:#fff;border-radius:999px;font-size:11px;padding:2px 7px;letter-spacing:0;}
.active-filters{display:flex;align-items:center;gap:8px;margin-top:14px;flex-wrap:wrap;}
.active-filters[hidden]{display:none;}
.active-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px 6px 12px;border-radius:999px;border:0;background:var(--ink);color:var(--paper);
  font:600 13px 'Inter',sans-serif;cursor:pointer;white-space:nowrap;flex-shrink:0;}
.active-chip span{opacity:.7;}
.link-btn{background:none;border:0;padding:0;font:500 13px 'Inter',sans-serif;color:var(--ink-soft);text-decoration:underline;cursor:pointer;white-space:nowrap;}
.dir-empty{text-align:center;color:var(--ink-soft);padding:40px 0;}

.filter-sheet{position:fixed;inset:0 0 0 auto;margin:0;width:min(440px,100vw);height:100%;max-height:100%;max-width:100vw;padding:0;border:0;
  background:var(--cream);color:var(--ink);display:none;flex-direction:column;box-shadow:-20px 0 50px rgba(0,0,0,.15);}
.filter-sheet[open]{display:flex;animation:sheet-in-r .28s cubic-bezier(.2,.8,.2,1);}
.filter-sheet::backdrop{background:rgba(22,20,15,.35);}
@keyframes sheet-in-r{from{transform:translateX(40px);opacity:0;}}
.fs-head{display:flex;justify-content:space-between;align-items:center;padding:24px 28px 8px;}
.fs-head h2{font-family:'Space Grotesk',sans-serif;font-size:24px;}
.fs-close{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--paper);font-size:15px;cursor:pointer;color:var(--ink);}
.fs-body{flex:1;overflow-y:auto;padding:0 28px 24px;}
.fs-sec{padding:20px 0;border-bottom:1px solid var(--line);}
.fs-sec:last-child{border-bottom:0;}
.fs-sec h4{font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--ink-soft);margin-bottom:12px;}
.fs-search{width:100%;border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:11px 14px;font:14px 'Inter',sans-serif;color:var(--ink);outline:none;margin-bottom:6px;}
.fs-fam{border-bottom:1px solid rgba(22,20,15,.06);}
.fs-fam summary{display:flex;justify-content:space-between;align-items:center;padding:12px 0;font-weight:700;font-size:15px;cursor:pointer;list-style:none;}
.fs-fam summary::-webkit-details-marker{display:none;}
.fs-fam summary::after{content:"›";margin-left:10px;transition:transform .2s;color:var(--ink-soft);}
.fs-fam[open] summary::after{transform:rotate(90deg);}
.fs-fam summary small{margin-left:auto;font-weight:500;color:var(--ink-soft);font-size:12px;}
.fs-opt{display:flex;align-items:center;gap:12px;padding:8px 0 8px 4px;font-size:14px;cursor:pointer;}
.fs-opt input{width:17px;height:17px;accent-color:var(--terracotta);margin:0;}
.fs-opt small{margin-left:auto;color:var(--ink-soft);font-size:12px;}
.fs-opt.empty{opacity:.45;}
.fs-none{font-size:13px;color:var(--ink-soft);padding:8px 0;}
.fs-chips{display:flex;flex-wrap:wrap;gap:8px;}
.fs-foot{display:flex;justify-content:space-between;align-items:center;padding:16px 28px;border-top:1px solid var(--line);background:var(--cream);}
@media (max-width:700px){
  .page-hero p{font-size:14px;}
  .fam-row{margin-right:0;}
  .filters-btn{width:44px;height:38px;padding:0;justify-content:center;}
  .filters-btn .t{display:none;}
  .filters-btn .n{position:absolute;top:-6px;right:-6px;}
  .active-filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-16px;padding-right:16px;}
  .active-filters::-webkit-scrollbar{display:none;}
  /* bottom sheet */
  .filter-sheet{inset:auto 0 0 0;width:100%;height:86svh;border-radius:22px 22px 0 0;box-shadow:0 -20px 50px rgba(0,0,0,.15);}
  .filter-sheet[open]{animation:sheet-in-b .3s cubic-bezier(.2,.8,.2,1);}
  .filter-sheet::before{content:"";display:block;width:40px;height:4px;border-radius:4px;background:var(--line);margin:10px auto 0;flex-shrink:0;}
  .fs-head{padding:12px 18px 4px;}
  .fs-body{padding:0 18px 16px;}
  .fs-foot{padding:14px 18px calc(14px + env(safe-area-inset-bottom));}
}
@keyframes sheet-in-b{from{transform:translateY(60px);opacity:0;}}
.fs-head h2:focus{outline:none;}   /* sheet opens with focus on its title, not the close button */
/* Filters button sits beside Sort, in the results bar */
.rb-right{display:flex;align-items:center;gap:8px;}
.rb-right .filters-btn{height:36px;padding:0 14px;border-color:var(--line);font-size:12px;}
.rb-right .filters-btn:hover{border-color:var(--ink);}
.rb-right .sort-select{height:36px;}
@media (max-width:700px){.rb-right .filters-btn{width:40px;} .rb-right{gap:6px;} .rb-right .sort-select{max-width:170px;}}
.avatar{overflow:hidden;}
.avatar img{width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block;}
/* Art sits on the warm "gallery wall" tone from the share cards, not plain white */
:root{--art-bg:#EDE7D8;}
.strip-frame,.g-frame,.art-detail-frame,.art-primary,.dash-tile-frame,.nav-menu-thumb,.lightbox img{background:var(--art-bg);}
.art-detail-frame img{box-shadow:0 18px 40px rgba(22,20,15,.2);}   /* hung-on-a-wall shadow, like the share cards */

/* ---------- Footer: big serif links, giant wordmark, partners, laurel line (after america.gov) ---------- */
footer.ft{border-top:1px solid var(--line);margin-top:40px;padding:72px 32px 36px;text-align:center;background:var(--cream);}
.ft-links{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 30px;max-width:1100px;margin:0 auto;}
.ft-links a{font-family:'Instrument Serif',serif;font-size:clamp(28px,2.6vw,38px);line-height:1.12;letter-spacing:-.5px;transition:color .2s;}
.ft-links a:hover{color:var(--terracotta);}
.ft-links small{display:inline-block;vertical-align:middle;margin-left:8px;font:700 9px 'Inter',sans-serif;letter-spacing:.6px;text-transform:uppercase;background:var(--ink);color:var(--paper);padding:3px 6px;border-radius:4px;}
.ft-word{display:flex;align-items:center;justify-content:center;gap:clamp(14px,2vw,28px);margin:72px auto 0;}
.ft-word svg{height:clamp(84px,11vw,170px);width:auto;fill:var(--ink);}
.ft-word span{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(84px,15vw,230px);letter-spacing:-.04em;line-height:.85;}
.ft-sup{margin-top:64px;font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--ink-soft);}
.ft-partners{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:30px 56px;margin:26px auto 0;max-width:1000px;}
.ft-partners img{height:62px;width:auto;max-width:200px;object-fit:contain;mix-blend-mode:multiply;}   /* white logo backgrounds melt into the cream */
.ft-partners .ft-canada{filter:brightness(1.08) contrast(1.15);}
.ft-wreath{display:flex;align-items:center;justify-content:center;gap:14px;margin:60px auto 0;}
.ft-wreath svg{width:52px;height:96px;flex-shrink:0;color:var(--ink);}
.ft-wreath svg.flip{transform:scaleX(-1);}
.ft-wreath p{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:21px;line-height:1.25;}
.ft-small{display:flex;justify-content:center;gap:26px;margin-top:48px;font-size:15px;}
.ft-small a{display:inline-flex;align-items:center;gap:6px;}
.ft-small a:hover{color:var(--terracotta);}
.ft-credit{margin-top:18px;font-size:14px;color:var(--ink-soft);}
.ft-credit b{color:var(--ink);font-weight:600;}
@media (max-width:700px){
  footer.ft{padding:56px 20px 32px;}
  .ft-links{flex-direction:column;gap:0;}
  .ft-links a{font-size:44px;padding:4px 0;}
  .ft-word{flex-direction:column;gap:10px;margin-top:60px;}
  .ft-word svg{height:88px;}
  .ft-word span{font-size:96px;}
  .ft-sup{margin-top:48px;}
  .ft-partners{display:grid;grid-template-columns:1fr 1fr;gap:26px 22px;max-width:340px;}
  .ft-partners img{height:58px;max-width:100%;margin:0 auto;}
  .ft-wreath{margin-top:52px;}
  .ft-wreath p{font-size:19px;}
  .ft-credit{line-height:1.5;}
}
@media (max-width:700px){.ft-dot{display:none;} .ft-made{display:block;}}
/* Compact footer (About, Impact, profiles, artwork pages) — desktop only; phones keep the full footer. */
@media (min-width:701px){
  footer.ft-compact{padding:44px 48px 28px;display:grid;grid-template-columns:auto 1fr auto;column-gap:0;max-width:none;
    grid-template-areas:"word links links" "wreath sup partners" "credit small small";align-items:center;text-align:left;}
  footer.ft-compact > *{max-width:none;}
  .ft-compact .ft-word{grid-area:word;margin:0;gap:12px;justify-content:flex-start;}
  .ft-compact .ft-word svg{height:58px;}
  .ft-compact .ft-word span{font-size:58px;letter-spacing:-.03em;}
  .ft-compact .ft-links{grid-area:links;justify-content:flex-end;gap:2px 26px;margin:0;}
  .ft-compact .ft-links a{font-size:26px;}
  .ft-compact .ft-wreath,.ft-compact .ft-sup,.ft-compact .ft-partners{border-top:1px solid var(--line);margin-top:28px;padding:24px 0;}
  .ft-compact .ft-wreath{grid-area:wreath;justify-content:flex-start;gap:10px;}
  .ft-compact .ft-wreath svg{width:24px;height:44px;}
  .ft-compact .ft-wreath p{font-size:16px;}
  .ft-compact .ft-wreath p br{display:none;}
  .ft-compact .ft-sup{grid-area:sup;align-self:stretch;display:flex;align-items:center;justify-content:flex-end;font-size:11px;}
  .ft-compact .ft-partners{grid-area:partners;align-self:stretch;flex-wrap:nowrap;gap:26px;}
  .ft-compact .ft-partners img{height:36px;max-width:120px;}
  .ft-compact .ft-credit,.ft-compact .ft-small{border-top:1px solid var(--line);padding-top:18px;margin:0;}
  .ft-compact .ft-credit{grid-area:credit;font-size:13px;}
  .ft-compact .ft-small{grid-area:small;justify-content:flex-end;font-size:14px;gap:22px;}
}
@media (min-width:701px){.ft-compact .ft-links{padding-left:32px;} .ft-compact .ft-sup{padding-right:22px;padding-left:32px;}}
/* Footer line framed by two halves of a shapla (water lily) */
.ft-wreath svg{width:48px;height:82px;}
@media (min-width:701px){.ft-compact .ft-wreath svg{width:22px;height:38px;}}
/* Wordmark text removed: the শিল্পী mark carries the footer on its own, so it's bigger */
.ft-word svg{height:clamp(225px,25.5vw,390px);}
@media (max-width:700px){.ft-word svg{height:225px;}}
@media (min-width:701px){.ft-compact .ft-word svg{height:84px;}}
/* Logo sits closer to the line below it */
.ft-wreath{margin-top:8px;}
@media (max-width:700px){.ft-wreath{margin-top:8px;}}
@media (min-width:701px){.ft-compact .ft-wreath{margin-top:28px;}}

/* Footer শিল্পী: the mark is a window onto the art wall, which drifts up through the letters */
.ft-art{display:block;height:clamp(225px,25.5vw,390px);aspect-ratio:181/362;position:relative;overflow:hidden;
  -webkit-mask:url(assets/logo-mask.svg) center/contain no-repeat;mask:url(assets/logo-mask.svg) center/contain no-repeat;}
.ft-reel{position:absolute;inset:0 0 auto;display:grid;grid-template-columns:1fr 1fr;animation:ft-reel 48s linear infinite;}
.ft-reel img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block;}
@keyframes ft-reel{to{transform:translateY(-50%);}}
.ft-word > svg{display:none;}
@media (max-width:700px){.ft-art{height:225px;}}
@media (min-width:701px){.ft-compact .ft-word > svg{display:block;} .ft-compact .ft-art{display:none;}}   /* compact row keeps the plain mark */
@media (prefers-reduced-motion:reduce){.ft-reel{animation:none;}}
.ft-art{background:linear-gradient(160deg,#D8622B,#F0B429,#1E9E6A,#2B6CB0,#C2185B);}   /* colour shows until the art arrives */

/* Footer শিল্পী legibility: bold art only, one big tile at a time, a hairline outline, and a soft "hung on the wall" shadow */
.ft-reel{grid-template-columns:1fr;animation-duration:60s;}
.ft-reel img{aspect-ratio:5/6;}
.ft-word{position:relative;filter:drop-shadow(0 10px 14px rgba(22,20,15,.18));}
.ft-word > svg.ft-outline{display:block;position:absolute;top:0;left:50%;transform:translateX(-50%);height:100%;width:auto;fill:none;
  stroke:var(--ink);stroke-width:1.6;vector-effect:non-scaling-stroke;pointer-events:none;}
@media (min-width:701px){.ft-compact .ft-word > svg.ft-outline{display:none;} .ft-compact .ft-word{filter:none;}}

/* ---------- Scroll performance ---------- */
/* Cream header: plain cream, no live blur (it's almost solid anyway). The glass blur only runs over the wall. */
header::before{background:rgba(245,241,231,.97);backdrop-filter:none;-webkit-backdrop-filter:none;}
/* Motion you can't see is paused: the wall once scrolled past, the footer art until the footer is on screen. */
.wall-track.offscreen{animation-play-state:paused;}
.ft-reel{animation-play-state:paused;}
.ft-art.on .ft-reel{animation-play-state:running;}
/* Big footer, desktop: logo and line first, the big links sit right above the Roadmap line */
@media (min-width:701px){
  footer.ft:not(.ft-compact){display:flex;flex-direction:column;align-items:center;}
  footer.ft:not(.ft-compact) .ft-word{order:1;margin-top:0;}
  footer.ft:not(.ft-compact) .ft-wreath{order:2;}
  footer.ft:not(.ft-compact) .ft-sup{order:3;}
  footer.ft:not(.ft-compact) .ft-partners{order:4;}
  footer.ft:not(.ft-compact) .ft-links{order:5;margin-top:64px;}
  footer.ft:not(.ft-compact) .ft-small{order:6;margin-top:28px;}
  footer.ft:not(.ft-compact) .ft-credit{order:7;}
}
/* Wall tiles start as a warm placeholder and the artwork fades in once it has arrived */
.art-strip .strip-frame img{opacity:0;transition:opacity .6s ease;}
.art-strip .strip-frame img.in{opacity:1;}
@media (prefers-reduced-motion:reduce){.art-strip .strip-frame img{transition:none;}}

/* ---------- First-visit intro (homepage) ---------- */
.intro-screen{display:none;}
html.intro .intro-screen{position:fixed;inset:0;z-index:300;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;
  background:var(--cream);animation:intro-failsafe .01s 3.5s forwards;}   /* if the script never runs, it still gets out of the way */
html.intro-out .intro-screen{opacity:0;transition:opacity .4s ease;}
.intro-screen svg{height:120px;width:auto;fill:var(--ink);animation:intro-breathe 1.2s ease-in-out infinite alternate;}
.intro-bar{width:150px;height:3px;border-radius:3px;background:var(--line);overflow:hidden;}
.intro-bar i{display:block;height:100%;background:var(--terracotta);transform:scaleX(0);transform-origin:left;transition:transform .35s ease;}
@keyframes intro-failsafe{to{visibility:hidden;}}
@keyframes intro-breathe{from{opacity:.7;}to{opacity:1;}}
@media (prefers-reduced-motion:reduce){.intro-screen svg{animation:none;}}
@media (min-width:701px){.ft-compact .ft-sup{white-space:nowrap;}}