/* ==========================================================================
   Empowerment Supports — Scrapbook design system
   Warm ivory paper, torn edges, washi tape, polaroids and handwriting.
   Brand palette (blush / dusty rose / deep rose) is kept; sage, honey and
   terracotta join as scrapbook accents so pages never read as one flat wash.
   ========================================================================== */

:root{
  /* paper */
  --paper:#FBF7F5;
  --paper-warm:#FFFBF8;
  --card:#FFFFFF;
  --kraft:#EFE1D4;
  --kraft-deep:#E0CDBB;

  /* ink */
  --ink:#332B2A;
  --ink-soft:#5F5654;
  --ink-faint:#635A57;

  /* brand rose */
  --rose:#A85A64;
  --rose-deep:#8E4650;
  --rose-mid:#DDA6AA;
  --rose-pale:#FFD7DA;
  --rose-wash:#FFF4F5;

  /* scrapbook accents */
  --sage:#7E9478;
  --sage-deep:#4F6449;
  --sage-wash:#EDF1EA;
  --honey:#E5B25E;
  --honey-wash:#FBF0DC;
  --terracotta:#C4784F;
  --terracotta-wash:#FBEDE4;

  /* tape */
  --tape-rose:rgba(255,203,209,.62);
  --tape-sage:rgba(150,177,143,.42);
  --tape-honey:rgba(233,192,122,.52);
  --tape-plain:rgba(238,226,214,.72);

  --line:rgba(51,43,42,.16);
  --line-soft:rgba(221,166,170,.55);

  --hand:"Caveat","Bradley Hand","Segoe Script",cursive;
  --display:"Cormorant Garamond",Cormorant,Garamond,"Times New Roman",serif;
  --body:"Nunito Sans","Avenir Next",Avenir,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  --gutter:clamp(20px,5vw,60px);
  --max:1200px;

  --shadow-lift:0 10px 22px -14px rgba(51,43,42,.42), 0 2px 5px -2px rgba(51,43,42,.14);
  --shadow-deep:0 20px 40px -22px rgba(51,43,42,.5), 0 3px 8px -3px rgba(51,43,42,.16);

  --ease:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:clip}

body{
  margin:0;
  background-color:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:1.0625rem;
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

/* paper grain — sits above the background, below the content */
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.5;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E");
}
body>*{position:relative;z-index:1}

img{max-width:100%;display:block}

/* grid children must be allowed to shrink below their min-content,
   or one long word (an email address) widens the whole page */
.contact-grid>*,.areas-layout>*,.how-layout>*,.approach-layout>*,
.how-head>*,.approach-head>*,.grid>*,.values>*,.ledger>*,.hero-grid>*{min-width:0}
h1,h2,h3,p,li,dd,dt{overflow-wrap:break-word}
.detail dd a,.foot-grid a{overflow-wrap:anywhere}
a{color:inherit}
button{font:inherit;color:inherit}

:focus-visible{
  outline:3px solid var(--rose);
  outline-offset:3px;
  border-radius:3px;
}

.wrap{width:min(var(--max),100%);margin-inline:auto;padding-inline:var(--gutter)}

.skip-link{
  position:fixed;left:1rem;top:1rem;z-index:200;
  transform:translateY(-200%);
  padding:.75rem 1.1rem;
  background:var(--card);
  border:2px solid var(--rose);
  border-radius:4px 12px 4px 12px;
  font-weight:800;text-decoration:none;
}
.skip-link:focus{transform:none}

/* ---------------------------------------------------------------- type -- */

.display{
  font-family:var(--display);
  font-weight:600;
  font-size:clamp(2.45rem,5.1vw,4.15rem);
  line-height:1.02;
  letter-spacing:-.022em;
  margin:0;
  text-wrap:balance;
}
h2{
  font-family:var(--display);
  font-weight:600;
  font-size:clamp(2rem,3.9vw,3.2rem);
  line-height:1.06;
  letter-spacing:-.02em;
  margin:0;
  text-wrap:balance;
}
h3{
  font-family:var(--body);
  font-weight:800;
  font-size:1.075rem;
  line-height:1.34;
  letter-spacing:-.005em;
  margin:0;
}
p{margin:0 0 1rem}
p:last-child{margin-bottom:0}

.lede{
  font-size:clamp(1.05rem,1.45vw,1.185rem);
  line-height:1.62;
  color:var(--ink-soft);
  max-width:56ch;
  text-wrap:pretty;
}

