:root{
    --ink:#0B1220; --ink-2:#182135; --ivory:#F6F1E7; --ivory-2:#ECE3D2;
    --brass:#C9A24C; --brass-2:#D8B96C; --signal:#3DDC97; --line:#E4DCC9;
    --muted:rgba(11,18,32,.62);
  }
  *{box-sizing:border-box}
  html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
  body{margin:0;background:var(--ivory);color:var(--ink);font-family:"Inter Tight",system-ui,sans-serif;line-height:1.5}
  h1,h2,h3,h4,.display{font-family:"Fraunces",Georgia,serif;letter-spacing:-.01em;margin:0}
  .mono{font-family:"JetBrains Mono",monospace;font-variant-numeric:tabular-nums}
  a{color:inherit;text-decoration:none}
  .wrap{width:100%;max-width:80rem;margin-inline:auto;padding-inline:1.5rem}
  .eyebrow{font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(11,18,32,.65)}
  .brass{color:var(--brass)}
  .bg-grid{background-image:linear-gradient(to right,rgba(11,18,32,.06) 1px,transparent 1px),linear-gradient(to bottom,rgba(11,18,32,.06) 1px,transparent 1px);background-size:40px 40px}
  .bg-grid-dark{background-image:linear-gradient(to right,rgba(246,241,231,.06) 1px,transparent 1px),linear-gradient(to bottom,rgba(246,241,231,.06) 1px,transparent 1px);background-size:40px 40px}

  /* nav */
  header.nav{position:sticky;top:0;z-index:50;background:rgba(246,241,231,.82);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  .nav-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
  .logo{display:flex;align-items:center;gap:.5rem;font-family:"Fraunces",serif;font-size:1.25rem;font-weight:600}
  .logo .mark{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--ink);color:var(--brass)}
  .nav-links{display:flex;align-items:center;gap:1.6rem;font-size:.9rem}
  .nav-links a{color:rgba(11,18,32,.72)}
  .nav-links a:hover{color:var(--ink)}
  .nav-links a.btn-ink{color:var(--ivory)}
  .nav-links a.btn-ink:hover{color:var(--ivory)}
  .btn{display:inline-flex;align-items:center;gap:.5rem;border-radius:999px;padding:.6rem 1.15rem;font-size:.85rem;font-weight:500;transition:transform .2s,background .2s}
  .btn-ink{background:var(--ink);color:var(--ivory)}
  .btn-ink:hover{transform:translateY(-2px);background:var(--ink-2)}
  .btn-brass{background:var(--brass);color:var(--ink)}
  .btn-brass:hover{transform:translateY(-2px);background:var(--brass-2)}
  .btn-ghost{border:1px solid rgba(11,18,32,.15);color:var(--ink)}
  .btn-ghost:hover{border-color:rgba(11,18,32,.4)}
  @media(max-width:820px){.nav-links .hide-sm{display:none}}

  /* hero */
  .hero{position:relative;overflow:hidden;padding:2.5rem 0 2rem}
  .hero .grid-layer{position:absolute;inset:0;opacity:.6}
  .hero h1{font-size:clamp(2.6rem,6vw,4.6rem);line-height:1.02;margin-top:1.4rem}
  .hero .lead{margin-top:1.4rem;max-width:34rem;font-size:1.12rem;color:rgba(11,18,32,.72)}
  .hero .cta-row{margin-top:2rem;display:flex;flex-wrap:wrap;gap:1rem}
  .pill{display:inline-flex;align-items:center;gap:.5rem}
  .underline-svg{display:block;width:min(300px,60%);margin-top:.2rem;color:var(--brass)}

  /* marquee */
  .marquee{overflow:hidden;border-block:1px solid rgba(0,0,0,.08);background:var(--ink);padding:.8rem 0}
  .marquee-track{display:flex;width:max-content;animation:scroll 30s linear infinite;gap:3rem}
  .marquee:hover .marquee-track{animation-play-state:paused}
  .marquee span{display:inline-flex;align-items:center;gap:3rem;white-space:nowrap;font-family:"JetBrains Mono",monospace;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(246,241,231,.72)}
  @keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

  section{padding:3.2rem 0}
  .sec-head h2{font-size:clamp(2rem,4vw,3rem)}
  .rule{display:block;height:1px;width:10rem;background:rgba(201,162,76,.6);margin-top:1.2rem}

  /* services */
  .cards{margin-top:2rem;display:grid;gap:1.4rem;grid-template-columns:repeat(2,1fr)}
  @media(max-width:820px){.cards{grid-template-columns:1fr}}
  .cluster{border:1px solid var(--line);background:#fff;border-radius:1rem;padding:1.8rem;transition:box-shadow .3s}
  .cluster:hover{box-shadow:0 24px 60px -34px rgba(11,18,32,.4)}
  .cluster .top{display:flex;justify-content:space-between;align-items:flex-start}
  .cluster .tag{font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--brass)}
  .cluster h3{font-size:1.5rem;margin-top:.35rem}
  .svc{display:flex;gap:.75rem;padding:.5rem 0;border-top:1px solid rgba(11,18,32,.06)}
  .svc:first-of-type{border-top:0}
  .dot{margin-top:.5rem;width:6px;height:6px;border-radius:999px;background:var(--brass);flex:none}
  .svc p{margin:0}
  .svc .t{font-size:.9rem;font-weight:500}
  .svc .s{font-size:.78rem;color:rgba(11,18,32,.55)}

  /* metrics */
  .metrics{border-block:1px solid var(--line);background:rgba(236,227,210,.4)}
  .metrics .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem;padding:2rem 1.5rem}
  @media(max-width:820px){.metrics .wrap{grid-template-columns:repeat(2,1fr)}}
  .metric .v{font-family:"Fraunces",serif;font-size:2.4rem}
  .metric .l{font-size:.85rem;color:rgba(11,18,32,.6);margin-top:.4rem}

  /* industries */
  .ind-grid{margin-top:2rem;display:grid;gap:1rem;grid-template-columns:repeat(5,1fr)}
  @media(max-width:1000px){.ind-grid{grid-template-columns:repeat(2,1fr)}}
  .ind{border:1px solid var(--line);background:#fff;border-radius:1rem;padding:1.15rem;transition:transform .25s,border-color .25s,box-shadow .25s}
  .ind:hover{transform:translateY(-4px);border-color:rgba(201,162,76,.6);box-shadow:0 22px 50px -28px rgba(11,18,32,.4)}
  .ind .n{font-family:"Fraunces",serif;font-size:1.05rem;margin-top:.6rem;line-height:1.25}
  .ind .b{font-size:.76rem;color:rgba(11,18,32,.55);margin-top:.35rem}

  /* process (dark) */
  .dark{background:var(--ink);color:var(--ivory)}
  .dark .eyebrow{color:var(--brass)}
  .steps{margin-top:2rem;display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem}
  @media(max-width:820px){.steps{grid-template-columns:repeat(2,1fr)}}
  .step{border-top:1px solid rgba(255,255,255,.15);padding-top:1.2rem}
  .step .n{font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.12em;color:var(--brass)}
  .step h3{font-size:1.4rem;margin-top:.6rem}
  .step p{font-size:.86rem;color:rgba(246,241,231,.72);margin-top:.6rem}

  /* founder */
  .founder{max-width:52rem}
  .card-dark{aspect-ratio:4/5;border-radius:1rem;background:linear-gradient(135deg,var(--ink),var(--ink-2));color:var(--ivory);padding:2rem;display:flex;flex-direction:column;justify-content:space-between}
  .roles{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;font-size:.76rem;color:rgba(246,241,231,.75)}
  .roles div{border:1px solid rgba(255,255,255,.12);border-radius:.6rem;padding:.5rem .7rem}
  .founder .body{font-size:1.1rem;color:rgba(11,18,32,.72);margin-top:1.4rem}

  /* testimonial */
  .quote{border-block:1px solid var(--line);background:rgba(236,227,210,.55);text-align:center}
  .quote blockquote{font-family:"Fraunces",serif;font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.25;margin:1.4rem auto 0;max-width:52rem}

  /* cta */
  .cta-band{position:relative;padding:3rem 0}
  .cta-inner{position:relative;border-radius:1.5rem;background:var(--ink);color:var(--ivory);text-align:center;padding:3rem 1.5rem;overflow:hidden}
  .cta-inner h2{font-size:clamp(2rem,4.5vw,3.4rem);line-height:1.08}
  .cta-inner p{margin:1.2rem auto 0;max-width:34rem;color:rgba(246,241,231,.75)}

  /* footer */
  footer{background:var(--ink);color:var(--ivory);position:relative;overflow:hidden}
  .foot{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2rem;padding:2.6rem 0}
  @media(max-width:820px){.foot{grid-template-columns:1fr 1fr}}
  .foot h4{font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(246,241,231,.7);font-weight:400}
  .foot ul{list-style:none;margin:.9rem 0 0;padding:0;display:flex;flex-direction:column;gap:.5rem;color:rgba(246,241,231,.8);font-size:.9rem}
  .foot a:hover{color:var(--ivory)}
  .foot .lede{max-width:22rem;color:rgba(246,241,231,.7);margin-top:1rem;font-size:.95rem}
  .foot-bottom{border-top:1px solid rgba(255,255,255,.1);padding:1.2rem 0;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;color:rgba(246,241,231,.6);font-size:.82rem}

  .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
  .reveal.vis{opacity:1;transform:none}
  @media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}.marquee-track{animation:none}}

