/* ==========================================================
   Estúdio — folha de estilo única (site público, painel admin
   e área da cliente compartilham os mesmos tokens visuais)
   ========================================================== */

:root{
  --ink:#f7f7f4;
  --ink-2:#eef0ea;
  --paper:#1b211d;
  --paper-dim:#4b5148;
  --paper-faint:#6b7166;
  --brass:#1f4b3f;
  --brass-deep:#163830;
  --line:rgba(27,33,29,0.12);
  --line-strong:rgba(27,33,29,0.22);
  --ok:#3f7d52;
  --warn:#a8752e;
  --danger:#a83e3e;
  --on-accent:#f7f7f4;
  --on-photo:#f4efe4;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:var(--ink);
  color:var(--paper);
  font-family:'Work Sans',ui-sans-serif,system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  line-height:1.4;
}
h1,h2,h3{ font-family:'Fraunces',ui-serif,Georgia,serif; font-weight:500; margin:0; text-wrap:balance; }
p{ margin:0; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
ul{ list-style:none; margin:0; padding:0; }
button{ font-family:inherit; }
::selection{ background:var(--brass); color:var(--on-accent); }

.eyebrow{
  font-family:'IBM Plex Mono',ui-monospace,monospace;
  font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--brass); display:flex; align-items:center; gap:.6em;
}
.eyebrow::before{ content:''; width:1.4em; height:1px; background:var(--brass-deep); display:inline-block; }

.btn{
  font-family:'IBM Plex Mono',monospace; font-size:.74rem; letter-spacing:.08em; text-transform:uppercase;
  padding:.85rem 1.4rem; border-radius:2px; display:inline-flex; align-items:center; gap:.5em;
  border:none; cursor:pointer;
}
.btn.primary{ background:var(--brass); color:var(--on-accent); }
.btn.primary:hover{ background:var(--brass-deep); }
.btn.ghost{ border:1px solid var(--line-strong); background:transparent; color:var(--paper); }
.btn.ghost:hover{ border-color:var(--brass); color:var(--brass); }