/* handwritten line — the scrapbook signature */
.hand{
  font-family:var(--hand);
  font-weight:700;
  font-size:clamp(1.55rem,2.9vw,2.5rem);
  line-height:1;
  color:var(--rose);
  letter-spacing:.005em;
  margin:0 0 .35rem;
  display:block;
  transform:rotate(-1.6deg);
  transform-origin:left center;
}
.hand.sage{color:var(--sage-deep)}
.hand.terracotta{color:var(--terracotta)}
.hand.honey{color:#B98426}
.hand-note{
  font-family:var(--hand);
  font-size:1.28rem;
  line-height:1.25;
  color:var(--ink-soft);
  transform:rotate(-1deg);
  display:inline-block;
}

/* small letterspaced label */
.eyebrow{
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--rose);
  margin:0 0 .9rem;
}
.eyebrow.sage{color:var(--sage-deep)}

/* highlighter marker behind a word — background-based so it survives line wraps */
.marker{
  --marker-colour:%23E5B25E;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M4,24 C40,18 70,27 104,21 C140,15 170,25 196,20 L197,35 C165,41 130,32 96,37 C62,42 34,33 3,37 Z' fill='%23E5B25E' opacity='.68'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-size:100% .62em;
  background-position:0 74%;
  padding:0 .1em;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
}
.marker.rose{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M4,24 C40,18 70,27 104,21 C140,15 170,25 196,20 L197,35 C165,41 130,32 96,37 C62,42 34,33 3,37 Z' fill='%23FFD7DA'/%3E%3C/svg%3E");
}
.marker.sage{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M4,24 C40,18 70,27 104,21 C140,15 170,25 196,20 L197,35 C165,41 130,32 96,37 C62,42 34,33 3,37 Z' fill='%23B6CBAE' opacity='.75'/%3E%3C/svg%3E");
}

/* hand-drawn circle around a phrase */
.circled{position:relative;display:inline-block;padding:.05em .38em}
.circled::after{
  content:"";
  position:absolute;inset:-.28em -.42em;
  border:2.5px solid var(--terracotta);
  border-radius:52% 47% 49% 53% / 62% 58% 63% 55%;
  opacity:.62;
  pointer-events:none;
}

/* underline scribble */
.underline-scribble{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8 C 40 2, 70 11, 108 5 S 168 3, 198 7' fill='none' stroke='%23A85A64' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-size:100% .3em;
  background-position:0 100%;
  padding-bottom:.12em;
  -webkit-box-decoration-break:clone;
  box-decoration-break:clone;
}

/* ---------------------------------------------------------- scrapbook fx -- */

/* washi tape strip. Position with --tape-top/--tape-left, angle with --tape-rot */
.tape{
  position:absolute;
  top:var(--tape-top,-13px);
  left:var(--tape-left,50%);
  width:var(--tape-w,104px);
  height:26px;
  transform:translateX(-50%) rotate(var(--tape-rot,-3deg));
  background:var(--tape-rose);
  box-shadow:0 1px 3px rgba(51,43,42,.13);
  pointer-events:none;
  z-index:3;
  /* serrated torn ends */
  -webkit-mask-image:linear-gradient(#000,#000);
  mask-image:linear-gradient(#000,#000);
  clip-path:polygon(3% 0,97% 0,100% 22%,97% 48%,100% 76%,96% 100%,4% 100%,0 78%,3% 50%,0 24%);
}
.tape::after{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.34) 0 3px,transparent 3px 7px);
  opacity:.65;
}
.tape--sage{background:var(--tape-sage)}
.tape--honey{background:var(--tape-honey)}
.tape--plain{background:var(--tape-plain)}
.tape--r{--tape-left:78%;--tape-rot:4deg}
.tape--l{--tape-left:20%;--tape-rot:-5deg}

