:root {
  --plum: #6b55ba;
  --plum-deep: #3b3164;
  --mint: #7bcbb0;
  --butter: #ffd65f;
  --paper: #fffaf3;
  --lilac-pale: #eeeaff;
  --ink: #29263b;
  --line: rgba(41, 38, 59, .18);
  --display: "Fraunces", Georgia, serif;
  --body: "Manrope", Arial, sans-serif;
  --mono: "DM Mono", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--body); font-size: 16px; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
h1, h2, h3, p { margin-top: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.skip-link { position: absolute; z-index: 99; top: -5rem; left: 1rem; padding: .75rem 1rem; background: var(--butter); color: var(--ink); font-weight: 800; }
.skip-link:focus { top: 1rem; }

.topbar { position: absolute; z-index: 10; display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 1.35rem clamp(1.25rem, 5vw, 6.5rem); }
.topbar.is-sticky { position: fixed; padding-top: .85rem; padding-bottom: .85rem; background: rgba(255, 250, 243, .96); box-shadow: 0 3px 17px rgba(41, 38, 59, .1); }
.brand { display: inline-flex; align-items: center; gap: .65rem; color: var(--plum-deep); font-size: 1.14rem; font-weight: 800; letter-spacing: -.06em; line-height: 1; }
.brand b { color: var(--plum); font-family: var(--display); font-weight: 700; letter-spacing: -.09em; }
.brand-symbol { position: relative; display: block; width: 2.15rem; height: 1.75rem; border: 2px solid var(--plum); border-radius: 50% 50% 42% 50%; transform: rotate(-10deg); }
.brand-symbol::after { position: absolute; right: .05rem; bottom: -.29rem; width: .52rem; height: .5rem; border-right: 2px solid var(--plum); content: ""; transform: skewX(-28deg); }
.brand-symbol i { position: absolute; top: .54rem; width: .19rem; height: .19rem; border-radius: 50%; background: var(--mint); }.brand-symbol i:nth-child(1) { left: .46rem; }.brand-symbol i:nth-child(2) { left: .91rem; }.brand-symbol i:nth-child(3) { left: 1.36rem; }
.nav { display: flex; align-items: center; gap: clamp(1rem, 2.5vw, 2.5rem); font-size: .77rem; font-weight: 800; }
.nav > a:not(.nav-cta) { border-bottom: 2px solid transparent; padding-bottom: .2rem; }.nav > a:not(.nav-cta):hover { border-color: var(--mint); }
.nav-cta { padding: .7rem .95rem; border-radius: 99px; background: var(--plum); color: white; box-shadow: 3px 3px 0 var(--mint); transition: transform .2s, box-shadow .2s; }.nav-cta:hover { box-shadow: 5px 5px 0 var(--mint); transform: translate(-2px, -2px); }.nav-cta span { padding-left: .3rem; }
.menu-button { display: none; }

.hero { position: relative; display: grid; min-height: min(810px, 100svh); grid-template-columns: minmax(0, 1fr) minmax(430px, .92fr); overflow: hidden; background: var(--paper); isolation: isolate; }
.hero::before { position: absolute; z-index: -1; top: -22vw; right: -8vw; width: 63vw; height: 63vw; min-width: 690px; min-height: 690px; border-radius: 50%; background: var(--lilac-pale); content: ""; }
.hero-copy { align-self: center; padding: 9rem 2rem 5.5rem clamp(1.25rem, 9.5vw, 11.5rem); }
.eyebrow, .kicker { display: flex; align-items: center; gap: .7rem; margin-bottom: 1.5rem; color: var(--plum-deep); font-family: var(--mono); font-size: .65rem; letter-spacing: .09em; text-transform: uppercase; }
.eyebrow span, .kicker span { display: inline-block; width: 1.6rem; height: 1px; background: currentColor; }
h1 { max-width: 730px; margin-bottom: 1.5rem; color: var(--plum-deep); font-family: var(--display); font-size: clamp(3.45rem, 6.5vw, 7rem); font-weight: 600; letter-spacing: -.075em; line-height: .93; }
h1 em, .contact h2 em { color: var(--plum); font-style: normal; }
.hero-text { max-width: 560px; margin-bottom: 2.15rem; font-size: clamp(1rem, 1.32vw, 1.16rem); font-weight: 600; line-height: 1.65; }
.hero-actions { display: flex; align-items: center; gap: 1.4rem; }.button { display: inline-flex; align-items: center; justify-content: space-between; min-height: 3.25rem; gap: 2.5rem; border: 0; border-radius: 99px; padding: .75rem .95rem .75rem 1.3rem; font-size: .9rem; font-weight: 800; transition: transform .2s, box-shadow .2s; }.button:hover { transform: translateY(-3px); box-shadow: 0 5px 0 rgba(41, 38, 59, .16); }.button span { font-size: 1.35rem; line-height: .6; }.button-plum { background: var(--plum); color: white; }.button-mint { background: var(--mint); color: var(--ink); }
.quiet-link { border-bottom: 1px solid var(--plum); padding-bottom: .2rem; color: var(--plum-deep); font-size: .84rem; font-weight: 800; }.quiet-link span { color: var(--plum); }
.hero-note { display: flex; align-items: center; gap: .45rem; margin: 2.25rem 0 0; color: rgba(59, 49, 100, .78); font-family: var(--mono); font-size: .66rem; letter-spacing: .03em; }.hero-note span { color: var(--plum); font-size: 1.1rem; }

.hero-art { position: relative; min-height: 810px; overflow: hidden; }.thread { fill: none; stroke: var(--plum); stroke-width: 4; stroke-linecap: round; stroke-dasharray: 1 11; }.thread-hero { position: absolute; z-index: 1; top: 13%; left: -19%; width: 110%; overflow: visible; }.word-card { position: absolute; z-index: 3; top: 21%; left: 18%; width: min(66%, 335px); padding: 1.35rem 1.45rem 1.55rem; background: var(--plum); color: white; box-shadow: 15px 15px 0 rgba(123, 203, 176, .9); transform: rotate(-5deg); }.word-card::before { position: absolute; top: .65rem; right: .65rem; bottom: .65rem; left: .65rem; border: 1px solid rgba(255, 255, 255, .48); content: ""; }.card-kicker { position: relative; z-index: 1; color: var(--butter); font-family: var(--mono); font-size: .55rem; letter-spacing: .1em; text-transform: uppercase; }.word-card p { position: relative; z-index: 1; margin: 2.7rem 0 0; font-family: var(--display); font-size: clamp(1.8rem, 3vw, 3.1rem); font-weight: 500; letter-spacing: -.07em; line-height: .91; }.word-card strong { color: var(--butter); font-weight: 600; }.card-spark { position: absolute; z-index: 1; right: 1.55rem; bottom: 1.15rem; color: var(--mint); font-size: 1.6rem; }.bubble { position: absolute; z-index: 2; display: grid; place-items: center; border: 2px solid var(--ink); border-radius: 50%; color: var(--ink); font-family: var(--display); font-size: 2.6rem; line-height: 1; }.bubble::after { position: absolute; bottom: -11px; left: 13%; width: 20px; height: 18px; border-bottom: 2px solid var(--ink); content: ""; transform: rotate(28deg); }.bubble-lilac { top: 13%; right: 10%; width: 7.2rem; height: 6.3rem; background: var(--lilac-pale); }.bubble-mint { right: 4%; bottom: 17%; width: 5.4rem; height: 4.7rem; background: var(--mint); font-family: var(--body); font-size: 2rem; }.bubble-yellow { bottom: 9%; left: 8%; width: 8.1rem; height: 7rem; background: var(--butter); }.bubble-ink { top: 53%; left: 3%; width: 4.9rem; height: 4.3rem; border-color: var(--plum-deep); background: var(--plum-deep); color: white; font-size: 2rem; }.bubble-ink::after { border-color: var(--plum-deep); }.art-label { position: absolute; z-index: 3; color: var(--plum-deep); font-family: var(--mono); font-size: .62rem; line-height: 1.45; letter-spacing: .04em; text-transform: uppercase; }.art-label b { color: var(--plum); font-weight: 500; }.label-one { top: 57%; right: 16%; transform: rotate(5deg); }.label-two { bottom: 36%; left: 24%; transform: rotate(-6deg); }.small-spark { position: absolute; z-index: 3; color: var(--plum); }.spark-one { top: 16%; left: 10%; font-size: 1.45rem; }.spark-two { right: 28%; bottom: 14%; color: var(--butter); font-size: 2rem; }

.section-pad { padding-right: clamp(1.25rem, 9.5vw, 11.5rem); padding-left: clamp(1.25rem, 9.5vw, 11.5rem); }.care { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(260px, .7fr); gap: clamp(3rem, 12vw, 13rem); padding-top: clamp(5.2rem, 10vw, 9rem); padding-bottom: clamp(5.2rem, 10vw, 9rem); }.care h2, .specialties h2, .path h2, .contact h2 { margin: 0; font-family: var(--display); font-size: clamp(2.75rem, 5.05vw, 5.6rem); font-weight: 600; letter-spacing: -.075em; line-height: .94; }.care-copy { align-self: end; }.care-copy p { max-width: 400px; font-size: 1rem; font-weight: 600; line-height: 1.68; }.care-copy p + p { margin-top: 1.1rem; }.arrow-link { display: inline-flex; gap: .65rem; margin-top: 1.25rem; border-bottom: 1px solid var(--plum); padding-bottom: .25rem; color: var(--plum-deep); font-size: .84rem; font-weight: 800; }.arrow-link span { color: var(--plum); }

.specialties { overflow: hidden; background: var(--plum-deep); color: white; }.specialties-intro { display: grid; grid-template-columns: 1.2fr .6fr; align-items: end; gap: 3rem; padding-top: clamp(5rem, 9vw, 8rem); padding-bottom: 3.4rem; }.kicker-light { color: var(--mint); }.specialties-intro h2 { color: white; }.specialties-intro > p { max-width: 370px; margin: 0 0 .35rem; color: rgba(255,255,255,.82); font-size: .97rem; font-weight: 600; line-height: 1.65; }.specialties-grid { display: grid; grid-template-columns: repeat(4, 1fr); }.specialty { position: relative; min-height: 390px; padding: 1.65rem clamp(1.15rem, 3vw, 3rem) 2.2rem; color: var(--ink); overflow: hidden; }.specialty::after { position: absolute; right: -5rem; bottom: -6rem; width: 15rem; height: 15rem; border: 1px solid rgba(41,38,59,.4); border-radius: 50%; content: ""; }.specialty h3 { position: relative; z-index: 1; margin: 3.2rem 0 1rem; font-family: var(--display); font-size: clamp(1.85rem, 2.6vw, 3.2rem); font-weight: 600; letter-spacing: -.075em; line-height: .9; }.specialty p { position: relative; z-index: 1; max-width: 250px; margin: 0; font-size: .86rem; font-weight: 700; line-height: 1.6; }.specialty-mark { position: relative; z-index: 1; display: grid; width: 2.8rem; height: 2.8rem; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-family: var(--display); font-size: 1.5rem; }.specialty-mint { background: var(--mint); }.specialty-lilac { background: var(--lilac-pale); }.specialty-yellow { background: var(--butter); }.specialty-paper { background: var(--paper); }

.path { display: grid; grid-template-columns: minmax(230px, .7fr) minmax(0, 1fr); gap: clamp(3rem, 9vw, 11rem); padding-top: clamp(5rem, 10vw, 9rem); padding-bottom: clamp(5rem, 10vw, 9rem); }.path-art { position: relative; min-height: 500px; overflow: hidden; background: var(--lilac-pale); }.thread-path { position: absolute; top: -2%; left: 0; width: 100%; height: 100%; stroke: var(--plum-deep); }.path-dot { position: absolute; width: 1rem; height: 1rem; border-radius: 50%; background: var(--mint); }.dot-one { top: 21%; left: 59%; }.dot-two { top: 52%; left: 17%; background: var(--butter); }.dot-three { right: 20%; bottom: 18%; background: var(--plum); }.path-content { align-self: center; }.path-content h2 { max-width: 680px; }.steps { display: grid; gap: 1.45rem; margin: 2.5rem 0 0; padding: 0; list-style: none; }.steps li { display: grid; grid-template-columns: 3rem 1fr; gap: .75rem; padding-bottom: 1.25rem; border-bottom: 1px solid var(--line); }.steps b { color: var(--plum); font-family: var(--mono); font-size: .66rem; letter-spacing: .04em; }.steps h3 { margin-bottom: .35rem; font-size: 1rem; font-weight: 800; }.steps p { max-width: 460px; margin: 0; color: rgba(41,38,59,.76); font-size: .89rem; font-weight: 600; line-height: 1.55; }

.contact { position: relative; display: grid; grid-template-columns: .9fr .84fr; gap: clamp(3rem, 11vw, 13rem); overflow: hidden; padding-top: clamp(5rem, 10vw, 9rem); padding-bottom: clamp(5rem, 10vw, 9rem); background: var(--plum); color: white; }.contact::before { position: absolute; right: -13rem; bottom: -15rem; width: 41rem; height: 41rem; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; content: ""; }.contact-copy, .contact-form { position: relative; z-index: 1; }.contact h2 { color: white; }.contact-copy > p:not(.kicker) { max-width: 415px; margin: 1.45rem 0 2rem; color: rgba(255,255,255,.84); font-size: 1rem; font-weight: 600; line-height: 1.65; }.contact-details { display: grid; gap: .85rem; font-size: .82rem; font-weight: 700; }.contact-details a, .contact-details > span { display: flex; align-items: center; gap: .65rem; width: max-content; max-width: 100%; }.contact-details a:hover { color: var(--butter); }.contact-details a span, .contact-details > span i { color: var(--mint); font-size: 1.25rem; font-style: normal; }.contact-details b { padding-left: .2rem; }.contact-form { display: grid; gap: 1.05rem; align-self: center; padding: clamp(1.4rem, 3vw, 2.3rem); background: var(--paper); color: var(--ink); box-shadow: 13px 13px 0 var(--mint); }.contact-form label { display: grid; gap: .45rem; font-family: var(--mono); font-size: .6rem; font-weight: 500; letter-spacing: .07em; text-transform: uppercase; }.contact-form input, .contact-form select, .contact-form textarea { width: 100%; border: 0; border-bottom: 1px solid rgba(41,38,59,.36); border-radius: 0; outline: 0; padding: .55rem 0 .6rem; background: transparent; color: var(--ink); font-family: var(--body); font-size: .91rem; font-weight: 700; resize: vertical; }.contact-form select { cursor: pointer; }.contact-form textarea { min-height: 5.2rem; }.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color: var(--plum); }.contact-form .button { width: 100%; margin-top: .25rem; }.form-note { margin: 0; color: rgba(41,38,59,.62); font-size: .65rem; font-weight: 700; line-height: 1.45; text-align: center; }

