/* One clear reading order: websites, enquiries, software, then a conversation. */
:root { --header-height: 84px; --section-space: clamp(40px, 4.5vw, 64px); }
html { scroll-padding-top: calc(var(--header-height) + 22px); }
.site-header { position: sticky; top: 0; height: var(--header-height); z-index: 40; width: 100%; max-width: none; margin-inline: 0; padding-inline: max(var(--page-gutter), calc((100% - var(--page-width)) / 2)); background: #050707f2; box-shadow: 0 -2px #050707; backdrop-filter: blur(16px); }
.site-header .desktop-nav { gap: 34px; }
.site-header .desktop-nav a { display: flex; min-height: 44px; align-items: center; position: relative; font-size: 14px; }
.desktop-nav a[aria-current="location"] { color: #fff; }
.desktop-nav a[aria-current="location"]::after { content: ''; position: absolute; bottom: 0; inset-inline: 0; height: 1px; background: #cddbe3; }
.mobile-nav { position: fixed; top: var(--header-height); z-index: 39; max-height: calc(100dvh - var(--header-height)); overflow-y: auto; background: #080b0cf7; padding-inline: var(--page-gutter); }
.mobile-nav a[aria-current="location"] { color: #fff; }
.hero .eyebrow { letter-spacing: .13em; font-size: 11px; }
.hero-description { max-width: 38ch; }
.anchor-alias { display: block; position: absolute; inset: 0 auto auto 0; }
.experience-proof { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr) minmax(0, 1.55fr) auto; align-items: center; gap: 12px 24px; padding: 17px 24px; border: 1px solid #a4bdce66; border-radius: 4px; text-align: left; background: linear-gradient(115deg, #0e1924f5, #080f16f5 66%); box-shadow: 0 18px 60px #0004; }
/* The full-width sky measures outer bounds; keep its origin outside the frame's 1px border. */
.experience-proof > .nvl-sky { margin-left: -1px; }
.experience-proof > .proof-heading { display: flex; align-items: center; gap: 9px; max-width: none; color: #b8cbd8; font-size: 9px; line-height: 1.4; letter-spacing: .13em; text-align: left; }
.experience-proof > .proof-heading svg { width: 17px; height: 17px; flex: 0 0 17px; }
.experience-proof > .proof-heading::after { content: none; }
.experience-proof > p { display: flex; align-items: center; gap: 12px; margin: 0; padding: 0; border: 0; color: #b9c6cf; font-size: 13px; line-height: 1.35; }
.experience-proof > p + p { padding-left: 24px; border-left: 1px solid #a4bdce29; }
.experience-proof > p strong { color: #edf3f6; font: 400 42px/1 var(--serif); letter-spacing: -.025em; font-variant-numeric: lining-nums tabular-nums; }
.experience-proof > .proof-more { margin-left: auto; padding: 10px 12px; min-height: 44px; display: inline-flex; align-items: center; justify-content: space-between; gap: 14px; border: 1px solid #a4bdce4d; border-radius: 2px; color: #e1eaf0; font-size: 12px; line-height: 1.4; text-align: left; text-decoration: none; white-space: normal; background: linear-gradient(115deg, #bacfdf0c, #bacfdf03); transition: border-color .2s, background-color .2s; }
.experience-proof > .proof-more .ui-icon { width: 17px; height: 17px; color: #bcd9ed; }
.experience-proof > .proof-more:hover { border-color: #c4e3f2a6; background-color: #8bb7d21a; }
.experience-proof > .proof-more:focus-visible { outline: 2px solid #bbdff5; outline-offset: 5px; }
@media (prefers-reduced-motion: reduce) { .experience-proof > .proof-more { transition: none; } }
.section-heading { margin-bottom: 38px; }
.section-heading h2 { font-size: clamp(42px, 4.1vw, 58px); }
.section-heading > p { max-width: 44ch; font-size: 17px; line-height: 1.7; }
.website-services { position: relative; }
.experience-proof + .website-services { padding-top: 32px; }
.real-example.section-shell { border-top: 1px solid #b4c5d226; }
.website-examples-grid { gap: 28px; }
.website-example-body { padding: 26px 28px 22px; }
.website-example-body h3 { font-size: 31px; margin-bottom: 12px; }
.website-example-body .eyebrow { margin-bottom: 14px; }
.website-example-body > p:not(.eyebrow) { line-height: 1.65; margin-bottom: 16px; }
.project-note { display: grid; grid-template-columns: 1fr 1.2fr auto; gap: 32px; align-items: center; margin-top: 32px; border-top: 1px solid #b4c5d230; padding-top: 28px; }
.project-note h3 { color: #dfe3e1; font: 400 25px/1.35 var(--serif); margin-top: 9px; }
.project-note > p { color: #aebbc4; font-size: 14px; line-height: 1.7; max-width: 54ch; }
.project-note .eyebrow, .project-note-label { color: #9eacb7; font-size: 9px; line-height: 1.6; letter-spacing: .09em; }
.enquiry-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: start; gap: 56px; }
.enquiry-story { padding-top: 3px; }
.enquiry-story > .eyebrow { margin-bottom: 27px; color: #b8c3cb; font-size: 10px; }
.enquiry-story .example-steps { gap: 25px; }
.enquiry-story .example-steps h3 { font-size: 25px; }
.enquiry-story .example-steps p { font-size: 15px; }
.enquiry-story > .product-link { display: flex; justify-content: space-between; margin-top: 22px; border-top: 1px solid #a9bac63b; padding-block: 18px; text-decoration: none; font-size: 15px; }
.enquiry-story > .example-live-note { color: #a2afb8; font-size: 12px; line-height: 1.7; }
.enquiry-entry-points { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; padding-top: 26px; }
.enquiry-entry-points p { color: #aebbc4; font-size: 14px; line-height: 1.65; }
.enquiry-entry-points strong { display: block; color: #dde2e3; font-size: 15px; font-weight: 500; margin-bottom: 8px; }
.real-example .voice-examples { width: 100%; max-width: none; margin: 38px 0 0; padding: 0; }
.voice-examples > summary { padding: 22px 0; }
.voice-examples > summary strong { font-size: 27px; line-height: 1.3; }
.voice-examples .experience { padding: 32px 0 0; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 48px; }
.audio-example-title { color: #edf0ed; font: 400 32px/1.22 var(--serif); }
.experience-copy > .audio-example-intro { font-size: 16px !important; margin-top: 20px; }
.integrations .integration-feature { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: start; gap: 64px; }
.integrations .document-sheet { min-height: 0; }
.integrations .integration-story { padding: 0; }
.integration-story h3 { font-size: clamp(32px, 3vw, 42px); margin-block: 25px 22px; }
.integration-story > p { font-size: 16px; line-height: 1.75; margin-bottom: 20px; }
.integration-story > .software-review-note { color: #dce3e5; border-left: 1px solid #a6b9c3; padding-left: 19px; }
.integration-story .vendor-heading { flex-wrap: wrap; }
.integration-story .vendor-heading img { width: 135px; height: auto; padding: 0; }
.integration-story .integration-state { font-size: 9px; border: 0; padding: 0; }
.integration-story .product-link { font-size: 14px; }
.integrations .tools-disclosure { margin-top: 36px; }
.integrations .vendor-note { max-width: 100%; font-size: 12px; color: #94a4af; }
.contact.section-shell { display: block; text-align: left; padding-block: var(--section-space); overflow: visible; background: transparent; }
.contact-start { display: grid; grid-template-columns: 1.2fr .8fr; gap: 64px; align-items: center; }
.contact-start h2 { font-size: clamp(42px, 4.1vw, 58px); margin: 20px 0 0; }
.contact-start p:not(.eyebrow) { font-size: 17px; color: #b8c3ca; max-width: 40ch; line-height: 1.7; }
.contact-start .button { margin-top: 25px; }
.getting-started { list-style: none; padding: 32px 0 0; margin: 42px 0 0; border-top: 1px solid #b4c5d230; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.getting-started li { display: flex; gap: 18px; }
.getting-started li > span { color: #a3b0b8; font-size: 11px; padding-top: 5px; }
.getting-started h3 { font: 400 25px/1.3 var(--serif); color: #e5e9e5; }
.getting-started p { color: #aebbc4; font-size: 14px; line-height: 1.6; margin-top: 10px; }
.questions-disclosure { margin-top: 36px; border-block: 1px solid #b4c5d230; }
.questions-disclosure > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; min-height: 74px; gap: 20px; font-size: 16px; cursor: pointer; color: #cad3d9; }
.questions-disclosure > summary::-webkit-details-marker { display: none; }
.questions-disclosure > summary > span { font-size: 26px; }
.questions-disclosure[open] > summary > span { transform: rotate(45deg); }
.faq.faq-inline { display: block; padding: 0 0 24px; border: 0; }
.faq-inline .faq-list { margin: 0; }
.faq-inline summary { font-size: 16px; padding-block: 20px; }
.faq-inline details p { max-width: 75ch; font-size: 15px; }
.contact-constellation { display: none; }
@media (max-width: 1000px) {
 .experience-proof { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) auto; gap: 10px 24px; padding: 15px 22px; }
 .experience-proof > .proof-heading { grid-column: 1 / -1; }
 .experience-proof > .proof-heading::after { content: ''; height: 1px; flex: 1; margin-left: 6px; background: linear-gradient(90deg, #b5ced333, #b5ced308); }
 .experience-proof > p strong { font-size: 38px; }
 .experience-proof > .proof-more { margin-left: 0; min-height: 44px; }
 .project-note { grid-template-columns: 1fr 1.2fr; gap: 22px 32px; }
 .project-note-label { display: none; }
 .enquiry-layout { gap: 32px; }
 .integrations .integration-feature { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 32px; }
 .contact-start { gap: 32px; }
}
@media (max-width: 800px) {
 .enquiry-layout, .integrations .integration-feature, .contact-start { grid-template-columns: 1fr; gap: 34px; }
 .enquiry-visual { max-width: none; }
 .integrations .integration-story { max-width: 600px; }
 .integrations .document-workspace { max-width: none; }
 .getting-started { grid-template-columns: 1fr; gap: 27px; }
 .voice-examples .experience { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 680px) {
 .experience-proof { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: 8px 18px; padding: 13px 18px 8px; }
 .experience-proof > .proof-more { grid-column: 1 / -1; width: 100%; padding: 6px 0; border: 0; border-top: 1px solid #a4bdce26; border-radius: 0; background: transparent; }
 .experience-proof > .proof-more:hover { background: transparent; }
}
@media (max-width: 580px) {
 :root { --header-height: 76px; }
 .site-header .brand { gap: 8px; }
 .site-header .brand .nvl-wordmark { width: 128px; }
 .site-header .brand-star { width: 26px; height: 26px; }
 .site-header .header-cta { font-size: 12px; padding: 9px 10px 9px 26px; margin-right: 5px; gap: 8px; }
 .site-header .header-cta svg { width: 16px; }
 .site-header .menu-toggle { min-width: 36px; }
 .experience-proof > .proof-heading { font-size: 9px; gap: 8px; letter-spacing: .11em; }
 .experience-proof > p { display: grid; gap: 2px; align-self: start; font-size: 12px; }
 .experience-proof > p + p { padding-left: 18px; }
 .experience-proof > p strong { font-size: 34px; }
 .experience-proof > .proof-more { font-size: 12px; }
 .section-heading h2, .contact-start h2 { font-size: clamp(37px, 9.8vw, 48px); }
 .website-example-body { padding: 24px 22px 20px; }
 .website-example-body h3 { font-size: 29px; }
 .project-note { grid-template-columns: 1fr; gap: 14px; }
 .project-note h3 { font-size: 24px; }
 .enquiry-entry-points { gap: 20px; padding-top: 22px; }
 .enquiry-entry-points p { font-size: 13px; }
 .enquiry-entry-points strong { font-size: 14px; }
 .enquiry-story .example-steps h3 { font-size: 24px; }
 .enquiry-story .example-steps { gap: 23px; }
 .real-example .voice-examples { margin-top: 30px; }
 .voice-examples > summary strong { font-size: 24px; }
 .audio-example-title { font-size: 29px; }
 .integrations .tools-disclosure > summary > span:first-child { font-size: 24px; }
 .getting-started { margin-top: 34px; padding-top: 28px; }
 .questions-disclosure > summary { font-size: 15px; }
}

@media (max-width: 360px) { .site-header .brand .nvl-wordmark { width: 116px; } }

/* Resolve older editorial selectors at phone sizes; retain desktop proportions. */
@media (max-width: 580px), (max-width: 1000px) and (max-height: 500px) {
 .integrations .integration-story h3 { font-size: 32px; line-height: 1.14; margin: 20px 0 16px; }
 .integrations .integration-story > p { font-size: 16px; line-height: 1.65; margin-bottom: 18px; }
 .integrations .integration-story .product-link { padding-top: 12px; }
 .integrations .document-workspace-header { padding-block: 18px; }
 .integrations .document-sheet { padding-block: 22px; }
 .integrations .document-kicker { margin-bottom: 10px; }
 .integrations .document-intro { margin-bottom: 18px; }
 .integrations .document-enquiry { font-size: 20px; line-height: 1.4; padding-bottom: 16px; margin-bottom: 18px; }
 .integrations .document-fields { gap: 16px; margin-bottom: 0; }
 .integrations .document-review-note { margin-top: 18px; }
 .integrations .document-workspace-footer { padding-block: 14px; }
}
@media (max-width: 360px) {
 .enquiry-entry-points { grid-template-columns: 1fr; gap: 14px; }
 .enquiry-entry-points > p + p { border-top: 1px solid #b4c5d226; padding-top: 14px; }
}