/* One page grid, based on Contact: 1440px content with 48/32/20px gutters.
   Keep backgrounds full-width; align header, hero copy and section edges. */
html { scrollbar-gutter:stable; }
.travik-home { --th-width:1440px;--th-page-gutter:48px; }
@media(max-width:1250px) { .travik-home { --th-page-gutter:32px; } }
@media(max-width:900px) { .travik-home { --th-page-gutter:20px; } }

.travik-home .th-container,
.travik-home.travik-inner .th-container {
    width:min(calc(100% - var(--th-page-gutter) * 2),var(--th-width));
    max-width:var(--th-width);
    margin-inline:auto;
}
.travik-home .th-header .th-header-inner { padding-inline:0; }
.travik-home .th-header .th-search {
    width:min(calc(100% - var(--th-page-gutter) * 2),var(--th-width));
    padding-inline:0;
}
.travik-home .th-hero-copy { padding-inline:0; }
.travik-home .th-offer-heading { padding-inline:0; }
.travik-home .th-section-heading { margin-inline:0; }
.travik-home .th-about-copy { padding-left:0; }

/* These editorial layouts previously supplied a second set of page gutters. */
.travik-inner .ta-story-copy,
.travik-inner .ta-brands-copy { padding-left:0; }
.travik-inner .tw-content .tw-business,
.travik-inner .tw-content .tw-next { padding-inline:0; }

/* About and Why use display:contents to stack hero photos on small screens. */
@media(max-width:700px) {
    .travik-inner .ta-hero .ti-breadcrumbs,
    .travik-inner .ta-hero-copy,
    .travik-inner .tw-feature-hero .ti-breadcrumbs,
    .travik-inner .tw-hero-copy { padding-inline:var(--th-page-gutter); }
    .travik-inner .ta-story-copy,
    .travik-inner .ta-manufacturing-copy,
    .travik-inner .ta-brands-copy { padding-inline:0; }
}
