:root {
      --ink:#151515;
      --gold:#cdb890;
      --side:26px;
      --header-h:53px;
    }

    * { box-sizing:border-box; }
    html, body { margin:0; padding:0; width:100%; min-height:100%; }
    html { scroll-behavior:smooth; }
    body {
      background:#fff;
      color:var(--ink);
      font-family:"IBM Plex Sans", Arial, sans-serif;
      font-weight:300;
      -webkit-font-smoothing:antialiased;
      text-rendering:optimizeLegibility;
    }
    a { color:inherit; text-decoration:none; }
    img { display:block; }

    /* The original page has no outer grey frame or boxed white page. */
    .page { width:100%; margin:0; background:#fff; overflow:visible; }

    .site-header {
      height:var(--header-h);
      width:100%;
      display:flex;
      align-items:center;
      justify-content:center;
      background:#fff;
      position:relative;
      z-index:20;
    }

    .nav {
      display:flex;
      align-items:center;
      justify-content:center;
      gap:26px;
      list-style:none;
      margin:0;
      padding:0;
    }
    .nav a {
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:0;
      font-family:"Roboto Mono", monospace;
      font-size:12.65px;
      line-height:1;
      font-weight:500;
      letter-spacing:2px;
      text-transform:uppercase;
      white-space:nowrap;
    }
    .chev {
      display:inline-block;
      width:5px;
      height:5px;
      margin-top:-3px;
      border-right:1px solid currentColor;
      border-bottom:1px solid currentColor;
      transform:rotate(45deg);
    }

    .hero {
      height:calc(100vh - 78px);
      min-height:560px;
      margin:0 var(--side) 25px;
      position:relative;
      overflow:visible;
      background:#101010;
    }
    .hero-media {
      position:absolute;
      inset:0;
      overflow:hidden;
      background:#101010;
    }
    .hero-media img {
      width:100%;
      height:100%;
      object-fit:cover;
      object-position:50% 50%;
    }

    /* Hero crossfade: slides never move; only their opacity changes. */
    .hero-slide {
      position:absolute;
      inset:0;
      opacity:0;
      transition:opacity 1.35s ease-in-out;
      will-change:opacity;
    }
    .hero-slide.is-active {
      opacity:1;
      z-index:2;
    }
    @media (prefers-reduced-motion: reduce) {
      .hero-slide { transition:none; }
    }

    .hero-line {
      position:absolute;
      z-index:6;
      left:50%;
      top:calc(100% - 15px);
      width:1px;
      height:80px;
      background:var(--gold);
      transform:translateX(-50%);
    }

    /* Slide-in panel: the launcher stays visible while the panel sits off-canvas. */
    .chat-panel-wrap {
      --panel-w:310px;
      position:fixed;
      z-index:60;
      top:0;
      right:0;
      width:var(--panel-w);
      height:100vh;
      transform:translateX(100%);
      transition:transform .42s cubic-bezier(.22,.61,.36,1);
      will-change:transform;
    }
    .chat-panel-wrap.open { transform:translateX(0); }

    .chat-launcher {
      position:absolute;
      left:-60px;
      top:31.2vh;
      width:60px;
      height:60px;
      display:grid;
      place-items:center;
      background:#fff;
      border:0;
      padding:0;
      cursor:pointer;
      box-shadow:-4px 2px 10px rgba(0,0,0,.08);
    }
    .chat-launcher svg {
      width:27px;
      height:27px;
      fill:none;
      stroke:#050505;
      stroke-width:1.8;
      stroke-linecap:round;
      stroke-linejoin:round;
    }

    .chat-panel {
      width:100%;
      height:100%;
      overflow-y:auto;
      background:#fff;
      box-shadow:-7px 0 18px rgba(0,0,0,.10);
      padding:28px 30px 34px;
      font-family:"IBM Plex Sans", Arial, sans-serif;
    }
    .chat-panel-title {
      margin:0 0 16px;
      font-size:15px;
      line-height:22px;
      font-weight:400;
      text-transform:uppercase;
      letter-spacing:.3px;
    }
    .chat-placeholder {
      min-height:250px;
      display:flex;
      align-items:center;
      justify-content:center;
      border:1px solid #e4e4e4;
      background:#f7f7f7;
      color:#929292;
      font-size:15px;
      margin-bottom:26px;
    }
    .chat-panel-actions {
      display:flex;
      gap:10px;
    }
    .chat-panel-actions button {
      min-height:40px;
      padding:0 18px;
      border-radius:2px;
      font-family:"IBM Plex Sans", Arial, sans-serif;
      font-size:14px;
      font-weight:400;
      cursor:pointer;
    }
    .chat-panel-actions .primary {
      border:1px solid #55bf84;
      background:#55bf84;
      color:#fff;
    }
    .chat-panel-actions .secondary {
      border:1px solid #cfcfcf;
      background:#fff;
      color:#777;
    }

    .intro {
      max-width:780px;
      margin:0 auto;
      padding:92px 38px 0;
      text-align:center;
    }
    .intro h1 {
      margin:0 0 22px;
      font-size:26px;
      line-height:39px;
      font-weight:300;
      letter-spacing:0;
    }
    .intro p {
      max-width:610px;
      margin:0 auto;
      font-size:16px;
      line-height:24px;
      font-weight:300;
      color:#000;
    }
    .signature {
      width:220px;
      height:auto;
      margin:22px auto 0;
      filter:grayscale(1) brightness(0);
    }

    .instagram {
      padding-top:132px;
      text-align:center;
    }
    .instagram-title {
      margin:0 auto;
      text-align:center;
      font-family:"Roboto Mono", monospace;
      font-size:12px;
      line-height:1;
      font-weight:500;
      letter-spacing:4px;
      text-transform:uppercase;
      color:var(--gold);
    }
    .social-icons {
      display:flex;
      align-items:center;
      justify-content:center;
      gap:20px;
      margin:78px 0 35px;
    }
    .social-icons a {
      width:25px;
      height:25px;
      display:grid;
      place-items:center;
      color:#000;
    }
    .social-icons svg {
      width:23px;
      height:23px;
      display:block;
      fill:currentColor;
    }
    .social-icons .stroke-icon {
      fill:none;
      stroke:currentColor;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }

    .footer {
      display:flex;
      align-items:center;
      justify-content:center;
      padding:0 30px 28px;
      font-family:"IBM Plex Sans", Arial, sans-serif;
      font-size:14px;
      line-height:20px;
      font-weight:300;
      color:#000;
      text-align:center;
    }
    .footer strong { font-weight:400; }
    .footer a { color:inherit; font-weight:400; text-decoration:none; }

    .menu-toggle { display:none; }

    @media (max-width:900px) {
      :root { --side:18px; --header-h:58px; }
      .nav { gap:16px; }
      .nav a { font-size:11.385px; letter-spacing:1.4px; gap:6px; }
      .hero { height:calc(100vh - 82px); margin-bottom:24px; min-height:500px; }
      .brand { width:280px; top:12px; }
      .insta-grid { grid-template-columns:repeat(4,1fr); }
    }

    @media (max-width:720px) {
      :root { --side:12px; --header-h:62px; }
      .site-header { justify-content:flex-end; padding:0 14px; }
      .menu-toggle {
        display:block;
        width:38px;
        height:38px;
        border:0;
        background:transparent;
        position:relative;
      }
      .menu-toggle::before,
      .menu-toggle::after,
      .menu-toggle span {
        content:"";
        position:absolute;
        left:8px;
        width:22px;
        height:1px;
        background:#111;
      }
      .menu-toggle::before { top:12px; }
      .menu-toggle span { top:19px; }
      .menu-toggle::after { top:26px; }
      .nav {
        position:absolute;
        top:var(--header-h);
        left:0;
        right:0;
        display:none;
        padding:18px 24px 24px;
        background:#fff;
      }
      .nav.open { display:block; }
      .nav li { margin:0 0 17px; }
      .nav a { font-size:12.65px; }
      .hero { height:calc(100vh - 82px); min-height:540px; }
      .brand { width:240px; top:10px; }
      .chat-panel-wrap { display:none; }
      .intro { padding:88px var(--mobile-content-inset) 0; }
      .intro h1 { font-size:25px; line-height:36px; }
      .intro p { font-size:16px; line-height:24px; }
      .instagram { padding-top:105px; }
    }
  

    /* v19 — shared content typography */
    .intro h1 {
      font-family:"Roboto Condensed",Arial,sans-serif;
      font-size:46px;
      line-height:1;
      font-weight:700;
      letter-spacing:1.5px;
      text-transform:uppercase;
      color:#111;
    }
    .intro p {
      font-size:16px;
      line-height:25px;
      font-weight:300;
      color:#151515;
    }
    @media (max-width:700px){
      .intro h1{font-size:38px;line-height:1.04}
      .intro p{font-size:16px;line-height:25px}
    }
