/*
 * SEO / accessibility / performance utilities.
 *
 * Loaded last (and included last in the CSS bundle) so these rules can
 * override page-specific styles without editing every source stylesheet.
 */

/* Always honour the native hidden attribute, even when a component sets display. */
[hidden] {
    display: none !important;
}

.visually-hidden,
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.skip-link {
    position: absolute;
    left: 12px;
    top: -60px;
    z-index: 10000;
    background: var(--tdt-orange, #e67026);
    color: #ffffff;
    padding: 10px 16px;
    border-radius: 0 0 6px 6px;
    font-weight: 700;
    text-decoration: none;
    transition: top 0.15s ease;
}

.skip-link:focus {
    top: 0;
}

/* Inline SVG icons (replaced Font Awesome webfonts). */
.tdt-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    line-height: 1;
    vertical-align: -0.125em;
}

.tdt-icon svg {
    width: 1em;
    height: 1em;
    display: block;
    fill: currentColor;
}

.tdt-icon-sprite {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
}

.logo-link {
    display: block;
}

.btn-icon {
    margin-right: 6px;
}

.form-honeypot {
    position: absolute;
    left: -5000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.quote-form-error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 13px;
    margin-top: 4px;
}

.gtm-noscript {
    display: none;
    visibility: hidden;
}

.top-bar-address {
    display: inline;
    font-style: normal;
}

.top-bar a,
.footer-contact-list a {
    color: inherit;
    text-decoration: none;
}

.top-bar a:hover,
.footer-contact-list a:hover {
    color: var(--tdt-orange, #e67026);
}

.footer-address {
    font-style: normal;
    margin: 0;
}

.footer-heading {
    margin-top: 0;
}

.footer-nap > div {
    min-width: 0;
}

.footer-email {
    color: inherit;
}

/* Hero stat values were <h3> before (skipping from the page h1 to h3). */
.stat-item .stat-value {
    font-family: var(--font-bebas);
    font-size: 32px;
    color: #e67026;
    line-height: 1;
    margin: 0;
}

.card-header-form .card-form-title {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 24px;
    letter-spacing: 1.5px;
    color: #717074;
    margin: 0;
}

/* About page: person name was an <h4> directly under an <h2>. */
.person-caption .person-name {
    font-family: var(--font-bebas);
    font-size: 20px;
    letter-spacing: 0.03em;
    color: var(--tdt-dark);
    margin: 0;
}

/* Contact page: panel titles / info titles keep their old visual weight. */
.contact-info-panel .panel-title,
.contact-form-panel .panel-title {
    font-family: var(--font-bebas);
    font-size: 32px;
    color: var(--tdt-dark);
    margin-bottom: 12px;
    letter-spacing: 0.03em;
}

.contact-info-panel .panel-title span,
.contact-form-panel .panel-title span,
.info-card .info-card-title span,
.contact-social-heading span {
    color: var(--tdt-orange);
}

.info-card .info-card-title {
    font-family: var(--font-montserrat);
    font-size: 12px;
    font-weight: 700;
    color: var(--tdt-gray);
    text-transform: uppercase;
    margin-bottom: 2px;
}

.contact-social-heading {
    color: var(--tdt-dark);
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 12px;
    font-weight: 700;
}

.social-links-container {
    margin-top: 25px;
    border-top: 1px solid rgba(113, 112, 116, 0.15);
    padding-top: 15px;
}

.social-icons-contact {
    display: flex;
    gap: 10px;
}

.contact-map-wrapper {
    height: 100%;
    min-height: 350px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

.contact-map-frame {
    border: 0;
    display: block;
    min-height: 100%;
    width: 100%;
    height: 100%;
}

/* Blog card / article cover images moved out of inline styles. */
.blog-cover-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    inset: 0;
}

.product-footer .btn-outline-dark {
    text-align: center;
}

/* Skip rendering/layout for deep below-the-fold sections until they are
   approached. This keeps the homepage's initial style/layout work small. */
.projects-section,
.why-choose-section,
.faq-section,
.site-footer {
    content-visibility: auto;
    contain-intrinsic-size: auto 800px;
}

/* Duplicate marquee cards use a non-heading title so their titles are not
   counted twice in the document outline. */
.project-info .project-title {
    font-family: var(--font-bebas);
    font-size: 22px;
    letter-spacing: 0.02em;
    color: var(--tdt-gray);
    line-height: 1.15;
    margin-bottom: 10px;
}

/* Featured blog title is an h3 under the "Latest Articles" h2. */
.blog-featured-body h3 {
    font-family: var(--font-bebas);
    font-size: 30px;
    color: #717074;
    letter-spacing: 0.01em;
    line-height: 1.15;
    margin: 10px 0 14px 0;
}

.referral-form-submit-row {
    margin-top: 20px;
}
/* Hero slides use <picture> for responsive WebP sources. */
.hero-slide picture {
    display: block;
    width: 100%;
    height: 100%;
}

.about-hero-slideshow .hero-slide:nth-child(1) { background-image: url('/static/images/steel1.jpg'); }
.about-hero-slideshow .hero-slide:nth-child(2) { background-image: url('/static/images/steel2.jpg'); }
.about-hero-slideshow .hero-slide:nth-child(3) { background-image: url('/static/images/steel3.jpg'); }
.about-hero-slideshow .hero-slide:nth-child(4) { background-image: url('/static/images/steel4.jpg'); }
.about-hero-slideshow .hero-slide:nth-child(5) { background-image: url('/static/images/steel5.jpg'); }
.about-hero-slideshow .hero-slide:nth-child(6) { background-image: url('/static/images/steel6.jpg'); }
.about-hero-slideshow .hero-slide:nth-child(7) { background-image: url('/static/images/steel7.jpg'); }

/* Category banner photo as a real <img> (alt text + LCP control). */
.page-banner-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

.subcat-page-banner.page-banner {
    background-image: none;
}

.subcat-page-banner.page-banner::before {
    z-index: 1;
}

.subcat-page-banner .container {
    position: relative;
    z-index: 2;
}

/* 404 page moved out of inline styles. */
.error-page {
    padding: 110px 0;
    text-align: center;
}

.error-code {
    font-family: var(--font-bebas);
    font-size: 96px;
    line-height: 1;
    color: var(--tdt-orange);
    margin: 0;
}

.error-title {
    font-family: var(--font-bebas);
    font-size: 48px;
    color: var(--tdt-dark);
    margin: 8px 0 16px;
}

.error-copy {
    max-width: 620px;
    margin: 0 auto 28px;
    color: var(--tdt-gray);
    line-height: 1.8;
}

.error-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}