/* ===================== ASRA v2 — Daylight-style design system =====================
   warm-beige ground · mono eyebrow · Fraunces display serif · Cantarell body · hover-fill btn */
@font-face{font-family:'Fraunces';src:url('../assets/Fraunces.ttf') format('truetype');font-weight:100 900;font-display:swap;}
/* Latin subset of the same variable font as woff2 (126 KB vs 360 KB TTF). Declared after the full TTF so it wins for Latin text; the TTF is only fetched for characters outside this range. */
@font-face{font-family:'Fraunces';src:url('../assets/Fraunces-latin.woff2') format('woff2');font-weight:100 900;font-display:swap;unicode-range:U+0020-007E,U+00A0-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+20B9,U+2122,U+2190-2193,U+2212,U+2605,U+21D2;}

:root{
  /* warm neutrals (biased toward the forest accent, not grey) */
  --beige:#F1EADB;         /* page ground */
  --beige-30:#E9E0CC;      /* card panels */
  --beige-dark:#D9CDB4;    /* hairlines */
  --ink:#1B2620;           /* near-black text */
  --brown:#4C3A28;         /* warm body text on beige */
  --grey-txt:#8A7E6B;      /* muted mono labels */
  --cream:#FBF6EC;         /* light-on-dark text */
  /* accents */
  --forest:#4A7C59; --forest-deep:#2F5540; --mint:#8FC0A9; --sage:#C8D5B9;
  /* type */
  --serif:'Fraunces',Georgia,serif;
  --sans:'Cantarell',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --mono:'SFMono-Regular',ui-monospace,Menlo,Consolas,monospace;
  --ease:cubic-bezier(.16,1,.3,1); --expo:cubic-bezier(.16,1.08,.38,.98);
  --gut:clamp(20px,5vw,80px); --maxw:1320px; --nav-h:76px;
}
*{box-sizing:border-box;} html{-webkit-text-size-adjust:100%;}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--beige);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;}
a{color:inherit;text-decoration:none;} img{max-width:100%;display:block;}
h1,h2,h3,h4,p{margin:0;}
/* jump-to-anchor sections (#services, #book, ...) land clear of the fixed nav pill */
section[id]{scroll-margin-top:calc(var(--nav-h) + 20px);}

/* --- reusable type roles --- */
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey-txt);}
.display{font-family:var(--serif);font-weight:400;line-height:.98;letter-spacing:-.01em;text-wrap:balance;}
.lead{font-size:clamp(15px,1.5vw,20px);line-height:1.6;color:var(--brown);}

/* --- Daylight hover-fill button --- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;
  height:52px;padding:0 26px;border-radius:6px;cursor:pointer;border:none;
  font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;
  background:var(--ink);color:var(--cream);}
.btn>span{position:relative;z-index:2;transition:transform .3s var(--expo),color .3s var(--expo);}
.btn::after{content:"";position:absolute;inset:0;z-index:1;border-radius:6px;background:var(--cream);
  transform:translateY(200%) rotate(15deg) scale(1.8);transform-origin:center;
  transition:transform .9s var(--expo);}
.btn:hover>span{color:var(--ink);transform:translateY(-1px);}
.btn:hover::after{transform:translateY(0) rotate(8deg) scale(1.8);}
.btn.light{background:var(--cream);color:var(--ink);} .btn.light::after{background:var(--ink);} .btn.light:hover>span{color:var(--cream);}
.btn.forest{background:var(--forest);color:var(--cream);} .btn.forest::after{background:var(--cream);} .btn.forest:hover>span{color:var(--forest-deep);}

/* reveal helper */
.rise{opacity:0;transform:translateY(26px);}
@media(prefers-reduced-motion:reduce){.rise{opacity:1;transform:none;}}

/* ---- enquiry form: honeypot + status line ------------------------------- */
/* Off-screen rather than display:none — some bots skip hidden fields. */
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;
  opacity:0!important;pointer-events:none;}
.form-status{grid-column:1/-1;margin:2px 0 0;font-family:var(--sans);font-size:13.5px;
  line-height:1.55;min-height:0;}
.form-status:empty{display:none;}
.form-status.is-ok{color:var(--forest);}
.form-status.is-err{color:#a4452f;}
.form [type="submit"][disabled],.c-form [type="submit"][disabled]{opacity:.62;cursor:wait;}

/* ---- floating WhatsApp + Call buttons — markup injected by js/site.js on every page ---- */
/* Pinned bottom-right. Sits above the nav (z 60) but below the splash (z 80) so the
   intro animation still covers it. */
.fdock{position:fixed;right:clamp(14px,2vw,26px);bottom:clamp(14px,2vw,26px);z-index:70;
  display:flex;flex-direction:column;gap:12px;}
.fdock a{position:relative;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  color:#fff;box-shadow:0 6px 20px rgba(20,26,22,.28);
  transition:transform .28s cubic-bezier(.2,.7,.3,1),box-shadow .28s;
  -webkit-tap-highlight-color:transparent;}
.fdock a:hover{transform:translateY(-3px) scale(1.06);box-shadow:0 10px 26px rgba(20,26,22,.34);}
.fdock a:active{transform:translateY(-1px) scale(1.02);}
.fdock svg{width:26px;height:26px;fill:currentColor;}
.fdock .wa{background:#25D366;}
.fdock .call{background:var(--forest-deep);}
/* the label that slides out on hover — desktop only, pointer devices */
.fdock .lbl{position:absolute;right:calc(100% + 10px);top:50%;transform:translateY(-50%) translateX(6px);
  background:var(--ink);color:var(--cream);font-size:12.5px;font-weight:600;white-space:nowrap;
  padding:7px 12px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;}
@media(hover:hover) and (min-width:821px){
  .fdock a:hover .lbl{opacity:1;transform:translateY(-50%) translateX(0);}
}
@media(max-width:820px){
  .fdock a{width:48px;height:48px;} .fdock svg{width:24px;height:24px;} .fdock .lbl{display:none;}
}
@media(prefers-reduced-motion:reduce){
  .fdock a,.fdock .lbl{transition:none;} .fdock a:hover{transform:none;}
}
