@font-face{font-family:Khorus Display;src:url('assets/display-400.ttf');font-weight:400;font-display:swap}
@font-face{font-family:Khorus Sans;src:url('assets/body-400.ttf');font-weight:400;font-display:swap}
@font-face{font-family:Khorus Sans;src:url('assets/body-500.ttf');font-weight:500;font-display:swap}
:root{
  --ground:#f8eee9;--paper:#fffaf7;--ink:#512e3a;--muted:#795b63;--line:#d7c2c2;--accent:#ae594e;--voice:#604b7f;--voice_assistants:#604b7f;
  --shadow-plane:0 1px 0 color-mix(in srgb,var(--paper) 80%,transparent) inset,0 30px 60px -30px color-mix(in srgb,var(--ink) 18%,transparent),0 2px 6px -2px color-mix(in srgb,var(--ink) 8%,transparent);
  --hero-veil:linear-gradient(90deg,var(--ground) 0%,color-mix(in srgb,var(--ground) 94%,transparent) 24%,color-mix(in srgb,var(--ground) 62%,transparent) 48%,transparent 78%);
  --hero-ground:linear-gradient(180deg,var(--ground) 0%,transparent 18%,transparent 72%,var(--ground) 100%);
  --closing-veil:linear-gradient(180deg,var(--ground),color-mix(in srgb,var(--ground) 18%,transparent) 22%,color-mix(in srgb,var(--ground) 90%,transparent) 62%,var(--ground) 96%);
  --image-edge:linear-gradient(180deg,transparent,var(--ink) 12%,var(--ink) 84%,transparent);
  --image-soft:linear-gradient(90deg,transparent,var(--ink) 14%,var(--ink) 86%,transparent),linear-gradient(180deg,transparent,var(--ink) 14%,var(--ink) 86%,transparent);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:28px}
