/* Contact page layout (2026-10-25 redesign). The forms keep project-brief.css; this only arranges and animates. */
.ct-page .ct-wrap{max-width:var(--maxw)}
.ct-page .ct-intro{grid-template-columns:1fr;align-items:center;gap:clamp(2rem,4vw,4rem);margin-bottom:clamp(2rem,4vw,3rem)}
@media(min-width:1000px){.ct-page .ct-intro{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
.ct-page .ct-title{font-size:clamp(3rem,1.5rem + 5vw,6rem);line-height:1;max-width:12ch}
.ct-js .ct-title{clip-path:inset(0 0 100% 0);transform:translateY(24px);transition:clip-path 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.ct-js .ct-fade{opacity:0;transform:translateY(14px);transition:opacity .6s ease .4s,transform .7s cubic-bezier(.2,.7,.2,1) .4s}
.op-in .ct-title{clip-path:inset(0 0 -10% 0);transform:none}
.op-in .ct-fade{opacity:1;transform:none}
.ct-offer{margin-top:1.5rem;max-width:44ch;border-left-color:var(--amber)!important}

/* Pierre's card */
.ct-card{background:var(--forest);color:var(--chalk);border-radius:28px;padding:clamp(1.4rem,3vw,2rem);box-shadow:0 40px 80px -40px rgba(0,82,45,.55)}
.ct-me{display:flex;align-items:center;gap:1rem}
.ct-me img{width:68px;height:68px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px var(--apricot)}
.ct-me b{display:block;font-size:1.15rem}
.ct-live{display:flex;align-items:center;gap:.5rem;margin-top:.2rem;font-size:.9rem;color:#cfe3d6}
.ct-typing{position:relative;flex:none;display:inline-flex;align-items:center;gap:3px;padding:6px 8px;border-radius:12px 12px 12px 3px;background:var(--apricot);box-shadow:0 6px 14px -8px rgba(0,0,0,.5)}
.ct-typing b{width:5px;height:5px;border-radius:50%;background:var(--forest);animation:ctType 1.3s ease-in-out infinite}
.ct-typing b:nth-child(2){animation-delay:.18s}.ct-typing b:nth-child(3){animation-delay:.36s}
@keyframes ctType{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1}}
.ct-q{margin-top:1.4rem;font-weight:700;color:var(--apricot)}
.ct-routes-nav{margin-top:.7rem;display:grid;gap:.5rem}
.ct-routes-nav a{display:flex;align-items:center;gap:.9rem;padding:.85rem 1rem;border-radius:16px;background:rgba(254,250,243,.07);border:1px solid rgba(254,250,243,.15);color:var(--chalk);text-decoration:none;transition:background .25s ease,transform .25s ease,border-color .25s ease}
.ct-routes-nav a:hover,.ct-routes-nav a:focus-visible{background:var(--chalk);color:var(--forest);transform:translateX(4px)}
.ct-routes-nav a:focus-visible{outline:3px solid var(--amber-hi);outline-offset:2px}
.ct-routes-nav svg{width:40px;height:40px;padding:9px;border-radius:12px;background:var(--amber-btn);fill:var(--white);flex:none}
.ct-routes-nav b{display:block;font-size:1.05rem}
.ct-routes-nav small{display:block;font-size:.9rem;opacity:.85}
.ct-mail{display:inline-block;margin-top:1.1rem;color:var(--apricot);font-weight:600;text-decoration:underline;text-underline-offset:4px}

/* the three routes */
.ct-routes{display:grid;gap:1.25rem}
@media(min-width:1000px){.ct-routes{grid-template-columns:1fr 1fr;align-items:start}.ct-routes .book-call{grid-column:1/-1}}
.ct-page .ct-panel{border-radius:24px;scroll-margin-top:100px;transition:box-shadow .5s ease}
.ct-page .ct-panel.flash{box-shadow:0 0 0 4px var(--amber)}
.ct-page .book-call{background:var(--forest);color:var(--chalk);display:grid;gap:1rem;align-items:center}
@media(min-width:900px){.ct-page .book-call{grid-template-columns:1fr auto}.ct-page .book-call .body{grid-column:1}.ct-page .book-call h2{grid-column:1}.ct-page .book-call>p.mt-2{grid-column:2;grid-row:1/span 2;margin:0}}
.ct-page .book-call h2{color:var(--apricot)}
.ct-page .book-call .body{color:#d7e7dc}
.ct-page .book-call .btn.btn-fill{background:var(--amber-btn);border-color:var(--amber-btn);color:var(--white)}
.ct-page .book-call .btn.btn-fill:hover{background:var(--amber-hi);border-color:var(--amber-hi);color:var(--forest)}
.ct-page .free-sample{background:var(--white);box-shadow:0 0 0 1px var(--sand),0 30px 60px -45px rgba(0,82,45,.45)}
.ct-page .quick-enquiry{background:var(--peach)}
.ct-js .ct-panel{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .7s cubic-bezier(.2,.7,.2,1),box-shadow .5s ease}
.ct-panel.op-seen{opacity:1;transform:none}
.ct-page .ct-brief{margin-top:1.25rem;padding:0 clamp(1rem,2.5vw,1.75rem);border-radius:24px;box-shadow:0 0 0 2px rgba(0,82,45,.14) inset}

@media (prefers-reduced-motion:reduce){
  .ct-js .ct-title,.ct-js .ct-fade,.ct-js .ct-panel{clip-path:none!important;transform:none!important;opacity:1!important;transition:none!important}
  .ct-typing b{animation:none;opacity:1}
}