:root {
    --page-max: 1440px;
    --page-pad: clamp(20px, 4.5vw, 72px);
}

body {
    overflow-x: hidden;
}

.public-page {
    min-height: 100vh;
}

.public-page a {
    text-decoration: none;
}

.page-hero {
    max-width: var(--page-max);
    margin: 0 auto;
    padding: clamp(110px, 13vw, 190px) var(--page-pad) clamp(90px, 10vw, 150px);
    position: relative;
}

.page-hero:after {
    content: none;
}

.services-page .services-hero {
    position: relative;
}

.page-hero .orbital-visual,
.services-page .services-hero .orbital-visual {
    position: absolute;
    z-index: 0;
    right: 3%;
    top: 10%;
    width: clamp(260px, 31vw, 430px);
    aspect-ratio: 1;
    pointer-events: none;
    overflow: visible;
}

.orbital-visual .orbit {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 42%;
    border: 1px solid rgba(63, 135, 145, .22);
    border-radius: 50%;
    transform: translate(-50%, -50%) rotate(0deg);
    transform-origin: center;
    animation: visual-tech-orbit-one 18s linear infinite;
    box-shadow: 0 0 12px rgba(63, 135, 145, .025);
}

.orbital-visual .orbit-two {
    width: 88%;
    height: 50%;
    border-color: rgba(63, 135, 145, .18);
    transform: translate(-50%, -50%) rotate(58deg);
    animation-name: visual-tech-orbit-two;
    animation-duration: 14s;
}

.orbital-visual .orbit-three {
    width: 76%;
    height: 58%;
    border-color: rgba(63, 135, 145, .14);
    transform: translate(-50%, -50%) rotate(-55deg);
    animation-name: visual-tech-orbit-three;
    animation-duration: 22s;
}

.orbital-visual .orbital-core {
    position: absolute;
    left: 50%;
    top: 50%;
    width: clamp(76px, 10vw, 118px);
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    display: grid;
    place-items: center;
    border: 1px solid rgba(63, 135, 145, .2);
    border-radius: 50%;
    background: rgba(16, 24, 32, .92);
    box-shadow: 0 0 24px rgba(63, 135, 145, .07);
    z-index: 2;
    overflow: hidden;
}

.orbital-visual .orbital-core img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    border-radius: 50%;
    filter: brightness(0.68) blur(0.4px);
}