/* ============ conversion components (new, brand tokens only) ============ */
.pillars{margin-top:2rem;display:grid;gap:1.4rem;grid-template-columns:1fr 1fr}
@media(max-width:900px){.pillars{grid-template-columns:1fr}}
.pillar{border:1px solid var(--line);background:#fff;border-radius:1rem;padding:2rem;
  display:flex;flex-direction:column;transition:box-shadow .3s,border-color .3s}
.pillar:hover{border-color:rgba(201,162,76,.6);box-shadow:0 24px 60px -34px rgba(11,18,32,.4)}
.pillar .tag{font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--brass)}
.pillar h3{font-size:1.8rem;margin-top:.5rem}
.pillar .who{font-size:.8rem;color:var(--muted);margin-top:.5rem;
  font-family:"JetBrains Mono",monospace;letter-spacing:.02em}
.pillar ul{margin:1.2rem 0 0;padding:0;list-style:none}
.pillar li{display:flex;gap:.7rem;padding:.45rem 0;font-size:.92rem;
  border-top:1px solid rgba(11,18,32,.06)}
.pillar li:first-child{border-top:0}
.pillar li::before{content:"";margin-top:.55rem;width:6px;height:6px;border-radius:999px;
  background:var(--brass);flex:none}
.pillar .foot{margin-top:auto;padding-top:1.4rem}

