/* ==========================================================================
   THREE LAYER DIP STACK™
   Flooring + Tile Installation
   Revised Visual System
   ========================================================================== */

:root {
    --chalk: #f4f1ea;
    --paper: #fbf9f4;
    --graphite: #171817;
    --graphite-2: #242624;
    --birch: #d7b88a;
    --birch-dark: #b88e5a;
    --mortar: #aaa79f;
    --cement: #d7d3c9;
    --lime: #c8e62e;
    --white: #ffffff;
    --muted: #676960;

    --line: rgba(23, 24, 23, 0.2);
    --line-strong: rgba(23, 24, 23, 0.48);
    --line-light: rgba(244, 241, 234, 0.2);

    --font-display: "Big Shoulders Display", Impact, sans-serif;
    --font-body: "Work Sans", Arial, sans-serif;

    --content: 1200px;
    --gutter: clamp(20px, 4vw, 52px);
    --space-xl: clamp(96px, 11vw, 156px);

    --ease: cubic-bezier(0.22, 0.68, 0, 1);
    --transition: 180ms var(--ease);
}


/* ==========================================================================
   RESET
   ========================================================================== */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 92px;
}

body {
    margin: 0;
    overflow-x: hidden;

    background: var(--chalk);
    color: var(--graphite);

    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.55;

    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.nav-open {
    overflow: hidden;
}

img,
svg {
    display: block;
    max-width: 100%;
}

img {
    width: 100%;
    height: auto;
}

figure,
blockquote,
h1,
h2,
h3,
p {
    margin: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea {
    font: inherit;
}

button,
summary {
    -webkit-tap-highlight-color: transparent;
}

::selection {
    background: var(--lime);
    color: var(--graphite);
}


/* ==========================================================================
   ACCESSIBILITY
   ========================================================================== */

.skip-link {
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: 9999;

    transform: translateY(-160%);

    padding: 11px 15px;

    background: var(--graphite);
    color: var(--white);

    font-weight: 700;
}

.skip-link:focus {
    transform: translateY(0);
}

:focus-visible {
    outline: 3px solid var(--lime);
    outline-offset: 4px;
}


/* ==========================================================================
   SHARED
   ========================================================================== */

.content-shell {
    width: min(calc(100% - (var(--gutter) * 2)), var(--content));
    margin-inline: auto;
}

.section-label {
    color: var(--muted);

    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.demo-note {
    color: var(--muted);
    font-size: 0.7rem;
    line-height: 1.6;
}

h1,
h2,
h3 {
    text-wrap: balance;
}


/* ==========================================================================
   HEADER
   ========================================================================== */

.site-header {
    position: relative;
    z-index: 1000;

    background: var(--chalk);
    border-bottom: 1px solid var(--graphite);
}

.header-shell {
    width: min(calc(100% - (var(--gutter) * 2)), var(--content));
    min-height: 84px;
    margin-inline: auto;

    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 36px;
    align-items: center;
}

.brand {
    font-family: var(--font-display);
    font-size: clamp(1.1rem, 1.7vw, 1.45rem);
    font-weight: 800;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.site-nav {
    position: relative;

    display: flex;
    justify-content: center;
    gap: clamp(20px, 3vw, 38px);
}

.site-nav::before {
    content: "";

    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    z-index: -1;

    height: 1px;

    background: var(--line);
}

.site-nav a {
    padding-inline: 9px;

    background: var(--chalk);

    font-size: 0.67rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.site-nav a:hover {
    color: var(--birch-dark);
}

.header-estimate {
    padding: 13px 16px;

    background: var(--lime);
    border: 1px solid var(--graphite);

    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;

    transition:
        background var(--transition),
        color var(--transition);
}

.header-estimate:hover {
    background: var(--graphite);
    color: var(--chalk);
}

.menu-toggle {
    display: none;

    width: 44px;
    height: 44px;

    cursor: pointer;

    border: 0;
    padding: 0;

    background: transparent;
}

.menu-toggle span {
    display: block;

    width: 24px;
    height: 2px;
    margin: 5px auto;

    background: var(--graphite);

    transition:
        transform var(--transition),
        opacity var(--transition);
}


/* ==========================================================================
   HERO — SPECIMEN BOARD
   ========================================================================== */

.specimen-hero {
    padding-top: clamp(64px, 8vw, 110px);

    background: var(--chalk);
}

.specimen-hero__intro {
    display: grid;
    grid-template-columns: minmax(130px, 0.22fr) minmax(0, 1fr);
    gap: clamp(30px, 6vw, 86px);
}

.specimen-hero__meta {
    padding-top: 12px;

    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1.7;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.specimen-hero h1 {
    max-width: 990px;

    font-family: var(--font-display);
    font-size: clamp(6rem, 11.5vw, 11.5rem);
    font-weight: 800;
    line-height: 0.72;
    letter-spacing: -0.045em;
    text-transform: uppercase;
}

.specimen-hero h1 span {
    display: block;
}

.specimen-hero__statement {
    grid-column: 2;

    max-width: 780px;
    margin-top: clamp(34px, 5vw, 70px);
    margin-left: clamp(0px, 15vw, 220px);

    display: grid;
    grid-template-columns: minmax(210px, 0.4fr) minmax(260px, 0.6fr);
    gap: 48px;

    border-top: 1px solid var(--graphite);
    padding-top: 22px;
}

.specimen-hero__tagline {
    color: var(--birch-dark);

    font-family: var(--font-display);
    font-size: clamp(2.5rem, 4.5vw, 4.7rem);
    font-weight: 800;
    line-height: 0.86;
    text-transform: uppercase;
}

.specimen-hero__statement > p:last-child {
    max-width: 460px;
}

.specimen-hero__panorama {
    width: calc(100% - (var(--gutter) * 2));
    max-width: 1540px;
    height: clamp(350px, 43vw, 670px);

    margin: clamp(62px, 8vw, 108px) auto 0;

    overflow: hidden;

    background: var(--cement);
}

.specimen-hero__panorama img {
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center 72%;
}

.specimen-hero__rail {
    min-height: 84px;

    display: flex;
    justify-content: space-between;
    gap: 32px;
    align-items: center;

    border-bottom: 1px solid var(--graphite);
}

.specimen-hero__materials {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 32px;

    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.specimen-hero__materials span:not(:last-child)::after {
    content: "/";
    margin-left: 32px;

    color: var(--birch-dark);
}

.specimen-hero__rail > a {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;

    transition: transform var(--transition);
}

.specimen-hero__rail > a:hover {
    transform: translateX(6px);
}


/* ==========================================================================
   HERO PHYSICAL LAYERS
   ========================================================================== */

.hero-layer-stack {
    width: 100%;

    color: var(--graphite);

    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.hero-layer {
    display: flex;
    align-items: center;

    padding-inline:
        max(
            var(--gutter),
            calc((100vw - var(--content)) / 2)
        );
}

.hero-layer--finish {
    min-height: 44px;

    background:
        repeating-linear-gradient(
            90deg,
            #d8b98b 0,
            #d8b98b 108px,
            #caa574 109px,
            #caa574 110px
        );
}

.hero-layer--support {
    min-height: 30px;

    background: var(--mortar);
}

.hero-layer--subfloor {
    min-height: 37px;

    background:
        linear-gradient(
            90deg,
            #c8a16f,
            #d9b985 55%,
            #c9a16d
        );
}


/* ==========================================================================
   MATERIAL SAMPLE RACK
   ========================================================================== */

.sample-rack {
    padding-block: var(--space-xl);

    background: var(--paper);
}

.sample-rack__heading {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: clamp(34px, 7vw, 92px);
    align-items: end;

    margin-bottom: clamp(70px, 9vw, 120px);
}

.sample-rack__heading h2 {
    font-family: var(--font-display);
    font-size: clamp(4.8rem, 9vw, 9.5rem);
    font-weight: 700;
    line-height: 0.77;
    letter-spacing: -0.045em;
    text-transform: uppercase;
}

.sample-rack__heading h2 span {
    display: block;
    color: var(--birch-dark);
}

.sample-rack__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.surface-sample {
    min-width: 0;
}

.surface-sample figure {
    height: clamp(490px, 54vw, 760px);

    overflow: hidden;

    background: var(--cement);
}

.surface-sample img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 600ms var(--ease);
}

.surface-sample:hover img {
    transform: scale(1.025);
}

.surface-sample__caption {
    min-height: 190px;

    display: grid;
    grid-template-columns: 32px 1fr;
    gap: 14px;

    border-top: 4px solid var(--graphite);
    padding: 21px 9px 0;
}

.surface-sample__caption > span {
    color: var(--muted);

    font-size: 0.64rem;
    font-weight: 700;
}

.surface-sample h3 {
    font-family: var(--font-display);
    font-size: clamp(2rem, 3.2vw, 3.3rem);
    font-weight: 700;
    line-height: 0.85;
    text-transform: uppercase;
}

.surface-sample p {
    margin-top: 11px;

    color: var(--muted);

    font-size: 0.86rem;
}


/* ==========================================================================
   ARCHITECTURAL FLOOR CUTAWAY
   ========================================================================== */

.floor-section {
    padding-block: var(--space-xl);

    background: var(--graphite);
    color: var(--chalk);
}

.floor-section .section-label {
    color: var(--lime);
}

.floor-section__heading {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.55fr);
    gap: clamp(60px, 11vw, 150px);
    align-items: end;
}

.floor-section__heading h2 {
    max-width: 760px;
    margin-top: 28px;

    font-family: var(--font-display);
    font-size: clamp(5rem, 9vw, 9.2rem);
    font-weight: 700;
    line-height: 0.75;
    letter-spacing: -0.04em;
    text-transform: uppercase;
}

.floor-section__heading h2 span {
    display: block;
    color: var(--lime);
}

.floor-section__side-note {
    border-left: 1px solid var(--line-light);
    padding-left: 28px;
}

.floor-section__side-note > p:first-child {
    color: var(--lime);

    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.floor-section__side-note h3 {
    margin-top: 18px;

    font-family: var(--font-display);
    font-size: clamp(2.7rem, 4.5vw, 4.7rem);
    font-weight: 700;
    line-height: 0.84;
    text-transform: uppercase;
}

.floor-section__side-note h3 span {
    display: block;
    color: var(--lime);
}

.floor-section__side-note > p:last-child {
    margin-top: 22px;

    color: rgba(244, 241, 234, 0.62);
}

.cutaway {
    position: relative;

    min-height: 720px;
    margin-top: clamp(90px, 11vw, 145px);

    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    grid-template-rows: repeat(3, 1fr);

    border-top: 1px solid var(--line-light);
    border-right: 1px solid var(--line-light);
    border-bottom: 1px solid var(--line-light);
}

.cutaway__annotation {
    position: relative;

    z-index: 2;

    display: grid;
    grid-template-columns: 34px 1fr;
    align-content: center;
    gap: 7px 12px;

    border-left: 1px solid var(--line-light);
    border-bottom: 1px solid var(--line-light);

    padding: 28px 24px;
}

.cutaway__annotation:last-of-type {
    border-bottom: 0;
}

.cutaway__annotation > span {
    grid-row: 1 / 3;

    color: var(--lime);

    font-size: 0.62rem;
    font-weight: 700;
}

.cutaway__annotation strong {
    font-family: var(--font-display);
    font-size: 1.9rem;
    line-height: 0.9;
    text-transform: uppercase;
}

.cutaway__annotation p {
    color: rgba(244, 241, 234, 0.58);

    font-size: 0.78rem;
}

.cutaway__annotation::after {
    content: "";

    position: absolute;
    top: 50%;
    left: 100%;

    width: clamp(70px, 9vw, 130px);
    height: 1px;

    background: var(--lime);
}

.cutaway__drawing {
    grid-column: 2;
    grid-row: 1 / 4;

    position: relative;

    align-self: center;

    margin-inline: clamp(80px, 12vw, 170px) 46px;
}

.cutaway__layer {
    position: relative;
}

.cutaway__layer--finish {
    height: 140px;

    display: grid;
    grid-template-columns: repeat(5, 1fr);

    transform: perspective(780px) rotateX(47deg);
    transform-origin: bottom;

    background: var(--birch);
    border: 2px solid var(--chalk);
}

.cutaway__layer--finish > div {
    border-right: 1px solid rgba(23, 24, 23, 0.38);
}

.cutaway__layer--finish > div:last-child {
    border-right: 0;
}

.cutaway__layer--support {
    height: 80px;
    margin-top: -21px;

    background:
        repeating-linear-gradient(
            -45deg,
            #aaa79f 0,
            #aaa79f 8px,
            #94918a 9px,
            #94918a 10px
        );

    border: 2px solid var(--chalk);
}

.cutaway__layer--subfloor {
    height: 150px;

    display: grid;
    grid-template-columns: repeat(3, 1fr);

    background: #c29b67;
    border: 2px solid var(--chalk);
    border-top: 0;
}

.cutaway__layer--subfloor span {
    border-right: 1px solid rgba(23, 24, 23, 0.4);
}

.cutaway__layer--subfloor span:last-child {
    border-right: 0;
}

.cutaway__dimension--left {
    position: absolute;
    top: 22px;
    bottom: 0;
    left: -48px;

    width: 22px;

    border-top: 1px solid var(--lime);
    border-bottom: 1px solid var(--lime);
    border-left: 1px solid var(--lime);
}

.cutaway__dimension--left::before,
.cutaway__dimension--left::after {
    content: "";

    position: absolute;
    left: -4px;

    width: 7px;
    height: 1px;

    background: var(--lime);
}

.cutaway__dimension--left::before {
    top: 0;
}

.cutaway__dimension--left::after {
    bottom: 0;
}

.cutaway__dimension--left span {
    position: absolute;
    top: 50%;
    left: -53px;

    width: 110px;

    transform: rotate(-90deg);

    color: var(--lime);

    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-align: center;
    text-transform: uppercase;
}


/* ==========================================================================
   REMOVAL STORY
   ========================================================================== */

.removal-story {
    padding-block: clamp(88px, 10vw, 140px);

    background: var(--chalk);
}

.removal-story__status {
    min-height: 52px;

    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: center;

    border-top: 1px solid var(--graphite);
    border-bottom: 1px solid var(--graphite);

    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.removal-story__status strong {
    color: var(--birch-dark);
}

.removal-story__photo {
    width: calc(100% - (var(--gutter) * 2));
    max-width: 1540px;
    height: clamp(390px, 58vw, 780px);

    margin: 34px auto;

    overflow: hidden;

    background: var(--cement);
}

.removal-story__photo img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.removal-story__copy {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(260px, 0.5fr);
    gap: clamp(60px, 11vw, 150px);
    align-items: end;

    padding-top: clamp(42px, 6vw, 76px);
}

.removal-story__copy h2 {
    font-family: var(--font-display);
    font-size: clamp(5rem, 9vw, 9rem);
    font-weight: 700;
    line-height: 0.76;
    letter-spacing: -0.045em;
    text-transform: uppercase;
}

.removal-story__copy h2 span {
    display: block;
    color: var(--birch-dark);
}

.removal-story__copy > div {
    border-top: 1px solid var(--graphite);
    padding-top: 18px;
}

.removal-story__copy strong {
    font-family: var(--font-display);
    font-size: clamp(1.9rem, 3vw, 3.1rem);
    line-height: 0.9;
    text-transform: uppercase;
}

.removal-story__copy p {
    margin-top: 20px;

    color: var(--muted);
}


/* ==========================================================================
   STAGGERED PLANK SERVICES
   ========================================================================== */

.plank-services {
    overflow: hidden;

    padding-block: var(--space-xl);

    background: var(--paper);
}

.plank-services__heading {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: clamp(34px, 7vw, 92px);
    align-items: end;

    margin-bottom: clamp(80px, 10vw, 135px);
}

.plank-services__heading h2 {
    font-family: var(--font-display);
    font-size: clamp(4.8rem, 9vw, 9.3rem);
    font-weight: 700;
    line-height: 0.77;
    letter-spacing: -0.045em;
    text-transform: uppercase;
}

.plank-services__heading h2 span {
    display: block;
    color: var(--birch-dark);
}

.plank-field {
    position: relative;

    display: flex;
    flex-direction: column;
    gap: 7px;
}

.service-plank {
    min-height: 92px;

    display: grid;
    grid-template-columns: 48px minmax(200px, 1fr) auto;
    gap: 22px;
    align-items: center;

    padding: 16px 24px;

    background: var(--birch);
    border: 1px solid rgba(23, 24, 23, 0.32);

    transition:
        transform var(--transition),
        background var(--transition);
}

.service-plank:hover {
    transform: translateX(8px);

    background: var(--lime);
}

.service-plank > span {
    font-size: 0.62rem;
    font-weight: 700;
}

.service-plank h3 {
    font-family: var(--font-display);
    font-size: clamp(2rem, 3.5vw, 3.7rem);
    font-weight: 700;
    line-height: 0.85;
    text-transform: uppercase;
}

.service-plank p {
    color: rgba(23, 24, 23, 0.66);

    font-size: 0.72rem;
    font-weight: 600;
}

.service-plank--01 {
    width: 84%;
    margin-left: 0;
}

.service-plank--02 {
    width: 71%;
    margin-left: 19%;
}

.service-plank--03 {
    width: 93%;
    margin-left: 5%;
}

.service-plank--04 {
    width: 68%;
    margin-left: 28%;
}

.service-plank--05 {
    width: 78%;
    margin-left: 2%;
}

.service-plank--06 {
    width: 87%;
    margin-left: 12%;
}

.service-plank--07 {
    width: 65%;
    margin-left: 25%;
}


/* ==========================================================================
   FLOOR PLAN PROCESS
   ========================================================================== */

.plan-process {
    padding-block: var(--space-xl);

    background: var(--graphite);
    color: var(--chalk);
}

.plan-process .section-label {
    color: var(--lime);
}

.plan-process__header {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    align-items: center;

    margin-bottom: 50px;
}

.plan-process__drawing-label {
    color: rgba(244, 241, 234, 0.46);

    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.floor-plan {
    position: relative;

    min-height: 900px;

    display: grid;
    grid-template-columns: 260px minmax(300px, 1fr) 260px;
    grid-template-rows: 240px minmax(300px, 1fr) 240px;

    border: 2px solid var(--chalk);
}

.floor-plan__perimeter {
    position: absolute;
    inset: 24px;

    pointer-events: none;

    border: 1px dashed rgba(200, 230, 46, 0.66);
}

.floor-plan__measurement {
    position: absolute;

    color: var(--lime);

    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.floor-plan__measurement--top {
    top: -11px;
    left: 50%;

    transform: translateX(-50%);

    padding-inline: 10px;

    background: var(--graphite);
}

.floor-plan__measurement--side {
    top: 50%;
    right: -24px;

    transform: translateY(-50%) rotate(90deg);

    padding-inline: 10px;

    background: var(--graphite);
}

.floor-plan__tick {
    position: absolute;

    width: 16px;
    height: 16px;

    border: 1px solid var(--lime);
    background: var(--graphite);
}

.floor-plan__tick--01 {
    top: -8px;
    left: -8px;
}

.floor-plan__tick--02 {
    top: -8px;
    right: -8px;
}

.floor-plan__tick--03 {
    right: -8px;
    bottom: -8px;
}

.floor-plan__tick--04 {
    bottom: -8px;
    left: -8px;
}

.plan-step {
    position: relative;
    z-index: 2;

    padding: 34px;

    background: var(--graphite);
}

.plan-step > span {
    color: var(--lime);

    font-size: 0.65rem;
    font-weight: 700;
}

.plan-step h3 {
    margin-top: 12px;

    font-family: var(--font-display);
    font-size: clamp(2.8rem, 4.7vw, 4.8rem);
    font-weight: 700;
    line-height: 0.8;
    text-transform: uppercase;
}

.plan-step p {
    max-width: 220px;
    margin-top: 16px;

    color: rgba(244, 241, 234, 0.58);
}

.plan-step--01 {
    grid-column: 1;
    grid-row: 1;

    border-right: 1px solid var(--line-light);
    border-bottom: 1px solid var(--line-light);
}

.plan-step--02 {
    grid-column: 3;
    grid-row: 1;

    border-left: 1px solid var(--line-light);
    border-bottom: 1px solid var(--line-light);
}

.plan-step--03 {
    grid-column: 1;
    grid-row: 3;

    align-self: stretch;

    border-top: 1px solid var(--line-light);
    border-right: 1px solid var(--line-light);
}

.plan-step--04 {
    grid-column: 3;
    grid-row: 3;

    border-top: 1px solid var(--line-light);
    border-left: 1px solid var(--line-light);
}

.floor-plan__center {
    grid-column: 2;
    grid-row: 2;

    position: relative;
    z-index: 2;

    align-self: center;

    padding: 54px;

    text-align: center;
}

.floor-plan__center h2 {
    font-family: var(--font-display);
    font-size: clamp(4.6rem, 8vw, 8rem);
    font-weight: 700;
    line-height: 0.74;
    letter-spacing: -0.04em;
    text-transform: uppercase;
}

.floor-plan__center h2 span {
    display: block;
    color: var(--lime);
}

.floor-plan__center p {
    max-width: 520px;
    margin: 30px auto 0;

    color: rgba(244, 241, 234, 0.56);
}


/* ==========================================================================
   TILE EDITORIAL
   ========================================================================== */

.tile-editorial {
    padding-block: var(--space-xl);

    background: var(--chalk);
}

.tile-editorial__grid {
    min-height: 940px;

    display: grid;
    grid-template-columns: minmax(320px, 0.46fr) minmax(0, 0.54fr);
    gap: clamp(70px, 13vw, 180px);
    align-items: stretch;
}

.tile-editorial__photo {
    align-self: start;

    width: 100%;
    height: 840px;

    overflow: hidden;

    background: var(--cement);
}

.tile-editorial__photo img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.tile-editorial__copy {
    position: relative;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding-block: 70px;
}

.tile-editorial__copy h2 {
    margin-top: 36px;

    font-family: var(--font-display);
    font-size: clamp(6rem, 10vw, 10rem);
    font-weight: 700;
    line-height: 0.72;
    letter-spacing: -0.045em;
    text-transform: uppercase;
}

.tile-editorial__copy h2 span {
    display: block;
    color: var(--birch-dark);
}

.tile-editorial__aside {
    align-self: flex-end;

    margin-top: 30px;

    color: var(--birch-dark);

    font-family: var(--font-display);
    font-size: clamp(2.2rem, 3.5vw, 3.5rem);
    font-weight: 700;
    text-transform: uppercase;
}

.tile-editorial__body {
    max-width: 430px;

    margin-top: auto;
    margin-left: auto;

    border-top: 1px solid var(--graphite);
    padding-top: 22px;
}

.tile-editorial__body p {
    color: var(--muted);
}

.tile-editorial__body a {
    display: inline-block;

    margin-top: 28px;
    border-bottom: 2px solid var(--graphite);
    padding-bottom: 4px;

    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;

    transition: transform var(--transition);
}

.tile-editorial__body a:hover {
    transform: translateX(6px);
}


/* ==========================================================================
   SHOWROOM GALLERY
   ========================================================================== */

.showroom-work {
    padding-block: var(--space-xl);

    background: var(--paper);
}

.showroom-work__heading {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: clamp(34px, 7vw, 92px);
    align-items: end;

    margin-bottom: clamp(72px, 9vw, 118px);
}

.showroom-work__heading h2 {
    font-family: var(--font-display);
    font-size: clamp(5.5rem, 10vw, 10rem);
    font-weight: 700;
    line-height: 0.75;
    letter-spacing: -0.045em;
    text-transform: uppercase;
}

.showroom-panels {
    width: min(calc(100% - (var(--gutter) * 2)), 1500px);
    margin-inline: auto;

    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;

    background: var(--graphite);
    border: 1px solid var(--graphite);
}

.showroom-panel {
    display: grid;
    grid-template-rows: minmax(560px, 68vw) auto;

    overflow: hidden;

    background: var(--paper);
}

.showroom-panel > img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 600ms var(--ease);
}

.showroom-panel:hover > img {
    transform: scale(1.018);
}

.showroom-panel figcaption {
    min-height: 170px;

    display: grid;
    grid-template-columns: 30px 1fr;
    gap: 7px 12px;

    align-content: center;

    padding: 24px;
}

.showroom-panel figcaption > span {
    grid-row: 1 / 3;

    color: var(--muted);

    font-size: 0.62rem;
    font-weight: 700;
}

.showroom-panel figcaption strong {
    font-family: var(--font-display);
    font-size: clamp(1.8rem, 2.6vw, 2.8rem);
    line-height: 0.86;
    text-transform: uppercase;
}

.showroom-panel figcaption p {
    color: var(--muted);

    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}


/* ==========================================================================
   REVIEW FIELD
   ========================================================================== */

.review-field {
    padding-block: var(--space-xl);

    background: var(--birch);
}

.review-field blockquote {
    max-width: 1120px;
    margin-top: clamp(54px, 8vw, 100px);

    font-family: var(--font-display);
    font-size: clamp(5rem, 8.5vw, 8.8rem);
    font-weight: 600;
    line-height: 0.82;
    letter-spacing: -0.028em;
    text-transform: uppercase;
}

.review-field__footer {
    margin-top: clamp(70px, 9vw, 110px);

    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 60px;

    border-top: 2px solid var(--graphite);
    border-bottom: 2px solid var(--graphite);

    padding-block: 20px;
}

.review-field__footer > p {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.review-field__footer > p span {
    display: block;

    color: rgba(23, 24, 23, 0.58);
}

.review-field__footer > div {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px 28px;

    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.review-field .demo-note {
    margin-top: 18px;

    color: rgba(23, 24, 23, 0.58);
}


/* ==========================================================================
   FULL-WIDTH FAQ
   ========================================================================== */

.spec-faq {
    padding-block: var(--space-xl);

    background: var(--chalk);
}

.spec-faq__heading {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: clamp(34px, 7vw, 92px);
    align-items: start;

    margin-bottom: clamp(72px, 9vw, 120px);
}

.spec-faq__heading h2 {
    font-family: var(--font-display);
    font-size: clamp(5rem, 9vw, 9.3rem);
    font-weight: 700;
    line-height: 0.75;
    letter-spacing: -0.045em;
    text-transform: uppercase;
}

.spec-faq__heading h2 span {
    display: block;
    color: var(--birch-dark);
}

.spec-faq__list {
    border-top: 2px solid var(--graphite);
}

.spec-faq details {
    border-bottom: 1px solid var(--graphite);
}

.spec-faq summary {
    min-height: 112px;

    cursor: pointer;

    display: grid;
    grid-template-columns: 50px 1fr 30px;
    gap: 20px;
    align-items: center;

    list-style: none;

    padding: 20px 0;
}

.spec-faq summary::-webkit-details-marker {
    display: none;
}

.spec-faq summary > span {
    color: var(--muted);

    font-size: 0.64rem;
    font-weight: 700;
}

.spec-faq summary strong {
    font-family: var(--font-display);
    font-size: clamp(2.1rem, 4vw, 4rem);
    line-height: 0.86;
    text-transform: uppercase;
}

.spec-faq summary i {
    font-family: var(--font-body);
    font-size: 1.7rem;
    font-style: normal;
    font-weight: 400;
    text-align: right;
}

.spec-faq details[open] summary i {
    transform: rotate(45deg);
}

.spec-faq details > p {
    max-width: 720px;

    margin-left: 70px;
    padding: 0 0 34px;

    color: var(--muted);
}


/* ==========================================================================
   ESTIMATE WORKSHEET
   ========================================================================== */

.worksheet {
    padding-block: var(--space-xl);

    background: var(--paper);
}

.worksheet__masthead {
    min-height: 62px;

    display: flex;
    justify-content: space-between;
    gap: 30px;
    align-items: center;

    border-top: 2px solid var(--graphite);
    border-bottom: 1px solid var(--graphite);

    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.worksheet__masthead > div {
    display: flex;
    gap: 18px 34px;
}

.worksheet__masthead > span {
    padding: 6px 9px;

    background: var(--graphite);
    color: var(--paper);
}

.worksheet__heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(230px, 0.3fr);
    gap: clamp(50px, 9vw, 120px);
    align-items: end;

    padding-block: clamp(60px, 8vw, 100px);
}

.worksheet__heading h2 {
    font-family: var(--font-display);
    font-size: clamp(5.2rem, 9vw, 9rem);
    font-weight: 700;
    line-height: 0.75;
    letter-spacing: -0.045em;
    text-transform: uppercase;
}

.worksheet__heading h2 span {
    display: block;
    color: var(--birch-dark);
}

.worksheet__heading > p {
    padding-bottom: 8px;

    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
}

.worksheet__heading > p strong {
    display: block;
    margin-top: 4px;
}

.estimate-form {
    border-top: 2px solid var(--graphite);
    border-left: 1px solid var(--graphite);
}

.worksheet-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
}

.field {
    position: relative;

    min-height: 155px;

    display: flex;
    flex-direction: column;

    border-right: 1px solid var(--graphite);
    border-bottom: 1px solid var(--graphite);

    padding: 20px;
}

.field > span {
    font-size: 0.61rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.field input,
.field select,
.field textarea {
    width: 100%;

    margin-top: auto;

    border: 0;
    border-radius: 0;
    outline: none;

    padding: 14px 0 4px;

    background: transparent;
    color: var(--graphite);

    font-family: var(--font-display);
    font-size: clamp(1.9rem, 3vw, 3rem);
    font-weight: 700;
}

.field textarea {
    min-height: 140px;

    resize: vertical;

    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 400;
}

.field input::placeholder,
.field textarea::placeholder {
    color: rgba(23, 24, 23, 0.35);
}

.field:focus-within {
    background: rgba(215, 184, 138, 0.2);
}

.field--name {
    grid-column: span 6;
}

.field--email {
    grid-column: span 6;
}

.field--phone {
    grid-column: span 4;
}

.field--zip {
    grid-column: span 3;
}

.field--project {
    grid-column: span 5;
}

.field--square-footage {
    grid-column: span 5;

    min-height: 220px;

    background: var(--lime);
}

.field--square-footage input {
    padding-right: 70px;

    font-size: clamp(4rem, 7vw, 7rem);
    line-height: 0.8;
}

.field--square-footage > strong {
    position: absolute;
    right: 20px;
    bottom: 30px;

    font-size: 0.68rem;
    text-transform: uppercase;
}

.field--flooring {
    grid-column: span 7;
}

.field--current {
    grid-column: span 6;
}

.field--timeline {
    grid-column: span 6;
}

.field--message {
    grid-column: span 12;

    min-height: 240px;
}

.worksheet-submit {
    width: 100%;
    min-height: 88px;

    cursor: pointer;

    border: 0;
    border-right: 1px solid var(--graphite);
    border-bottom: 2px solid var(--graphite);

    background: var(--lime);
    color: var(--graphite);

    font-family: var(--font-display);
    font-size: clamp(2.2rem, 4vw, 4rem);
    font-weight: 800;
    letter-spacing: 0.01em;
    text-transform: uppercase;

    transition:
        background var(--transition),
        color var(--transition);
}

.worksheet-submit:hover {
    background: var(--graphite);
    color: var(--lime);
}

.worksheet__form-footer {
    min-height: 80px;

    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.4fr);
    gap: 30px;
    align-items: center;

    border-right: 1px solid var(--graphite);
    border-bottom: 1px solid var(--graphite);

    padding: 18px 20px;

    color: var(--muted);

    font-size: 0.68rem;
}

.form-status {
    min-height: 22px;

    color: var(--graphite);
    font-weight: 700;
    text-align: right;
}


/* ==========================================================================
   CLOSING STRIP
   ========================================================================== */

.closing-strip {
    background: var(--graphite);
    color: var(--chalk);
}

.closing-strip__inner {
    min-height: 680px;

    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: clamp(34px, 7vw, 92px);
    align-content: center;

    padding-block: var(--space-xl);
}

.closing-strip .section-label {
    color: var(--lime);
}

.closing-strip h2 {
    font-family: var(--font-display);
    font-size: clamp(5.5rem, 9.5vw, 9.5rem);
    font-weight: 700;
    line-height: 0.75;
    letter-spacing: -0.045em;
    text-transform: uppercase;
}

.closing-strip h2 span {
    display: block;
    color: var(--lime);
}

.closing-strip__inner > div {
    grid-column: 2;

    display: flex;
    justify-content: space-between;
    gap: 30px;
    align-items: center;

    margin-top: 38px;
    border-top: 1px solid var(--line-light);

    padding-top: 24px;
}

.closing-strip__inner > div > p {
    color: rgba(244, 241, 234, 0.58);
}

.closing-strip__inner > div > a {
    color: var(--lime);

    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}


/* ==========================================================================
   FOOTER
   ========================================================================== */

.site-footer {
    background: #101110;
    color: var(--chalk);
}

.site-footer__main {
    display: grid;
    grid-template-columns: minmax(340px, 1fr) 210px 210px;
    gap: clamp(50px, 9vw, 110px);

    padding-block: clamp(78px, 10vw, 120px);
}

.site-footer__brand > a {
    display: block;

    max-width: 620px;

    font-family: var(--font-display);
    font-size: clamp(4rem, 7vw, 7rem);
    font-weight: 700;
    line-height: 0.74;
    text-transform: uppercase;
}

.site-footer__brand > p {
    margin-top: 28px;

    color: rgba(244, 241, 234, 0.5);
}

.site-footer__brand > strong {
    display: block;
    margin-top: 5px;

    color: var(--lime);
}

.site-footer__nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;

    font-size: 0.83rem;
}

.site-footer__nav a {
    color: rgba(244, 241, 234, 0.62);
}

.site-footer__nav a:hover {
    color: var(--lime);
}

.site-footer__contact {
    color: rgba(244, 241, 234, 0.62);

    font-size: 0.83rem;
}

.site-footer__contact p + p {
    margin-top: 8px;
}

.site-footer__legal {
    min-height: 72px;

    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    align-items: center;

    border-top: 1px solid rgba(244, 241, 234, 0.13);

    color: rgba(244, 241, 234, 0.37);

    font-size: 0.59rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.site-footer__legal p:nth-child(2) {
    text-align: center;
}

.site-footer__legal p:last-child {
    color: var(--lime);
    text-align: right;
}

.footer-layers {
    color: var(--graphite);

    font-size: 0.55rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.footer-layers div {
    padding-left:
        max(
            var(--gutter),
            calc((100vw - var(--content)) / 2)
        );
}

.footer-layers div:nth-child(1) {
    min-height: 27px;

    display: flex;
    align-items: center;

    background: var(--birch);
}

.footer-layers div:nth-child(2) {
    min-height: 21px;

    display: flex;
    align-items: center;

    background: var(--mortar);
}

.footer-layers div:nth-child(3) {
    min-height: 25px;

    display: flex;
    align-items: center;

    background: #c89f69;
}


/* ==========================================================================
   WIDE-SCREEN RESTRAINT
   ========================================================================== */

@media (min-width: 1500px) {

    :root {
        --content: 1180px;
        --gutter: clamp(30px, 3vw, 50px);
    }

    .specimen-hero h1 {
        font-size: 8.7rem;
    }

    .sample-rack__heading h2,
    .plank-services__heading h2,
    .spec-faq__heading h2 {
        font-size: 6.8rem;
    }

    .floor-section__heading h2 {
        font-size: 6.8rem;
    }

    .removal-story__copy h2 {
        font-size: 6.7rem;
    }

    .floor-plan__center h2 {
        font-size: 6rem;
    }

    .tile-editorial__copy h2 {
        font-size: 7rem;
    }

    .showroom-work__heading h2 {
        font-size: 7rem;
    }

    .review-field blockquote {
        font-size: 6.3rem;
    }

    .worksheet__heading h2 {
        font-size: 6.7rem;
    }

    .closing-strip h2 {
        font-size: 6.8rem;
    }

    .showroom-panel {
        grid-template-rows: 680px auto;
    }
}


/* ==========================================================================
   SMALL DESKTOP / TABLET
   ========================================================================== */

@media (max-width: 1050px) {

    .header-shell {
        gap: 20px;
    }

    .site-nav {
        gap: 15px;
    }

    .header-estimate {
        display: none;
    }

    .specimen-hero__statement {
        margin-left: 0;
    }

    .sample-rack__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 40px 12px;
    }

    .surface-sample figure {
        height: 68vw;
        max-height: 720px;
    }

    .floor-section__heading {
        grid-template-columns: 1fr 320px;
        gap: 60px;
    }

    .cutaway {
        grid-template-columns: 230px 1fr;
    }

    .cutaway__drawing {
        margin-inline: 90px 30px;
    }

    .floor-plan {
        grid-template-columns: 220px 1fr 220px;
    }

    .tile-editorial__grid {
        gap: 70px;
    }

    .site-footer__main {
        grid-template-columns: 1fr 180px 180px;
    }
}


/* ==========================================================================
   MOBILE NAV / TABLET
   ========================================================================== */

@media (max-width: 820px) {

    html {
        scroll-padding-top: 76px;
    }

    .header-shell {
        min-height: 76px;

        grid-template-columns: 1fr auto;
    }

    .menu-toggle {
        display: block;

        position: relative;
        z-index: 1003;
    }

    .menu-toggle[aria-expanded="true"] span:nth-child(1) {
        transform: translateY(7px) rotate(45deg);
    }

    .menu-toggle[aria-expanded="true"] span:nth-child(2) {
        opacity: 0;
    }

    .menu-toggle[aria-expanded="true"] span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg);
    }

    .site-nav {
        position: fixed;
        inset: 0;
        z-index: 1002;

        visibility: hidden;
        opacity: 0;

        transform: translateY(-12px);

        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 0;

        padding: 90px var(--gutter) 50px;

        background: var(--graphite);
        color: var(--chalk);

        transition:
            opacity var(--transition),
            transform var(--transition),
            visibility var(--transition);
    }

    .site-nav::before {
        display: none;
    }

    .site-nav.is-open {
        visibility: visible;
        opacity: 1;

        transform: translateY(0);
    }

    .site-nav a {
        width: 100%;

        border-bottom: 1px solid var(--line-light);
        padding: 13px 0;

        background: transparent;

        font-family: var(--font-display);
        font-size: clamp(2.8rem, 9vw, 4.5rem);
        line-height: 0.9;
    }

    .specimen-hero__intro {
        grid-template-columns: 1fr;
    }

    .specimen-hero__meta {
        display: flex;
        justify-content: space-between;
        gap: 20px;
    }

    .specimen-hero h1 {
        font-size: clamp(5.5rem, 17vw, 8.6rem);
    }

    .specimen-hero__statement {
        grid-column: 1;

        grid-template-columns: 1fr 1fr;
    }

    .specimen-hero__panorama {
        height: 62vw;
    }

    .sample-rack__heading,
    .plank-services__heading,
    .showroom-work__heading,
    .spec-faq__heading {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .floor-section__heading {
        grid-template-columns: 1fr;
    }

    .floor-section__side-note {
        max-width: 480px;
    }

    .cutaway {
        min-height: 0;

        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .cutaway__annotation {
        grid-column: 1;

        min-height: 150px;
    }

    .cutaway__annotation::after {
        display: none;
    }

    .cutaway__drawing {
        grid-column: 1;
        grid-row: auto;

        margin: 70px 60px;
    }

    .removal-story__copy {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .service-plank--01,
    .service-plank--02,
    .service-plank--03,
    .service-plank--04,
    .service-plank--05,
    .service-plank--06,
    .service-plank--07 {
        width: 92%;
        margin-left: 0;
    }

    .service-plank:nth-child(even) {
        margin-left: 8%;
    }

    .service-plank {
        grid-template-columns: 42px 1fr;
    }

    .service-plank p {
        grid-column: 2;
    }

    .floor-plan {
        min-height: 0;

        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;

        padding: 24px;
    }

    .floor-plan__perimeter {
        display: none;
    }

    .plan-step--01,
    .plan-step--02,
    .plan-step--03,
    .plan-step--04 {
        grid-column: auto;
        grid-row: auto;

        border: 1px solid var(--line-light);
    }

    .floor-plan__center {
        grid-column: 1 / -1;
        grid-row: 1;

        padding: 70px 30px;
    }

    .tile-editorial__grid {
        min-height: 0;

        grid-template-columns: 0.72fr 1fr;
        gap: 50px;
    }

    .tile-editorial__photo {
        height: 720px;
    }

    .tile-editorial__copy h2 {
        font-size: clamp(5rem, 13vw, 7rem);
    }

    .showroom-panel {
        grid-template-rows: 70vw auto;
    }

    .review-field__footer {
        grid-template-columns: 1fr;
    }

    .review-field__footer > div {
        justify-content: flex-start;
    }

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

    .field--phone,
    .field--zip,
    .field--project {
        grid-column: span 6;
    }

    .field--project {
        grid-column: span 12;
    }

    .field--square-footage,
    .field--flooring {
        grid-column: span 6;
    }

    .closing-strip__inner {
        grid-template-columns: 1fr;
    }

    .closing-strip__inner > div {
        grid-column: 1;
    }

    .site-footer__main {
        grid-template-columns: 1fr 1fr;
    }

    .site-footer__brand {
        grid-column: 1 / -1;
    }

    .site-footer__legal {
        grid-template-columns: 1fr;
        gap: 7px;

        padding-block: 20px;
    }

    .site-footer__legal p:nth-child(2),
    .site-footer__legal p:last-child {
        text-align: left;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    :root {
        --gutter: 18px;
        --space-xl: 88px;
    }

    body {
        font-size: 15px;
    }

    .brand {
        font-size: 1rem;
    }

    .specimen-hero {
        padding-top: 54px;
    }

    .specimen-hero__meta {
        font-size: 0.6rem;
    }

    .specimen-hero h1 {
        font-size: clamp(4.8rem, 22vw, 6.6rem);
    }

    .specimen-hero__statement {
        grid-template-columns: 1fr;
        gap: 16px;

        margin-top: 40px;
    }

    .specimen-hero__tagline {
        font-size: 2.6rem;
    }

    .specimen-hero__panorama {
        width: 100%;
        height: 78vw;

        margin-top: 55px;
    }

    .specimen-hero__rail {
        min-height: 100px;

        align-items: flex-start;
        flex-direction: column;

        padding-block: 20px;
    }

    .specimen-hero__materials {
        gap: 8px 14px;
    }

    .specimen-hero__materials span:not(:last-child)::after {
        margin-left: 14px;
    }

    .sample-rack__heading h2,
    .plank-services__heading h2,
    .showroom-work__heading h2,
    .spec-faq__heading h2,
    .worksheet__heading h2,
    .closing-strip h2 {
        font-size: clamp(4.1rem, 18vw, 6rem);
    }

    .sample-rack__grid {
        grid-template-columns: 1fr;
        gap: 58px;
    }

    .surface-sample figure {
        height: 120vw;
        max-height: none;
    }

    .surface-sample__caption {
        min-height: 0;

        padding-bottom: 5px;
    }

    .floor-section__heading h2 {
        font-size: clamp(4.2rem, 19vw, 6.1rem);
    }

    .floor-section__side-note {
        border-left: 0;
        border-top: 1px solid var(--line-light);

        padding: 28px 0 0;
    }

    .cutaway__annotation {
        min-height: 165px;
    }

    .cutaway__drawing {
        margin: 70px 32px 60px 60px;
    }

    .cutaway__layer--finish {
        height: 95px;
    }

    .cutaway__layer--support {
        height: 62px;
    }

    .cutaway__layer--subfloor {
        height: 100px;
    }

    .removal-story__photo {
        width: 100%;
        height: 105vw;
    }

    .removal-story__copy h2 {
        font-size: clamp(4.3rem, 19vw, 6.2rem);
    }

    .service-plank {
        min-height: 104px;

        padding: 15px;
    }

    .service-plank h3 {
        font-size: 2.35rem;
    }

    .service-plank--01,
    .service-plank--02,
    .service-plank--03,
    .service-plank--04,
    .service-plank--05,
    .service-plank--06,
    .service-plank--07 {
        width: 95%;
    }

    .service-plank:nth-child(even) {
        margin-left: 5%;
    }

    .floor-plan {
        grid-template-columns: 1fr;

        padding: 16px;
    }

    .floor-plan__center {
        grid-column: 1;

        padding: 64px 18px;
    }

    .floor-plan__center h2 {
        font-size: clamp(4.1rem, 18vw, 6rem);
    }

    .plan-step {
        min-height: 220px;
    }

    .tile-editorial__grid {
        grid-template-columns: 1fr;
    }

    .tile-editorial__photo {
        width: 78%;
        height: 118vw;
        max-height: 720px;
    }

    .tile-editorial__copy {
        min-height: 600px;

        padding-block: 20px;
    }

    .tile-editorial__copy h2 {
        font-size: clamp(5rem, 22vw, 7rem);
    }

    .tile-editorial__aside {
        align-self: flex-start;
    }

    .tile-editorial__body {
        margin-top: auto;
        margin-left: 18%;
    }

    .showroom-panels {
        width: 100%;

        grid-template-columns: 1fr;
    }

    .showroom-panel {
        grid-template-rows: 125vw auto;
    }

    .showroom-panel figcaption {
        min-height: 145px;
    }

    .review-field blockquote {
        font-size: clamp(4rem, 17vw, 5.8rem);
    }

    .review-field__footer > div {
        display: grid;

        gap: 6px;
    }

    .spec-faq summary {
        min-height: 98px;

        grid-template-columns: 30px 1fr 26px;
        gap: 12px;
    }

    .spec-faq summary strong {
        font-size: 2rem;
    }

    .spec-faq details > p {
        margin-left: 42px;
        padding-right: 10px;
    }

    .worksheet__masthead {
        align-items: flex-start;
        flex-direction: column;

        padding-block: 14px;
    }

    .worksheet__masthead > div {
        flex-direction: column;
        gap: 1px;
    }

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

    .field--name,
    .field--email,
    .field--phone,
    .field--zip,
    .field--project,
    .field--square-footage,
    .field--flooring,
    .field--current,
    .field--timeline,
    .field--message {
        grid-column: 1;
    }

    .field {
        min-height: 140px;
    }

    .field--square-footage {
        min-height: 210px;
    }

    .worksheet-submit {
        min-height: 78px;

        font-size: 2.4rem;
    }

    .worksheet__form-footer {
        grid-template-columns: 1fr;
    }

    .form-status {
        text-align: left;
    }

    .closing-strip__inner {
        min-height: 610px;
    }

    .closing-strip__inner > div {
        align-items: flex-start;
        flex-direction: column;
    }

    .site-footer__main {
        grid-template-columns: 1fr;
    }

    .site-footer__brand {
        grid-column: 1;
    }

    .site-footer__brand > a {
        font-size: clamp(4rem, 18vw, 6rem);
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;

        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}
/* === TF TYPOGRAPHY CORRECTION START ===
   Revised after desktop / wide / mobile visual QA.
   Keeps the flooring composition intact and corrects only type scale,
   line-height, and tracking.
   ========================================================================== */

.specimen-hero h1 {
    font-size: clamp(5rem, 9vw, 8.8rem);
    line-height: 0.84;
    letter-spacing: -0.03em;
}

.specimen-hero__tagline {
    font-size: clamp(2.25rem, 3.7vw, 3.9rem);
    line-height: 0.9;
    letter-spacing: -0.015em;
}

.sample-rack__heading h2,
.plank-services__heading h2,
.showroom-work__heading h2,
.spec-faq__heading h2,
.worksheet__heading h2,
.closing-strip h2 {
    font-size: clamp(4.2rem, 7.2vw, 7.2rem);
    line-height: 0.86;
    letter-spacing: -0.03em;
}

.floor-section__heading h2,
.removal-story__copy h2 {
    font-size: clamp(4.25rem, 7.3vw, 7.3rem);
    line-height: 0.85;
    letter-spacing: -0.03em;
}

.floor-section__side-note h3 {
    font-size: clamp(2.3rem, 3.6vw, 3.8rem);
    line-height: 0.9;
    letter-spacing: -0.015em;
}

.floor-plan__center h2 {
    font-size: clamp(4rem, 6.5vw, 6.4rem);
    line-height: 0.85;
    letter-spacing: -0.03em;
}

.tile-editorial__copy h2 {
    font-size: clamp(4.6rem, 7.4vw, 7.4rem);
    line-height: 0.85;
    letter-spacing: -0.03em;
}

.tile-editorial__aside {
    font-size: clamp(1.9rem, 2.8vw, 2.9rem);
    line-height: 0.95;
}

.review-field blockquote {
    font-size: clamp(4.1rem, 6.7vw, 6.7rem);
    line-height: 0.88;
    letter-spacing: -0.02em;
}

.surface-sample h3,
.service-plank h3,
.plan-step h3,
.spec-faq summary strong {
    line-height: 0.92;
    letter-spacing: -0.012em;
}


/* Wide screens: readable content stays restrained. */

@media (min-width: 1500px) {

    .specimen-hero h1 {
        font-size: 7.25rem;
        line-height: 0.85;
    }

    .sample-rack__heading h2,
    .plank-services__heading h2,
    .showroom-work__heading h2,
    .spec-faq__heading h2,
    .worksheet__heading h2,
    .closing-strip h2 {
        font-size: 5.7rem;
        line-height: 0.87;
    }

    .floor-section__heading h2 {
        font-size: 5.7rem;
        line-height: 0.86;
    }

    .removal-story__copy h2 {
        font-size: 5.65rem;
        line-height: 0.86;
    }

    .floor-section__side-note h3 {
        font-size: 3.25rem;
    }

    .floor-plan__center h2 {
        font-size: 5.15rem;
        line-height: 0.86;
    }

    .tile-editorial__copy h2 {
        font-size: 5.85rem;
        line-height: 0.86;
    }

    .showroom-work__heading h2 {
        font-size: 5.8rem;
    }

    .review-field blockquote {
        font-size: 5.25rem;
        line-height: 0.89;
    }

    .worksheet__heading h2,
    .closing-strip h2 {
        font-size: 5.7rem;
    }
}


/* Tablet */

@media (max-width: 820px) {

    .specimen-hero h1 {
        font-size: clamp(4.7rem, 14vw, 6.3rem);
        line-height: 0.85;
    }

    .sample-rack__heading h2,
    .plank-services__heading h2,
    .showroom-work__heading h2,
    .spec-faq__heading h2,
    .worksheet__heading h2,
    .closing-strip h2 {
        font-size: clamp(3.8rem, 11vw, 5.25rem);
        line-height: 0.87;
    }

    .floor-section__heading h2,
    .removal-story__copy h2 {
        font-size: clamp(3.9rem, 11.5vw, 5.35rem);
        line-height: 0.87;
    }

    .floor-section__side-note h3 {
        font-size: clamp(2.25rem, 6vw, 3.2rem);
    }

    .floor-plan__center h2 {
        font-size: clamp(3.8rem, 10.5vw, 5.1rem);
        line-height: 0.87;
    }

    .tile-editorial__copy h2 {
        font-size: clamp(4.1rem, 12vw, 5.5rem);
        line-height: 0.87;
    }

    .review-field blockquote {
        font-size: clamp(3.75rem, 10vw, 5rem);
        line-height: 0.9;
    }
}


/* Mobile */

@media (max-width: 600px) {

    .specimen-hero h1 {
        font-size: clamp(4.05rem, 17vw, 5.15rem);
        line-height: 0.86;
        letter-spacing: -0.025em;
    }

    .specimen-hero__tagline {
        font-size: clamp(2.1rem, 9vw, 2.7rem);
        line-height: 0.92;
    }

    .sample-rack__heading h2,
    .plank-services__heading h2,
    .showroom-work__heading h2,
    .spec-faq__heading h2,
    .worksheet__heading h2,
    .closing-strip h2 {
        font-size: clamp(3.4rem, 14vw, 4.55rem);
        line-height: 0.89;
        letter-spacing: -0.022em;
    }

    .floor-section__heading h2,
    .removal-story__copy h2 {
        font-size: clamp(3.55rem, 14.5vw, 4.7rem);
        line-height: 0.88;
        letter-spacing: -0.022em;
    }

    .floor-section__side-note h3 {
        font-size: clamp(2.1rem, 8.5vw, 2.9rem);
        line-height: 0.92;
    }

    .floor-plan__center h2 {
        font-size: clamp(3.45rem, 13.5vw, 4.55rem);
        line-height: 0.89;
    }

    .tile-editorial__copy h2 {
        font-size: clamp(3.8rem, 15vw, 4.9rem);
        line-height: 0.88;
    }

    .tile-editorial__aside {
        font-size: clamp(1.8rem, 7vw, 2.35rem);
    }

    .review-field blockquote {
        font-size: clamp(3.3rem, 13vw, 4.5rem);
        line-height: 0.91;
    }

    .service-plank h3 {
        font-size: 2.05rem;
        line-height: 0.94;
    }

    .spec-faq summary strong {
        font-size: 1.8rem;
        line-height: 0.96;
    }
}

/* === TF TYPOGRAPHY CORRECTION END === */
/* === TF FOOTER WIDTH FIX START === */

/*
   Footer correction:
   - gives the brand enough horizontal room
   - keeps nav/contact compact
   - prevents the brand lockup from feeling squeezed
   - preserves the full-width footer and layer bands
*/

.site-footer__main {
    grid-template-columns:
        minmax(440px, 1.35fr)
        minmax(150px, 0.42fr)
        minmax(180px, 0.48fr);

    gap: clamp(48px, 7vw, 96px);
}

.site-footer__brand {
    min-width: 0;
    max-width: 620px;
}

.site-footer__brand > a {
    width: 100%;
    max-width: 620px;

    font-size: clamp(3.7rem, 5vw, 5.35rem);
    line-height: 0.9;
    letter-spacing: -0.025em;
}


/* Wide desktop */

@media (min-width: 1500px) {

    .site-footer__main {
        grid-template-columns:
            minmax(500px, 1.45fr)
            minmax(160px, 0.38fr)
            minmax(190px, 0.42fr);

        gap: 78px;
    }

    .site-footer__brand {
        max-width: 680px;
    }

    .site-footer__brand > a {
        max-width: 680px;

        font-size: 4.85rem;
        line-height: 0.91;
    }
}


/* Tablet */

@media (max-width: 820px) {

    .site-footer__main {
        grid-template-columns: minmax(0, 1fr) minmax(150px, 0.42fr);
        gap: 50px 34px;
    }

    .site-footer__brand {
        grid-column: 1 / -1;

        max-width: 620px;
    }

    .site-footer__brand > a {
        max-width: 620px;

        font-size: clamp(3.7rem, 9vw, 5rem);
        line-height: 0.91;
    }
}


/* Mobile */

@media (max-width: 600px) {

    .site-footer__main {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .site-footer__brand {
        grid-column: 1;

        max-width: 100%;
    }

    .site-footer__brand > a {
        max-width: 100%;

        font-size: clamp(3.25rem, 14vw, 4.45rem);
        line-height: 0.92;
        letter-spacing: -0.02em;
    }
}

/* === TF FOOTER WIDTH FIX END === */
/* === TF MIXED CASE TYPOGRAPHY START ===
   Editorial copy now uses natural capitalization.
   Uppercase is reserved for branding, technical labels,
   drawing annotations, and small utility information.
   ========================================================================== */


/* --------------------------------------------------------------------------
   Navigation + actions
   -------------------------------------------------------------------------- */

.site-nav a,
.header-estimate,
.specimen-hero__rail > a,
.tile-editorial__body a,
.closing-strip__inner > div > a,
.worksheet-submit {
    text-transform: none;
    letter-spacing: 0.015em;
}


/* --------------------------------------------------------------------------
   Major editorial headlines
   -------------------------------------------------------------------------- */

.sample-rack__heading h2,
.floor-section__heading h2,
.removal-story__copy h2,
.plank-services__heading h2,
.floor-plan__center h2,
.tile-editorial__copy h2,
.showroom-work__heading h2,
.review-field blockquote,
.spec-faq__heading h2,
.worksheet__heading h2,
.closing-strip h2 {
    text-transform: none;
    letter-spacing: -0.018em;
    line-height: 0.94;
}


/* --------------------------------------------------------------------------
   Secondary display copy
   -------------------------------------------------------------------------- */

.specimen-hero__tagline,
.floor-section__side-note h3,
.tile-editorial__aside {
    text-transform: none;
    letter-spacing: -0.01em;
    line-height: 0.96;
}


/* --------------------------------------------------------------------------
   Material names
   -------------------------------------------------------------------------- */

.surface-sample h3 {
    text-transform: none;
    letter-spacing: -0.01em;
    line-height: 0.96;
}


/* --------------------------------------------------------------------------
   Service names / plank labels
   -------------------------------------------------------------------------- */

.service-plank h3 {
    text-transform: none;
    letter-spacing: -0.01em;
    line-height: 0.96;
}


/* --------------------------------------------------------------------------
   Process step names
   -------------------------------------------------------------------------- */

.plan-step h3 {
    text-transform: none;
    letter-spacing: -0.01em;
    line-height: 0.96;
}


/* --------------------------------------------------------------------------
   Showroom project titles
   -------------------------------------------------------------------------- */

.showroom-panel figcaption strong {
    text-transform: none;
    letter-spacing: -0.008em;
    line-height: 0.96;
}


/* --------------------------------------------------------------------------
   FAQ questions
   -------------------------------------------------------------------------- */

.spec-faq summary strong {
    text-transform: none;
    letter-spacing: -0.008em;
    line-height: 1;
}


/* --------------------------------------------------------------------------
   Footer navigation
   -------------------------------------------------------------------------- */

.site-footer__nav a {
    text-transform: none;
}


/* --------------------------------------------------------------------------
   Intentionally retained uppercase
   -------------------------------------------------------------------------- */

.brand,
.specimen-hero h1,
.site-footer__brand > a,
.section-label,
.specimen-hero__meta,
.specimen-hero__materials,
.hero-layer,
.cutaway__annotation strong,
.cutaway__dimension--left span,
.removal-story__status,
.plan-process__drawing-label,
.worksheet__masthead,
.field > span,
.site-footer__legal,
.footer-layers {
    text-transform: uppercase;
}


/* --------------------------------------------------------------------------
   Mobile refinement
   -------------------------------------------------------------------------- */

@media (max-width: 820px) {

    .site-nav a {
        text-transform: none;
        letter-spacing: -0.01em;
        line-height: 1;
    }
}


@media (max-width: 600px) {

    .sample-rack__heading h2,
    .floor-section__heading h2,
    .removal-story__copy h2,
    .plank-services__heading h2,
    .floor-plan__center h2,
    .tile-editorial__copy h2,
    .showroom-work__heading h2,
    .review-field blockquote,
    .spec-faq__heading h2,
    .worksheet__heading h2,
    .closing-strip h2 {
        line-height: 0.97;
        letter-spacing: -0.012em;
    }

    .surface-sample h3,
    .service-plank h3,
    .plan-step h3,
    .spec-faq summary strong,
    .showroom-panel figcaption strong {
        line-height: 1;
    }
}

/* === TF MIXED CASE TYPOGRAPHY END === */
/* === TF NAV SIZE FIX START === */

.site-nav a {
    font-size: 0.92rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

@media (min-width: 1500px) {
    .site-nav a {
        font-size: 0.88rem;
    }
}

@media (max-width: 820px) {
    .site-nav a {
        font-size: clamp(2.9rem, 9vw, 4.5rem);
    }
}

/* === TF NAV SIZE FIX END === */
/* === TF HERO IMAGE INTEGRATION START ===
   Turns the hero photograph into a deliberate material specimen
   rather than a plain rectangular content image.
   ========================================================================== */

.specimen-hero__panorama {
    position: relative;
    isolation: isolate;

    width: min(calc(100% - 34px), 1560px);
    height: clamp(430px, 47vw, 720px);

    margin-top: clamp(34px, 4.5vw, 62px);
    margin-bottom: 0;

    overflow: visible;

    background: var(--cement);
    border: 1px solid var(--graphite);
}


/* physical underlayer peeking from beneath the sample */

.specimen-hero__panorama::before {
    content: "";

    position: absolute;
    z-index: -1;

    top: 12px;
    left: 12px;
    right: -12px;
    bottom: -12px;

    background: var(--birch);
    border: 1px solid var(--graphite);
}


/* specimen / drawing label */

.specimen-hero__panorama::after {
    content: "01 / FINISHED FLOOR";

    position: absolute;
    z-index: 3;

    top: 18px;
    left: 18px;

    padding: 8px 10px;

    background: var(--chalk);
    border: 1px solid var(--graphite);

    color: var(--graphite);

    font-family: var(--font-body);
    font-size: 0.61rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    line-height: 1;
    text-transform: uppercase;
}


.specimen-hero__panorama img {
    position: relative;
    z-index: 1;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center 76%;
}


/* pull the material rail into the specimen composition */

.specimen-hero__rail {
    position: relative;
    z-index: 4;

    margin-top: 13px;

    min-height: 76px;

    border-top: 1px solid var(--graphite);
    border-bottom: 1px solid var(--graphite);
}


/* desktop: reduce the large dead zone above photography */

.specimen-hero__statement {
    margin-top: clamp(28px, 3.5vw, 48px);
}


/* Wide screens */

@media (min-width: 1500px) {

    .specimen-hero__panorama {
        width: min(calc(100% - 56px), 1510px);
        height: 650px;

        margin-top: 44px;
    }

    .specimen-hero__statement {
        margin-top: 34px;
    }
}


/* Tablet */

@media (max-width: 820px) {

    .specimen-hero__panorama {
        width: calc(100% - 24px);
        height: 62vw;

        margin-top: 38px;
    }

    .specimen-hero__panorama::before {
        top: 9px;
        left: 9px;
        right: -9px;
        bottom: -9px;
    }

    .specimen-hero__panorama::after {
        top: 14px;
        left: 14px;
    }
}


/* Mobile */

@media (max-width: 600px) {

    .specimen-hero__panorama {
        width: calc(100% - 14px);
        height: 82vw;

        margin-top: 32px;

        border-left: 1px solid var(--graphite);
        border-right: 1px solid var(--graphite);
    }

    .specimen-hero__panorama::before {
        top: 7px;
        left: 7px;
        right: -7px;
        bottom: -7px;
    }

    .specimen-hero__panorama::after {
        top: 11px;
        left: 11px;

        padding: 7px 8px;

        font-size: 0.55rem;
    }

    .specimen-hero__rail {
        margin-top: 9px;
    }
}

/* === TF HERO IMAGE INTEGRATION END === */
/* === TF REMOVAL IMAGE INTEGRATION START ===
   Treats the removal photograph like an exposed floor assembly:
   framed, layered, annotated, and connected to the status rail.
   ========================================================================== */

.removal-story__status {
    position: relative;
    z-index: 4;

    margin-bottom: 18px;
}

.removal-story__status::after {
    content: "";

    position: absolute;
    right: 0;
    bottom: -19px;

    width: 1px;
    height: 19px;

    background: var(--graphite);
}


/* Main image plate */

.removal-story__photo {
    position: relative;
    isolation: isolate;

    width: min(calc(100% - 34px), 1540px);
    height: clamp(420px, 58vw, 790px);

    margin-top: 0;
    margin-bottom: 46px;

    overflow: visible;

    background: var(--cement);
    border: 1px solid var(--graphite);
}


/* dark structural layer */

.removal-story__photo::before {
    content: "";

    position: absolute;
    z-index: -2;

    top: 11px;
    right: -12px;
    bottom: -18px;
    left: 11px;

    background: var(--graphite);
    border: 1px solid var(--graphite);
}


/* warm exposed layer peeking underneath */

.removal-story__photo::after {
    content: "02 / FLOOR REMOVAL";

    position: absolute;
    z-index: 3;

    top: 18px;
    left: 18px;

    padding: 8px 10px;

    background: var(--lime);
    border: 1px solid var(--graphite);

    color: var(--graphite);

    font-size: 0.61rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    line-height: 1;
    text-transform: uppercase;
}


/* actual image */

.removal-story__photo img {
    position: relative;
    z-index: 1;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    border: 0;
}


/* exposed birch line underneath the dark layer */

.removal-story__photo {
    box-shadow:
        0 8px 0 0 var(--birch),
        0 9px 0 0 var(--graphite);
}


/* pull copy visually closer to the photograph */

.removal-story__copy {
    padding-top: clamp(24px, 4vw, 48px);
}


/* Wide screens */

@media (min-width: 1500px) {

    .removal-story__photo {
        width: min(calc(100% - 56px), 1510px);
        height: 720px;

        margin-bottom: 52px;
    }
}


/* Tablet */

@media (max-width: 820px) {

    .removal-story__photo {
        width: calc(100% - 24px);
        height: 68vw;

        margin-bottom: 42px;
    }

    .removal-story__photo::before {
        top: 9px;
        right: -9px;
        bottom: -14px;
        left: 9px;
    }

    .removal-story__photo::after {
        top: 14px;
        left: 14px;
    }
}


/* Mobile */

@media (max-width: 600px) {

    .removal-story__photo {
        width: calc(100% - 14px);
        height: 105vw;

        margin-bottom: 38px;

        box-shadow:
            0 6px 0 0 var(--birch),
            0 7px 0 0 var(--graphite);
    }

    .removal-story__photo::before {
        top: 7px;
        right: -7px;
        bottom: -11px;
        left: 7px;
    }

    .removal-story__photo::after {
        top: 11px;
        left: 11px;

        padding: 7px 8px;

        font-size: 0.55rem;
    }

    .removal-story__status {
        margin-bottom: 14px;
    }

    .removal-story__status::after {
        bottom: -15px;
        height: 15px;
    }
}

/* === TF REMOVAL IMAGE INTEGRATION END === */
/* === TF TILE SECTION BALANCE START ===
   Keeps the editorial negative space but removes the accidental
   giant dead zone between the heading and body copy.
   ========================================================================== */

.tile-editorial__copy {
    position: relative;
}


/* subtle architectural guide through the open field */

.tile-editorial__copy::before {
    content: "";

    position: absolute;
    top: 53%;
    right: 0;
    left: 10%;

    height: 1px;

    background: var(--line);
}


/* tiny perpendicular measurement tick */

.tile-editorial__copy::after {
    content: "";

    position: absolute;
    top: calc(53% - 8px);
    left: 10%;

    width: 1px;
    height: 17px;

    background: var(--birch-dark);
}


.tile-editorial__aside {
    align-self: flex-end;

    margin-top: 24px;
    margin-right: 6%;
}


/*
   This was previously margin-top:auto, which pushed the entire
   paragraph and CTA to the bottom of the section.
*/

.tile-editorial__body {
    max-width: 430px;

    margin-top: clamp(150px, 17vw, 230px);
    margin-left: auto;

    border-top: 1px solid var(--graphite);
    padding-top: 22px;
}


/* Wide screens */

@media (min-width: 1500px) {

    .tile-editorial__body {
        margin-top: 165px;
    }

    .tile-editorial__copy::before {
        top: 52%;
    }

    .tile-editorial__copy::after {
        top: calc(52% - 8px);
    }
}


/* Tablet */

@media (max-width: 820px) {

    .tile-editorial__body {
        margin-top: clamp(100px, 14vw, 150px);
    }

    .tile-editorial__copy::before {
        top: 55%;
        left: 0;
    }

    .tile-editorial__copy::after {
        top: calc(55% - 8px);
        left: 0;
    }

    .tile-editorial__aside {
        margin-right: 0;
    }
}


/* Mobile */

@media (max-width: 600px) {

    .tile-editorial__copy {
        min-height: 520px;
    }

    .tile-editorial__body {
        margin-top: 105px;
        margin-left: 12%;
    }

    .tile-editorial__copy::before {
        top: 54%;
        left: 12%;
    }

    .tile-editorial__copy::after {
        top: calc(54% - 8px);
        left: 12%;
    }
}

/* === TF TILE SECTION BALANCE END === */