body{margin:0;background:var(--ground);color:var(--ink);font:18px/1.6 "Khorus Sans",sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:5px}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:"Khorus Display",serif;font-weight:400;line-height:1.06;letter-spacing:-.02em;text-wrap:balance}
h1{font-size:clamp(44px,6.2vw,84px);max-width:18ch}
h2{font-size:clamp(30px,3.4vw,48px)}
h3{font-size:clamp(26px,2.4vw,34px)}
p{max-width:68ch}
p+p{margin-top:16px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.skip{position:absolute;top:-100px;left:20px;background:var(--ink);color:var(--paper);padding:12px;z-index:20}
.skip:focus{top:12px}
header{position:relative;z-index:20;max-width:1440px;margin:auto;padding:22px 6%;display:flex;align-items:center;gap:28px;min-height:96px}
.brand{margin-right:auto;flex-shrink:0;font-family:"Khorus Display",serif;font-size:28px;text-decoration:none;color:var(--ink)}
.brand span{color:var(--accent)}
.brand img{display:block;width:160px;height:auto}
nav{display:flex;gap:26px;font-size:15px}
nav a{text-decoration:none;padding:10px 0;color:var(--muted)}
nav a:hover{color:var(--ink);text-decoration:underline}
.nav-cta{font-size:15px;text-decoration:none;border:1px solid color-mix(in srgb,var(--ink) 35%,transparent);border-radius:999px;padding:10px 16px;color:var(--ink)}
.nav-cta:hover{border-color:var(--ink);background:var(--paper)}
.mobile-nav{display:none;justify-content:space-between;gap:12px;margin:0 6% 8px;padding-top:10px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}
.mobile-nav a{text-decoration:none}
.image-hero{position:relative;isolation:isolate;overflow:hidden;min-height:680px;height:88svh;max-height:980px}
.hero-art{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:68% 55%;animation:gallery-breathe 24s ease-in-out infinite}
.hero-veil{position:absolute;inset:0;z-index:-1;background-image:var(--hero-ground),var(--hero-veil)}
.hero-copy{max-width:1440px;margin:auto;padding:140px 6% 150px}
.hero-copy p{margin-top:28px;font-size:clamp(18px,1.5vw,21px);color:var(--muted);max-width:42ch}
.home-hero .hero-art{top:240px;left:28%;width:85%;height:calc(100% - 170px);object-position:center 55%;-webkit-mask-image:var(--image-soft);mask-image:var(--image-soft);-webkit-mask-composite:source-in;mask-composite:intersect}
.voice-hero .hero-art{width:58%;left:auto;right:0;object-position:center 47%}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:52px;padding:14px 22px;border-radius:999px;background:var(--ink);color:var(--paper);text-decoration:none;font-size:16px;box-shadow:var(--shadow-plane);margin-top:36px}
.button:hover{background:var(--accent)}
.button .arrow{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}
.story{max-width:1440px;margin:auto;padding:72px 6%;display:grid;gap:28px}
@media(min-width:900px){.story{grid-template-columns:1.1fr .9fr;gap:64px;padding:96px 6%;align-items:start}.story p{padding-top:8px}}
.image-band{height:400px;overflow:hidden;-webkit-mask-image:var(--image-edge);mask-image:var(--image-edge)}
.image-band img{width:100%;height:100%;object-fit:cover;display:block}
.clarity-band{height:380px}
.clarity-band img{object-position:center 57%}
.change-band{height:340px}
.audiences{max-width:1440px;margin:auto;padding:24px 6% 48px}
.audience-row{display:grid;gap:28px;align-items:center;border-top:1px solid var(--line);padding:36px 0;text-decoration:none;color:inherit}
@media(min-width:900px){.audience-row{grid-template-columns:1fr 1fr;gap:56px}}
.audience-art{height:400px;overflow:hidden;-webkit-mask-image:var(--image-soft);mask-image:var(--image-soft);-webkit-mask-composite:source-in;mask-composite:intersect}
.audience-art img{width:100%;height:100%;object-fit:cover;display:block}
.audience-copy p{margin-top:14px;color:var(--muted)}
.audience-link{display:inline-block;margin-top:22px;font-size:14px;color:var(--accent);text-decoration:none}
.audience-row:hover .audience-link{text-decoration:underline}
.help{max-width:1440px;margin:auto;padding:48px 6% 88px}
.help h2{margin-bottom:28px}
.help ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.help li{display:grid;gap:10px;padding:28px 0;border-bottom:1px solid var(--line)}
@media(min-width:900px){.help li{grid-template-columns:48px 1.1fr 1.2fr;gap:24px;align-items:baseline}}
.help .n{font-family:"Khorus Display",serif;color:var(--accent);font-size:15px}
.help .row-title{display:flex;align-items:center;justify-content:space-between;gap:16px}
.help .list-art{width:96px;height:72px;object-fit:cover;border-radius:4px;-webkit-mask-image:var(--image-soft);mask-image:var(--image-soft);-webkit-mask-composite:source-in;mask-composite:intersect}
.help p{color:var(--muted)}
.voice-band{max-width:1440px;margin:auto;padding:32px 6% 56px;display:grid;gap:28px;align-items:center}
@media(min-width:900px){.voice-band{grid-template-columns:.9fr 1.1fr;gap:48px}}
.voice-band h2{color:var(--voice)}
.voice-band p{margin-top:14px;color:var(--muted);font-size:19px}
.voice-band a{display:inline-block;margin-top:22px;color:var(--voice);border-bottom:1px solid var(--voice);text-decoration:none;padding-bottom:2px}
.voice-art{height:420px;overflow:hidden;-webkit-mask-image:var(--image-soft);mask-image:var(--image-soft);-webkit-mask-composite:source-in;mask-composite:intersect}
.voice-art img{width:100%;height:100%;object-fit:cover;object-position:center 55%}
.faq{max-width:1440px;margin:auto;padding:72px 6% 96px;display:grid;gap:28px}
@media(min-width:900px){.faq{grid-template-columns:.8fr 1.2fr;gap:48px}}
.faq details{border-bottom:1px solid var(--line);padding:22px 0}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:18px;font-size:clamp(18px,1.5vw,22px)}
.faq summary::-webkit-details-marker{display:none}
.faq summary span{color:var(--accent)}
.faq details[open] summary span{transform:rotate(45deg)}
.faq p{margin-top:12px;color:var(--muted)}
.closing{position:relative;isolation:isolate;overflow:hidden;padding:180px 6% 96px}
.closing-art{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:top center;opacity:.82}
.closing-veil{position:absolute;inset:0;z-index:-1;background-image:var(--closing-veil)}
.closing-inner{max-width:920px}
.closing p{margin-top:22px;color:var(--muted);font-size:19px}
footer{border-top:1px solid var(--line);max-width:1440px;margin:auto;padding:36px 6%;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;font-size:14px;color:var(--muted)}
footer .name{font-family:"Khorus Display",serif;font-size:16px;color:var(--ink)}
footer a{color:inherit}
.guide-toc{max-width:1440px;margin:auto;padding:28px 6% 0;font-size:15px;color:var(--muted)}
.guide-toc strong{display:block;font-family:"Khorus Display",serif;font-size:18px;color:var(--voice);font-weight:400;margin-bottom:12px}
.guide-toc a{margin-right:24px;color:inherit;text-decoration:none}
.guide-toc a:hover{color:var(--ink)}
.cards{max-width:1440px;margin:auto;padding:64px 6%}
.cards h2{margin-bottom:28px}
.card-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden}
@media(min-width:900px){.card-grid{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--paper);padding:28px}
.card h3{color:var(--voice)}
.card p{margin-top:10px;color:var(--muted)}
.steps{max-width:1440px;margin:auto;padding:64px 6%}
.steps h2{margin-bottom:28px}
.step-grid{display:grid;gap:28px}
@media(min-width:900px){.step-grid{grid-template-columns:repeat(4,1fr)}}
.step{border-top:2px solid color-mix(in srgb,var(--voice) 40%,transparent);padding-top:18px}
.step .n{font-family:"Khorus Display",serif;font-size:14px;color:var(--accent)}
.step h3{margin-top:8px;font-size:22px}
.step p{margin-top:8px;color:var(--muted)}
.qa{max-width:1440px;margin:auto;padding:64px 6% 88px;display:grid;gap:28px}
@media(min-width:900px){.qa{grid-template-columns:.8fr 1.2fr}}
.qa-item{border-bottom:1px solid var(--line);padding:22px 0}
.qa-item dt{font-size:clamp(18px,1.5vw,22px)}
.qa-item dd{margin:10px 0 0;color:var(--muted)}
.rail{position:relative}
.rail::before{content:"";position:absolute;left:calc(6% + 6px);top:0;bottom:0;width:1px;background:var(--line)}
@keyframes gallery-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
@media(max-width:899px){
  nav{display:none}
  .mobile-nav{display:flex}
  .image-hero{min-height:620px;height:calc(92svh - 120px);max-height:none}
  .hero-copy{padding:48px 6% 260px}
  .home-hero .hero-art{top:300px;left:10%;width:110%;height:calc(100% - 230px)}
  .hero-veil{background-image:linear-gradient(180deg,var(--ground) 0%,color-mix(in srgb,var(--ground) 97%,transparent) 28%,color-mix(in srgb,var(--ground) 84%,transparent) 46%,transparent 68%,var(--ground) 100%)}
  .voice-hero .hero-art{width:100%}
  .clarity-band,.audience-art,.voice-art{height:300px}
  .change-band{height:240px}
  .closing{padding-top:140px}
  .rail::before{display:none}
}
@media(prefers-reduced-motion:reduce){.hero-art{animation:none}html{scroll-behavior:auto}}