.frame{
  position:relative; overflow:hidden; background:var(--ink-2);
}
.frame.placeholder{
  background:
    radial-gradient(120% 140% at 15% 10%, #4a3a22 0%, transparent 55%),
    radial-gradient(120% 140% at 85% 90%, #2a2419 0%, transparent 55%),
    linear-gradient(155deg,#332a1c 0%, #1c1810 60%, #100d09 100%);
  min-height:360px;
}
.frame img{ width:100%; height:100%; object-fit:cover; }
.frame .tag{
  position:absolute; left:1rem; bottom:1rem;
  font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:.06em;
  color:var(--on-photo); background:rgba(23,20,15,.5);
  padding:.3rem .55rem; border:1px solid rgba(244,239,228,.18); border-radius:2px;
}

/* ================= SITE PÚBLICO ================= */
body.site header.nav{
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
  padding:1.2rem clamp(1.2rem,4vw,3.5rem); border-bottom:1px solid var(--line);
  position:sticky; top:0; background:var(--ink); z-index:40;
}
body.site .brand{ font-family:'Fraunces',serif; font-size:1.25rem; }
body.site .main-nav ul{ display:flex; gap:2rem; font-size:.86rem; color:var(--paper-dim); }
body.site .main-nav a:hover{ color:var(--brass); }
body.site .nav-right{ display:flex; align-items:center; gap:1.4rem; }
.social-icons{ display:flex; align-items:center; gap:.7rem; }
.social-icon{
  display:flex; align-items:center; justify-content:center; width:1.9rem; height:1.9rem;
  color:var(--paper-dim); border-radius:50%; transition:color .2s ease, background .2s ease;
}
.social-icon svg{ width:1.05rem; height:1.05rem; }
.social-icon:hover{ color:var(--brass); background:rgba(31,75,63,.1); }
.site-footer .social-icon{ color:var(--paper-faint); }
.site-footer .social-icon:hover{ color:var(--brass); }
body.site .nav-cta{
  font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;
  border:1px solid var(--line-strong); padding:.55rem 1rem; border-radius:2px;
}
body.site .nav-cta:hover{ border-color:var(--brass); color:var(--brass); }
.nav-client-mobile{ display:none; }
.nav-burger{ display:none; flex-direction:column; gap:4px; background:none; border:none; padding:.4rem; }
.nav-burger span{ width:20px; height:2px; background:var(--paper); display:block; }

.hero{ display:grid; grid-template-columns:1.05fr .95fr; border-bottom:1px solid var(--line); }
.hero-copy{ padding:clamp(2.5rem,7vw,6rem) clamp(1.2rem,4vw,3.5rem); display:flex; flex-direction:column; justify-content:center; gap:1.6rem; }
.hero-copy h1{ font-size:clamp(2.3rem,5vw,3.8rem); line-height:1.05; }
.hero-copy .desc{ max-width:42ch; color:var(--paper-dim); font-size:1rem; line-height:1.65; }
.hero-actions{ display:flex; gap:.9rem; flex-wrap:wrap; }
.hero-media{ min-height:360px; position:relative; }
.slider{ position:relative; width:100%; height:100%; min-height:360px; }
.slider .slide{ position:absolute; inset:0; margin:0; opacity:0; transition:opacity 1s ease; }
.slider .slide.active{ opacity:1; }
.slider .slide img{ width:100%; height:100%; object-fit:cover; }
.slider .slide figcaption{
  position:absolute; left:1rem; bottom:1rem; font-family:'IBM Plex Mono',monospace; font-size:.7rem;
  color:var(--on-photo); background:rgba(23,20,15,.5); padding:.3rem .55rem; border-radius:2px;
}
.slider-arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:2.4rem; height:2.4rem;
  border-radius:50%; border:1px solid rgba(247,247,244,.4); background:rgba(23,20,15,.35); color:var(--on-photo);
  font-size:1.4rem; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .2s ease, border-color .2s ease; backdrop-filter:blur(2px);
}
.slider-arrow:hover{ background:rgba(23,20,15,.6); border-color:rgba(247,247,244,.7); }
.slider-arrow.prev{ left:.9rem; }
.slider-arrow.next{ right:.9rem; }
.slider-dots{ position:absolute; left:0; right:0; bottom:1rem; z-index:2; display:flex; justify-content:center; gap:.5rem; }
.slider-dots button{
  width:.5rem; height:.5rem; border-radius:50%; border:1px solid rgba(247,247,244,.7); background:rgba(247,247,244,.25);
  padding:0; cursor:pointer; transition:background .2s ease, transform .2s ease;
}
.slider-dots button.active{ background:var(--on-photo); transform:scale(1.25); }

section.block{ padding:clamp(3rem,7vw,5.5rem) clamp(1.2rem,4vw,3.5rem); border-bottom:1px solid var(--line); }
.block-head{ margin-bottom:2.2rem; }
.block-head h2{ font-size:clamp(1.7rem,3vw,2.4rem); margin-top:.5rem; }

.about-grid{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.about-grid .frame{ aspect-ratio:4/5; border-radius:2px; }
.about-grid p{ color:var(--paper-dim); line-height:1.8; font-size:1rem; white-space:pre-line; }

.portfolio-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:.6rem; }
.portfolio-grid .frame{ aspect-ratio:1/1; border-radius:1px; cursor:pointer; }
.portfolio-grid .frame:hover img{ transform:scale(1.03); }
.portfolio-grid .frame img{ transition:transform .4s ease; }
.portfolio-grid .cat:nth-child(4n+1){ grid-row:span 2; aspect-ratio:1/2.1; }
.empty-note{ color:var(--paper-faint); font-size:.9rem; }

.testi-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.6px; background:var(--line); border:1px solid var(--line); }
.testi{ background:var(--ink-2); padding:2rem 1.7rem; display:flex; flex-direction:column; gap:1.2rem; }
.testi q{ font-family:'Fraunces',serif; font-style:italic; font-size:1.05rem; line-height:1.5; quotes:none; }
.testi cite{ font-style:normal; font-size:.78rem; color:var(--paper-faint); font-family:'IBM Plex Mono',monospace; }

.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); }
.contact-info h2{ font-size:clamp(1.8rem,3vw,2.4rem); margin-bottom:1.3rem; }
.contact-info p{ color:var(--paper-dim); line-height:1.7; max-width:40ch; margin-bottom:1.5rem; }
.contact-list{ display:flex; flex-direction:column; gap:0; font-size:.94rem; }
.contact-list div{ display:flex; gap:.8rem; padding:.7rem 0; border-bottom:1px solid var(--line); }
.contact-list span.k{ font-family:'IBM Plex Mono',monospace; font-size:.7rem; color:var(--brass); text-transform:uppercase; letter-spacing:.08em; width:6.5rem; flex-shrink:0; padding-top:.15rem; }
.form-mock{ position:relative; border:1px solid var(--line); padding:1.8rem; border-radius:2px; display:flex; flex-direction:column; gap:1rem; }
.form-mock .f{ display:flex; flex-direction:column; gap:.4rem; }
.form-mock label{ font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:var(--paper-faint); }
.form-mock .box, .form-mock input, .form-mock select, .form-mock textarea{
  border:1px solid var(--line-strong); padding:.75rem; border-radius:2px; color:var(--paper); font-size:.9rem;
  background:var(--ink); font-family:'Work Sans',sans-serif; width:100%;
}
.form-mock textarea.box{ min-height:6rem; resize:vertical; }
.form-mock .f-row{ display:flex; gap:1rem; }
.form-mock .f-row .f{ flex:1; min-width:0; }
.form-feedback{ font-size:.85rem; padding:.7rem .9rem; border-radius:2px; }
.form-feedback.ok{ background:rgba(63,125,82,.12); color:var(--ok); }
.form-feedback.error{ background:rgba(168,62,62,.1); color:var(--danger); }
.quote-section .block-head{ margin-bottom:.6rem; }
.quote-intro{ max-width:60ch; color:var(--paper-dim); line-height:1.7; margin:0 0 2rem; }
.quote-form{ max-width:640px; }