/* booking */
.book-wrap{border:1px solid var(--line);background:#fff;border-radius:1rem;overflow:hidden;margin-top:1.8rem}
.book-head{padding:1.4rem 1.6rem;border-bottom:1px solid var(--line);background:rgba(236,227,210,.4)}
.book-head h3{font-size:1.3rem}
.book-head p{margin:.4rem 0 0;font-size:.88rem;color:var(--muted)}
#cal-embed{min-height:640px}
.book-fallback{padding:1.6rem;font-size:.9rem;color:var(--muted)}

/* forms */
.form-card{border:1px solid var(--line);background:#fff;border-radius:1rem;padding:1.35rem 1.4rem;max-width:34rem}
.form-card h3{font-size:1.15rem}
.form-card p.sub{margin:.35rem 0 .2rem;font-size:.82rem;color:var(--muted)}
.field{display:block;margin-top:.9rem}
.field span{display:block;font-family:"Inter Tight",system-ui,sans-serif;font-size:.78rem;
  font-weight:600;letter-spacing:0;color:var(--ink);margin-bottom:.2rem}
.field input,.field textarea{width:100%;border:1px solid var(--line);border-radius:.6rem;
  padding:.7rem .85rem;font-family:"Inter Tight",system-ui,sans-serif;font-size:.95rem;
  background:var(--ivory);color:var(--ink)}
.field input:focus,.field textarea:focus{outline:2px solid rgba(201,162,76,.55);border-color:var(--brass)}
.field textarea{min-height:96px;resize:vertical}
.form-note{margin-top:.9rem;font-size:.72rem;color:var(--muted)}
.ok{display:none;margin-top:1rem;padding:.8rem 1rem;border-radius:.6rem;
  background:rgba(61,220,151,.12);border:1px solid var(--signal);
  font-family:"JetBrains Mono",monospace;font-size:.78rem;color:var(--ink)}
.ok.show{display:block}

/* newsletter */
.news{display:flex;gap:.6rem;margin-top:1rem;flex-wrap:wrap}
.news input{flex:1 1 15rem;border:1px solid var(--line);border-radius:999px;
  padding:.7rem 1.1rem;background:var(--ivory);font-family:"Inter Tight",sans-serif}
.dark .news input{background:rgba(246,241,231,.08);border-color:rgba(246,241,231,.2);color:var(--ivory)}

/* whatsapp float */
.wa{position:fixed;right:1rem;bottom:1rem;z-index:80;display:inline-flex;align-items:center;
  gap:.55rem;background:var(--ink);color:var(--ivory);border-radius:999px;
  padding:.8rem 1.15rem;font-size:.85rem;font-weight:500;
  box-shadow:0 18px 40px -18px rgba(11,18,32,.7)}
.wa:hover{background:var(--ink-2)}
.wa svg{width:18px;height:18px;flex:none}
@media(min-width:900px){.wa{right:1.5rem;bottom:1.5rem}}

/* mono data table */
.dtable{width:100%;border-collapse:collapse;margin-top:1.4rem;font-size:.9rem}
.dtable th,.dtable td{text-align:left;padding:.85rem .9rem;border-bottom:1px solid var(--line);
  vertical-align:top}
.dtable thead th{font-family:"JetBrains Mono",monospace;font-size:.7rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);border-bottom:1px solid rgba(11,18,32,.2)}
.dtable td.num,.dtable td .num{font-family:"JetBrains Mono",monospace;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.dtable tbody tr:hover{background:rgba(236,227,210,.35)}
.was{color:var(--muted);font-size:.76rem;display:block;margin-top:.2rem}

/* spec callout */
.spec{border:1px solid var(--line);background:#fff;border-radius:1rem;padding:1.5rem;margin-top:1.2rem}
.spec h4{font-size:1.1rem}
.spec p{margin:.5rem 0 0;font-size:.92rem;color:var(--muted)}
.spec code{font-family:"JetBrains Mono",monospace;font-size:.84rem;background:rgba(11,18,32,.05);
  padding:.12rem .35rem;border-radius:.25rem;color:var(--ink)}
.codes{margin-top:.7rem;font-family:"JetBrains Mono",monospace;font-size:.82rem}
.codes .bad{color:var(--muted);text-decoration:line-through}
.codes .good{color:var(--ink);font-weight:500}

/* breadcrumb + article list */
.crumb{font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);padding-top:1.6rem}
.crumb a{color:var(--muted)}.crumb a:hover{color:var(--ink)}
.empty{border:1px dashed var(--line);border-radius:1rem;padding:2.5rem;text-align:center;
  color:var(--muted);margin-top:2rem}
.legal h2{font-size:1.5rem;margin-top:2rem}
.legal p,.legal li{font-size:.95rem;color:rgba(11,18,32,.78);margin-top:.7rem}
.legal ul{padding-left:1.1rem}

/* --- quiet luxury: tinted band, accordion FAQ, editorial tables --- */
.tint{background:linear-gradient(180deg,#faf7f1 0%,#f6f1e7 100%)}
.tint + .tint{background:#faf7f1}
details.faq{border-top:1px solid var(--line);padding:0}
details.faq:last-of-type{border-bottom:1px solid var(--line)}
details.faq > summary{list-style:none;cursor:pointer;padding:1.15rem 2.2rem 1.15rem 0;
  position:relative;font-weight:600;font-size:1.02rem;color:var(--ink)}
details.faq > summary::-webkit-details-marker{display:none}
details.faq > summary::after{content:"+";position:absolute;right:.2rem;top:1rem;
  font-size:1.35rem;line-height:1;color:var(--brass);font-weight:400}
details.faq[open] > summary::after{content:"3"}
details.faq > summary:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
details.faq > p{margin:0 0 1.35rem;color:var(--muted);font-size:.97rem;max-width:60ch}
.crumb{font-size:.82rem;color:var(--muted);padding:1.1rem 0 0}
.crumb + section{padding-top:1.5rem}
.crumb a{color:var(--muted)}

@media(max-width:900px){.book-grid{grid-template-columns:1fr !important}
  footer .foot-grid{grid-template-columns:1fr 1fr !important}}
@media(max-width:600px){footer .foot-grid{grid-template-columns:1fr !important}}

.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ink);color:var(--ivory);
  padding:.7rem 1.2rem;border-radius:0 0 .5rem 0}
.skip:focus{left:0}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:2px solid var(--brass);outline-offset:2px}

.logo{display:inline-flex;align-items:center;gap:.55rem;line-height:1}
.logo .mark{display:inline-flex;align-items:center;justify-content:center;
  width:1.6rem;height:1.6rem;border-radius:.42rem;flex:none;box-sizing:border-box}
.logo .mkstar{width:82%;height:82%;display:block}
.nav-inner{align-items:center}

/* ============================================================
   QUIET LUXURY LAYER
   Editorial scale for mature readers. Everything here is neutralised
   inside .auto-world and .u2 so the approved Automation page is untouched.
   ============================================================ */
body{font-size:18px;line-height:1.65;letter-spacing:.005em}
p{max-width:68ch}
h1,h2,h3{letter-spacing:-.015em}
h1{line-height:1.08}
h2{line-height:1.14}
section{padding-block:clamp(2.6rem,3.6vw,4rem)}
section + section{padding-top:0}                 /* no doubled gap between stacked bands */
.dark + section,section + .dark{padding-top:clamp(2.6rem,3.6vw,4rem)}
.wrap{max-width:1240px}
.eyebrow{font-size:.72rem;letter-spacing:.22em;color:#8a6d2f}
.sub,.form-note{font-size:1rem}
/* editorial rules instead of boxes everywhere */
.rule{display:block;width:56px;height:2px;background:var(--brass);margin-top:1.4rem}
.cluster,.form-card,.book-wrap,.spec{border-radius:.5rem}
.cluster{padding:1.9rem 1.8rem}
.cards{gap:1.6rem}
/* links a 60 year old can see */
main a:not(.btn):not(.logo):not(.cbtn){text-underline-offset:3px}
.btn{font-size:1rem;padding:.78rem 1.5rem;min-height:46px}
/* generous, legible tables */
.dtable th,.dtable td{padding:1rem .95rem;font-size:1rem}
@media(max-width:900px){body{font-size:17px}}
@media(max-width:560px){body{font-size:16.5px}section{padding-block:2.2rem}}

/* ==================== MOBILE ==================== */
/* desktop: the bar CTA is the one in the link row */
.nav-cta{display:none}
.navtog{display:none}
.nav-links .nav-inline-cta{margin-left:.4rem}

@media(max-width:980px){
  .nav-inner{gap:.7rem}
  .nav-cta{display:inline-flex;order:2;padding:.5rem .95rem;min-height:40px;font-size:.85rem}
  .nav-cta .cta-long{display:none}
  .navtog{display:inline-flex;order:3;flex-direction:column;justify-content:center;gap:4px;
    width:44px;height:44px;padding:0 10px;border:1px solid var(--line);border-radius:.4rem;
    background:transparent;cursor:pointer;flex:none}
  .navtog span{display:block;height:2px;background:var(--ink);border-radius:1px;
    transition:transform .25s,opacity .25s}
  .nav.open .navtog span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  .nav.open .navtog span:nth-child(2){opacity:0}
  .nav.open .navtog span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
  .navtog:focus-visible{outline:2px solid var(--brass);outline-offset:2px}

  /* the links become a full width panel under the bar */
  .nav-links{position:absolute;left:0;right:0;top:100%;order:4;
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--ivory);border-bottom:1px solid var(--line);
    box-shadow:0 18px 40px -26px rgba(11,18,32,.6);
    max-height:0;overflow:hidden;visibility:hidden;
    transition:max-height .3s ease,visibility .3s}
  .nav.open .nav-links{max-height:80svh;overflow:auto;visibility:visible}
  .nav-links a{padding:1rem 1.5rem;border-bottom:1px solid var(--line);font-size:1.02rem;
    min-height:52px;display:flex;align-items:center}
  .nav-links a[aria-current="page"]{color:var(--ink);font-weight:600;
    box-shadow:inset 3px 0 0 var(--brass)}
  .nav-links .nav-inline-cta{display:none}
  .nav-inner{position:relative;flex-wrap:wrap}
  .logo{order:1;margin-right:auto}
}
@media(max-width:420px){
  .logo{font-size:1rem}
  .nav-cta{padding:.45rem .8rem;font-size:.8rem}
}

/* the four stat figures stack rather than squeeze on a phone */
@media(max-width:560px){
  .stats-strip{grid-template-columns:1fr 1fr!important;gap:1.1rem}
  .stats-strip .num.big{font-size:1.9rem}
}
@media(max-width:400px){.stats-strip{grid-template-columns:1fr!important}}

/* form fields stack on a phone. The rows carry inline styles, so these
   need !important to reach them. */
@media(max-width:560px){
  .frow{display:block!important}
  .frow > label{width:100%!important}
  .notepad input,.notepad textarea{font-size:20px!important}
  .lead-form input,.lead-form select,.lead-form textarea{font-size:16px}
}
/* 16px minimum stops iOS zooming the page when a field is focused */
input,select,textarea{font-size:16px}

/* long buttons may wrap on small screens rather than overflow */
@media(max-width:520px){
  .btn{white-space:normal;text-align:center}
  .cta-row{display:flex;flex-direction:column;align-items:stretch;gap:.6rem}
  .cta-row .btn{width:100%}
}
/* any wide table scrolls inside itself instead of stretching the page */
@media(max-width:760px){
  .dtable{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}
  .dtable td,.dtable th{white-space:normal;min-width:9rem}
}
/* media never exceeds its box */
img,svg,video,canvas{max-width:100%}

/* nothing may push the document wider than the viewport */
html,body{max-width:100%;overflow-x:clip}

/* ---------- motion: restrained, once, and never on the Automation page ---------- */
.reveal{opacity:0;transform:translateY(16px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);
  transition-delay:var(--rd,0ms);will-change:opacity,transform}
.reveal.in{opacity:1;transform:none}
.reveal-img{clip-path:inset(0 0 12% 0);opacity:0;
  transition:clip-path 1s cubic-bezier(.22,.61,.36,1),opacity .8s ease;transition-delay:var(--rd,0ms)}
.reveal-img.in{clip-path:inset(0 0 0 0);opacity:1}
.fig img{transition:transform 1.1s cubic-bezier(.22,.61,.36,1)}
.fig-split:hover .fig img,.fig-band:hover img{transform:scale(1.018)}
.rule.ranim{transform-origin:left;transform:scaleX(0);
  transition:transform .8s cubic-bezier(.22,.61,.36,1) .12s}
.reveal.in .rule.ranim,.rule.ranim.in{transform:scaleX(1)}
.btn{transition:transform .22s ease,background .22s ease,border-color .22s ease,box-shadow .22s ease}
.btn:hover{transform:translateY(-2px)}
.cluster{transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.cluster:hover{transform:translateY(-3px)}
.nav{transition:box-shadow .3s ease,background .3s ease}
.nav.stuck{box-shadow:0 1px 0 rgba(11,18,32,.09),0 8px 26px -18px rgba(11,18,32,.5)}
@media(prefers-reduced-motion:reduce){
  .reveal,.reveal-img,.rule,
  .w,.rise{opacity:1!important;transform:none!important;
    clip-path:none!important;transition:none!important}
  .btn:hover,.cluster:hover,.fig-split:hover .fig img{transform:none}
}
/* headings rise word by word */
.w{display:inline-block;opacity:0;transform:translateY(.5em) rotate(.4deg);
  transition:opacity .5s ease,transform .55s cubic-bezier(.22,.61,.36,1);
  transition-delay:calc(var(--i,0)*38ms)}
.in .w,.w.in{opacity:1;transform:none}
/* paragraphs, list rows and table rows stagger in */
.rise{opacity:0;transform:translateY(12px);
  transition:opacity .55s ease,transform .55s cubic-bezier(.22,.61,.36,1);
  transition-delay:calc(var(--i,0)*55ms)}
.rise.in,.in .rise{opacity:1;transform:none}
/* long prose gets a lead paragraph so it is not one grey slab */
section > .wrap > p:first-of-type,.fig-split-txt > div > p:first-of-type{
  font-size:1.06em;color:var(--ink)}
section > .wrap > h2 + .rule + p{margin-top:1.15rem}
.dtable tbody tr{opacity:0;transform:translateY(8px);
  transition:opacity .45s ease,transform .45s ease;transition-delay:calc(var(--i,0)*45ms)}
.dtable.in tbody tr{opacity:1;transform:none}
.num.big{font-variant-numeric:tabular-nums}
/* the automation page runs its own motion system; keep ours out of it */
.auto-world .reveal,.u2 .reveal{opacity:1;transform:none}

/* ---------- ruled editorial lists. No boxes, no cards, no tiles. ---------- */
.ledger{margin-top:2rem;border-top:1px solid var(--line)}
.lrow{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:1.2rem 2.4rem;
  padding:1.15rem 0;border-bottom:1px solid var(--line);align-items:baseline;
  transition:background .3s ease}
.lrow:hover{background:rgba(201,162,39,.045)}
.lname{font-weight:600;font-size:1.02rem;color:var(--ink)}
.ldesc{color:var(--muted);font-size:.97rem;max-width:60ch;margin:0}
.lmore{margin-top:1.5rem;font-size:.93rem}
.lmore a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){.lrow{grid-template-columns:1fr;gap:.35rem;padding:1rem 0}}

.numbered{margin-top:2rem;border-top:1px solid var(--line)}
.nrow{display:grid;grid-template-columns:3.2rem minmax(0,1fr);gap:1.6rem;
  padding:1.5rem 0;border-bottom:1px solid var(--line);transition:background .3s ease}
.nrow:hover{background:rgba(201,162,39,.045)}
.nno{color:var(--brass);font-size:1rem;padding-top:.15rem}
.nrow h3{font-size:1.12rem;margin:0 0 .4rem;font-weight:600}
.nrow p{margin:0;color:var(--muted);font-size:.97rem;max-width:70ch}
@media(max-width:640px){.nrow{grid-template-columns:2.4rem 1fr;gap:1rem;padding:1.2rem 0}}

/* editorial imagery: quiet, cropped, never a rounded card */
.fig{margin:0}
.fig img{display:block;width:100%;height:auto;object-fit:cover;border-radius:.4rem;
  background:#e9e2d6}
.fig figcaption{margin-top:.7rem;font-size:.78rem;letter-spacing:.02em;color:var(--muted)}
.fig-band{margin:0}
.fig-band img{border-radius:0;display:block;width:100%;object-fit:cover}
/* a full width image on its own says nothing. Give it something to say. */
.fig-quote{position:relative;margin:0;isolation:isolate}
.fig-quote img{border-radius:0;display:block;width:100%;object-fit:cover;
  aspect-ratio:24/9}
.fig-quote::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(11,18,32,.86) 0%,rgba(11,18,32,.62) 46%,rgba(11,18,32,.12) 100%)}
.fig-quote .fq{position:absolute;inset:0;z-index:2;display:flex;align-items:center}
.fig-quote .fq-in{max-width:1240px;margin-inline:auto;padding-inline:clamp(1.1rem,4vw,2rem);width:100%}
.fig-quote .fq p{max-width:26ch;color:var(--ivory);font-family:"Fraunces",serif;
  font-size:clamp(1.25rem,2.5vw,2rem);line-height:1.24;margin:0}
.fig-quote .fq span{display:block;margin-top:.9rem;font-family:"JetBrains Mono",monospace;
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
@media(max-width:700px){.fig-quote img{aspect-ratio:4/3}
  .fig-quote::after{background:linear-gradient(180deg,rgba(11,18,32,.5) 0%,rgba(11,18,32,.88) 70%)}
  .fig-quote .fq{align-items:flex-end;padding-bottom:1.6rem}
  .fig-quote .fq p{max-width:none}}
.fig-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,3vw,3rem);
  align-items:center;margin-top:1.8rem}