/* contact / enquiry form */
.brand img{display:block;width:160px;height:auto}
.hero{max-width:1280px;padding:56px 6% 40px;margin:auto}
.brief-intro{margin-top:24px;max-width:640px;color:var(--muted);font-size:clamp(18px,1.5vw,21px)}
.brief-layout{max-width:1280px;margin:auto;padding:48px 6% 96px;display:grid;gap:40px;border-top:1px solid var(--line)}
@media(min-width:900px){.brief-layout{grid-template-columns:1fr 1fr;gap:10%;align-items:start}}
.brief-layout>div p{margin-top:18px;color:var(--muted)}
.brief-layout form{margin:0}
label{display:block;font-size:16px;font-weight:500;margin-bottom:8px}
input,textarea,select{display:block;width:100%;border:1px solid #ab8d96;border-radius:6px;background:var(--paper);padding:11px 13px;font-size:16px;margin-bottom:22px;color:var(--ink)}
textarea{resize:vertical;line-height:1.55;min-height:96px}
.form-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.optional{font-weight:400;color:var(--muted)}
.consent{display:flex;gap:12px;align-items:flex-start;font-weight:400;margin:0 0 28px}
.consent input{width:20px;height:20px;flex-shrink:0;margin:4px 0 0;accent-color:var(--ink)}
.button{border:0;cursor:pointer}
.button:disabled{opacity:.65;cursor:wait}
.copy-status{min-height:28px;font-size:15px;margin-top:16px;color:var(--muted)}
#enquiry-status[data-error=true]{color:#852c36}
#enquiry-success p{margin-top:18px;color:var(--muted)}
#enquiry-reference{font-size:15px;overflow-wrap:anywhere}
.text-link{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-size:16px;text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:2px}
.footer-brand{font-size:25px;font-family:"Khorus Display",serif;text-decoration:none;color:var(--ink)}
footer{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
footer p{max-width:420px}
@media(max-width:620px){
  .brief .hero{padding-top:36px;padding-bottom:28px}
  .brief-layout{display:block;padding:36px 6% 72px}
  .brief-layout form{margin-top:28px}
  footer{display:block}
  footer p{margin:14px 0 18px}
}