@media (max-width:640px){ .form-mock .f-row{ flex-direction:column; } }

.site-footer{
  padding:2.2rem clamp(1.2rem,4vw,3.5rem); display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:1rem; font-size:.78rem; color:var(--paper-faint);
}
.site-footer .social{ display:flex; align-items:center; gap:1.2rem; }
.site-credit{ font-size:.74rem; color:var(--paper-faint); }
.site-credit a{ color:var(--paper-faint); }
.site-credit a:hover{ color:var(--brass); }

@media (max-width:860px){
  body.site .main-nav{ display:none; position:absolute; top:100%; left:0; right:0; background:var(--ink); border-bottom:1px solid var(--line); padding:1rem clamp(1.2rem,4vw,3.5rem); }
  body.site .main-nav.open{ display:block; }
  body.site .main-nav ul{ flex-direction:column; gap:1rem; }
  body.site .nav-right .nav-cta{ display:none; }
  .nav-client-mobile{
    display:block; margin-top:.4rem; padding-top:1rem; border-top:1px solid var(--line);
  }
  .nav-client-mobile a{
    display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.08em;
    text-transform:uppercase; color:var(--brass); border:1px solid var(--brass); padding:.55rem 1rem; border-radius:2px;
  }
  .nav-burger{ display:flex; }
  .hero{ grid-template-columns:1fr; }
  .about-grid{ grid-template-columns:1fr; }
  .portfolio-grid{ grid-template-columns:repeat(2,1fr); }
  .portfolio-grid .cat:nth-child(4n+1){ grid-row:auto; aspect-ratio:1/1; }
  .testi-grid{ grid-template-columns:1fr; }
  .contact-grid{ grid-template-columns:1fr; }
}