.fig-split.rev .fig-split-txt{order:2}      /* image on the left, copy on the right */
.fig-split.rev .fig{order:1}
.fig-split .fig img{aspect-ratio:4/3}
@media(max-width:820px){.fig-split{grid-template-columns:1fr;gap:1.6rem}}
.fig-rule{margin:0;overflow:hidden}
.fig-rule img{border-radius:0;display:block;width:100%;aspect-ratio:32/9;object-fit:cover}

/* strategy CTA: keep the kicker on one line, balance the headline */
/* flex centring so nothing can drift, and never wider than the column */
.strat .wrap{display:flex;flex-direction:column;align-items:center;text-align:center}
.strat .wrap>*{max-width:100%}
.strat-kick{letter-spacing:.16em;text-wrap:balance;margin-inline:auto}
.strat-h{text-wrap:balance;line-height:1.16;margin-inline:auto}
@media(max-width:820px){.strat-kick{font-size:.66rem;letter-spacing:.14em;max-width:30rem}}
@media(max-width:620px){.strat-h br{display:none}}

/* --- the Automation page keeps its own system, untouched ---
   NOTE: do NOT use `revert` here. `revert` falls back to the browser default,
   not to the Automation page's own stylesheet, and these selectors outrank it.
   Using it collapsed every .asec padding to zero. Only explicit values, and
   only where a global rule actually reaches the page. */
