/* Tour Diary Cloud — shared styles */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --ink:#12233F;
  --cream:#F5F1E6;
  --teal:#0F7B6C;
  --vermilion:#C2451E;
  --line:#D8CFB8;
  --slate:#5A6472;
  --paper:#FBF9F2;
  --shadow:20px 24px 60px -30px rgba(18,35,63,.45);
  --radius:14px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,sans-serif;
  background:var(--cream);
  color:var(--ink);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
.wrap{width:min(1120px,92vw);margin-inline:auto}
.mono{font-family:'IBM Plex Mono',monospace}
.serif{font-family:'Fraunces',serif}

/* eyebrow / labels */
.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--teal);font-weight:600;
}

/* buttons */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;
  font-weight:600;font-size:.95rem;
  padding:.85rem 1.5rem;border-radius:10px;border:1.5px solid transparent;
  cursor:pointer;transition:transform .15s ease,box-shadow .2s ease,background .2s;
}
.btn:hover{transform:translateY(-2px)}
.btn:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
.btn-primary{background:var(--ink);color:var(--cream)}
.btn-primary:hover{box-shadow:0 12px 28px -12px rgba(18,35,63,.6)}
.btn-accent{background:var(--vermilion);color:#fff}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{background:rgba(18,35,63,.04)}
.btn-block{width:100%;justify-content:center}

/* nav */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(245,241,230,.86);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-in{display:flex;align-items:center;justify-content:space-between;padding:.9rem 0}
.brand{display:flex;align-items:center;gap:.6rem;font-family:'Fraunces';font-weight:600;font-size:1.15rem}
.mark{width:34px;height:34px;border-radius:9px;background:var(--ink);position:relative;flex:0 0 auto}
.mark::before,.mark::after{content:"";position:absolute;border-radius:50%}
.mark::before{width:7px;height:7px;background:var(--vermilion);top:9px;left:9px}
.mark::after{width:7px;height:7px;background:var(--teal);bottom:9px;right:9px;
  box-shadow:-9px 0 0 -1px var(--cream),-9px 0 0 var(--teal)}
.nav-links{display:flex;align-items:center;gap:1.6rem;font-size:.92rem;font-weight:500}
.nav-links a.muted{color:var(--slate)}
.nav-links a.muted:hover{color:var(--ink)}
@media(max-width:720px){.nav-links .hide-sm{display:none}}

/* focus rings for inputs */
:focus-visible{outline-offset:2px}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