/* ================= LOGIN (admin + cliente) ================= */
.auth-screen{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:var(--ink); padding:1.5rem;
}
.auth-card{
  width:100%; max-width:380px; border:1px solid var(--line); border-radius:8px;
  padding:2.2rem 2rem; background:var(--ink-2);
}
.auth-card .brand{ font-family:'Fraunces',serif; font-size:1.2rem; margin-bottom:.3rem; display:block; }
.auth-card h1{ font-size:1.4rem; margin-bottom:.3rem; }
.auth-card .sub{ color:var(--paper-faint); font-size:.86rem; margin-bottom:1.6rem; }
.auth-card .f{ display:flex; flex-direction:column; gap:.4rem; margin-bottom:1rem; }
.auth-card label{ font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:var(--paper-faint); }
.auth-card input{
  border:1px solid var(--line-strong); padding:.8rem .9rem; border-radius:4px; background:var(--ink);
  color:var(--paper); font-size:.95rem; width:100%;
}
.auth-card .btn{ width:100%; justify-content:center; margin-top:.4rem; }
.auth-card .error{ background:rgba(168,62,62,.1); color:var(--danger); font-size:.85rem; padding:.7rem .9rem; border-radius:4px; margin-bottom:1rem; }
.auth-card .ok{ background:rgba(63,125,82,.12); color:var(--ok); font-size:.85rem; padding:.7rem .9rem; border-radius:4px; margin-bottom:1rem; }
.auth-card .back{ display:block; text-align:center; margin-top:1.2rem; font-size:.82rem; color:var(--paper-faint); }
.auth-card .back:hover{ color:var(--brass); }
.auth-card .forgot-link{ display:block; text-align:center; margin-top:.9rem; font-size:.8rem; color:var(--brass); }
.auth-card .forgot-link:hover{ color:var(--brass-deep); text-decoration:underline; }
.auth-lang{ display:flex; justify-content:center; gap:.4rem; margin-bottom:1.2rem; font-family:'IBM Plex Mono',monospace; font-size:.72rem; color:var(--paper-faint); }
.auth-lang a.active{ color:var(--brass); font-weight:600; }

/* ================= PAINEL ADMINISTRATIVO ================= */
body.admin-body{ background:var(--ink); }
.admin{ display:grid; grid-template-columns:230px 1fr; min-height:100vh; }
.admin-side{ background:var(--ink-2); border-right:1px solid var(--line); padding:1.6rem 1.1rem; display:flex; flex-direction:column; gap:1.8rem; position:sticky; top:0; height:100vh; overflow:auto; }
.admin-brand{ font-family:'Fraunces',serif; font-size:1.05rem; padding:0 .5rem; }
.admin-nav{ display:flex; flex-direction:column; gap:.15rem; }
.admin-nav a, .footer-nav a{ display:flex; align-items:center; gap:.7rem; padding:.65rem .7rem; border-radius:4px; font-size:.86rem; color:var(--paper-dim); }
.admin-nav a .dot, .footer-nav a .dot{ width:6px; height:6px; border-radius:50%; background:var(--paper-faint); flex-shrink:0; }
.admin-nav a.active, .footer-nav a.active{ background:rgba(31,75,63,.12); color:var(--paper); }
.admin-nav a.active .dot, .footer-nav a.active .dot{ background:var(--brass); }
.admin-nav a:hover:not(.active), .footer-nav a:hover:not(.active){ color:var(--paper); }
.admin-side .divider{ font-family:'IBM Plex Mono',monospace; font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; color:var(--paper-faint); padding:0 .7rem; }
.admin-side .footer-nav{ margin-top:auto; display:flex; flex-direction:column; gap:.15rem; }

.admin-main{ padding:2rem clamp(1.2rem,3vw,2.6rem); }
.admin-top{ display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:1.8rem; flex-wrap:wrap; gap:1rem; }
.admin-top h2{ font-size:1.5rem; }
.admin-top .sub{ color:var(--paper-dim); font-size:.86rem; margin-top:.3rem; }