.auto-world,.u2{font-size:16px;line-height:1.5;letter-spacing:normal}
.auto-world p,.u2 p{max-width:none}

/* balanced contact section: top aligned, content driven height */
.contact-grid{display:grid;grid-template-columns:minmax(0,0.68fr) minmax(0,1fr);
  gap:clamp(1.6rem,3vw,3rem);align-items:stretch;margin-top:2.4rem}
.contact-grid>*{align-self:stretch;min-width:0;display:flex;flex-direction:column}
/* the form card fills its column so both sides finish on the same line */
.contact-grid .dispatch{flex:1;display:flex;flex-direction:column}
.contact-grid .dispatch > .notepad{flex:1;display:flex;flex-direction:column}
.contact-grid .dispatch > .notepad > form{flex:1;display:flex;flex-direction:column}
/* the closing note settles at the foot of the sheet rather than leaving a gap */
.contact-grid .dispatch > .notepad > form > :last-child{margin-top:auto}
/* both columns must begin on exactly the same line. Nothing inside either cell
   may contribute a top margin, or one column sits lower than the other. */
.contact-grid > * > :first-child{margin-top:0}
.contact-grid .dispatch{margin-top:0}
.contact-grid .book-wrap{margin-top:0}
.contact-grid .notepad{margin-top:0}
/* the form is a bordered card; its inner padding would otherwise drop its first
   line below the bare text opposite. Pull the text column down to match. */
