:root{
    --ink:#111110;
    --paper:#F1F0EB;
    --paper-dim:#E4E2DA;
    --cobalt:#8C1D24;
    --cobalt-dark:#5E1218;
    --brass:#9C7A44;
    --line: rgba(17,17,16,0.15);
    --line-inv: rgba(241,240,235,0.2);
    --radius:16px;
    --radius-sm:9px;
    --shadow:0 10px 34px rgba(17,17,16,0.08);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{ background:var(--paper); color:var(--ink); font-family:'Inter', sans-serif; font-weight:300; -webkit-font-smoothing:antialiased; }
  h1,h2,h3,.display{ font-family:'Bricolage Grotesque', sans-serif; font-weight:400; letter-spacing:-0.01em; }
  .mono{ font-family:'IBM Plex Mono', monospace; letter-spacing:0.04em; }

  .topbar{ display:flex; justify-content:space-between; padding:14px 28px; font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:rgba(17,17,16,0.55); border-bottom:1px solid var(--line); }

  nav{ position:sticky; top:0; z-index:50; background:var(--paper); border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; padding:20px 28px; }
  .nav-logo-img{ height:44px; cursor:pointer; display:block; }
  .nav-links{ display:flex; gap:6px; list-style:none; }
  .nav-links li{ font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:0.05em; text-transform:uppercase; cursor:pointer; color:var(--ink); padding:8px 16px; border:1px solid transparent; border-radius:var(--radius-sm); transition:all .15s;}
  .nav-links li:hover{ border-color:var(--line); }
  .nav-links li.active{ background:var(--ink); color:var(--paper); }
  .nav-gestionale{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.06em; background:var(--cobalt); color:var(--paper); padding:10px 16px; border:none; border-radius:var(--radius-sm); cursor:pointer; text-transform:uppercase; }
  .nav-gestionale:hover{ background:var(--cobalt-dark); }
  .nav-login{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.06em; background:transparent; color:rgba(17,17,16,0.45); padding:8px 12px; border:1px solid var(--line); border-radius:var(--radius-sm); cursor:pointer; text-transform:uppercase; }
  .nav-login:hover{ color:var(--ink); border-color:var(--ink); }

  .nav-hamburger{ display:none; flex-direction:column; justify-content:center; gap:5px; width:32px; height:32px; background:none; border:none; cursor:pointer; padding:0; }
  .nav-hamburger span{ display:block; width:100%; height:2px; background:var(--ink); }

  @media(max-width:900px){
    nav{ padding:16px 18px; flex-wrap:wrap; }
    .nav-links{
      display:none; position:absolute; top:100%; left:0; right:0; z-index:49;
      flex-direction:column; gap:0; background:var(--paper); border-bottom:1px solid var(--line);
      padding:8px 0;
    }
    .nav-links.mobile-open{ display:flex; }
    .nav-links li{ padding:16px 24px; border:none; }
    .nav-hamburger{ display:flex; }
  }

  .hero{ position:relative; min-height:82vh; display:flex; align-items:center; padding:0; margin:0; max-width:none; }
  .hero-content{ max-width:1280px; margin:0 auto; padding:80px 28px; width:100%; }
  .hero-index{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:rgba(17,17,16,0.4); margin-bottom:32px; }
  .hero h1{ font-size:clamp(42px, 7.6vw, 100px); line-height:1.04; font-weight:300; letter-spacing:-0.025em; max-width:15ch; }
  .hero h1 .word{ display:inline-block; will-change:transform; }
  .hero-side{ font-size:17px; line-height:1.7; color:rgba(17,17,16,0.6); max-width:480px; margin-top:32px; }
  .hero-cta{ margin-top:44px; display:flex; gap:12px; flex-wrap:wrap; }
  @media(max-width:900px){ .hero{ min-height:auto; } .hero-content{ padding:64px 28px; } }
  .btn{ font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:0.06em; text-transform:uppercase; padding:15px 28px; border:1px solid var(--ink); border-radius:var(--radius-sm); background:transparent; color:var(--ink); cursor:pointer; transition:background .15s, color .15s; display:inline-block; }
  .btn:hover{ background:var(--ink); color:var(--paper); }
  .btn.primary{ background:var(--cobalt); color:var(--paper); border-color:var(--cobalt); }
  .btn.primary:hover{ background:var(--cobalt-dark); border-color:var(--cobalt-dark); }
  .hero-cta .btn:not(.primary){ border-color:var(--line); }
  .hero-cta .btn:not(.primary):hover{ background:var(--ink); color:var(--paper); border-color:var(--ink); }

  .marquee-bar{ max-width:1280px; margin:0 auto; height:1px; background:var(--line); }

  section{ max-width:1280px; margin:0 auto; padding:104px 28px; }
  .section-head{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:48px; gap:20px; flex-wrap:wrap;}
  .section-head .idx{ font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--cobalt); display:block; margin-bottom:10px; }
  .section-head h2{ font-size:clamp(28px,4vw,44px); }
  .section-head .count{ font-family:'IBM Plex Mono', monospace; font-size:12px; color:rgba(17,17,16,0.5); }
  .section-sub{ max-width:640px; color:rgba(17,17,16,0.7); font-size:15px; line-height:1.6; margin-top:-30px; margin-bottom:44px; }

  .project-grid{ display:flex; flex-direction:column; gap:88px; }
  .project-row{ display:grid; grid-template-columns:1.4fr 1fr; gap:50px; align-items:center; cursor:pointer; }
  @media(max-width:900px){ .project-row{ grid-template-columns:1fr; } }
  .project-row-media{ position:relative; overflow:hidden; border-radius:var(--radius); order:1; }
  .project-row-media img{ width:100%; height:520px; object-fit:cover; display:block; transition:transform .5s cubic-bezier(.16,.8,.24,1); }
  @media(max-width:900px){ .project-row-media img{ height:340px; } }
  .project-row-media .swatch-dot{ width:100%; height:520px; background:var(--ink); }
  .project-row:hover .project-row-media img{ transform:scale(1.04); }
  .project-row-media .photo-count{
    position:absolute; bottom:14px; right:14px; background:rgba(17,17,16,0.72); color:var(--paper);
    padding:6px 12px; border-radius:var(--radius-sm); font-size:10px; letter-spacing:0.06em; text-transform:uppercase;
  }
  .project-row-info{ order:2; }
  .project-row-info .tag{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--cobalt); }
  .project-row-info h3{ font-size:clamp(24px,3vw,34px); margin:10px 0 16px; }
  .project-row-info p{ font-size:15px; line-height:1.75; color:rgba(17,17,16,0.68); font-family:'Inter',sans-serif; }
  .project-row:nth-child(even) .project-row-media{ order:2; }
  .project-row:nth-child(even) .project-row-info{ order:1; }
  @media(max-width:900px){ .project-row:nth-child(even) .project-row-media, .project-row:nth-child(even) .project-row-info{ order:initial; } }

  /* servizi */
  .service-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-bottom:20px; }
  @media(max-width:800px){ .service-grid{ grid-template-columns:1fr; } }
  .service-card{ background:var(--paper); padding:32px 26px; border-radius:var(--radius); box-shadow:var(--shadow); }
  .service-card .num{ font-family:'IBM Plex Mono', monospace; font-size:12px; color:var(--cobalt); margin-bottom:14px; display:block; }
  .service-card h3{ font-size:20px; margin-bottom:12px; }
  .service-card p{ font-size:14.5px; line-height:1.6; color:rgba(17,17,16,0.68); }

  .feature-band{ background:var(--ink); color:var(--paper); }
  .feature-wrap{ max-width:1280px; margin:0 auto; padding:104px 28px; display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
  @media(max-width:900px){ .feature-wrap{ grid-template-columns:1fr; } }
  /* max-width limitato alla risoluzione nativa dei file (424-476px): oltre risulterebbero sgranate */
  .feature-wrap img{ width:100%; max-width:420px; height:auto; display:block; object-fit:cover; border-radius:var(--radius); margin:0 auto; }
  .feature-eyebrow{ font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--brass); margin-bottom:16px; display:inline-block; border:1px solid rgba(241,240,235,0.3); border-radius:var(--radius-sm); padding:6px 14px; }
  .feature-wrap h2{ font-size:clamp(26px,3.6vw,42px); margin-bottom:18px; color:var(--paper); }
  .feature-wrap p{ font-size:15.5px; line-height:1.7; color:rgba(241,240,235,0.75); margin-bottom:10px; }
  .feature-list{ margin-top:26px; display:flex; flex-direction:column; }
  .feature-list .fitem{ border-top:1px solid var(--line-inv); padding:16px 0; }
  .feature-list .fitem h4{ font-family:'Bricolage Grotesque',sans-serif; font-weight:500; font-size:16px; margin-bottom:6px; }
  .feature-list .fitem p{ font-size:13.5px; margin:0; color:rgba(241,240,235,0.62); }
  .feature-wrap.light{ color:var(--ink); }

  .eccellenza-band{ background:var(--ink); color:var(--paper); }
  .eccellenza-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:36px; max-width:1040px; }
  @media(max-width:800px){ .eccellenza-grid{ grid-template-columns:1fr; max-width:420px; } }
  .ecc-card img{ width:100%; max-width:440px; aspect-ratio:1/1; height:auto; object-fit:cover; display:block; margin-bottom:16px; border-radius:var(--radius); }
  .ecc-card h3{ font-size:19px; margin-bottom:8px; color:var(--paper); }
  .ecc-card p{ font-size:14px; line-height:1.55; color:rgba(241,240,235,0.65); }

  /* chi siamo */
  .about-wrap{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:50px; align-items:start; }
  @media(max-width:800px){ .about-wrap{ grid-template-columns:1fr; } }
  .about-wrap img{ width:100%; height:auto; display:block; border-radius:var(--radius); }
  .about-photos{ display:flex; flex-direction:column; gap:16px; }
  .about-photo-sticky{ position:sticky; top:100px; }
  @media(max-width:800px){ .about-photo-sticky{ position:static; } }

  .about-story{ margin:0; }
  .about-story p{ font-size:16px; line-height:1.8; color:rgba(17,17,16,0.8); margin-bottom:22px; }
  .about-story p:last-child{ font-weight:500; color:var(--ink); margin-bottom:0; }

  /* story teaser on home */
  .story-teaser-full{ padding:0 0 0; }
  .story-teaser-text{ max-width:680px; margin:0 auto; padding:80px 28px 48px; text-align:center; }
  .story-teaser-text p{ font-size:16.5px; line-height:1.8; color:rgba(17,17,16,0.75); margin:18px 0 28px; }
  .story-teaser-text h2{ font-size:clamp(26px,3.6vw,40px); }
  .story-eyebrow{ color:var(--cobalt) !important; border-color:var(--line) !important; }
  .story-teaser-full img{ width:100%; height:auto; max-height:60vh; object-fit:cover; display:block; border-radius:var(--radius); }

  /* contatti */
  .contact-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:60px; }
  @media(max-width:800px){ .contact-wrap{ grid-template-columns:1fr; } }
  .form-group{ margin-bottom:22px; }
  .form-group label{ display:block; font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; margin-bottom:8px; color:rgba(17,17,16,0.6); }
  .form-group input, .form-group textarea{ width:100%; border:none; border-bottom:1px solid var(--ink); background:transparent; padding:10px 2px; font-family:'Inter', sans-serif; font-weight:300; font-size:16px; color:var(--ink); }
  .form-group input:focus, .form-group textarea:focus{ outline:none; border-bottom:2px solid var(--cobalt); }
  .contact-info .row{ display:flex; justify-content:space-between; padding:16px 0; border-bottom:1px solid var(--line); }
  .contact-info .row .k{ font-family:'IBM Plex Mono', monospace; font-size:12px; text-transform:uppercase; letter-spacing:0.06em; color:rgba(17,17,16,0.55); }
  .contact-link{ color:var(--ink); text-decoration:none; border-bottom:1px solid transparent; transition:all .15s; }
  .contact-link:hover{ color:var(--cobalt); border-bottom-color:var(--cobalt); }
  .form-msg{ font-family:'IBM Plex Mono', monospace; font-size:12px; margin-top:14px; color:var(--cobalt); min-height:16px; }

  footer{ border-top:1px solid var(--line); padding:36px 28px; text-align:center; font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.05em; color:rgba(17,17,16,0.5); }
  .footer-contacts{ display:flex; justify-content:center; flex-wrap:wrap; gap:8px 24px; margin-bottom:16px; }
  .footer-contacts a, .footer-contacts span{ color:rgba(17,17,16,0.6); text-decoration:none; }
  .footer-contacts a:hover{ color:var(--cobalt); }
  .footer-copy{ color:rgba(17,17,16,0.4); display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; }

  .admin-banner{ background:var(--cobalt-dark); color:var(--paper); text-align:center; padding:10px; font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:0.05em; }
  .admin-panel{ max-width:960px; margin:0 auto; padding:50px 28px 110px; }
  .admin-panel h2{ font-size:28px; margin-bottom:6px; }
  .admin-panel .sub{ color:rgba(17,17,16,0.6); font-size:14px; margin-bottom:36px; font-family:'Inter',sans-serif; }
  .admin-block{ border:none; box-shadow:var(--shadow); border-radius:var(--radius); background:var(--paper-dim); padding:26px; margin-bottom:26px; }
  .admin-block h3{ font-size:18px; margin-bottom:18px; }
  .admin-form-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
  @media(max-width:600px){ .admin-form-row{ grid-template-columns:1fr; } }
  .admin-block input, .admin-block textarea, .admin-block select{ width:100%; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--paper); padding:11px 12px; font-family:'Inter', sans-serif; font-weight:300; font-size:14px; }
  .admin-block textarea{ min-height:70px; resize:vertical; }
  .admin-block input[type="checkbox"]{ width:auto; margin-right:9px; vertical-align:middle; }
  .check-label{ display:flex !important; align-items:center; text-transform:none !important; font-size:13px !important; font-family:'Inter',sans-serif !important; letter-spacing:0 !important; color:var(--ink) !important; cursor:pointer; }
  .admin-block label{ display:block; font-family:'IBM Plex Mono', monospace; font-size:10px; letter-spacing:0.05em; text-transform:uppercase; margin-bottom:6px; color:rgba(17,17,16,0.55); }
  .admin-item-list{ display:flex; flex-direction:column; gap:10px; margin-top:20px; }
  .admin-item-row{ display:flex; justify-content:space-between; align-items:center; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-sm); padding:12px 16px; }
  .admin-item-row .t{ font-size:14px; font-family:'Inter',sans-serif; }
  .admin-item-row .t .s{ display:block; font-family:'IBM Plex Mono', monospace; font-size:10px; color:var(--cobalt); text-transform:uppercase; }
  .admin-item-row .actions{ display:flex; gap:8px; }
  .icon-btn{ background:none; border:1px solid var(--line); border-radius:var(--radius-sm); font-family:'IBM Plex Mono', monospace; font-size:10px; text-transform:uppercase; padding:6px 10px; cursor:pointer; }
  .icon-btn:hover{ background:var(--ink); color:var(--paper); }
  .icon-btn.danger:hover{ background:#B23A2E; border-color:#B23A2E; color:#fff; }

  .admin-item-editing{ display:block; }
  .admin-edit-form{ width:100%; }
  .upload-status{ font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--cobalt); margin-left:8px; }
  .edit-photo-grid{ display:flex; flex-wrap:wrap; gap:10px; margin:14px 0; }
  .edit-photo{ position:relative; width:80px; height:80px; }
  .edit-photo img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:8px; }
  .photo-remove{
    position:absolute; top:-8px; right:-8px; width:22px; height:22px; border-radius:50%;
    background:var(--ink); color:var(--paper); border:none; cursor:pointer; font-size:13px; line-height:1;
  }
  .photo-remove:hover{ background:#B23A2E; }
  .admin-edit-actions{ display:flex; gap:10px; margin-top:16px; }
  .empty-note{ font-size:13px; color:rgba(17,17,16,0.5); font-style:italic; padding:14px 0; font-family:'Inter',sans-serif; }
  .save-status{ font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--paper); margin-left:12px; }
  .hint{ font-size:12px; color:rgba(17,17,16,0.5); margin-top:-8px; margin-bottom:14px; }

  .vintage-section{ background:var(--ink); color:var(--paper); }
  .vintage-section .section-head .count{ color:rgba(241,240,235,0.5); }
  .vintage-section .section-sub{ color:rgba(241,240,235,0.65); }
  .vintage-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
  @media(max-width:900px){ .vintage-grid{ grid-template-columns:repeat(2,1fr); } }
  @media(max-width:600px){ .vintage-grid{ grid-template-columns:1fr; } }
  .vintage-card{ background:var(--ink); border-radius:var(--radius); padding:24px; min-height:230px; display:flex; flex-direction:column; gap:14px; transition:background .15s;}
  .vintage-card:hover{ background:#1c1c19; }
  .vintage-card .thumbs{ display:grid; grid-template-columns:repeat(3,1fr); gap:3px; }
  .vintage-card .thumbs img{ width:100%; height:64px; object-fit:cover; display:block; border-radius:6px; }
  .vintage-card .thumbs .swatch-dot{ width:100%; height:64px; background:rgba(241,240,235,0.12); border-radius:6px; grid-column:1/-1; }
  .vintage-card .era{ font-family:'IBM Plex Mono', monospace; font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:rgba(241,240,235,0.55); }
  .vintage-card h3{ font-size:19px; }
  .vintage-card p{ font-size:13.5px; line-height:1.55; color:rgba(241,240,235,0.65); flex:1; font-family:'Inter',sans-serif; }

  .dev-notice{ border:1px solid var(--line-inv); border-radius:var(--radius); padding:48px 36px; text-align:center; max-width:620px; }
  .dev-badge{ display:inline-block; font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:rgba(241,240,235,0.55); border:1px solid var(--line-inv); border-radius:var(--radius-sm); padding:7px 14px; }
  .dev-notice p{ font-size:15.5px; line-height:1.7; color:rgba(241,240,235,0.7); margin:20px 0 28px; font-family:'Inter',sans-serif; }
  .dev-notice .btn{ border-color:rgba(241,240,235,0.5); color:var(--paper); }
  .dev-notice .btn:hover{ background:var(--paper); color:var(--ink); }

  .hidden{ display:none !important; }

  /* micro-interazioni ispirate a studi premiati (Awwwards) */
  .reveal{ opacity:0; transform:translateY(28px); transition:opacity 0.9s cubic-bezier(.16,.8,.24,1), transform 0.9s cubic-bezier(.16,.8,.24,1); }
  .reveal.in-view{ opacity:1; transform:translateY(0); }
  @media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

  .vintage-card .thumbs{ overflow:hidden; }
  .vintage-card .thumbs img, .ecc-card img, .feature-wrap img, .story-teaser-full img{
    transition:transform 1.1s cubic-bezier(.16,.8,.24,1), filter .4s ease;
  }
  .vintage-card:hover .thumbs img{ transform:scale(1.045); }
  .ecc-card:hover img{ transform:scale(1.04); }
  .ecc-card{ overflow:hidden; }
  .ecc-card img{ overflow:hidden; }

  body.edit-mode [data-editable]{
    outline:1.5px dashed var(--brass); outline-offset:4px; cursor:text; border-radius:2px;
    transition:background .15s;
  }
  body.edit-mode [data-editable]:hover{ background:rgba(156,122,68,0.1); }
  body.edit-mode [data-editable]:focus{ outline:2px solid var(--cobalt); background:rgba(122,31,46,0.06); }
  body.edit-mode [data-img-editable]{ position:relative; cursor:pointer; }
  body.edit-mode [data-img-editable]::after{
    content:'✎ clicca per cambiare'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    background:rgba(17,17,16,0.55); color:#fff; font-family:'IBM Plex Mono', monospace; font-size:12px;
    opacity:0; transition:opacity .15s;
  }
  body.edit-mode [data-img-editable]:hover::after{ opacity:1; }
  .edit-toolbar{
    position:fixed; bottom:24px; left:50%; transform:translateX(-50%); z-index:100;
    background:var(--ink); color:var(--paper); padding:14px 20px; display:flex; align-items:center; gap:14px;
    font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:0.04em;
    box-shadow:0 10px 30px rgba(0,0,0,0.3);
  }
  .edit-toolbar button{
    font-family:'IBM Plex Mono', monospace; font-size:12px; text-transform:uppercase; letter-spacing:0.05em;
    padding:10px 18px; border:none; cursor:pointer;
  }
  .edit-toolbar .save-edit{ background:var(--cobalt); color:#fff; }
  .edit-toolbar .cancel-edit{ background:transparent; color:var(--paper); border:1px solid rgba(241,240,235,0.3) !important; }

  /* lightbox */
  .lightbox-overlay{
    position:fixed; inset:0; background:rgba(17,17,16,0.92); z-index:200;
    display:flex; align-items:center; justify-content:center; padding:40px; cursor:zoom-out;
  }
  .lightbox-overlay img{ max-width:100%; max-height:100%; object-fit:contain; border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,0.5); }
  .lightbox-close{
    position:absolute; top:24px; right:28px; background:none; border:1px solid rgba(241,240,235,0.4);
    color:var(--paper); font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:0.06em; text-transform:uppercase;
    padding:10px 16px; cursor:pointer;
  }
  .lightbox-close:hover{ background:rgba(241,240,235,0.1); }
  [data-zoomable]{ cursor:zoom-in; }
  .lightbox-nav{
    position:absolute; top:50%; transform:translateY(-50%);
    background:rgba(241,240,235,0.08); border:1px solid rgba(241,240,235,0.3); color:var(--paper);
    width:52px; height:52px; border-radius:50%; cursor:pointer; font-size:20px;
    display:flex; align-items:center; justify-content:center; transition:background .15s;
  }
  .lightbox-nav:hover{ background:rgba(241,240,235,0.2); }
  .lightbox-nav.prev{ left:24px; }
  .lightbox-nav.next{ right:24px; }
  .lightbox-counter{
    position:absolute; bottom:24px; left:50%; transform:translateX(-50%);
    font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:0.06em; color:rgba(241,240,235,0.7);
  }
  @media(max-width:700px){
    .lightbox-nav{ width:42px; height:42px; font-size:16px; }
    .lightbox-nav.prev{ left:10px; } .lightbox-nav.next{ right:10px; }
  }

  /* login */
  .login-box{
    background:var(--paper); color:var(--ink); width:100%; max-width:360px;
    padding:32px 28px; cursor:auto; border-radius:var(--radius); box-shadow:0 24px 60px rgba(0,0,0,0.3);
  }
  .login-box h3{ font-family:'Bricolage Grotesque', sans-serif; font-size:22px; font-weight:500; margin-bottom:24px; }
  .login-box .btn{ width:100%; margin-top:4px; }
  .link-btn{
    display:block; width:100%; margin-top:14px; background:none; border:none; cursor:pointer;
    font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.05em; text-transform:uppercase;
    color:rgba(17,17,16,0.5); text-decoration:underline; text-underline-offset:3px;
  }
  .link-btn:hover{ color:var(--ink); }
  .logout-btn{
    font-family:'IBM Plex Mono', monospace; font-size:11px; letter-spacing:0.05em; text-transform:uppercase;
    background:none; border:1px solid rgba(241,240,235,0.4); color:var(--paper); padding:4px 10px; margin-left:10px; cursor:pointer;
  }
  .logout-btn:hover{ background:rgba(241,240,235,0.15); }

  /* custom cursor */
  .custom-cursor{
    position:fixed; top:0; left:0; width:88px; height:88px; border-radius:50%;
    background:var(--paper); color:var(--ink); display:flex; align-items:center; justify-content:center;
    font-family:'IBM Plex Mono', monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.05em;
    pointer-events:none; z-index:300; opacity:0; transform:translate(-50%,-50%) scale(0.5);
    transition:opacity .2s ease, transform .2s ease; mix-blend-mode:difference;
  }
  .custom-cursor.active{ opacity:1; transform:translate(-50%,-50%) scale(1); }
  @media(max-width:900px), (hover:none){ .custom-cursor{ display:none; } }