footer { display: grid; grid-template-columns: 1fr 1.05fr .75fr; gap: 2rem; padding: 2.7rem clamp(1.25rem, 9.5vw, 11.5rem) 1.4rem; background: #282241; color: white; }.footer-brand { color: white; align-self: start; }.footer-brand .brand-symbol { border-color: var(--mint); }.footer-brand .brand-symbol::after { border-color: var(--mint); }.footer-brand .brand-symbol i { background: var(--butter); }.footer-brand b { color: var(--mint); } footer > p { margin: 0; color: rgba(255,255,255,.72); font-size: .82rem; font-weight: 600; line-height: 1.6; }.footer-links { display: grid; gap: .55rem; justify-items: start; font-family: var(--mono); font-size: .65rem; letter-spacing: .04em; }.footer-links a:hover { color: var(--mint); }.copyright { grid-column: 1 / -1; padding-top: 1.3rem; border-top: 1px solid rgba(255,255,255,.17); color: rgba(255,255,255,.5); font-family: var(--mono); font-size: .56rem; letter-spacing: .09em; text-transform: uppercase; }
.whatsapp-float { position: fixed; z-index: 7; right: 1.3rem; bottom: 1.3rem; display: flex; align-items: center; gap: .5rem; padding: .68rem .92rem; border: 2px solid var(--plum-deep); border-radius: 99px; background: var(--mint); color: var(--ink); box-shadow: 4px 4px 0 var(--plum-deep); font-size: .75rem; font-weight: 800; transition: transform .2s; }.whatsapp-float:hover { transform: translate(-2px, -2px); }.whatsapp-float svg { width: 1.3rem; height: 1.3rem; }
:focus-visible { outline: 3px solid var(--butter); outline-offset: 4px; }

@media (max-width: 980px) { .hero { grid-template-columns: minmax(0, 1fr) minmax(350px, .74fr); }.hero-copy { padding-left: clamp(1.25rem, 7vw, 5rem); }.specialties-grid { grid-template-columns: 1fr 1fr; }.specialty { min-height: 330px; }.path { gap: 4rem; }.section-pad { padding-right: clamp(1.25rem, 7vw, 5rem); padding-left: clamp(1.25rem, 7vw, 5rem); } }
@media (max-width: 730px) { .topbar { padding-top: 1rem; padding-bottom: 1rem; }.menu-button { position: relative; z-index: 2; display: grid; width: 2.65rem; height: 2.65rem; place-content: center; gap: .32rem; border: 1px solid var(--plum); border-radius: 50%; background: var(--paper); color: var(--plum-deep); }.menu-button i { display: block; width: 1rem; height: 2px; background: currentColor; transition: transform .2s; }.menu-button[aria-expanded="true"] i:first-of-type { transform: translateY(3px) rotate(45deg); }.menu-button[aria-expanded="true"] i:last-of-type { transform: translateY(-3px) rotate(-45deg); }.nav { position: absolute; top: 0; right: 0; left: 0; display: grid; gap: 1.35rem; padding: 5.7rem 1.5rem 1.8rem; background: var(--paper); box-shadow: 0 5px 12px rgba(41,38,59,.1); transform: translateY(-115%); transition: transform .23s ease; }.nav.is-open { transform: translateY(0); }.nav-cta { width: max-content; }.hero { grid-template-columns: 1fr; min-height: auto; }.hero-copy { padding-top: 7.5rem; padding-bottom: 3.5rem; }.hero-art { min-height: 490px; }.hero::before { top: auto; bottom: -28%; right: -40%; width: 120vw; height: 120vw; min-width: 0; min-height: 0; }.word-card { top: 13%; left: 24%; width: 54%; }.thread-hero { top: 9%; left: 0; width: 100%; }.bubble-lilac { top: 10%; right: 9%; }.bubble-ink { top: 52%; left: 13%; }.bubble-yellow { bottom: 8%; left: 18%; }.bubble-mint { right: 12%; bottom: 20%; }.label-one { top: 55%; right: 18%; }.label-two { bottom: 30%; left: 32%; }.care, .specialties-intro, .path, .contact { grid-template-columns: 1fr; }.care { gap: 1.7rem; }.specialties-intro { gap: 1.6rem; }.specialties-intro > p { max-width: 500px; }.path { gap: 2.5rem; }.path-art { min-height: 390px; max-width: 520px; }.contact { gap: 2.9rem; }.contact-form { max-width: 570px; }.contact-details { margin-bottom: .5rem; } footer { grid-template-columns: 1fr 1fr; }.copyright { grid-column: 1 / -1; } }
@media (max-width: 510px) { h1 { font-size: clamp(3.05rem, 15vw, 4.3rem); }.eyebrow, .kicker { font-size: .55rem; }.hero-actions { flex-direction: column; align-items: flex-start; gap: 1.15rem; }.hero-art { min-height: 430px; }.word-card { top: 12%; left: 21%; width: 59%; padding: 1.1rem 1.2rem 1.25rem; box-shadow: 10px 10px 0 rgba(123,203,176,.9); }.word-card p { margin-top: 2.1rem; font-size: 1.75rem; }.bubble-lilac { width: 5.6rem; height: 5rem; font-size: 2.2rem; }.bubble-ink { width: 4rem; height: 3.6rem; }.bubble-yellow { width: 6.1rem; height: 5.4rem; font-size: 2.1rem; }.bubble-mint { width: 4.2rem; height: 3.7rem; }.small-spark { display: none; }.specialties-grid { grid-template-columns: 1fr; }.specialty { min-height: 285px; }.path-art { min-height: 350px; }.contact-form { padding: 1.3rem; box-shadow: 8px 8px 0 var(--mint); }.contact-details a, .contact-details > span { align-items: flex-start; }.whatsapp-float { padding: .7rem; right: .9rem; bottom: .9rem; }.whatsapp-float span { display: none; } footer { grid-template-columns: 1fr; }.copyright { grid-column: auto; }.footer-links { order: 2; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }