:root {
  --m-ink:#171717;
  --m-muted:#625d59;
  --m-peach:#f6a276;
  --m-peach-dark:#ee8d5e;
  --m-peach-soft:#fff2ea;
  --m-line:#eadfd8;
  --m-seriff:Georgia,"Times New Roman",serif;
}
html { scroll-padding-top: 74px; }
body { font-family: Arial,"Helvetica Neue",sans-serif; color:var(--m-ink); line-height:1.65; }
.mobile-site { width:100%; overflow:hidden; background:#fff; }
.mobile-site img { display:block; width:100%; height:auto; }
.m-container { width:calc(100% - 34px); margin-inline:auto; }
.m-section, .m-approach, .m-contact { scroll-margin-top:74px; }
.m-header { height:74px; position:sticky; top:0; z-index:100; display:flex; align-items:center; justify-content:space-between; padding:0 17px; background:rgba(255,255,255,.97); border-bottom:1px solid rgba(234,223,216,.55); backdrop-filter:blur(10px); }
.m-brand { display:flex; align-items:center; gap:10px; min-width:0; text-decoration:none; color:var(--m-ink); }
.m-brand img { width:43px; height:43px; flex:none; }
.m-brand span { display:flex; flex-direction:column; min-width:0; }
.m-brand strong { font-family:var(--m-seriff); font-size:1.08rem; font-weight:400; line-height:1.1; white-space:nowrap; }
.m-brand small { font-size:.58rem; margin-top:4px; white-space:nowrap; }
.m-menu-button { width:42px; height:42px; padding:0; border:0; background:transparent; cursor:pointer; flex:none; }
.m-menu-button span { display:block; width:23px; height:1.5px; margin:5px auto; background:var(--m-ink); transition:transform .25s ease, opacity .25s ease; }
.m-menu-button[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.m-menu-button[aria-expanded="true"] span:nth-child(2){opacity:0}
.m-menu-button[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.m-nav { position:fixed; z-index:99; left:0; right:0; top:74px; display:grid; padding:10px 22px 18px; background:#fff; box-shadow:0 15px 35px rgba(42,32,24,.10); transform:translateY(-130%); opacity:0; visibility:hidden; transition:transform .3s ease,opacity .3s ease,visibility .3s; }
.m-nav.open { transform:translateY(0); opacity:1; visibility:visible; }
.m-nav a { padding:12px 0; border-bottom:1px solid #f2ebe6; text-decoration:none; color:var(--m-ink); font-size:.94rem; }
.m-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:43px; padding:0 19px; border:1px solid var(--m-peach); border-radius:7px; color:var(--m-ink); text-decoration:none; font-size:.84rem; background:transparent; }
.m-button-primary { color:#fff; background:var(--m-peach); border-color:var(--m-peach); }
.m-hero { background:#fff; }
.m-hero-copy { position:relative; min-height:390px; padding:48px 28px 38px; overflow:hidden; }
.m-hero-copy::before { content:""; position:absolute; left:-58px; top:24px; width:130px; height:320px; background:url('../images/mobile/floral-branch.svg') center/contain no-repeat; transform:scaleX(-1); opacity:.62; pointer-events:none; }
.m-hero-copy > * { position:relative; z-index:1; }
.m-hero h1 { margin:0; font-family:var(--m-seriff); font-size:clamp(2rem,9vw,2.35rem); font-weight:400; line-height:1.33; }
.m-hero h1::after, .mobile-site h2::after { content:""; display:block; width:34px; height:1px; margin-top:16px; background:var(--m-peach); }
.m-hero-copy p { margin:17px 0 20px; font-size:.91rem; color:#393532; }
.m-scroll-cue { display:flex; align-items:center; gap:10px; width:max-content; margin-top:28px; color:#6c6661; text-decoration:none; font-size:.78rem; }
.m-scroll-cue span { width:19px; height:19px; display:grid; place-items:center; border:1px solid var(--m-peach); border-radius:50%; color:var(--m-peach); }
.m-hero-photo { position:relative; height:455px; margin:0; overflow:hidden; background:#f7f2eb; }
.m-hero-photo::before { content:""; position:absolute; z-index:1; inset:0 0 auto; height:18%; background:linear-gradient(180deg,#fff,rgba(255,255,255,0)); pointer-events:none; }
.m-hero-photo img { width:100%; height:100%; object-fit:cover; object-position:50% 27%; }
.mobile-site h2 { margin:0 0 24px; font-family:var(--m-seriff); font-size:2rem; line-height:1.18; font-weight:400; }
.mobile-site h2.m-centered { text-align:center; }
.mobile-site h2.m-centered::after { margin-inline:auto; }
.m-about { padding:38px 0 48px; }
.m-about-photo { height:310px; margin:0; overflow:hidden; border-radius:7px; }
.m-about-photo img { height:100%; object-fit:cover; }
.m-about-copy { position:relative; padding:32px 7px 0; }
.m-about-copy::after { content:""; position:absolute; right:-43px; top:80px; width:160px; height:280px; background:url('../images/mobile/floral-branch.svg') center/contain no-repeat; opacity:.30; pointer-events:none; }
.m-about-copy > * { position:relative; z-index:1; }
.m-about-copy p { margin:0 0 12px; font-size:.94rem; line-height:1.75; }
.m-credentials { display:grid; grid-template-columns:repeat(2,1fr); gap:24px 14px; margin:28px 0; }
.m-credentials > div, .m-audience-grid > div { text-align:center; font-size:.82rem; line-height:1.42; }
.m-icon { width:58px; height:58px; margin:0 auto 8px; display:grid; place-items:center; border:1px solid #f3d9ca; border-radius:50%; background:var(--m-peach-soft); color:var(--m-peach-dark); font-family:var(--m-seriff); font-size:1.45rem; }
.m-actions { display:flex; flex-wrap:wrap; gap:12px; }
.m-services { padding:54px 0 62px; border-top:1px solid rgba(234,223,216,.5); }
.m-cards { display:grid; gap:18px; }
.m-card { display:grid; grid-template-columns:72px 1fr; gap:16px; min-height:188px; padding:24px 21px; border:1px solid var(--m-line); border-radius:7px; background:#fff; }
.m-card .m-icon { width:64px; height:64px; margin:0; }
.m-card h3 { margin:0 0 8px; font-family:var(--m-seriff); font-size:1.35rem; font-weight:400; }
.m-card p { margin:0 0 10px; font-size:.88rem; line-height:1.66; }
.m-card a { color:var(--m-peach-dark); text-decoration:none; font-size:.86rem; }
.m-audience { padding:54px 0 64px; background:#fffaf6; }
.m-audience-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:30px 18px; }
.m-audience-grid .m-icon { width:62px; height:62px; }
.m-approach { background:#fbfaf7; }
.m-approach-copy { position:relative; padding:54px 26px 48px; overflow:hidden; }
.m-approach-copy::before { content:""; position:absolute; left:-38px; bottom:-12px; width:130px; height:190px; background:url('../images/mobile/floral-branch.svg') center/contain no-repeat; opacity:.4; transform:rotate(-16deg); }
.m-approach-copy > * { position:relative; z-index:1; }
.m-approach-copy p { margin:0 0 10px; font-size:.94rem; line-height:1.75; }
.m-approach-copy .m-button { margin-top:12px; }
.m-approach figure { height:310px; margin:0; overflow:hidden; }
.m-approach figure img { height:100%; object-fit:cover; }
.m-cta { position:relative; padding:48px 24px 52px; text-align:center; overflow:hidden; background:#fff; }
.m-cta::before,.m-cta::after { content:""; position:absolute; top:-20px; width:130px; height:125px; background:url('../images/mobile/floral-branch.svg') center/contain no-repeat; opacity:.35; }
.m-cta::before { left:-25px; transform:rotate(72deg); }
.m-cta::after { right:-25px; transform:rotate(-72deg) scaleX(-1); }
.m-cta h2 { position:relative; z-index:1; font-size:1.82rem; }
.m-cta h2::after { margin-inline:auto; }
.m-cta .m-button { position:relative; z-index:1; }
.m-contact { background:#fff; }
.m-contact-info { display:grid; gap:12px; padding:46px 26px; }
.m-contact-info h2 { margin-bottom:6px; }
.m-contact-info a,.m-contact-info span { color:var(--m-ink); text-decoration:none; font-size:.92rem; }
.m-contact > img,.m-contact > a img { height:240px; object-fit:cover; }
.m-footer { display:flex; flex-direction:column; align-items:center; gap:8px; padding:20px 17px; color:#77716c; font-size:.7rem; text-align:center; background:#fff; }
.m-footer a { color:inherit; }

/* Motion: normal free scrolling; no snapping, no locked sections. */
html.motion-ready .mobile-site .m-reveal { opacity:0; transform:translateY(18px); transition:opacity .72s cubic-bezier(.22,.61,.36,1),transform .72s cubic-bezier(.22,.61,.36,1); }
html.motion-ready .mobile-site .m-reveal.motion-visible { opacity:1; transform:none; }

@media (max-width:370px) {
  .m-brand strong { font-size:1rem; }
  .m-brand small { font-size:.53rem; }
  .m-hero h1 { font-size:1.9rem; }
  .m-card { grid-template-columns:62px 1fr; padding-inline:17px; }
  .m-card .m-icon { width:56px; height:56px; }
}
@media (prefers-reduced-motion:reduce) {
  html.motion-ready .mobile-site .m-reveal { opacity:1; transform:none; transition:none; }
}