@keyframes visual-tech-orbit-one {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes visual-tech-orbit-two {
    from { transform: translate(-50%, -50%) rotate(58deg); }
    to { transform: translate(-50%, -50%) rotate(-302deg); }
}

@keyframes visual-tech-orbit-three {
    from { transform: translate(-50%, -50%) rotate(-55deg); }
    to { transform: translate(-50%, -50%) rotate(305deg); }
}

@media (max-width: 768px) {
     .page-hero .orbital-visual,
    .services-page .services-hero .orbital-visual {
        right: 3%;
        top: 4%;
        width: min(72vw, 290px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .orbital-visual .orbit {
        animation-play-state: paused;
    }
}

.page-hero h1 {
    font-family: var(--font-display);
    font-size: clamp(4rem, 9vw, 8.5rem);
    font-weight: 500;
    line-height: .88;
    letter-spacing: -.045em;
    max-width: 1050px;
    position: relative;
    z-index: 1;
}

.page-hero h1 em,
.manifesto-line em {
    font-weight: 400;
    color: var(--color-accent);
}

.page-lead {
    max-width: 680px;
    margin-top: 40px;
    font-size: clamp(1.05rem, 1.5vw, 1.35rem);
    line-height: 1.75;
    color: var(--color-text-secondary);
}

.service-list {
    max-width: var(--page-max);
    margin: 0 auto;
    padding: 0 var(--page-pad);
}

.service-list article {
    display: grid;
    grid-template-columns: 80px minmax(0, 1fr) auto;
    gap: 32px;
    align-items: end;
    padding: 64px 0;
    border-top: 1px solid var(--color-border);
}

.service-list article:last-child {
    border-bottom: 1px solid var(--color-border);
}

.service-list article > span,
.process-grid span,
.principles span {
    font-size: .75rem;
    color: var(--color-accent);
    letter-spacing: .14em;
}

.service-list h2 {
    font-family: var(--font-display);
    font-size: clamp(2.3rem, 4vw, 4.5rem);
    font-weight: 500;
    line-height: 1;
}

.service-list p:not(.eyebrow) {
    max-width: 650px;
    color: var(--color-text-secondary);
    line-height: 1.8;
}

.service-list .text-link {
    align-self: end;
}

.process-section,
.studio-split {
    max-width: var(--page-max);
    margin: 0 auto;
    padding: clamp(110px, 14vw, 190px) var(--page-pad);
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 8vw;
}

.process-section h2,
.studio-split h2 {
    font-family: var(--font-display);
    font-size: clamp(3rem, 5vw, 5.5rem);
    line-height: .95;
    font-weight: 500;
}

.process-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid var(--color-border);
}

.process-grid article,
.principles article {
    padding: 32px 24px 32px 0;
    border-bottom: 1px solid var(--color-border);
}

.process-grid h3,
.principles h3 {
    font-size: 1.2rem;
    margin: 28px 0 10px;
}

.process-grid p,
.principles p,
.studio-split p {
    color: var(--color-text-secondary);
    line-height: 1.8;
}

.manifesto {
    background: var(--color-editorial);
    color: var(--color-editorial-text);
    padding: clamp(100px, 14vw, 200px) var(--page-pad);
}

.manifesto-line {
    max-width: 1100px;
    margin: auto;
    font-family: var(--font-display);
    font-size: clamp(3rem, 6vw, 6.5rem);
    line-height: .95;
    letter-spacing: -.03em;
}

.principles {
    max-width: var(--page-max);
    margin: 0 auto;
    padding: 0 var(--page-pad) clamp(110px, 14vw, 180px);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
}

.principles article {
    border-top: 1px solid var(--color-border);
    border-bottom: 0;
}

.featured-resource {
    max-width: var(--page-max);
    margin: 0 auto;
    padding: 0 var(--page-pad) clamp(100px, 12vw, 170px);
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    min-height: 620px;
}

.resource-visual {
    background: linear-gradient(135deg, #101820, #1B2931);
    display: flex;
    align-items: flex-end;
    padding: 32px;
    min-height: 480px;
    border: 1px solid var(--color-border);
}

.resource-visual span {
    font-size: .7rem;
    letter-spacing: .18em;
    color: var(--color-accent);
}

.featured-resource > div:last-child {
    background: var(--color-editorial);
    color: var(--color-editorial-text);
    padding: clamp(40px, 6vw, 90px);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.featured-resource h2 {
    font-family: var(--font-display);
    font-size: clamp(2.5rem, 4vw, 4.5rem);
    line-height: 1;
    margin: 20px 0;
}

.featured-resource p:not(.eyebrow) {
    line-height: 1.8;
    color: #3F8791;
}

.resource-grid {
    max-width: var(--page-max);
    margin: auto;
    padding: 0 var(--page-pad);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.resource-grid article {
    min-height: 300px;
    padding: 48px 48px 48px 0;
    border-top: 1px solid var(--color-border);
}

.resource-grid article:nth-child(even) {
    padding-left: 48px;
    border-left: 1px solid var(--color-border);
}

.resource-type {
    font-size: .7rem;
    color: var(--color-accent);
    letter-spacing: .15em;
}

.resource-grid h3 {
    font-family: var(--font-display);
    font-size: clamp(2rem, 3vw, 3rem);
    font-weight: 500;
    line-height: 1.05;
    margin: 28px 0 14px;
}

.resource-grid p {
    color: var(--color-text-secondary);
    line-height: 1.7;
}

.store-toolbar {
    max-width: var(--page-max);
    margin: auto;
    padding: 0 var(--page-pad) 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--color-border);
}

.store-toolbar > p {
    font-size: .85rem;
    color: var(--color-text-secondary);
}

.filter {
    background: transparent;
    border: 0;
    color: var(--color-text-secondary);
    padding: 10px 14px;
    cursor: pointer;
}

.filter.active {
    color: var(--color-text-primary);
    border-bottom: 1px solid var(--color-accent);
}

.product-grid {
    max-width: var(--page-max);
    margin: auto;
    padding: 64px var(--page-pad) 140px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.product-card {
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    transition: transform var(--duration-standard) var(--ease-premium), border-color var(--duration-standard);
}

.product-card:hover {
    transform: translateY(-5px);
    border-color: var(--color-accent);
}

.product-cover {
    aspect-ratio: 4 / 5;
    padding: 28px;
    display: flex;
    align-items: flex-end;
    font-family: var(--font-display);
    font-size: clamp(2rem, 4vw, 4rem);
    line-height: .85;
}

.cover-one {
    background: #3F8791;
    color: #101820;
}

.cover-two {
    background: #F4F5F2;
    color: #101820;
}

.cover-three {
    background: #1B2931;
    color: #F4F5F2;
}

.product-info {
    padding: 28px;
    min-height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.product-info h2 {
    font-family: var(--font-display);
    font-size: 2.2rem;
    font-weight: 500;
    margin: 10px 0;
}

.product-info p:not(.eyebrow) {
    color: var(--color-text-secondary);
    line-height: 1.7;
}

.product-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.product-bottom strong {
    font-size: 1.1rem;
}

.product-bottom .btn-primary {
    padding: 12px 18px;
}

.store-note {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 var(--page-pad) 160px;
    text-align: center;
}

.store-note h2 {
    font-family: var(--font-display);
    font-size: clamp(2.8rem, 5vw, 5rem);
    font-weight: 500;
    margin: 20px 0;
}

.store-note > p:last-child {
    color: var(--color-text-secondary);
    line-height: 1.8;
}

.brief-layout {
    max-width: var(--page-max);
    margin: auto;
    padding: 0 var(--page-pad) 150px;
    display: grid;
    grid-template-columns: .75fr 1.25fr;
    gap: 10vw;
}

.brief-layout aside h2 {
    font-family: var(--font-display);
    font-size: clamp(2.8rem, 4vw, 4.5rem);
    line-height: .98;
    font-weight: 500;
}

.brief-layout aside > p:last-child {
    max-width: 420px;
    color: var(--color-text-secondary);
    line-height: 1.7;
    margin-top: 24px;
}

.project-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.project-form label {
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: .82rem;
    color: var(--color-text-secondary);
}

.project-form label:nth-of-type(4),
.project-form label:nth-of-type(5),
.project-form label:nth-of-type(6) {
    grid-column: 1 / -1;
}

.project-form input,
.project-form select,
.project-form textarea {
    width: 100%;
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-text-primary);
    padding: 16px;
    border-radius: var(--radius-control);
    font: inherit;
    outline: 0;
    transition: border-color var(--duration-fast), box-shadow var(--duration-fast);
}

.project-form input:focus,
.project-form select:focus,
.project-form textarea:focus {
    border-color: var(--color-accent);
    box-shadow: var(--focus-ring);
}

.project-form textarea {
    resize: vertical;
}

.project-form .btn-primary {
    border: 0;
    justify-self: start;
    cursor: pointer;
}

.form-note {
    grid-column: 1 / -1;
    font-size: .75rem !important;
    color: var(--color-text-muted) !important;
    line-height: 1.6 !important;
}

.consultation-strip {
    max-width: var(--page-max);
    margin: 0 auto 100px;
    padding: 48px var(--page-pad);
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
}

.consultation-strip h2 {
    font-family: var(--font-display);
    font-size: clamp(2.3rem, 4vw, 4rem);
    font-weight: 500;
    margin-top: 10px;
}

.page-cta {
    margin-top: 80px;
    background: var(--color-editorial);
    color: var(--color-editorial-text);
    padding: clamp(90px, 12vw, 170px) var(--page-pad);
    text-align: center;
}

.page-cta h2 {
    font-family: var(--font-display);
    font-size: clamp(3.2rem, 6vw, 6rem);
    font-weight: 500;
    line-height: .95;
    margin: 20px auto 40px;
}

.page-cta .btn-primary {
    display: inline-flex;
}

.site-nav .nav-menu a.active {
    color: var(--color-text-primary);
}

.work-archive {
    max-width: var(--page-max);
    margin: 0 auto;
    padding: clamp(90px, 10vw, 150px) var(--page-pad);
}

.work-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(48px, 7vw, 110px) 32px;
    margin-top: 64px;
}

.work-item {
    min-width: 0;
}

.work-item img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
    object-fit: contain;
    object-position: center;
    border-radius: var(--radius-card);
    background: var(--color-surface);
    transition: transform var(--duration-slow) var(--ease-premium);
}

.work-item-featured {
    grid-column: span 2;
}

.work-item-meta {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--color-border);
    margin-top: 18px;
}

.work-item-meta h3 {
    font-family: var(--font-display);
    font-size: clamp(2rem, 3vw, 3.5rem);
    font-weight: 500;
    line-height: 1;
    margin: 8px 0 12px;
}

.work-item-meta p:not(.project-category) {
    max-width: 580px;
    color: var(--color-text-secondary);
    line-height: 1.7;
    margin: 0;
}

.work-item-meta .text-link {
    white-space: nowrap;
    padding-top: 10px;
}

@media (max-width: 1024px) {
    .service-list article {
        grid-template-columns: 50px 1fr;
    }

    .service-list .text-link {
        grid-column: 2;
    }

    .process-section,
    .studio-split {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .principles {
        grid-template-columns: 1fr 1fr;
    }

    .featured-resource {
        grid-template-columns: 1fr;
    }

    .product-grid {
        grid-template-columns: 1fr 1fr;
    }

    .brief-layout {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .work-item-meta {
        flex-direction: column;
        gap: 16px;
    }

    .work-item-meta .text-link {
        padding-top: 0;
    }
}

@media (max-width: 768px) {
    .page-hero {
        padding-top: 100px;
    }

    .page-hero h1 {
        font-size: clamp(3.3rem, 15vw, 5.5rem);
    }

    .page-hero:after {
        right: -15%;
        top: 8%;
        opacity: .5;
    }

    .service-list article {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 42px 0;
    }

    .service-list .text-link {
        grid-column: auto;
    }

    .process-grid,
    .principles,
    .resource-grid,
    .product-grid,
    .project-form {
        grid-template-columns: 1fr;
    }

    .resource-grid article,
    .resource-grid article:nth-child(even) {
        padding: 38px 0;
        border-left: 0;
    }

    .featured-resource > div:last-child {
        padding: 45px 28px;
    }

    .product-grid {
        padding-top: 40px;
    }

    .store-toolbar {
        align-items: flex-start;
        flex-direction: column;
        gap: 15px;
    }

    .brief-layout {
        padding-bottom: 90px;
    }

    .consultation-strip {
        align-items: flex-start;
        flex-direction: column;
        margin-bottom: 50px;
    }

    .project-form label:nth-of-type(4),
    .project-form label:nth-of-type(5),
    .project-form label:nth-of-type(6) {
        grid-column: auto;
    }

    .page-cta {
        margin-top: 40px;
    }

    .public-page .site-nav {
        min-height: 68px;
    }

    .work-grid {
        grid-template-columns: 1fr;
        gap: 64px;
        margin-top: 44px;
    }

    .work-item-featured {
        grid-column: auto;
    }

    .work-item-meta {
        padding-top: 18px;
        margin-top: 14px;
    }

    .work-item-meta h3 {
        font-size: clamp(2rem, 10vw, 3rem);
    }
}

@media (prefers-reduced-motion: reduce) {
    .product-card,
    .work-item img {
        transition: none;
    }

    .work-item:hover img {
        transform: none;
    }
}

/* Consistent type hierarchy across public pages */
:root {
    --type-h1: clamp(3rem, 6.2vw, 5.5rem);
    --type-h2: clamp(2.25rem, 4vw, 3.5rem);
    --type-h3: clamp(1.25rem, 2vw, 1.65rem);
    --type-body: 1rem;
    --type-small: .875rem;
    --type-caption: .75rem;
}
body h1 {
    font-family: var(--font-display);
    font-size: var(--type-h1) !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    letter-spacing: -.04em !important;
}
body h2 {
    font-family: var(--font-display);
    font-size: var(--type-h2) !important;
    font-weight: 500 !important;
    line-height: 1.08 !important;
    letter-spacing: -.03em !important;
}
body h3 {
    font-family: var(--font-display);
    font-size: var(--type-h3) !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    letter-spacing: -.02em !important;
}
body p:not(.eyebrow) { line-height: 1.7; }
body .page-lead { font-size: 1.125rem !important; line-height: 1.7 !important; }
body .eyebrow,
body .project-category,
body .resource-type,
body .resource-modal-type,
body .library-kicker { font-size: var(--type-caption) !important; line-height: 1.35 !important; }
body .service-list article > span,
body .process-grid span,
body .principles span { font-size: var(--type-caption) !important; line-height: 1.35 !important; }
@media (max-width: 820px) {
    body h1 { line-height: 1.04 !important; }
    body h2 { line-height: 1.12 !important; }
}

/* Shared content alignment for public-page sections */
.public-page .page-hero,
.public-page .service-list,
.public-page .process-section,
.public-page .studio-split,
.public-page .principles,
.public-page .featured-resource,
.public-page .resource-grid,
.public-page .store-toolbar,
.public-page .product-grid,
.public-page .brief-layout,
.public-page .consultation-strip,
.public-page .work-archive {
  box-sizing: border-box;
  margin-inline: auto;
}
.public-page .page-hero > *,
.public-page .service-list > *,
.public-page .process-section > *,
.public-page .studio-split > *,
.public-page .principles > *,
.public-page .featured-resource > *,
.public-page .resource-grid > *,
.public-page .store-toolbar > *,
.public-page .product-grid > *,
.public-page .brief-layout > *,
.public-page .consultation-strip > *,
.public-page .work-archive > * {
  min-width: 0;
}