:root{
    --ink:#16231d; --ink-soft:#3d4a41;
    --paper:#f1f3ed; --paper-raised:#e9ece2;
    --teal:#123832; --teal-mid:#1f5951;
    --sage:#8ea184; --bronze:#a9752f;
    --line: rgba(18,56,50,0.16); --line-strong: rgba(18,56,50,0.3);
    --radius: 3px;
    --bs-body-font-family:'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;
    --bs-body-color: var(--ink);
    --bs-body-bg: var(--paper);
    --bs-link-color: var(--teal);
    --bs-link-hover-color: var(--teal-mid);
  }
  html{scroll-padding-top: calc(84px + env(safe-area-inset-top,0px));}
  body{
    background:var(--paper); color:var(--ink);
    font-family:'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;
    -webkit-font-smoothing:antialiased;
    padding-top:env(safe-area-inset-top,0px);
    padding-bottom:env(safe-area-inset-bottom,0px);
  }
  h1,h2,h3,h4{font-family:'Source Serif 4', Georgia, serif; font-weight:500; line-height:1.1; letter-spacing:-0.01em;}
  a{color:var(--teal);}
  img{max-width:100%; display:block;}
  .kicker{font-size:0.95rem; color:var(--teal-mid); margin-bottom:14px; font-family:'Source Serif 4', serif; font-style:italic;}
  section{padding:64px 0;}

  .btn-teal{background:var(--teal); border-color:var(--teal); color:var(--paper); font-weight:500;}
  .btn-teal:hover{background:var(--teal-mid); border-color:var(--teal-mid); color:var(--paper);}
  .btn-outline-teal{border-color:var(--line-strong); color:var(--ink); font-weight:500;}
  .btn-outline-teal:hover{background:var(--paper-raised); border-color:var(--ink); color:var(--ink);}

  .navbar{background:var(--paper); border-bottom:1px solid var(--line); padding-top:calc(14px + env(safe-area-inset-top,0px)); padding-bottom:14px;}
  .navbar-brand{display:flex; align-items:center; gap:10px; font-family:'Source Serif 4', serif; font-size:1.02rem; color:var(--ink);}
  .navbar-brand .mark{width:34px; height:34px; border-radius:50%; background:var(--teal); color:var(--paper); display:flex; align-items:center; justify-content:center; font-family:'Source Serif 4', serif; font-size:0.9rem; flex-shrink:0;}
  .navbar-brand small{display:block; font-family:'IBM Plex Sans',sans-serif; font-size:0.7rem; color:var(--ink-soft); font-weight:400;}
  .nav-link{color:var(--ink-soft) !important; font-size:0.94rem;}
  .nav-link.active, .nav-link:hover{color:var(--ink) !important;}

  .page-hero{border-bottom:1px solid var(--line); background:var(--paper-raised);}

  /* filter tabs */
  .filter-tabs{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:36px;}
  .filter-tabs button{
    border:1px solid var(--line-strong); background:var(--paper); color:var(--ink-soft);
    padding:8px 18px; border-radius:30px; font-size:0.88rem; font-weight:500; cursor:pointer;
    transition:all .15s ease;
  }
  .filter-tabs button:hover{border-color:var(--ink);}
  .filter-tabs button.active{background:var(--teal); border-color:var(--teal); color:var(--paper);}

  /* masonry gallery */
  .masonry{column-count:1; column-gap:18px;}
  @media (min-width:576px){.masonry{column-count:2;}}
  @media (min-width:900px){.masonry{column-count:3;}}
  .tile{break-inside:avoid; margin-bottom:18px; border-radius:var(--radius); overflow:hidden; position:relative; border:1px solid var(--line); background:var(--paper-raised); cursor:pointer;}
  .tile img{width:100%; height:auto; display:block; transition:transform .5s ease;}
  .tile:hover img{transform:scale(1.045);}
  .tile .cap{position:absolute; left:0; right:0; bottom:0; padding:18px 18px 14px 18px; background:linear-gradient(0deg, rgba(9,26,23,0.85) 0%, rgba(9,26,23,0.0) 100%); color:#f1f3ed;}
  .tile .cap .t{font-family:'Source Serif 4', serif; font-size:1.05rem; margin:0;}
  .tile .cap .s{font-size:0.78rem; opacity:0.75; margin-top:2px; letter-spacing:0.02em; text-transform:uppercase;}
  .tile.hidden{display:none;}

  .tile-empty{
    break-inside:avoid; margin-bottom:18px; border:1.5px dashed var(--line-strong); border-radius:var(--radius);
    display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
    padding:40px 20px; color:var(--ink-soft); min-height:220px; gap:10px; background:transparent;
  }
  .tile-empty .plus{width:40px; height:40px; border-radius:50%; border:1.5px dashed var(--line-strong); display:flex; align-items:center; justify-content:center; font-size:1.3rem; color:var(--sage);}
  .tile-empty p{font-size:0.9rem; margin:0; max-width:22ch;}

  /* modal */
  .modal-content{background:var(--paper); border:none; border-radius:var(--radius);}
  .modal-body img{width:100%; border-radius:var(--radius) var(--radius) 0 0;}
  .modal-footer, .modal-header{border-color:var(--line);}

  footer{border-top:1px solid var(--line); padding:44px 0 calc(44px + env(safe-area-inset-bottom,0px)); font-size:0.86rem; color:var(--ink-soft);}
  footer .disclaimer{max-width:680px; margin-top:20px; font-size:0.8rem; opacity:0.8; line-height:1.6;}
  ::selection{background:var(--sage); color:var(--teal);}