:root{
  --accent-viper:#144C3F;
  --background-color:#2D2D2D;
  --text-color:#E0E0E0;
}
/* Local Montserrat */
@font-face{
  font-family:'Montserrat';
  src: url('fonts/Montserrat-Regular.woff2') format('woff2'),
       url('fonts/Montserrat-Regular.woff') format('woff');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Montserrat';
  src: url('fonts/Montserrat-Bold.woff2') format('woff2'),
       url('fonts/Montserrat-Bold.woff') format('woff');
  font-weight:700;
  font-style:normal;
  font-display:swap;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; padding:0;
  font-family:'Montserrat', Arial, sans-serif;
  background: url('img/bg.jpg') center/cover no-repeat fixed, var(--background-color);
  color: var(--text-color);
  line-height:1.6; font-size:1.05rem;
  display:flex; flex-direction:column; min-height:100vh; /* sticky footer */
}
.simple-header{ position:fixed; inset:0 0 auto 0; height:76px; background:#2d2d2d; z-index:1000; }
.spacer{ height: 76px; }
footer{ background:#2d2d2d; padding:18px 12px; text-align:center; margin-top:auto; }
footer a{ color:var(--text-color); text-decoration:none; }
footer a:hover{ text-decoration:underline; }
main 

.glass{
  width:min(1000px, 96vw);
  background: rgba(255,255,255,0.08);
  border: 1px solid color-mix(in oklab, var(--accent-viper) 35%, rgba(255,255,255,0.18));
  border-radius: 22px;
  backdrop-filter: blur(10px) saturate(120%);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  box-shadow: 0 10px 40px rgba(0,0,0,0.35), inset 0 0 14px rgba(20,76,63,0.10);
  padding: clamp(18px, 3.5vw, 36px);
  position: relative; /* for corner buttons */

  margin: 0 auto;}
/* Index layout */
.row{ display:grid; grid-template-columns: 200px 1px 1fr; gap: clamp(14px, 3vw, 28px); align-items:center; }
@media (max-width:720px){
  .row{ grid-template-columns: 1fr; }
  .divider{ display:none; }
  .text{ text-align:center; }
  .portrait{ justify-self:center; }
}
.portrait{ width:200px; height:200px; border-radius:18px; overflow:hidden; border:1px solid color-mix(in oklab, var(--accent-viper) 35%, rgba(255,255,255,0.18)); box-shadow: inset 0 0 14px rgba(20,76,63,0.10); }
.portrait img{ width:100%; height:100%; object-fit:cover; display:block; }
.divider{ width:1px; height:100%; background: linear-gradient(180deg, rgba(20,76,63,.0), rgba(20,76,63,.40), rgba(20,76,63,.0)); opacity:.9; }
/* Typo */
h1{ margin:.1em 0 .4em; font-size: clamp(1.6rem, 3.2vw, 2.2rem); }
h1,h2,h3,h4{ font-family:'Montserrat', Arial, sans-serif; font-weight:700; }
.mokoto{ letter-spacing:.06em; text-transform:uppercase; color:var(--accent-viper);
  -webkit-text-stroke: 0.5px rgba(0,0,0,.45);
  text-shadow:
    -0.5px -0.5px 0 rgba(0,0,0,.5),
     0.5px -0.5px 0 rgba(0,0,0,.5),
    -0.5px  0.5px 0 rgba(0,0,0,.5),
     0.5px  0.5px 0 rgba(0,0,0,.5),
     0 0 4px rgba(20,76,63,.18);
}
@media (max-width:480px){
  .mokoto{ -webkit-text-stroke: 0.7px rgba(0,0,0,.5); }
}
.lead{ opacity:.9; }
.small{ opacity:.75; font-size:.95rem; }
/* Links & Buttons */
a.btn{ display:inline-flex; align-items:center; justify-content:center; padding:10px 14px; border-radius:12px; text-decoration:none; font-weight:600; transition: transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease; }
.btn-primary{ color:#0f0f0f; background: linear-gradient(180deg, color-mix(in oklab, var(--accent-viper) 92%, #fff 6%), color-mix(in oklab, var(--accent-viper) 82%, #000 8%)); border:1px solid color-mix(in oklab, var(--accent-viper) 60%, #000 40%); box-shadow:0 8px 24px rgba(0,0,0,.35); }
.btn-ghost{ color: var(--text-color); background: rgba(255,255,255,0.06); border: 1px solid color-mix(in oklab, var(--accent-viper) 30%, rgba(255,255,255,0.18)); }
.btn-ghost:hover, .btn-primary:hover{ transform:translateY(-1px); box-shadow: 0 10px 28px rgba(0,0,0,0.45); }
.btn-row{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-start; margin-top:16px }
.contact a:hover{ text-decoration:underline; }
main

.page.long{ align-items:flex-start; }

.page.center{align-items:center;justify-content:center}

footer .credit{opacity:.75;font-size:.9rem;display:inline-block;margin-top:6px}

main

body{display:flex;flex-direction:column;min-height:100vh}
main.page{flex:1 1 auto;display:flex;align-items:center;justify-content:center;padding:28px 16px 72px}
main.page.long{align-items:flex-start;justify-content:flex-start}

/* Corner buttons - minimal outline */
.btn-corner{position:absolute;right:16px;padding:8px 12px;border-radius:12px;font-weight:600;font-size:.95rem;border:1px solid color-mix(in oklab, var(--accent-viper) 55%, #000 45%);background: rgba(0,0,0,0.22);color: var(--text-color);text-decoration:none;backdrop-filter: blur(6px) saturate(110%);-webkit-backdrop-filter: blur(6px) saturate(110%);z-index:2;}
.btn-corner.top{top:16px}
.btn-corner.bottom{bottom:16px}
.btn-corner:hover{background: rgba(255,255,255,0.08)}

.glass.pad-corners{padding-top: calc(36px + 28px); padding-bottom: calc(36px + 28px)}