.contact-grid > *:first-child{padding-top:1.25rem}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr}
  .contact-grid > *:first-child{padding-top:0}}
.wa{transition:opacity .25s,transform .25s}
.wa.tuck{opacity:0;transform:translateY(120%);pointer-events:none}
@media(max-width:700px){.wa{padding:.6rem .85rem;font-size:.78rem}}
form.lead-form{scroll-margin-bottom:6rem}
.logo{display:inline-flex;align-items:center;gap:.55rem;line-height:1}
.logo .mark{display:inline-flex;align-items:center;justify-content:center;
  width:1.6rem;height:1.6rem;border-radius:.42rem;flex:none;box-sizing:border-box}
.logo .mkstar{width:82%;height:82%;display:block}
.nav-inner{align-items:center}

/* the closing conversation */
.strat{background:linear-gradient(178deg,var(--ink) 0%,#0e1729 100%);color:var(--ivory);
  padding:clamp(3.2rem,5vw,4.6rem) 0 clamp(3.4rem,5vw,5rem);position:relative}
.strat h2{font-family:"Fraunces",serif;color:var(--ivory)}
.strat .btn{margin:.4rem}
.strat-ghost{border:1px solid rgba(246,241,231,.35);color:var(--ivory)}
.strat-ghost:hover{border-color:var(--brass)}
.strat .btn:focus-visible{outline:2px solid var(--brass);outline-offset:3px}

/* polish: buttons never wrap into blobs */
.btn{white-space:nowrap}
@media(max-width:480px){.btn{white-space:normal;border-radius:14px}}

/* automation hero: the spiral, in brand colours */
.auto-hero{position:relative;overflow:hidden;padding:4.5rem 0 3.5rem;
  background:
    radial-gradient(60rem 30rem at 78% 40%, rgba(201,162,76,.16), transparent 60%),
    radial-gradient(40rem 24rem at 20% 90%, rgba(61,220,151,.07), transparent 65%),
    linear-gradient(160deg, #101a2e 0%, var(--ink) 55%, #0d1526 100%)}
.auto-hero #fx{position:absolute;inset:0;width:100%;height:100%;display:block}
.auto-hero-inner{position:relative;z-index:1}
.auto-hero .rule{background:var(--brass)}

/* the universe: three acts, one sky */
.uni{position:relative;height:340svh;
  background:radial-gradient(60rem 30rem at 50% 12%, rgba(201,162,76,.08), transparent 60%),
  linear-gradient(178deg,#0a1122 0%,#070d1a 45%,var(--ink) 100%)}
.ustick{position:sticky;top:0;height:100svh;overflow:hidden}
#gl{position:absolute;inset:0;width:100%;height:100%;display:block}
.act{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;
  align-items:flex-start;justify-content:center;text-align:start;
  padding:0 6vw 8svh clamp(1.5rem,7vw,6rem);pointer-events:none;visibility:hidden;
  will-change:opacity,transform}
#act0{justify-content:flex-start;padding-top:11svh}
#act2{align-items:center;text-align:center;justify-content:center;padding-inline:6vw}
.act h1,.act h2{font-family:"Fraunces",serif;color:var(--ivory);
  font-size:clamp(1.9rem,4.6vw,3.4rem);line-height:1.12;font-weight:600}
.act em{font-style:italic;color:var(--brass)}
.act .asub{margin-top:1.1rem;max-width:27rem;color:rgba(246,241,231,.72);font-size:1rem}
.act .hint{margin-top:2.2rem;font-size:.7rem;letter-spacing:.18em;color:var(--brass);opacity:.8}
.act .btn{pointer-events:auto}
.bignum{font-size:clamp(4rem,10vw,7rem);color:var(--brass);line-height:1;
  text-shadow:0 0 40px rgba(201,162,76,.45)}
.btn-ghost-dark{border:1px solid rgba(246,241,231,.3);color:var(--ivory);margin-inline-start:.8rem}
#act2 .asub,#act2 h2{pointer-events:none}
@media(max-width:700px){.uni{height:300svh}.act{padding-top:10svh}}
.act.on{visibility:visible;opacity:1}
.mkstar{display:block;margin:auto}
/* graceful world without WebGL: acts stack as styled dark panels on a CSS starfield */
.uni.noweb{height:auto}
.uni.noweb .ustick{position:static;height:auto;overflow:visible}
.uni.noweb #gl{display:none}
.uni.noweb .act{position:static;visibility:visible;opacity:1;transform:none;
  padding:5rem 6vw;pointer-events:auto}
.uni.noweb{background-image:
  radial-gradient(1px 1px at 12% 22%, rgba(246,241,231,.7), transparent),
  radial-gradient(1px 1px at 78% 12%, rgba(201,162,76,.8), transparent),
  radial-gradient(1.5px 1.5px at 55% 45%, rgba(246,241,231,.5), transparent),
  radial-gradient(1px 1px at 30% 70%, rgba(201,162,76,.6), transparent),
  radial-gradient(1px 1px at 88% 60%, rgba(246,241,231,.6), transparent),
  radial-gradient(1.5px 1.5px at 45% 88%, rgba(201,162,76,.5), transparent),
  linear-gradient(178deg,#0a1122 0%,#070d1a 45%,var(--ink) 100%)}

/* the automation field */
.field{min-height:min(92svh,860px);display:block}
.field .chips{position:absolute;inset:0}
.chip{position:absolute;left:0;top:0;display:inline-flex;align-items:center;gap:.5rem;
  background:rgba(11,18,32,.55);border:1px solid rgba(201,162,76,.45);color:var(--ivory);
  border-radius:999px;padding:.45rem 1rem;font-size:.8rem;font-family:"Inter Tight",sans-serif;
  cursor:pointer;white-space:nowrap;backdrop-filter:blur(4px);will-change:transform;
  transition:border-color .2s,background .2s}
.chip:hover,.chip.sel{border-color:var(--brass);background:rgba(201,162,76,.18)}
.chip .cdot{width:6px;height:6px;border-radius:50%;background:var(--brass);flex:none}
.field-head{position:relative;z-index:30;padding-top:3.5rem;pointer-events:none}
.field-head .hint{margin-top:1.4rem;font-size:.7rem;letter-spacing:.15em;color:var(--brass);opacity:.8}
.apanel{position:absolute;right:clamp(1rem,4vw,3rem);top:50%;transform:translateY(-50%) translateX(12px);
  width:min(420px,88vw);background:rgba(16,26,46,.94);border:1px solid rgba(201,162,76,.45);
  border-radius:1rem;padding:1.6rem;backdrop-filter:blur(12px);z-index:40;
  opacity:0;visibility:hidden;transition:opacity .25s,transform .25s,visibility .25s;
  box-shadow:0 30px 80px -30px rgba(0,0,0,.8)}
.apanel.show{opacity:1;visibility:visible;transform:translateY(-50%) translateX(0)}
.ap-x{position:absolute;top:.7rem;right:.9rem;background:none;border:0;color:var(--ivory);
  font-size:1.4rem;cursor:pointer;opacity:.7}
.ap-x:hover{opacity:1}
.rep{font-size:.82rem;color:var(--brass);font-style:italic}
.stk{font-size:.72rem;color:rgba(246,241,231,.55);margin-top:.9rem;letter-spacing:.04em}
.term .rep{color:#8a6d2f;margin-top:.3rem}
.term .stk{color:var(--muted)}
.ap-nav{display:flex;gap:1rem;margin-top:1.2rem}
.ap-nav button{background:none;border:1px solid rgba(246,241,231,.25);color:var(--ivory);
  border-radius:999px;padding:.4rem 1rem;font-size:.78rem;cursor:pointer}
.ap-nav button:hover{border-color:var(--brass)}
@media(max-width:700px){
  .field{min-height:100svh}
  .chip{font-size:.68rem;padding:.35rem .7rem}
  .apanel{top:auto;bottom:1rem;transform:translateY(12px)}
  .apanel.show{transform:translateY(0)}}

/* stat strip on dark bands */
.stats-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;
  border-top:1px solid rgba(246,241,231,.15);padding:1.8rem 0 2.4rem}
.stats-strip>div{display:flex;flex-direction:column;gap:.3rem}
.stats-strip .num.big{font-size:2.1rem;color:var(--brass);font-family:"JetBrains Mono",monospace}
.stats-strip span:last-child{font-size:.85rem;color:rgba(246,241,231,.65)}
@media(max-width:700px){.stats-strip{grid-template-columns:1fr 1fr}}

/* ornamental separator */
.orn{text-align:center;color:var(--brass);letter-spacing:1.2em;margin:3rem 0;font-size:.8rem}

/* glossary terms: brass spine, two columns */
.term-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-top:.5rem}
.term{border-inline-start:3px solid var(--brass);padding:.2rem 0 .2rem 1.1rem}
.term h3{font-family:"Fraunces",serif}
@media(max-width:800px){.term-grid{grid-template-columns:1fr}}

/* faq rows with mono numerals */
.faq-item{display:grid;grid-template-columns:3rem 1fr;gap:1rem;padding:1.3rem 0;
  border-bottom:1px solid var(--line)}
.faq-item .qnum{color:var(--brass);font-size:1.05rem;padding-top:.2rem}

/* day-only booking form: two columns inside the card, padded like everything else */
.lead-form input[type=date]{font-family:"JetBrains Mono",monospace}

/* ============ /book : the notepad, and its dispatch ============ */
.dispatch{position:relative;margin-top:1.8rem;perspective:1400px}
.notepad{margin-top:0!important;border:1px solid #ddd3bd!important;border-radius:.5rem!important;
  background:
    radial-gradient(120% 80% at 50% 0%,#fffefa 0%,#fdfaf2 55%,#faf5e9 100%)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 40px -28px rgba(11,18,32,.5);
  transform-origin:50% 18%}
/* one quiet margin rule, well clear of the writing. No horizontal ruling. */
.notepad::before{content:"";position:absolute;top:0;bottom:0;left:2.4rem;width:1px;
  background:rgba(168,68,60,.16);pointer-events:none;z-index:1}
.book-wrap.notepad .book-head{background:transparent!important;
  border-bottom:1px dashed #ddd3bd!important;padding-left:3.4rem!important}
.notepad .book-head h3{font-family:"Caveat",cursive;font-size:1.9rem;font-weight:600;
  letter-spacing:.01em;color:#16202f}
.book-wrap.notepad form{padding-left:3.4rem!important}
.notepad form{position:relative;z-index:2}
.notepad h3{font-family:"Caveat",cursive;font-size:1.75rem;font-weight:600;color:#16202f}
/* ruled paper wants underlines, not boxes */
/* labels stay in the legible sans; the writing itself is a hand */
.notepad input,.notepad textarea{border:0!important;border-bottom:1px solid #cdc0a4!important;
  border-radius:0!important;background:transparent!important;padding-left:2px!important;
  font-family:"Caveat",cursive!important;font-size:22px!important;line-height:1.25!important;
  color:#1d2a3d!important;transition:border-color .2s,box-shadow .2s}
.notepad input{height:40px!important}
.notepad textarea{height:66px!important}
/* everything inside the form is the same hand. Sizes are lifted well above the
   sans equivalents so a 20px script stays as readable as 13px Inter. */
.notepad select{font-family:"Caveat",cursive!important;font-size:20px!important;
  height:40px!important;color:#1d2a3d!important}
.notepad button[type=submit],.notepad .btn{font-family:"Caveat",cursive!important;
  font-size:21px!important;letter-spacing:.01em}
.notepad label span,.notepad .ok,.notepad p,.notepad a{font-family:"Caveat",cursive}
.notepad .ok{font-size:18px!important}
.notepad label span{font-size:17px!important;letter-spacing:0!important;text-transform:none}
.notepad a{text-decoration:underline;text-underline-offset:2px}
.book-wrap.notepad .book-head p{font-family:"Caveat",cursive;font-size:19px;line-height:1.35}
.receipt-card h3,.receipt-card p{font-family:"Caveat",cursive}
.receipt-card h3{font-size:1.7rem}
.receipt-card p{font-size:1.15rem;color:rgba(11,18,32,.62)}
@media(max-width:560px){
  .notepad label span{font-size:18px!important}
  .notepad select{font-size:21px!important}
}

.notepad input::placeholder,.notepad textarea::placeholder{
  font-family:"Caveat",cursive;font-size:20px;color:rgba(11,18,32,.32)}
.notepad input[type=date]{font-family:"Caveat",cursive!important;font-size:20px!important}
.notepad input:focus,.notepad textarea:focus{outline:0;border-bottom-color:var(--brass)!important;
  box-shadow:0 1px 0 var(--brass)}
.notepad .ok{font-size:.86rem}
.notepad .book-head p{font-size:.9rem}

/* envelope, drawn in CSS, hidden until dispatch */
.envelope{position:absolute;left:50%;top:46%;width:min(340px,74%);aspect-ratio:1.62;
  translate:-50% -50%;opacity:0;pointer-events:none;z-index:3}
.env-back,.env-body,.env-flap{position:absolute;inset:0;border-radius:.35rem}
.env-back{background:#efe6d3;box-shadow:0 26px 50px -26px rgba(11,18,32,.6)}
.env-body{background:linear-gradient(170deg,#f6efdf,#e9dec6);
  clip-path:polygon(0 22%,50% 62%,100% 22%,100% 100%,0 100%)}
.env-flap{background:linear-gradient(180deg,#f9f3e6,#eee3cd);transform-origin:top center;
  clip-path:polygon(0 0,100% 0,50% 62%);transform:rotateX(180deg)}
.env-seal{position:absolute;left:50%;top:56%;translate:-50% -50%;width:34px;height:34px;
  border-radius:50%;background:var(--brass);color:#0B1220;display:grid;place-items:center;
  font-size:15px;opacity:0;scale:.4}

/* the receipt that replaces the pad */
.receipt{position:absolute;inset:0;display:grid;place-items:center;opacity:0;
  pointer-events:none;z-index:4}
.receipt-card{background:#fffdf7;border:1px solid #d9cfb8;border-radius:.5rem;
  padding:2.2rem 2rem;max-width:30rem;text-align:center;position:relative;
  box-shadow:0 20px 46px -30px rgba(11,18,32,.55)}
.receipt-card h3{font-family:"Fraunces",serif;font-size:1.35rem;margin:.9rem 0 .5rem}
.receipt-card p{font-size:.92rem;color:var(--muted);margin:0 auto;max-width:34ch}
.receipt-meta{margin-top:1.1rem!important;font-size:.7rem!important;letter-spacing:.1em;
  text-transform:uppercase;color:rgba(11,18,32,.45)!important}
.stamp{display:inline-block;border:2px solid rgba(168,68,60,.55);color:rgba(168,68,60,.75);
  font-family:"JetBrains Mono",monospace;font-size:.72rem;letter-spacing:.22em;
  padding:.32rem .7rem;border-radius:.2rem;rotate:-7deg}

/* ---- the sequence ---- */
.dispatch.sending .notepad{animation:fold .62s cubic-bezier(.7,0,.3,1) forwards}
.dispatch.sending .env-flap{animation:seal .3s cubic-bezier(.6,0,.3,1) .72s forwards}
.dispatch.sending .env-seal{animation:sealPop .26s cubic-bezier(.34,1.56,.64,1) .98s forwards}
.dispatch.sending .envelope{animation:envIn .3s ease .44s forwards, flyOff .62s cubic-bezier(.55,0,.85,.3) 1.16s forwards}
.dispatch.sent .receipt{opacity:1;pointer-events:auto;transition:opacity .5s ease}
.dispatch.sent .notepad,.dispatch.sent .envelope{visibility:hidden}
@keyframes fold{
  35% {transform:scaleY(.62) translateY(6%);filter:brightness(.99)}
  70% {transform:scaleY(.34) translateY(12%) scaleX(.9)}
  100%{transform:scaleY(.16) translateY(16%) scaleX(.78);opacity:0}
}
@keyframes envIn{from{opacity:0;scale:.9}to{opacity:1;scale:1}}
@keyframes seal{to{transform:rotateX(0deg)}}
@keyframes sealPop{to{opacity:1;scale:1}}
@keyframes flyOff{
  to{translate:-50% -1100%;rotate:-14deg;scale:.42;opacity:0}
}
@media(prefers-reduced-motion:reduce){
  .dispatch.sending .notepad,.dispatch.sending .envelope,
  .dispatch.sending .env-flap,.dispatch.sending .env-seal{animation:none}
  .dispatch.sending .notepad{opacity:0;visibility:hidden}
}
@media(max-width:620px){.notepad::before{left:1.5rem}
  .book-wrap.notepad .book-head,.book-wrap.notepad form{padding-left:2.2rem!important}}

/* the cal embed sits inside the design, not on top of it */
#cal-embed{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--ivory)}

/* language link in the nav, matching the other nav links */
.nav-links .nav-lang{font-weight:600;letter-spacing:0}