.section-tabs{ display:flex; flex-wrap:wrap; gap:.5rem; margin:1.4rem 0 1.4rem; border-bottom:1px solid var(--line); padding-bottom:1rem; }
.section-tab{
  font-family:'Work Sans',sans-serif; font-size:.86rem; font-weight:500; padding:.55rem 1.1rem; border-radius:99px;
  background:var(--ink-2); border:1px solid var(--line); cursor:pointer; color:var(--paper-dim);
}
.section-tab:hover{ border-color:var(--brass); color:var(--brass); }
.section-tab.active{ background:var(--brass); color:var(--on-accent); border-color:var(--brass); }

.kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:2rem; }
.kpi{ border:1px solid var(--line); border-radius:6px; padding:1.1rem 1.2rem; background:var(--ink-2); }
.kpi b{ font-family:'Fraunces',serif; font-size:1.8rem; display:block; margin-top:.5rem; }
.kpi .delta{ font-size:.76rem; color:var(--paper-faint); margin-top:.2rem; display:block; }

.panel{ border:1px solid var(--line); border-radius:6px; background:var(--ink-2); overflow:hidden; margin-bottom:1.6rem; }
.panel-head{ padding:1rem 1.3rem; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:.6rem; }
.panel-head h3{ font-size:1rem; font-family:'Work Sans',sans-serif; font-weight:600; }
.panel-body{ padding:1.4rem; }

table.gtable{ width:100%; border-collapse:collapse; font-size:.86rem; }
table.gtable th{ text-align:left; font-family:'IBM Plex Mono',monospace; font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:var(--paper-faint); font-weight:500; padding:.7rem 1.3rem; border-bottom:1px solid var(--line); }
table.gtable td{ padding:.85rem 1.3rem; border-bottom:1px solid var(--line); color:var(--paper-dim); vertical-align:middle; }
table.gtable tr:last-child td{ border-bottom:none; }
.gname{ color:var(--paper); font-weight:500; }
.gname .slug{ display:block; color:var(--paper-faint); font-family:'IBM Plex Mono',monospace; font-size:.72rem; font-weight:400; margin-top:.15rem; }
.pill{ font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:.05em; text-transform:uppercase; padding:.28rem .6rem; border-radius:99px; display:inline-block; }
.pill.open{ background:rgba(63,125,82,.14); color:var(--ok); }
.pill.locked{ background:rgba(31,75,63,.14); color:var(--brass); }
.pill.off{ background:rgba(27,33,29,.08); color:var(--paper-faint); }
.sel-bar{ display:flex; align-items:center; gap:.5rem; }
.sel-bar .track{ width:70px; height:5px; border-radius:99px; background:var(--line); overflow:hidden; }
.sel-bar .fill{ height:100%; background:var(--brass); }
.row-actions{ display:flex; gap:.6rem; }
.row-actions a, .row-actions button{ font-size:.78rem; color:var(--paper-faint); background:none; border:none; padding:0; cursor:pointer; }
.row-actions a:hover, .row-actions button:hover{ color:var(--brass); }
.row-actions .danger:hover{ color:var(--danger); }

.upload-zone{ border:1.5px dashed var(--line-strong); border-radius:6px; padding:2.4rem; text-align:center; color:var(--paper-faint); font-size:.86rem; }
.upload-zone b{ color:var(--paper); display:block; margin-bottom:.3rem; font-family:'Work Sans',sans-serif; }
.upload-zone input[type=file]{ margin-top:1rem; }

.upload-progress-wrap{ margin-top:.9rem; }
.upload-progress-wrap:not([hidden]){ display:flex; flex-direction:column; gap:.4rem; }
.upload-progress-track{ width:100%; height:8px; border-radius:99px; background:var(--line); overflow:hidden; }
.upload-progress-fill{ height:100%; width:0%; background:var(--brass); transition:width .2s ease; }
.upload-progress-label{ font-family:'Work Sans',sans-serif; font-size:.82rem; color:var(--paper-faint); }
.final-upload-label{ display:inline-block; }

