/* =================================================================
   anaramaison — admin / CMS styles
   ================================================================= */
:root{
  --ivory:#f6f2ea; --paper:#fbf9f4; --ink:#211e1a; --ink-soft:#4a453d;
  --greige:#a89a86; --greige-dk:#8b7d68; --line:#e2dccf; --line-dk:#d3cab8;
  --ok:#4b6a52; --err:#9d4b3f;
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Jost","Helvetica Neue",Arial,sans-serif;
}
*{ box-sizing:border-box; margin:0; padding:0; }
body{ font-family:var(--sans); font-weight:300; color:var(--ink); background:var(--ivory); line-height:1.55; }
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }

/* ---------- buttons ---------- */
.btn{ display:inline-block; font-family:var(--sans); font-size:.82rem; letter-spacing:.12em; text-transform:uppercase;
  padding:.85rem 1.7rem; border:1px solid var(--ink); background:none; color:var(--ink); cursor:pointer;
  transition:.3s cubic-bezier(.22,.61,.36,1); border-radius:2px; }
.btn:hover{ transform:translateY(-1px); }
.btn--dark{ background:var(--ink); color:var(--paper); margin-top:1.4rem; }
.btn--dark:hover{ background:#000; }
.btn--ghost{ border-color:var(--line-dk); color:var(--ink-soft); padding:.6rem 1.1rem; }
.btn--ghost:hover{ border-color:var(--ink); color:var(--ink); }
.btn--danger{ border-color:var(--err); color:var(--err); background:none; margin-top:1.4rem; margin-left:.6rem; }
.btn--danger:hover{ background:var(--err); color:#fff; }
.btn-icon{ background:none; border:1px solid var(--line-dk); color:var(--ink-soft); width:34px; height:34px; border-radius:4px;
  cursor:pointer; font-size:.95rem; line-height:1; transition:.25s; }
.btn-icon:hover{ border-color:var(--ink); color:var(--ink); }

/* ---------- alerts ---------- */
.alert{ padding:.85rem 1.2rem; border-radius:4px; font-size:.9rem; margin-bottom:1.2rem; }
.alert--ok{ background:#e7efe4; color:var(--ok); border:1px solid #c8dcc4; }
.alert--err{ background:#f3e2df; color:var(--err); border:1px solid #e4c6c0; }
.alert--float{ position:fixed; top:5.5rem; right:2rem; z-index:100; box-shadow:0 12px 40px rgba(0,0,0,.14);
  transition:opacity .6s; max-width:340px; }

/* =================================================================
   LOGIN
   ================================================================= */
.login-body{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:1.5rem;
  background:radial-gradient(120% 120% at 50% 0%, #fbf9f4 0%, #ece5d8 100%); }
.login-card{ width:100%; max-width:380px; background:var(--paper); border:1px solid var(--line); border-radius:8px;
  padding:3rem 2.6rem; text-align:center; box-shadow:0 24px 70px rgba(33,30,26,.10); }
.login-brand{ font-family:var(--serif); font-size:2.4rem; font-weight:300; letter-spacing:.02em; }
.login-sub{ font-size:.72rem; letter-spacing:.28em; text-transform:uppercase; color:var(--greige-dk); margin:.4rem 0 2rem; }
.login-form{ display:flex; flex-direction:column; gap:1rem; text-align:left; }
.login-form label{ font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--greige-dk); display:flex; flex-direction:column; gap:.4rem; }
.login-form input{ font-family:var(--sans); font-size:1rem; padding:.75rem .85rem; border:1px solid var(--line-dk); border-radius:4px; background:#fff; }
.login-form input:focus{ outline:none; border-color:var(--greige-dk); }
.login-form .btn{ margin-top:.6rem; width:100%; }
.login-back{ display:inline-block; margin-top:1.6rem; font-size:.78rem; letter-spacing:.1em; color:var(--greige-dk); }
.login-back:hover{ color:var(--ink); }

/* =================================================================
   DASHBOARD SHELL
   ================================================================= */
.admin-top{ position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between;
  padding:1rem 2rem; background:var(--paper); border-bottom:1px solid var(--line); }
.admin-top__brand{ font-family:var(--serif); font-size:1.5rem; }
.admin-top__brand span{ font-family:var(--sans); font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:var(--greige-dk); }
.admin-top__actions{ display:flex; gap:.6rem; }

.admin-wrap{ display:grid; grid-template-columns:230px 1fr; max-width:1200px; margin:0 auto; min-height:calc(100vh - 61px); }
.admin-side{ border-right:1px solid var(--line); padding:1.6rem 1rem; display:flex; flex-direction:column; gap:.2rem; }
.admin-side__link{ padding:.7rem .9rem; border-radius:5px; font-size:.9rem; color:var(--ink-soft); transition:.2s; }
.admin-side__link:hover{ background:#efe9dc; }
.admin-side__link.is-active{ background:var(--ink); color:var(--paper); }

.admin-main{ padding:2.4rem clamp(1.2rem,4vw,3rem); }
.admin-h1{ font-family:var(--serif); font-weight:400; font-size:2.2rem; }
.admin-h3{ font-family:var(--serif); font-weight:400; font-size:1.4rem; margin-bottom:1rem; }
.admin-lead{ color:var(--ink-soft); font-size:.95rem; margin:.4rem 0 1.8rem; max-width:60ch; }

/* ---------- cards / forms ---------- */
.card{ background:var(--paper); border:1px solid var(--line); border-radius:8px; padding:1.8rem; margin-bottom:1.6rem; }
.card--add{ border-style:dashed; border-color:var(--line-dk); background:transparent; }
.field{ display:flex; flex-direction:column; gap:.4rem; margin-bottom:1.1rem; }
.field label{ font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--greige-dk); }
.field input, .field textarea{ font-family:var(--sans); font-size:.98rem; color:var(--ink); padding:.7rem .8rem;
  border:1px solid var(--line-dk); border-radius:4px; background:#fff; width:100%; resize:vertical; }
.field input:focus, .field textarea:focus{ outline:none; border-color:var(--greige-dk); }
.hint{ text-transform:none; letter-spacing:0; color:var(--greige-dk); font-size:.82rem; }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:0 1.2rem; }
.divider{ font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--greige-dk);
  border-top:1px solid var(--line); padding-top:1.1rem; margin:1.4rem 0 1.2rem; }

/* ---------- list editor ---------- */
.list-editor{ display:flex; flex-direction:column; gap:.6rem; margin-bottom:1.2rem; }
.list-editor__row{ display:flex; align-items:center; gap:.7rem; }
.list-editor__row input{ flex:1; font-size:1rem; padding:.65rem .8rem; border:1px solid var(--line-dk); border-radius:4px; background:#fff; }
.list-editor__row input:focus{ outline:none; border-color:var(--greige-dk); }
.drag{ color:var(--greige); cursor:default; user-select:none; letter-spacing:-2px; }

/* ---------- images ---------- */
.img-row{ display:grid; grid-template-columns:220px 1fr; gap:1.6rem; align-items:start; padding-bottom:1.6rem; margin-bottom:1.6rem; border-bottom:1px solid var(--line); }
.img-row__preview{ aspect-ratio:16/10; overflow:hidden; border-radius:6px; border:1px solid var(--line); background:var(--ivory); }
.img-row__preview--tall{ aspect-ratio:4/5; }
.img-row__preview img,
.img-row__preview video{ width:100%; height:100%; object-fit:cover; display:block; }
.img-row__ctl h3{ font-family:var(--serif); font-weight:400; font-size:1.3rem; margin-bottom:.3rem; }
.img-row__ctl input[type=file]{ margin-top:.8rem; font-size:.88rem; }
.check{ display:flex; align-items:center; gap:.5rem; margin-top:.8rem; font-size:.85rem; color:var(--ink-soft); }

/* segmented control (hero type) */
.segmented{ display:inline-flex; border:1px solid var(--line-dk); border-radius:6px; overflow:hidden; margin-bottom:1.4rem; }
.seg{ display:flex; align-items:center; gap:.5rem; padding:.6rem 1.1rem; font-size:.85rem; letter-spacing:.06em; cursor:pointer; color:var(--ink-soft); background:#fff; transition:.2s; }
.seg + .seg{ border-left:1px solid var(--line-dk); }
.seg--on{ background:var(--ink); color:var(--paper); }
.seg input{ accent-color:currentColor; }

/* ---------- projects ---------- */
.proj-card__head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem; }
.proj-card__idx{ font-family:var(--serif); font-size:1.3rem; color:var(--greige-dk); }
.proj-card__order{ display:flex; gap:.4rem; }
.proj-card__grid{ display:grid; grid-template-columns:240px 1fr; gap:1.6rem; }
.proj-card__media{ }
.proj-card__media img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:6px; border:1px solid var(--line); background:var(--ivory); }
.proj-card__media input[type=file]{ margin-top:.7rem; font-size:.84rem; width:100%; }
.proj-card__media--empty{ display:flex; flex-direction:column; }
.proj-card__media--empty .ph{ aspect-ratio:4/5; border:1px dashed var(--line-dk); border-radius:6px; display:flex;
  align-items:center; justify-content:center; color:var(--greige-dk); font-size:.9rem; letter-spacing:.1em; text-transform:uppercase; }
.proj-card__foot{ display:flex; align-items:center; }

@media (max-width:820px){
  .admin-wrap{ grid-template-columns:1fr; }
  .admin-side{ flex-direction:row; overflow-x:auto; border-right:0; border-bottom:1px solid var(--line); padding:.8rem 1rem; }
  .admin-side__link{ white-space:nowrap; }
  .grid2{ grid-template-columns:1fr; }
  .img-row, .proj-card__grid{ grid-template-columns:1fr; }
}