/* push pin */
.pin{
  position:absolute;
  top:-11px;left:50%;
  width:22px;height:22px;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(circle at 34% 30%,#fff 0 12%,var(--rose) 13% 62%,var(--rose-deep) 63% 100%);
  box-shadow:0 3px 5px -1px rgba(51,43,42,.4);
  z-index:3;pointer-events:none;
}
.pin--sage{background:radial-gradient(circle at 34% 30%,#fff 0 12%,var(--sage) 13% 62%,var(--sage-deep) 63% 100%)}
.pin--honey{background:radial-gradient(circle at 34% 30%,#fff 0 12%,var(--honey) 13% 62%,#B98426 63% 100%)}

/* paper clip */
.clip{
  position:absolute;top:-16px;right:22px;width:20px;height:46px;
  border:3px solid #B9B2AC;border-radius:11px;
  border-bottom-color:transparent;
  transform:rotate(9deg);
  z-index:3;pointer-events:none;
  box-shadow:0 2px 3px rgba(51,43,42,.16);
}
.clip::after{
  content:"";position:absolute;left:3px;top:8px;right:3px;bottom:9px;
  border:3px solid #CFC8C2;border-radius:8px;border-bottom-color:transparent;
}

/* torn paper edge — put on a section to tear its top or bottom into the next */
.torn-top,.torn-bottom{position:relative}
.torn-top::before,.torn-bottom::after{
  content:"";
  position:absolute;
  left:-2vw;right:-2vw;
  height:26px;
  background:var(--torn-from,var(--paper));
  z-index:2;
  pointer-events:none;
}
.torn-top::before{
  top:-1px;
  -webkit-mask:url("torn-top.svg") no-repeat center/100% 100%;
  mask:url("torn-top.svg") no-repeat center/100% 100%;
}
.torn-bottom::after{
  bottom:-1px;
  -webkit-mask:url("torn-bottom.svg") no-repeat center/100% 100%;
  mask:url("torn-bottom.svg") no-repeat center/100% 100%;
}

/* ------------------------------------------------------------- surfaces -- */

/* base pasted-paper card */
.scrap{
  position:relative;
  background:var(--card);
  border-radius:3px;
  padding:clamp(1.35rem,2.6vw,1.9rem);
  box-shadow:var(--shadow-lift);
  transform:rotate(var(--rot,0deg));
  transition:transform 320ms var(--ease),box-shadow 320ms var(--ease);
}
.scrap::after{ /* soft paper edge */
  content:"";position:absolute;inset:0;border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(51,43,42,.07);
  pointer-events:none;
}
.scrap:hover{transform:rotate(0deg) translateY(-4px);box-shadow:var(--shadow-deep)}

/* deckled / hand-cut edge */
.scrap--cut{border-radius:14px 4px 16px 5px}
.scrap--cut2{border-radius:4px 16px 5px 14px}

/* stitched border */
.scrap--stitch::before{
  content:"";position:absolute;inset:7px;border-radius:inherit;
  border:2px dashed rgba(168,90,100,.34);
  pointer-events:none;
}

/* tinted paper variants */
.scrap--rose{background:var(--rose-wash)}
.scrap--sage{background:var(--sage-wash)}
.scrap--honey{background:var(--honey-wash)}
.scrap--kraft{background:var(--kraft)}

/* sticky note */
.sticky{
  position:relative;
  padding:clamp(1.25rem,2.4vw,1.6rem);
  background:var(--honey-wash);
  box-shadow:var(--shadow-lift);
  transform:rotate(var(--rot,-1deg));
  transition:transform 300ms var(--ease),box-shadow 300ms var(--ease);
  border-radius:2px 2px 14px 2px;
}
.sticky::after{ /* curled corner */
  content:"";position:absolute;right:0;bottom:0;width:26px;height:26px;
  background:linear-gradient(135deg,transparent 50%,rgba(51,43,42,.13) 50%,rgba(255,255,255,.85) 52%);
  border-radius:0 0 3px 0;
}
.sticky:hover{transform:rotate(0deg) translateY(-4px);box-shadow:var(--shadow-deep)}
.sticky--rose{background:#FFEAEC}
.sticky--sage{background:#E9F0E6}
.sticky--blue{background:#E7EFF3}
.sticky--kraft{background:#F3E6D8}

/* ruled index card */
.index-card{
  position:relative;
  background:
    linear-gradient(transparent 0 calc(100% - 1px),rgba(168,90,100,.22) calc(100% - 1px)) 0 0/100% 32px repeat-y,
    var(--card);
  border-radius:4px;
  box-shadow:var(--shadow-lift);
  overflow:hidden;
}
.index-card::before{ /* red margin rule */
  content:"";position:absolute;top:0;bottom:0;left:clamp(14px,3.6%,30px);width:2px;
  background:rgba(196,120,79,.42);
}

/* polaroid photo */
.polaroid{
  position:relative;
  margin:0;
  padding:11px 11px 0;
  background:var(--card);
  box-shadow:var(--shadow-deep);
  transform:rotate(var(--rot,-2deg));
  transition:transform 380ms var(--ease),box-shadow 380ms var(--ease);
  border-radius:2px;
}
.polaroid img{
  width:100%;
  aspect-ratio:var(--ar,4/3);
  object-fit:cover;
  object-position:var(--pos,center);
  background:var(--kraft);
  border-radius:1px;
}
.polaroid figcaption{
  padding:.62rem .35rem .95rem;
  font-family:var(--hand);
  font-size:1.24rem;
  line-height:1.16;
  color:var(--ink);
  text-align:center;
}
.polaroid figcaption small{
  display:block;
  margin-top:.1rem;
  font-family:var(--body);
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--rose);
}
.polaroid:hover{transform:rotate(0deg) scale(1.015);box-shadow:0 26px 48px -22px rgba(51,43,42,.55)}

/* circular photo cut-out */
.cutout{
  position:relative;margin:0;
  border-radius:50%;
  overflow:hidden;
  box-shadow:0 0 0 9px var(--card),var(--shadow-deep);
  transform:rotate(var(--rot,0deg));
}
.cutout img{width:100%;aspect-ratio:1;object-fit:cover}

/* sticker — rotated circular badge */
.sticker{
  position:relative;
  display:inline-grid;
  place-items:center;
  gap:.05rem;
  width:var(--size,112px);height:var(--size,112px);
  padding:.5rem;
  border-radius:50%;
  background:var(--rose);
  color:#fff;
  text-align:center;
  font-size:.63rem;
  font-weight:800;
  letter-spacing:.09em;
  line-height:1.22;
  text-transform:uppercase;
  transform:rotate(var(--rot,-9deg));
  box-shadow:var(--shadow-deep);
}
.sticker::before{
  content:"";position:absolute;inset:5px;border-radius:50%;
  border:1.5px dashed rgba(255,255,255,.62);
}
.sticker--sage{background:var(--sage-deep)}
.sticker--honey{background:var(--honey);color:var(--ink)}
.sticker--honey::before{border-color:rgba(51,43,42,.3)}
.sticker b{display:block;font-family:var(--hand);font-size:1.5rem;letter-spacing:0;text-transform:none;font-weight:700}

/* torn label chip (areas, tags) */
.chip{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.42rem .95rem;
  background:var(--card);
  border-radius:3px 12px 4px 11px;
  box-shadow:0 3px 8px -4px rgba(51,43,42,.4),inset 0 0 0 1px rgba(51,43,42,.09);
  font-size:.875rem;
  font-weight:700;
  color:var(--ink-soft);
  transform:rotate(var(--rot,0deg));
  transition:transform 240ms var(--ease),color 240ms;
}
.chip:hover{transform:rotate(0deg) translateY(-2px);color:var(--rose)}
.chip svg{width:14px;height:14px;flex:none;color:var(--rose)}
.chip--rose{background:var(--rose-wash)}
.chip--sage{background:var(--sage-wash)}
.chip--honey{background:var(--honey-wash)}

/* ---------------------------------------------------------------- buttons */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  min-height:48px;
  padding:.78rem 1.5rem;
  border:0;
  border-radius:26px 24px 27px 25px;
  font-family:var(--body);
  font-size:.9rem;
  font-weight:800;
  letter-spacing:.055em;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
  transition:transform 200ms var(--ease),box-shadow 200ms var(--ease),background 200ms;
}
.btn-primary{
  background:var(--rose);
  color:#fff;
  box-shadow:0 5px 0 -1px var(--rose-deep),0 10px 18px -10px rgba(51,43,42,.5);
}
.btn-primary:hover{background:var(--rose-deep);transform:translateY(2px);box-shadow:0 3px 0 -1px #7A3B44,0 8px 14px -10px rgba(51,43,42,.5)}
.btn-honey{
  background:var(--honey);color:var(--ink);
  box-shadow:0 5px 0 -1px #C9973F,0 10px 18px -10px rgba(51,43,42,.45);
}
.btn-honey:hover{transform:translateY(2px);box-shadow:0 3px 0 -1px #B08430,0 8px 14px -10px rgba(51,43,42,.45)}
.btn-sage{
  background:var(--sage-deep);color:#fff;
  box-shadow:0 5px 0 -1px #3C4E37,0 10px 18px -10px rgba(51,43,42,.45);
}
.btn-sage:hover{transform:translateY(2px);box-shadow:0 3px 0 -1px #33432F,0 8px 14px -10px rgba(51,43,42,.45)}
.btn-ghost{
  background:var(--card);
  color:var(--rose);
  box-shadow:inset 0 0 0 2px var(--rose-mid),0 4px 10px -6px rgba(51,43,42,.4);
}
.btn-ghost:hover{background:var(--rose-wash);box-shadow:inset 0 0 0 2px var(--rose),0 4px 10px -6px rgba(51,43,42,.4)}
.btn-sm{min-height:42px;padding:.55rem 1.15rem;font-size:.78rem}

/* --------------------------------------------------------------- doodles -- */

.doodle{
  position:absolute;
  pointer-events:none;
  color:var(--rose-mid);
  opacity:.75;
  z-index:0;
}
.doodle svg{width:100%;height:100%;display:block;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.doodle--sage{color:#A9BFA1}
.doodle--honey{color:#EAC384}
.doodle--terracotta{color:#DBA382}

/* ----------------------------------------------------------------- bands -- */

.band{padding:clamp(3.4rem,7vw,6rem) 0;position:relative}
.band-rose{background:var(--rose-wash)}
.band-sage{background:var(--sage-wash)}
.band-kraft{background:var(--kraft)}
.band-paper{background:var(--paper)}

.head{max-width:58ch;margin-bottom:clamp(2rem,4.5vw,3.2rem);position:relative}
.head .lede{margin-top:1rem}

/* which colour is tearing INTO each band (i.e. the section above it) */
#how{--torn-from:var(--paper)}
#services{--torn-from:var(--rose-wash)}
#approach{--torn-from:var(--paper)}
#areas{--torn-from:var(--sage-wash)}
#faq{--torn-from:var(--paper)}
#contact{--torn-from:var(--rose-wash)}
footer.torn-top{--torn-from:var(--rose)}

/* --------------------------------------------------------------- reveals -- */

.reveal{opacity:0;transform:translateY(20px) rotate(var(--rot,0deg));transition:opacity 700ms var(--ease),transform 700ms var(--ease)}
.reveal.in{opacity:1;transform:translateY(0) rotate(var(--rot,0deg))}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:rotate(var(--rot,0deg))}
  .scrap:hover,.sticky:hover,.polaroid:hover,.chip:hover{transform:rotate(var(--rot,0deg))}
}

/* ==========================================================================
   Page furniture
   ========================================================================== */

/* ------------------------------------------------------------------- nav -- */

.site-head{position:sticky;top:0;z-index:60;padding:10px 0}
.nav-inner{
  display:flex;align-items:center;gap:1rem;
  min-height:64px;
  padding:8px 10px 8px 14px;
  background:rgba(255,251,248,.94);
  border-radius:20px 8px 20px 8px;
  box-shadow:inset 0 0 0 1.5px var(--rose-pale),0 8px 20px -14px rgba(51,43,42,.55);
  backdrop-filter:blur(10px) saturate(140%);
  -webkit-backdrop-filter:blur(10px) saturate(140%);
}
.lockup{display:flex;align-items:center;gap:.6rem;text-decoration:none;flex:none}
.lockup img{width:42px;height:42px;border-radius:50%;box-shadow:0 2px 6px -3px rgba(51,43,42,.5)}
.wordmark{line-height:1.02}
.wordmark b{
  display:block;font-family:var(--display);font-weight:600;
  font-size:1.05rem;letter-spacing:.045em;text-transform:uppercase;color:var(--ink);
}
.wordmark span{
  display:block;margin-top:.1rem;font-family:var(--hand);
  font-size:.98rem;letter-spacing:.02em;color:var(--rose);
}
.nav-links{display:flex;align-items:center;gap:.1rem;margin:0 auto;padding:0;list-style:none}
.nav-links a{
  display:grid;place-items:center;min-height:42px;
  padding:.45rem .8rem;border-radius:16px 6px 16px 6px;
  font-size:.885rem;font-weight:700;color:var(--ink-soft);text-decoration:none;
  transition:background 200ms,color 200ms;
}
.nav-links a:hover,.nav-links a[aria-current="page"]{background:var(--rose-wash);color:var(--rose)}
.nav-actions{display:flex;align-items:center;gap:.6rem;flex:none}
.nav-phone{
  display:inline-flex;align-items:center;gap:.4rem;
  font-family:var(--hand);font-size:1.2rem;color:var(--sage-deep);text-decoration:none;white-space:nowrap;
}
.nav-phone svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9}
.nav-phone:hover{color:var(--rose)}

/* dropdown */
.has-menu{position:relative}
.has-menu>.menu-trigger{display:flex;align-items:center}
.menu-toggle-btn{
  display:grid;place-items:center;width:26px;height:26px;margin-left:-.35rem;
  border:0;background:none;border-radius:50%;cursor:pointer;color:var(--ink-soft);
}
.menu-toggle-btn svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.4;transition:transform 240ms var(--ease)}
.has-menu[data-open="true"] .menu-toggle-btn svg{transform:rotate(180deg)}
.drop{
  position:absolute;top:calc(100% + 12px);left:-8px;
  display:none;min-width:230px;padding:.5rem;
  background:var(--card);
  border-radius:4px 16px 4px 16px;
  box-shadow:var(--shadow-deep),inset 0 0 0 1.5px var(--rose-pale);
}
.has-menu[data-open="true"] .drop{display:block}
.drop a{display:block;padding:.55rem .75rem;border-radius:10px 4px 10px 4px;font-size:.875rem;font-weight:600;color:var(--ink-soft);text-decoration:none}
.drop a:hover{background:var(--rose-wash);color:var(--rose)}

/* burger + sheet */
.burger{display:none;width:46px;height:46px;flex:none;border:0;cursor:pointer;border-radius:14px 5px 14px 5px;background:var(--rose-wash);box-shadow:inset 0 0 0 1.5px var(--rose-pale);place-items:center;color:var(--rose)}
.burger svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round}
.sheet{display:none;margin-top:10px;padding:.6rem;background:var(--card);border-radius:6px 20px 6px 20px;box-shadow:var(--shadow-deep),inset 0 0 0 1.5px var(--rose-pale)}
.sheet[data-open="true"]{display:block}
.sheet a,.sheet summary{display:block;padding:.78rem .85rem;border-radius:12px 4px 12px 4px;font-weight:700;text-decoration:none;color:var(--ink);cursor:pointer}
.sheet a:hover,.sheet summary:hover{background:var(--rose-wash);color:var(--rose)}
.sheet details .sheet-sub a{padding-left:1.7rem;font-weight:600;font-size:.9rem;color:var(--ink-soft)}
.sheet summary::marker{color:var(--rose)}

/* ------------------------------------------------------------------ hero -- */

.hero{position:relative;padding:clamp(2.2rem,5vw,4rem) 0 clamp(2.5rem,6vw,4.5rem);overflow:hidden}
.hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:clamp(2rem,5vw,4.5rem);
  align-items:center;
}
.hero-copy{position:relative;z-index:2}
.hero .display em{font-style:normal;color:var(--rose)}
.hero-rule{width:158px;height:12px;margin:1.5rem 0 1.35rem;color:var(--rose-mid)}
.hero-rule svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round}
.hero-chips{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.5rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}

/* photo collage */
.collage{position:relative;min-height:clamp(400px,46vw,540px)}
.collage .polaroid{position:absolute;box-shadow:var(--shadow-deep)}
.collage-a{width:54%;top:2%;left:0;--rot:-4.5deg;z-index:2}
.collage-b{width:47%;top:26%;right:2%;--rot:5deg;z-index:3}
.collage-c{width:43%;bottom:2%;left:12%;--rot:2.5deg;z-index:4}
.collage .sticker{position:absolute;bottom:7%;left:-5%;z-index:5}
.collage .ndis-sticker{
  position:absolute;top:1%;right:1%;width:98px;z-index:5;
  transform:rotate(11deg);
  filter:drop-shadow(0 8px 14px rgba(51,43,42,.32));
}
.collage .doodle{z-index:1}

/* ------------------------------------------------------------ trust cards -- */

.ledger{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:clamp(1rem,2.2vw,1.7rem);
  margin-top:clamp(2.5rem,5vw,4rem);
}
.ledger .scrap{padding:1.5rem 1.25rem 1.35rem}
.ledger dt{
  font-family:var(--hand);font-size:1.42rem;line-height:1.1;color:var(--rose);margin-bottom:.35rem;
}
.ledger dd{margin:0;font-size:.925rem;line-height:1.55;color:var(--ink-soft)}

/* -------------------------------------------------------------- how steps -- */

.how-head{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:end;margin-bottom:clamp(2.2rem,5vw,3.4rem)}
.how-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(2rem,4.5vw,4rem);align-items:start}
.how-photo-col{position:relative;position:sticky;top:110px}
.how-photo-col .hand-note{display:block;margin-top:1.4rem;text-align:center}
.steps{display:grid;gap:3.5rem;margin:0;padding:0;list-style:none}
.step{position:relative;padding-left:0}
.step .scrap{display:grid;grid-template-columns:auto 1fr;gap:1.1rem;align-items:start}
.step-n{
  display:grid;place-items:center;
  width:52px;height:52px;flex:none;
  border-radius:50%;
  background:var(--rose-wash);
  box-shadow:inset 0 0 0 2px var(--rose-pale);
  font-family:var(--hand);font-size:1.75rem;font-weight:700;color:var(--rose);
}
.step:nth-child(2) .step-n{background:var(--sage-wash);box-shadow:inset 0 0 0 2px #CBDCC3;color:var(--sage-deep)}
.step:nth-child(3) .step-n{background:var(--honey-wash);box-shadow:inset 0 0 0 2px #F0D9A9;color:#A9761F}
.step:nth-child(4) .step-n{background:var(--terracotta-wash);box-shadow:inset 0 0 0 2px #EFCBB3;color:var(--terracotta)}
.step h3{margin-bottom:.4rem}
.step p{margin:0;font-size:.94rem;color:var(--ink-soft)}
/* sits entirely inside the 3rem gap between two step cards */
.step-arrow{position:absolute;left:20px;bottom:-45px;width:44px;height:34px;z-index:4;opacity:.9}

/* -------------------------------------------------------------- services -- */

.filter-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:clamp(1.5rem,3vw,2.2rem)}
.filters{display:flex;flex-wrap:wrap;gap:.5rem}
.filter-pill{
  min-height:42px;padding:.5rem 1.15rem;border:0;cursor:pointer;
  border-radius:20px 7px 20px 7px;
  background:var(--card);
  box-shadow:inset 0 0 0 1.5px rgba(51,43,42,.12),0 3px 8px -6px rgba(51,43,42,.5);
  font-size:.855rem;font-weight:800;color:var(--ink-soft);
  transition:transform 200ms var(--ease),background 200ms,color 200ms,box-shadow 200ms;
}
.filter-pill:hover{transform:translateY(-2px) rotate(-1deg)}
.filter-pill[aria-pressed="true"]{background:var(--rose);color:#fff;box-shadow:0 4px 0 -1px var(--rose-deep)}
.count{margin:0;font-family:var(--hand);font-size:1.25rem;color:var(--ink-soft)}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:clamp(1.1rem,2.4vw,1.75rem)}
.grid .card{display:flex;flex-direction:column;gap:.6rem;padding-top:1.75rem}
.card .tag{
  align-self:flex-start;
  padding:.25rem .7rem;border-radius:3px 10px 3px 10px;
  background:var(--rose-wash);color:var(--rose);
  font-size:.63rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;
}
.card .tag.cb{background:var(--sage-wash);color:var(--sage-deep)}
.card h3{font-size:1.16rem;font-family:var(--display);font-weight:600;letter-spacing:-.01em;line-height:1.16}
.card h3 a{text-decoration:none}
.card h3 a:hover{color:var(--rose);text-decoration:underline;text-underline-offset:3px}
.card p{margin:0;font-size:.9rem;line-height:1.58;color:var(--ink-soft)}
.card .group{
  margin-top:auto;padding-top:.85rem;
  border-top:1.5px dashed rgba(168,90,100,.32);
  font-size:.73rem;color:var(--ink-faint);line-height:1.45;
}
.card .group b{display:block;font-size:.63rem;letter-spacing:.12em;text-transform:uppercase;color:var(--rose);margin-bottom:.15rem}
.card[hidden]{display:none}

/* -------------------------------------------------------------- approach -- */

.approach-head{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(1.4rem,4vw,3.5rem);align-items:end;margin-bottom:clamp(2.2rem,5vw,3.4rem)}
.approach-layout{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(2rem,4.5vw,4rem);align-items:start}
.approach-photo-col{position:relative}
.values{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1rem,2.2vw,1.6rem)}
.values .sticky h3{margin-bottom:.5rem;font-size:1.04rem}
.values .sticky p{margin:0;font-size:.9rem;line-height:1.57;color:var(--ink-soft)}

/* ----------------------------------------------------------------- areas -- */

.areas-layout{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(2rem,4.5vw,4rem);align-items:center}
.areas{display:flex;flex-wrap:wrap;gap:.65rem}
.areas .chip{font-size:.9rem;padding:.5rem 1.05rem}

/* ------------------------------------------------------------------- faq -- */

.faq{display:grid;gap:clamp(.85rem,1.8vw,1.15rem);max-width:900px}
.faq-item{position:relative;overflow:hidden}
.faq-q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.15rem clamp(1.1rem,2.4vw,1.6rem) 1.15rem clamp(2.4rem,5%,3.1rem);
  border:0;background:none;cursor:pointer;text-align:left;
  font-family:var(--body);font-size:1.02rem;font-weight:800;line-height:1.35;color:var(--ink);
}
.faq-q:hover{color:var(--rose)}
.faq-q svg{width:22px;height:22px;flex:none;fill:none;stroke:var(--rose);stroke-width:2.4;stroke-linecap:round;transition:transform 300ms var(--ease)}
.faq-q[aria-expanded="true"] svg{transform:rotate(45deg)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows 380ms var(--ease)}
.faq-q[aria-expanded="true"]+.faq-a{grid-template-rows:1fr}
.faq-a>div{overflow:hidden}
.faq-a p{
  margin:0;padding:0 clamp(1.1rem,2.4vw,1.6rem) 1.35rem clamp(2.4rem,5%,3.1rem);
  font-size:.94rem;line-height:1.65;color:var(--ink-soft);max-width:72ch;
}

/* --------------------------------------------------------------- contact -- */

.contact-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.detail{display:grid;grid-template-columns:auto 1fr;gap:.35rem 1rem;padding:1rem 0;border-bottom:1.5px dashed rgba(168,90,100,.3)}
.detail:first-child{border-top:1.5px dashed rgba(168,90,100,.3)}
.detail dt{font-family:var(--hand);font-size:1.3rem;color:var(--rose);min-width:6.5rem}
.detail dd{margin:0;font-size:.94rem;line-height:1.55;color:var(--ink-soft)}
.detail dd a{color:var(--rose);text-decoration:none;font-weight:700}
.detail dd a:hover{text-decoration:underline;text-underline-offset:3px}
.contact-promise{margin-top:1.8rem;padding:1.15rem 1.35rem}
.contact-promise strong{display:block;font-family:var(--hand);font-weight:700;font-size:1.42rem;color:var(--sage-deep);margin-bottom:.2rem}
.contact-promise span{font-size:.92rem;line-height:1.55;color:var(--ink-soft)}

form{padding:clamp(1.4rem,3vw,2.2rem)}
.field{display:block;margin-bottom:1.05rem}
.field>span{
  display:block;margin-bottom:.4rem;
  font-family:var(--hand);font-size:1.2rem;color:var(--ink);
}
.field input,.field select,.field textarea{
  width:100%;padding:.78rem .95rem;
  font:inherit;font-size:.95rem;color:var(--ink);
  background:var(--paper-warm);
  border:0;border-radius:10px 4px 10px 4px;
  box-shadow:inset 0 0 0 1.5px rgba(168,90,100,.34);
  transition:box-shadow 200ms;
}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;box-shadow:inset 0 0 0 2.5px var(--rose)}
.form-note{margin:.9rem 0 0;font-size:.8rem;line-height:1.5;color:var(--ink-faint)}

/* ----------------------------------------------------------- credentials -- */

.credential-strip{background:var(--rose);color:#fff;padding:1.1rem 0}
.credential-strip .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1.6rem;justify-content:center;text-align:center}
.credential-strip strong{font-family:var(--hand);font-weight:700;font-size:1.5rem}
.credential-strip span{font-size:.78rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;opacity:.92}
.credential-strip span::before{content:"✦";margin-right:.55rem;opacity:.7}

/* ---------------------------------------------------------------- footer -- */

footer{position:relative;background:var(--kraft);padding:clamp(3rem,6vw,4.5rem) 0 2rem;color:var(--ink)}
.foot-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1.5rem;margin-bottom:clamp(2.2rem,5vw,3.4rem)}
.foot-mark{width:120px;height:120px;border-radius:50%;box-shadow:0 0 0 8px rgba(255,255,255,.6),var(--shadow-lift);transform:rotate(-3deg)}
.foot-top .ndis-mark{width:104px;transform:rotate(6deg);filter:drop-shadow(0 6px 12px rgba(51,43,42,.22))}
.foot-grid{display:grid;grid-template-columns:1fr 1fr 1.25fr 1.25fr;gap:clamp(1.5rem,3vw,2.5rem)}
.foot-grid h4{
  margin:0 0 .8rem;font-family:var(--hand);font-weight:700;font-size:1.5rem;color:var(--rose);
}
.foot-grid ul{margin:0;padding:0;list-style:none}
.foot-grid li+li{margin-top:.4rem}
.foot-grid a,.foot-grid p{font-size:.885rem;line-height:1.6;color:var(--ink-soft)}
.foot-grid a{text-decoration:none}
.foot-grid a:hover{color:var(--rose);text-decoration:underline;text-underline-offset:3px}
.country-ack{
  display:grid;grid-template-columns:auto 1fr;gap:1.2rem;align-items:start;
  margin-top:clamp(2.2rem,5vw,3.2rem);padding:1.3rem 1.5rem;
}
.country-flags{display:flex;gap:.5rem}
.country-flag{display:block;width:46px;height:31px;border-radius:2px;box-shadow:0 2px 5px -2px rgba(51,43,42,.5)}
.aboriginal-flag{background:linear-gradient(#000 0 50%,#C8102E 50% 100%);position:relative}
.aboriginal-flag::after{content:"";position:absolute;inset:0;margin:auto;width:13px;height:13px;border-radius:50%;background:#FFB81C}
.country-ack p{margin:0;font-size:.83rem;line-height:1.6;color:var(--ink-soft)}
.foot-base{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem;
  margin-top:2.2rem;padding-top:1.2rem;
  border-top:1.5px dashed rgba(168,90,100,.35);
  font-size:.78rem;color:var(--ink-faint);
}

/* ------------------------------------------------------------ responsive -- */

@media (max-width:1080px){
  .nav-links{display:none}
  .nav-phone{display:none}
  .burger{display:grid}
  .nav-inner{justify-content:space-between}
  .hero-grid{grid-template-columns:1fr}
  .collage{min-height:min(78vw,470px);margin-top:1rem}
  .ledger{grid-template-columns:repeat(2,1fr)}
  .how-head,.approach-head{grid-template-columns:1fr;align-items:start}
  .how-layout,.approach-layout,.areas-layout,.contact-grid{grid-template-columns:1fr}
  .how-photo-col{position:static}
  .how-photo-col .polaroid,.approach-photo-col .polaroid{max-width:460px;margin-inline:auto}
  .foot-grid{grid-template-columns:1fr 1fr}
}

/* below this the lockup + CTA + burger no longer fit on one row */
@media (max-width:700px){
  .nav-actions{display:none}
}

@media (max-width:640px){
  /* decorative marks stop competing with text on small screens */
  .doodle:not(.step-arrow){display:none}
  .ledger{grid-template-columns:1fr}
  .values{grid-template-columns:1fr}
  .hero-cta .btn{width:100%}
  .step .scrap{grid-template-columns:1fr}
  .step-arrow{display:none}
  .foot-grid{grid-template-columns:1fr}
  .country-ack{grid-template-columns:1fr}
  .collage-a{width:64%;left:0}
  .collage-b{width:52%}
  .collage-c{width:50%;left:22%}
  .collage .sticker{--size:84px;left:-6%;bottom:4%}
  .collage .ndis-sticker{width:72px}
  .filter-bar{flex-direction:column;align-items:flex-start}
  .credential-strip .wrap{flex-direction:column;gap:.5rem}
}