.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; }
.form-grid .full{ grid-column:1/-1; }
.form-field{ display:flex; flex-direction:column; gap:.4rem; margin-bottom:1.1rem; }
.form-field label{ font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:var(--paper-faint); }
.form-field .hint{ font-size:.76rem; color:var(--paper-faint); font-family:'Work Sans',sans-serif; text-transform:none; letter-spacing:0; }
.form-field input, .form-field select, .form-field textarea{
  border:1px solid var(--line-strong); padding:.75rem .85rem; border-radius:4px; background:var(--ink);
  color:var(--paper); font-size:.9rem; font-family:'Work Sans',sans-serif; width:100%;
}
.form-field textarea{ min-height:6rem; resize:vertical; }
.form-field.checkbox{ flex-direction:row; align-items:center; gap:.6rem; }
.checkbox-list{ display:flex; flex-wrap:wrap; gap:.3rem 1.4rem; padding:.9rem 1rem; border:1px solid var(--line-strong); border-radius:4px; background:var(--ink); margin-bottom:.4rem; }
.checkbox-list .form-field.checkbox{ margin-bottom:0; }
.qr-preview{ display:flex; align-items:center; gap:.7rem; margin-bottom:.5rem; }
.qr-preview img{ width:64px; height:64px; object-fit:contain; background:#fff; padding:4px; border-radius:6px; border:1px solid var(--line-strong); }
.qr-preview .qr-remove{ display:flex; align-items:center; gap:.35rem; font-family:'Work Sans',sans-serif; font-size:.8rem; text-transform:none; letter-spacing:0; color:var(--paper-faint); cursor:pointer; }
.lang-tab-group{ display:flex; gap:.4rem; margin-bottom:.8rem; }
.lang-tab{ font-family:'IBM Plex Mono',monospace; font-size:.68rem; text-transform:uppercase; padding:.35rem .8rem; border-radius:99px; background:var(--ink); border:1px solid var(--line); cursor:pointer; color:var(--paper-faint); }
.lang-tab.active{ background:var(--brass); color:var(--on-accent); border-color:var(--brass); }

.alert{ padding:.9rem 1.1rem; border-radius:6px; font-size:.88rem; margin-bottom:1.4rem; }
.alert.ok{ background:rgba(63,125,82,.12); color:var(--ok); }
.alert.error{ background:rgba(168,62,62,.1); color:var(--danger); }
.alert.info{ background:rgba(31,75,63,.1); color:var(--paper); border:1px solid rgba(31,75,63,.3); }
.alert.warn{ background:rgba(168,117,46,.14); color:var(--warn); border:1px solid rgba(168,117,46,.35); }
.admin-breadcrumb{ display:inline-flex; align-items:center; gap:.3rem; font-size:.78rem; color:var(--paper-faint); margin-bottom:.8rem; }
.admin-breadcrumb:hover{ color:var(--brass); }

.photo-grid-admin{ display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:.8rem; }
.photo-grid-admin .pcard{ position:relative; border-radius:4px; overflow:hidden; border:1px solid var(--line); }
.photo-grid-admin .pcard img{ width:100%; aspect-ratio:1/1; object-fit:cover; }
.photo-grid-admin .badge{
  position:absolute; top:.4rem; left:.4rem; background:var(--brass); color:var(--on-accent);
  font-family:'IBM Plex Mono',monospace; font-size:.62rem; padding:.15rem .4rem; border-radius:99px;
}
.photo-grid-admin .pactions{
  position:absolute; inset:auto 0 0 0; background:rgba(23,20,15,.65); padding:.4rem .5rem;
  display:flex; justify-content:space-between; opacity:0; transition:opacity .15s ease;
}
.photo-grid-admin .pcard:hover .pactions{ opacity:1; }
.photo-grid-admin .pactions a, .photo-grid-admin .pactions button, .photo-grid-admin .pactions label{
  color:var(--on-photo); background:none; border:none; font-size:.72rem; cursor:pointer; font-family:'IBM Plex Mono',monospace;
}
.photo-grid-admin .pactions form{ display:inline-flex; margin:0; }
.visually-hidden-file{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

@media (max-width:900px){
  .admin{ grid-template-columns:1fr; }
  .admin-side{ position:relative; height:auto; }
  .kpis{ grid-template-columns:repeat(2,1fr); }
  .form-grid{ grid-template-columns:1fr; }
  table.gtable{ display:block; overflow-x:auto; white-space:nowrap; }
}

/* ================= ÁREA DA CLIENTE ================= */
body.client-body{ background:var(--ink); }
.client-top{
  padding:1.4rem clamp(1.2rem,4vw,3rem); border-bottom:1px solid var(--line);
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem;
  position:sticky; top:0; background:var(--ink); z-index:20;
}
.client-top .ttl{ display:flex; flex-direction:column; gap:.2rem; }
.client-top h2{ font-size:1.3rem; }
.client-top .meta{ font-size:.78rem; color:var(--paper-faint); font-family:'IBM Plex Mono',monospace; }
.client-top .brand-link{ font-family:'Fraunces',serif; font-size:1.1rem; }
.client-actions{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.sel-summary{ display:flex; align-items:center; gap:1rem; background:var(--ink-2); border:1px solid var(--line); padding:.7rem 1.1rem; border-radius:6px; }
.sel-summary .count{ font-family:'Fraunces',serif; font-size:1.2rem; }
.sel-summary .count small{ font-family:'IBM Plex Mono',monospace; font-size:.7rem; color:var(--paper-faint); }
.sel-summary .track{ width:110px; height:6px; border-radius:99px; background:var(--line); overflow:hidden; }
.sel-summary .fill{ height:100%; background:var(--brass); transition:width .25s ease, background .25s ease; }
.sel-summary .count.over{ color:var(--warn); }
.sel-summary .fill.over{ background:var(--warn); }
.sel-summary .extra-badge{
  font-family:'IBM Plex Mono',monospace; font-size:.66rem; letter-spacing:.04em; text-transform:uppercase;
  color:var(--warn); background:rgba(168,117,46,.14); border-radius:99px; padding:.15rem .55rem; margin-left:.5rem;
  display:inline-block; vertical-align:middle;
}

.client-grid{ padding:1.6rem clamp(1.2rem,4vw,3rem); display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.photo-card{ position:relative; border-radius:3px; overflow:hidden; aspect-ratio:3/4; background:var(--ink-2); }
.photo-card img{ width:100%; height:100%; object-fit:cover; display:block; }
.photo-zoom{ display:block; width:100%; height:100%; cursor:zoom-in; }
.photo-zoom::after{
  content:''; position:absolute; inset:0; background:rgba(23,20,15,0) url('data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23f4efe4%22 stroke-width=%222%22><circle cx=%2211%22 cy=%2211%22 r=%227%22/><line x1=%2221%22 y1=%2221%22 x2=%2216.65%22 y2=%2216.65%22/><line x1=%2211%22 y1=%228%22 x2=%2211%22 y2=%2214%22/><line x1=%228%22 y1=%2211%22 x2=%2214%22 y2=%2211%22/></svg>') no-repeat center / 34px;
  opacity:0; transition:opacity .15s ease, background-color .15s ease; pointer-events:none;
}
.photo-card:hover .photo-zoom::after{ opacity:1; background-color:rgba(23,20,15,.28); }
.photo-card .num{
  position:absolute; top:.5rem; left:.5rem; font-family:'IBM Plex Mono',monospace; font-size:.62rem;
  color:var(--on-photo); background:rgba(23,20,15,.45); padding:.2rem .4rem; border-radius:2px;
}
.heart{
  position:absolute; top:.5rem; right:.5rem; width:30px; height:30px; border-radius:50%;
  background:rgba(23,20,15,.55); border:1px solid rgba(244,239,228,.25);
  display:flex; align-items:center; justify-content:center; transition:all .15s ease; cursor:pointer;
}
.heart svg{ width:15px; height:15px; fill:none; stroke:var(--on-photo); stroke-width:2; }
.photo-card.selected .heart{ background:var(--brass); border-color:var(--brass); }
.photo-card.selected .heart svg{ fill:var(--on-accent); stroke:var(--on-accent); }
.photo-card.selected{ outline:2px solid var(--brass); outline-offset:-2px; }
.download-link{
  position:absolute; bottom:.5rem; right:.5rem; background:rgba(23,20,15,.55); color:var(--on-photo);
  font-family:'IBM Plex Mono',monospace; font-size:.62rem; padding:.25rem .5rem; border-radius:2px;
}
.download-link.locked{ opacity:.5; pointer-events:none; }

.gallery-list{ padding:2rem clamp(1.2rem,4vw,3rem); display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.2rem; }
.gallery-card{ border:1px solid var(--line); border-radius:6px; overflow:hidden; background:var(--ink-2); }
.gallery-card .cover{ aspect-ratio:4/3; background:var(--ink); }
.gallery-card .cover img{ width:100%; height:100%; object-fit:cover; }
.gallery-card .body{ padding:1.1rem 1.2rem; }
.gallery-card h3{ font-size:1.05rem; margin-bottom:.3rem; }
.gallery-card .meta{ font-size:.78rem; color:var(--paper-faint); font-family:'IBM Plex Mono',monospace; margin-bottom:.9rem; }

.empty-state{
  max-width:440px; margin:3.5rem auto; padding:0 clamp(1.2rem,4vw,3rem);
  text-align:center; display:flex; flex-direction:column; align-items:center; gap:.9rem;
}
.empty-state-icon{
  width:64px; height:64px; border-radius:50%; background:rgba(31,75,63,.1); color:var(--brass);
  display:flex; align-items:center; justify-content:center; margin-bottom:.3rem;
}
.empty-state-icon svg{ width:30px; height:30px; }
.empty-state h3{ font-family:'Fraunces',serif; font-size:1.25rem; color:var(--paper); margin:0; }
.empty-state-body{ font-family:'Work Sans',sans-serif; font-size:.92rem; line-height:1.6; color:var(--paper-dim); margin:0; }
.empty-state-hint{ font-family:'Work Sans',sans-serif; font-size:.82rem; color:var(--paper-faint); margin:.4rem 0 0; padding-top:.9rem; border-top:1px solid var(--line); width:100%; }
.empty-state-hint a{ color:var(--brass); }

@media (max-width:820px){ .client-grid{ grid-template-columns:repeat(2,1fr); } }

.lightbox-overlay{
  position:fixed; inset:0; background:rgba(10,9,7,.92); display:none; align-items:center; justify-content:center;
  z-index:100; padding:2rem;
}
.lightbox-overlay.open{ display:flex; }
.lightbox-overlay img{ max-width:100%; max-height:90vh; object-fit:contain; }

.extra-payment{ border-color:var(--warn); }
.extra-payment .panel-body p{ font-family:'Work Sans',sans-serif; font-size:.95rem; color:var(--paper); margin:0 0 .6rem; }
.extra-payment .extra-total{ font-size:1.05rem; }
.extra-payment .extra-total strong{ color:var(--brass); }
.pay-buttons{ display:flex; flex-wrap:wrap; gap:1.1rem; margin-top:.9rem; align-items:flex-start; }
.pay-btn{ text-decoration:none; }
.pay-option{ display:flex; flex-direction:column; align-items:flex-start; gap:.5rem; }
.pay-zelle{ display:flex; flex-direction:column; align-items:flex-start; gap:.3rem; padding:.6rem .9rem; border:1px solid var(--line-strong); border-radius:6px; font-family:'Work Sans',sans-serif; font-size:.85rem; }
.pay-zelle .pay-label{ font-family:'IBM Plex Mono',monospace; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--paper-faint); }
.pay-zelle .hint{ font-size:.76rem; color:var(--paper-faint); }
.pay-zelle strong{ font-size:.95rem; }
.pay-qr{ width:112px; height:112px; object-fit:contain; background:#fff; padding:6px; border-radius:8px; border:1px solid var(--line-strong); }
.lightbox-close{ position:absolute; top:1.2rem; right:1.6rem; background:none; border:none; color:var(--on-photo); font-size:1.8rem; cursor:pointer; }
